From d387cac690986cc59ff0e9daa21c52e85c73072c Mon Sep 17 00:00:00 2001
From: BoHong Li <a60814billy@gmail.com>
Date: Fri, 12 Apr 2019 17:55:43 +0800
Subject: [PATCH] refactor: fix lint warning on public/js/extra.js

Signed-off-by: BoHong Li <a60814billy@gmail.com>
---
 public/js/extra.js | 434 ++++++++++++++++++++++-----------------------
 1 file changed, 217 insertions(+), 217 deletions(-)

diff --git a/public/js/extra.js b/public/js/extra.js
index a8430c68..41aa6348 100644
--- a/public/js/extra.js
+++ b/public/js/extra.js
@@ -1,6 +1,24 @@
 /* eslint-env browser, jquery */
 /* global moment, serverurl */
 
+import Prism from 'prismjs'
+import hljs from 'highlight.js'
+import PDFObject from 'pdfobject'
+import { saveAs } from 'file-saver'
+
+import escapeHTML from 'lodash/escape'
+import unescapeHTML from 'lodash/unescape'
+
+import { stripTags } from '../../utils/string'
+
+import getUIElements from './lib/editor/ui-elements'
+
+import markdownit from 'markdown-it'
+import markdownitContainer from 'markdown-it-container'
+
+/* Defined regex markdown it plugins */
+import Plugin from 'markdown-it-regexp'
+
 require('prismjs/themes/prism.css')
 require('prismjs/components/prism-wiki')
 require('prismjs/components/prism-haskell')
@@ -10,21 +28,9 @@ require('prismjs/components/prism-jsx')
 require('prismjs/components/prism-makefile')
 require('prismjs/components/prism-gherkin')
 
-import Prism from 'prismjs'
-import hljs from 'highlight.js'
-import PDFObject from 'pdfobject'
-import { saveAs } from 'file-saver'
-
-import escapeHTML from 'lodash/escape'
-import unescapeHTML from 'lodash/unescape'
-
-import {stripTags} from '../../utils/string'
-
 require('./lib/common/login')
 require('../vendor/md-toc')
 var Viz = require('viz.js')
-
-import getUIElements from './lib/editor/ui-elements'
 const ui = getUIElements()
 
 // auto update last change
@@ -194,7 +200,7 @@ export function parseMeta (md, edit, view, toc, tocAffix) {
     dir = meta.dir
     breaks = meta.breaks
   }
-    // text language
+  // text language
   if (lang && typeof lang === 'string') {
     view.attr('lang', lang)
     toc.attr('lang', lang)
@@ -206,7 +212,7 @@ export function parseMeta (md, edit, view, toc, tocAffix) {
     tocAffix.removeAttr('lang')
     if (edit) { edit.removeAttr('lang', lang) }
   }
-    // text direction
+  // text direction
   if (dir && typeof dir === 'string') {
     view.attr('dir', dir)
     toc.attr('dir', dir)
@@ -216,7 +222,7 @@ export function parseMeta (md, edit, view, toc, tocAffix) {
     toc.removeAttr('dir')
     tocAffix.removeAttr('dir')
   }
-    // breaks
+  // breaks
   if (typeof breaks === 'boolean' && !breaks) {
     md.options.breaks = false
   } else {
@@ -249,7 +255,7 @@ if (typeof window.mermaid !== 'undefined' && window.mermaid) window.mermaid.star
 
 // dynamic event or object binding here
 export function finishView (view) {
-    // todo list
+  // todo list
   const lis = view.find('li.raw').removeClass('raw').sortByDepth().toArray()
 
   for (let li of lis) {
@@ -263,9 +269,9 @@ export function finishView (view) {
     li.innerHTML = html
     let disabled = 'disabled'
     if (typeof editor !== 'undefined' && window.havePermission()) { disabled = '' }
-    if (/^\s*\[[x ]\]\s*/.test(html)) {
-      li.innerHTML = html.replace(/^\s*\[ \]\s*/, `<input type="checkbox" class="task-list-item-checkbox "${disabled}><label></label>`)
-                .replace(/^\s*\[x\]\s*/, `<input type="checkbox" class="task-list-item-checkbox" checked ${disabled}><label></label>`)
+    if (/^\s*\[[x ]]\s*/.test(html)) {
+      li.innerHTML = html.replace(/^\s*\[ ]\s*/, `<input type="checkbox" class="task-list-item-checkbox "${disabled}><label></label>`)
+        .replace(/^\s*\[x]\s*/, `<input type="checkbox" class="task-list-item-checkbox" checked ${disabled}><label></label>`)
       if (li.tagName.toLowerCase() !== 'li') {
         li.parentElement.setAttribute('class', 'task-list-item')
       } else {
@@ -273,42 +279,42 @@ export function finishView (view) {
       }
     }
     if (typeof editor !== 'undefined' && window.havePermission()) { $(li).find('input').change(toggleTodoEvent) }
-        // color tag in list will convert it to tag icon with color
+    // color tag in list will convert it to tag icon with color
     const tagColor = $(li).closest('ul').find('.color')
     tagColor.each((key, value) => {
       $(value).addClass('fa fa-tag').css('color', $(value).attr('data-color'))
     })
   }
 
-    // youtube
+  // youtube
   view.find('div.youtube.raw').removeClass('raw')
-        .click(function () {
-          imgPlayiframe(this, '//www.youtube.com/embed/')
-        })
+    .click(function () {
+      imgPlayiframe(this, '//www.youtube.com/embed/')
+    })
     // vimeo
   view.find('div.vimeo.raw').removeClass('raw')
-        .click(function () {
-          imgPlayiframe(this, '//player.vimeo.com/video/')
-        })
-        .each((key, value) => {
-          $.ajax({
-            type: 'GET',
-            url: `//vimeo.com/api/v2/video/${$(value).attr('data-videoid')}.json`,
-            jsonp: 'callback',
-            dataType: 'jsonp',
-            success (data) {
-              const thumbnailSrc = data[0].thumbnail_large
-              const image = `<img src="${thumbnailSrc}" />`
-              $(value).prepend(image)
-              if (window.viewAjaxCallback) window.viewAjaxCallback()
-            }
-          })
-        })
+    .click(function () {
+      imgPlayiframe(this, '//player.vimeo.com/video/')
+    })
+    .each((key, value) => {
+      $.ajax({
+        type: 'GET',
+        url: `//vimeo.com/api/v2/video/${$(value).attr('data-videoid')}.json`,
+        jsonp: 'callback',
+        dataType: 'jsonp',
+        success (data) {
+          const thumbnailSrc = data[0].thumbnail_large
+          const image = `<img src="${thumbnailSrc}" />`
+          $(value).prepend(image)
+          if (window.viewAjaxCallback) window.viewAjaxCallback()
+        }
+      })
+    })
     // gist
   view.find('code[data-gist-id]').each((key, value) => {
     if ($(value).children().length === 0) { $(value).gist(window.viewAjaxCallback) }
   })
-    // sequence diagram
+  // sequence diagram
   const sequences = view.find('div.sequence-diagram.raw').removeClass('raw')
   sequences.each((key, value) => {
     try {
@@ -331,7 +337,7 @@ export function finishView (view) {
       console.warn(err)
     }
   })
-    // flowchart
+  // flowchart
   const flow = view.find('div.flow-chart.raw').removeClass('raw')
   flow.each((key, value) => {
     try {
@@ -355,7 +361,7 @@ export function finishView (view) {
       console.warn(err)
     }
   })
-    // graphviz
+  // graphviz
   var graphvizs = view.find('div.graphviz.raw').removeClass('raw')
   graphvizs.each(function (key, value) {
     try {
@@ -374,7 +380,7 @@ export function finishView (view) {
       console.warn(err)
     }
   })
-    // mermaid
+  // mermaid
   const mermaids = view.find('div.mermaid.raw').removeClass('raw')
   mermaids.each((key, value) => {
     try {
@@ -416,16 +422,16 @@ export function finishView (view) {
       console.warn(err)
     }
   })
-    // image href new window(emoji not included)
+  // image href new window(emoji not included)
   const images = view.find('img.raw[src]').removeClass('raw')
   images.each((key, value) => {
-        // if it's already wrapped by link, then ignore
+    // if it's already wrapped by link, then ignore
     const $value = $(value)
     $value[0].onload = e => {
       if (window.viewAjaxCallback) window.viewAjaxCallback()
     }
   })
-    // blockquote
+  // blockquote
   const blockquote = view.find('blockquote.raw').removeClass('raw')
   const blockquoteP = blockquote.find('p')
   blockquoteP.each((key, value) => {
@@ -433,96 +439,96 @@ export function finishView (view) {
     html = replaceExtraTags(html)
     $(value).html(html)
   })
-    // color tag in blockquote will change its left border color
+  // color tag in blockquote will change its left border color
   const blockquoteColor = blockquote.find('.color')
   blockquoteColor.each((key, value) => {
     $(value).closest('blockquote').css('border-left-color', $(value).attr('data-color'))
   })
-    // slideshare
+  // slideshare
   view.find('div.slideshare.raw').removeClass('raw')
-        .each((key, value) => {
-          $.ajax({
-            type: 'GET',
-            url: `//www.slideshare.net/api/oembed/2?url=http://www.slideshare.net/${$(value).attr('data-slideshareid')}&format=json`,
-            jsonp: 'callback',
-            dataType: 'jsonp',
-            success (data) {
-              const $html = $(data.html)
-              const iframe = $html.closest('iframe')
-              const caption = $html.closest('div')
-              const inner = $('<div class="inner"></div>').append(iframe)
-              const height = iframe.attr('height')
-              const width = iframe.attr('width')
-              const ratio = (height / width) * 100
-              inner.css('padding-bottom', `${ratio}%`)
-              $(value).html(inner).append(caption)
-              if (window.viewAjaxCallback) window.viewAjaxCallback()
-            }
-          })
-        })
+    .each((key, value) => {
+      $.ajax({
+        type: 'GET',
+        url: `//www.slideshare.net/api/oembed/2?url=http://www.slideshare.net/${$(value).attr('data-slideshareid')}&format=json`,
+        jsonp: 'callback',
+        dataType: 'jsonp',
+        success (data) {
+          const $html = $(data.html)
+          const iframe = $html.closest('iframe')
+          const caption = $html.closest('div')
+          const inner = $('<div class="inner"></div>').append(iframe)
+          const height = iframe.attr('height')
+          const width = iframe.attr('width')
+          const ratio = (height / width) * 100
+          inner.css('padding-bottom', `${ratio}%`)
+          $(value).html(inner).append(caption)
+          if (window.viewAjaxCallback) window.viewAjaxCallback()
+        }
+      })
+    })
     // speakerdeck
   view.find('div.speakerdeck.raw').removeClass('raw')
-        .each((key, value) => {
-          const url = `https://speakerdeck.com/${$(value).attr('data-speakerdeckid')}`
-          const inner = $('<a>Speakerdeck</a>')
-          inner.attr('href', url)
-          inner.attr('rel', 'noopener noreferrer')
-          inner.attr('target', '_blank')
-          $(value).append(inner)
-      })
+    .each((key, value) => {
+      const url = `https://speakerdeck.com/${$(value).attr('data-speakerdeckid')}`
+      const inner = $('<a>Speakerdeck</a>')
+      inner.attr('href', url)
+      inner.attr('rel', 'noopener noreferrer')
+      inner.attr('target', '_blank')
+      $(value).append(inner)
+    })
     // pdf
   view.find('div.pdf.raw').removeClass('raw')
-            .each(function (key, value) {
-              const url = $(value).attr('data-pdfurl')
-              const inner = $('<div></div>')
-              $(this).append(inner)
-              PDFObject.embed(url, inner, {
-                height: '400px'
-              })
-            })
+    .each(function (key, value) {
+      const url = $(value).attr('data-pdfurl')
+      const inner = $('<div></div>')
+      $(this).append(inner)
+      PDFObject.embed(url, inner, {
+        height: '400px'
+      })
+    })
     // syntax highlighting
   view.find('code.raw').removeClass('raw')
-        .each((key, value) => {
-          const langDiv = $(value)
-          if (langDiv.length > 0) {
-            const reallang = langDiv[0].className.replace(/hljs|wrap/g, '').trim()
-            const codeDiv = langDiv.find('.code')
-            let code = ''
-            if (codeDiv.length > 0) code = codeDiv.html()
-            else code = langDiv.html()
-            var result
-            if (!reallang) {
-              result = {
-                value: code
-              }
-            } else if (reallang === 'haskell' || reallang === 'go' || reallang === 'typescript' || reallang === 'jsx' || reallang === 'gherkin') {
-              code = unescapeHTML(code)
-              result = {
-                value: Prism.highlight(code, Prism.languages[reallang])
-              }
-            } else if (reallang === 'tiddlywiki' || reallang === 'mediawiki') {
-              code = unescapeHTML(code)
-              result = {
-                value: Prism.highlight(code, Prism.languages.wiki)
-              }
-            } else if (reallang === 'cmake') {
-              code = unescapeHTML(code)
-              result = {
-                value: Prism.highlight(code, Prism.languages.makefile)
-              }
-            } else {
-              code = unescapeHTML(code)
-              const languages = hljs.listLanguages()
-              if (!languages.includes(reallang)) {
-                result = hljs.highlightAuto(code)
-              } else {
-                result = hljs.highlight(reallang, code)
-              }
-            }
-            if (codeDiv.length > 0) codeDiv.html(result.value)
-            else langDiv.html(result.value)
+    .each((key, value) => {
+      const langDiv = $(value)
+      if (langDiv.length > 0) {
+        const reallang = langDiv[0].className.replace(/hljs|wrap/g, '').trim()
+        const codeDiv = langDiv.find('.code')
+        let code = ''
+        if (codeDiv.length > 0) code = codeDiv.html()
+        else code = langDiv.html()
+        var result
+        if (!reallang) {
+          result = {
+            value: code
           }
-        })
+        } else if (reallang === 'haskell' || reallang === 'go' || reallang === 'typescript' || reallang === 'jsx' || reallang === 'gherkin') {
+          code = unescapeHTML(code)
+          result = {
+            value: Prism.highlight(code, Prism.languages[reallang])
+          }
+        } else if (reallang === 'tiddlywiki' || reallang === 'mediawiki') {
+          code = unescapeHTML(code)
+          result = {
+            value: Prism.highlight(code, Prism.languages.wiki)
+          }
+        } else if (reallang === 'cmake') {
+          code = unescapeHTML(code)
+          result = {
+            value: Prism.highlight(code, Prism.languages.makefile)
+          }
+        } else {
+          code = unescapeHTML(code)
+          const languages = hljs.listLanguages()
+          if (!languages.includes(reallang)) {
+            result = hljs.highlightAuto(code)
+          } else {
+            result = hljs.highlight(reallang, code)
+          }
+        }
+        if (codeDiv.length > 0) codeDiv.html(result.value)
+        else langDiv.html(result.value)
+      }
+    })
     // mathjax
   const mathjaxdivs = view.find('span.mathjax.raw').removeClass('raw').toArray()
   try {
@@ -536,7 +542,7 @@ export function finishView (view) {
   } catch (err) {
     console.warn(err)
   }
-    // render title
+  // render title
   document.title = renderTitle(view)
 }
 
@@ -596,23 +602,23 @@ window.removeDOMEvents = removeDOMEvents
 function generateCleanHTML (view) {
   const src = view.clone()
   const eles = src.find('*')
-    // remove syncscroll parts
+  // remove syncscroll parts
   eles.removeClass('part')
   src.find('*[class=""]').removeAttr('class')
   eles.removeAttr('data-startline data-endline')
   src.find("a[href^='#'][smoothhashscroll]").removeAttr('smoothhashscroll')
-    // remove gist content
+  // remove gist content
   src.find('code[data-gist-id]').children().remove()
-    // disable todo list
+  // disable todo list
   src.find('input.task-list-item-checkbox').attr('disabled', '')
-    // replace emoji image path
+  // replace emoji image path
   src.find('img.emoji').each((key, value) => {
     let name = $(value).attr('alt')
     name = name.substr(1)
     name = name.slice(0, name.length - 1)
     $(value).attr('src', `https://cdnjs.cloudflare.com/ajax/libs/emojify.js/1.1.0/images/basic/${name}.png`)
   })
-    // replace video to iframe
+  // replace video to iframe
   src.find('div[data-videoid]').each((key, value) => {
     const id = $(value).attr('data-videoid')
     const style = $(value).attr('style')
@@ -648,12 +654,12 @@ export function exportToHTML (view) {
   const title = renderTitle(ui.area.markdown)
   const filename = `${renderFilename(ui.area.markdown)}.html`
   const src = generateCleanHTML(view)
-    // generate toc
+  // generate toc
   const toc = $('#ui-toc').clone()
   toc.find('*').removeClass('active').find("a[href^='#'][smoothhashscroll]").removeAttr('smoothhashscroll')
   const tocAffix = $('#ui-toc-affix').clone()
   tocAffix.find('*').removeClass('active').find("a[href^='#'][smoothhashscroll]").removeAttr('smoothhashscroll')
-    // generate html via template
+  // generate html via template
   $.get(`${serverurl}/build/html.min.css`, css => {
     $.get(`${serverurl}/views/html.hbs`, data => {
       const template = window.Handlebars.compile(data)
@@ -668,7 +674,7 @@ export function exportToHTML (view) {
         dir: (md && md.meta && md.meta.dir) ? `dir="${md.meta.dir}"` : null
       }
       const html = template(context)
-            //        console.log(html);
+      //        console.log(html);
       const blob = new Blob([html], {
         type: 'text/html;charset=utf-8'
       })
@@ -783,20 +789,20 @@ export function smoothHashScroll () {
     const hash = element.hash
     if (hash) {
       $element.on('click', function (e) {
-                // store hash
+        // store hash
         const hash = decodeURIComponent(this.hash)
-                // escape special characters in jquery selector
+        // escape special characters in jquery selector
         const $hash = $(hash.replace(/(:|\.|\[|\]|,)/g, '\\$1'))
-                // return if no element been selected
+        // return if no element been selected
         if ($hash.length <= 0) return
-                // prevent default anchor click behavior
+        // prevent default anchor click behavior
         e.preventDefault()
-                // animate
+        // animate
         $('body, html').stop(true, true).animate({
           scrollTop: $hash.offset().top
         }, 100, 'linear', () => {
-                    // when done, add hash to url
-                    // (default click behaviour)
+          // when done, add hash to url
+          // (default click behaviour)
           window.location.hash = hash
         })
       })
@@ -938,9 +944,6 @@ function highlightRender (code, lang) {
   return result.value
 }
 
-import markdownit from 'markdown-it'
-import markdownitContainer from 'markdown-it-container'
-
 export let md = markdownit('default', {
   html: true,
   breaks: true,
@@ -1038,109 +1041,106 @@ md.renderer.rules.fence = (tokens, idx, options, env, self) => {
   return `<pre><code${self.renderAttrs(token)}>${highlighted}</code></pre>\n`
 }
 
-/* Defined regex markdown it plugins */
-import Plugin from 'markdown-it-regexp'
-
 // youtube
 const youtubePlugin = new Plugin(
-    // regexp to match
-    /{%youtube\s*([\d\D]*?)\s*%}/,
+  // regexp to match
+  /{%youtube\s*([\d\D]*?)\s*%}/,
 
-    (match, utils) => {
-      const videoid = match[1]
-      if (!videoid) return
-      const div = $('<div class="youtube raw"></div>')
-      div.attr('data-videoid', videoid)
-      const thumbnailSrc = `//img.youtube.com/vi/${videoid}/hqdefault.jpg`
-      const image = `<img src="${thumbnailSrc}" />`
-      div.append(image)
-      const icon = '<i class="icon fa fa-youtube-play fa-5x"></i>'
-      div.append(icon)
-      return div[0].outerHTML
-    }
+  (match, utils) => {
+    const videoid = match[1]
+    if (!videoid) return
+    const div = $('<div class="youtube raw"></div>')
+    div.attr('data-videoid', videoid)
+    const thumbnailSrc = `//img.youtube.com/vi/${videoid}/hqdefault.jpg`
+    const image = `<img src="${thumbnailSrc}" />`
+    div.append(image)
+    const icon = '<i class="icon fa fa-youtube-play fa-5x"></i>'
+    div.append(icon)
+    return div[0].outerHTML
+  }
 )
 // vimeo
 const vimeoPlugin = new Plugin(
-    // regexp to match
-    /{%vimeo\s*([\d\D]*?)\s*%}/,
+  // regexp to match
+  /{%vimeo\s*([\d\D]*?)\s*%}/,
 
-    (match, utils) => {
-      const videoid = match[1]
-      if (!videoid) return
-      const div = $('<div class="vimeo raw"></div>')
-      div.attr('data-videoid', videoid)
-      const icon = '<i class="icon fa fa-vimeo-square fa-5x"></i>'
-      div.append(icon)
-      return div[0].outerHTML
-    }
+  (match, utils) => {
+    const videoid = match[1]
+    if (!videoid) return
+    const div = $('<div class="vimeo raw"></div>')
+    div.attr('data-videoid', videoid)
+    const icon = '<i class="icon fa fa-vimeo-square fa-5x"></i>'
+    div.append(icon)
+    return div[0].outerHTML
+  }
 )
 // gist
 const gistPlugin = new Plugin(
-    // regexp to match
-    /{%gist\s*([\d\D]*?)\s*%}/,
+  // regexp to match
+  /{%gist\s*([\d\D]*?)\s*%}/,
 
-    (match, utils) => {
-      const gistid = match[1]
-      const code = `<code data-gist-id="${gistid}"></code>`
-      return code
-    }
+  (match, utils) => {
+    const gistid = match[1]
+    const code = `<code data-gist-id="${gistid}"></code>`
+    return code
+  }
 )
 // TOC
 const tocPlugin = new Plugin(
-    // regexp to match
-    /^\[TOC\]$/i,
+  // regexp to match
+  /^\[TOC\]$/i,
 
-    (match, utils) => '<div class="toc"></div>'
+  (match, utils) => '<div class="toc"></div>'
 )
 // slideshare
 const slidesharePlugin = new Plugin(
-    // regexp to match
-    /{%slideshare\s*([\d\D]*?)\s*%}/,
+  // regexp to match
+  /{%slideshare\s*([\d\D]*?)\s*%}/,
 
-    (match, utils) => {
-      const slideshareid = match[1]
-      const div = $('<div class="slideshare raw"></div>')
-      div.attr('data-slideshareid', slideshareid)
-      return div[0].outerHTML
-    }
+  (match, utils) => {
+    const slideshareid = match[1]
+    const div = $('<div class="slideshare raw"></div>')
+    div.attr('data-slideshareid', slideshareid)
+    return div[0].outerHTML
+  }
 )
 // speakerdeck
 const speakerdeckPlugin = new Plugin(
-    // regexp to match
-    /{%speakerdeck\s*([\d\D]*?)\s*%}/,
+  // regexp to match
+  /{%speakerdeck\s*([\d\D]*?)\s*%}/,
 
-    (match, utils) => {
-      const speakerdeckid = match[1]
-      const div = $('<div class="speakerdeck raw"></div>')
-      div.attr('data-speakerdeckid', speakerdeckid)
-      return div[0].outerHTML
-    }
+  (match, utils) => {
+    const speakerdeckid = match[1]
+    const div = $('<div class="speakerdeck raw"></div>')
+    div.attr('data-speakerdeckid', speakerdeckid)
+    return div[0].outerHTML
+  }
 )
 // pdf
 const pdfPlugin = new Plugin(
-    // regexp to match
-    /{%pdf\s*([\d\D]*?)\s*%}/,
+  // regexp to match
+  /{%pdf\s*([\d\D]*?)\s*%}/,
 
-    (match, utils) => {
-      const pdfurl = match[1]
-      if (!isValidURL(pdfurl)) return match[0]
-      const div = $('<div class="pdf raw"></div>')
-      div.attr('data-pdfurl', pdfurl)
-      return div[0].outerHTML
-    }
+  (match, utils) => {
+    const pdfurl = match[1]
+    if (!isValidURL(pdfurl)) return match[0]
+    const div = $('<div class="pdf raw"></div>')
+    div.attr('data-pdfurl', pdfurl)
+    return div[0].outerHTML
+  }
 )
 
 const emojijsPlugin = new Plugin(
-    // regexp to match emoji shortcodes :something:
-    // We generate an universal regex that guaranteed only contains the
-    // emojies we have available. This should prevent all false-positives
-    new RegExp(':(' + window.emojify.emojiNames.map((item) => { return RegExp.escape(item) }).join('|') + '):', 'i'),
+  // regexp to match emoji shortcodes :something:
+  // We generate an universal regex that guaranteed only contains the
+  // emojies we have available. This should prevent all false-positives
+  new RegExp(':(' + window.emojify.emojiNames.map((item) => { return RegExp.escape(item) }).join('|') + '):', 'i'),
 
-    (match, utils) => {
-      const emoji = match[1].toLowerCase()
-      const div = $(`<img class="emoji" alt=":${emoji}:" src="${serverurl}/build/emojify.js/dist/images/basic/${emoji}.png"></img>`)
-      return div[0].outerHTML
-    }
+  (match, utils) => {
+    const emoji = match[1].toLowerCase()
+    const div = $(`<img class="emoji" alt=":${emoji}:" src="${serverurl}/build/emojify.js/dist/images/basic/${emoji}.png"></img>`)
+    return div[0].outerHTML
+  }
 )
 
 // yaml meta, from https://github.com/eugeneware/remarkable-meta