Linter: Fix all lint errors

Signed-off-by: Philip Molares <philip.molares@udo.edu>

15 files changed, 1731 insertions, 1064 deletions

diff --git a/public/.eslintrc.js b/public/.eslintrc.js
index dc37b3cb..77cd2c0d 100644
--- a/public/.eslintrc.js
+++ b/public/.eslintrc.js
@@ -1,28 +1,28 @@
 // this config file is used in concert with the root .eslintrc.js in the root dir.
 module.exports = {
-  "env": {
-    "browser": true
+  env: {
+    browser: true
   },
-  "globals": {
-    "$": false,
-    "CodeMirror": false,
-    "Cookies": false,
-    "moment": false,
-    "editor": false,
-    "ui": false,
-    "Spinner": false,
-    "modeType": false,
-    "Idle": false,
-    "serverurl": false,
-    "key": false,
-    "gapi": false,
-    "Dropbox": false,
-    "FilePicker": false,
-    "ot": false,
-    "MediaUploader": false,
-    "hex2rgb": false,
-    "num_loaded": false,
-    "Visibility": false,
-    "inlineAttachment": false
+  globals: {
+    $: false,
+    CodeMirror: false,
+    Cookies: false,
+    moment: false,
+    editor: false,
+    ui: false,
+    Spinner: false,
+    modeType: false,
+    Idle: false,
+    serverurl: false,
+    key: false,
+    gapi: false,
+    Dropbox: false,
+    FilePicker: false,
+    ot: false,
+    MediaUploader: false,
+    hex2rgb: false,
+    num_loaded: false,
+    Visibility: false,
+    inlineAttachment: false
   }
-};
+}
diff --git a/public/js/cover.js b/public/js/cover.js
index ed10afbf..bad92574 100644
--- a/public/js/cover.js
+++ b/public/js/cover.js
@@ -262,8 +262,8 @@ function updateItemFromNow () {
   }
 }
 
-var clearHistory = false
-var deleteId = null
+let clearHistory = false
+let deleteId = null
 
 function deleteHistory () {
   checkIfAuth(() => {
@@ -431,9 +431,9 @@ $('.search').keyup(() => {
 
 // focus user field after opening login modal
 $('.signin-modal').on('shown.bs.modal', function () {
-  let fieldLDAP = $('input[name=username]')
-  let fieldEmail = $('input[name=email]')
-  let fieldOpenID = $('input[name=openid_identifier]')
+  const fieldLDAP = $('input[name=username]')
+  const fieldEmail = $('input[name=email]')
+  const fieldOpenID = $('input[name=openid_identifier]')
   if (fieldLDAP.length === 1) {
     fieldLDAP.focus()
   } else if (fieldEmail.length === 1) {
diff --git a/public/js/extra.js b/public/js/extra.js
index 44db742a..7f06ebda 100644
--- a/public/js/extra.js
+++ b/public/js/extra.js
@@ -29,7 +29,7 @@ require('prismjs/components/prism-gherkin')
 require('./lib/common/login')
 require('./locale')
 require('../vendor/md-toc')
-var Viz = require('viz.js')
+const Viz = require('viz.js')
 const ui = getUIElements()
 
 // auto update last change
@@ -314,8 +314,9 @@ export function finishView (view) {
   // sequence diagram
   const sequences = view.find('div.sequence-diagram.raw').removeClass('raw')
   sequences.each((key, value) => {
+    let $value
     try {
-      var $value = $(value)
+      $value = $(value)
       const $ele = $(value).parent().parent()
 
       const sequence = $value
@@ -337,15 +338,16 @@ export function finishView (view) {
   // flowchart
   const flow = view.find('div.flow-chart.raw').removeClass('raw')
   flow.each((key, value) => {
+    let $value
     try {
-      var $value = $(value)
+      $value = $(value)
       const $ele = $(value).parent().parent()
 
       const chart = window.flowchart.parse($value.text())
       $value.html('')
       chart.drawSVG(value, {
         'line-width': 2,
-        'fill': 'none',
+        fill: 'none',
         'font-size': '16px',
         'font-family': "'Andale Mono', monospace"
       })
@@ -359,13 +361,14 @@ export function finishView (view) {
     }
   })
   // graphviz
-  var graphvizs = view.find('div.graphviz.raw').removeClass('raw')
+  const graphvizs = view.find('div.graphviz.raw').removeClass('raw')
   graphvizs.each(function (key, value) {
+    let $value
     try {
-      var $value = $(value)
-      var $ele = $(value).parent().parent()
+      $value = $(value)
+      const $ele = $(value).parent().parent()
 
-      var graphviz = Viz($value.text())
+      const graphviz = Viz($value.text())
       if (!graphviz) throw Error('viz.js output empty graph')
       $value.html(graphviz)
 
@@ -380,8 +383,9 @@ export function finishView (view) {
   // mermaid
   const mermaids = view.find('div.mermaid.raw').removeClass('raw')
   mermaids.each((key, value) => {
+    let $value
     try {
-      var $value = $(value)
+      $value = $(value)
       const $ele = $(value).closest('pre')
 
       window.mermaid.mermaidAPI.parse($value.text())
@@ -389,7 +393,7 @@ export function finishView (view) {
       $ele.text($value.text())
       window.mermaid.init(undefined, $ele)
     } catch (err) {
-      var errormessage = err
+      let errormessage = err
       if (err.str) {
         errormessage = err.str
       }
@@ -402,9 +406,10 @@ export function finishView (view) {
   // abc.js
   const abcs = view.find('div.abc.raw').removeClass('raw')
   abcs.each((key, value) => {
+    let $value
     try {
-      var $value = $(value)
-      var $ele = $(value).parent().parent()
+      $value = $(value)
+      const $ele = $(value).parent().parent()
 
       window.ABCJS.renderAbc(value, $value.text())
 
@@ -493,7 +498,7 @@ export function finishView (view) {
         let code = ''
         if (codeDiv.length > 0) code = codeDiv.html()
         else code = langDiv.html()
-        var result
+        let result
         if (!reallang) {
           result = {
             value: code
@@ -571,7 +576,7 @@ export function postProcess (code) {
   }
   // show yaml meta paring error
   if (md.metaError) {
-    var warning = result.find('div#meta-error')
+    let warning = result.find('div#meta-error')
     if (warning && warning.length > 0) {
       warning.text(md.metaError)
     } else {
@@ -583,14 +588,14 @@ export function postProcess (code) {
 }
 window.postProcess = postProcess
 
-var domevents = Object.getOwnPropertyNames(document).concat(Object.getOwnPropertyNames(Object.getPrototypeOf(Object.getPrototypeOf(document)))).concat(Object.getOwnPropertyNames(Object.getPrototypeOf(window))).filter(function (i) {
+const domevents = Object.getOwnPropertyNames(document).concat(Object.getOwnPropertyNames(Object.getPrototypeOf(Object.getPrototypeOf(document)))).concat(Object.getOwnPropertyNames(Object.getPrototypeOf(window))).filter(function (i) {
   return !i.indexOf('on') && (document[i] === null || typeof document[i] === 'function')
 }).filter(function (elem, pos, self) {
   return self.indexOf(elem) === pos
 })
 
 export function removeDOMEvents (view) {
-  for (var i = 0, l = domevents.length; i < l; i++) {
+  for (let i = 0, l = domevents.length; i < l; i++) {
     view.find('[' + domevents[i] + ']').removeAttr(domevents[i])
   }
 }
@@ -739,13 +744,13 @@ export function generateToc (id) {
   const target = $(`#${id}`)
   target.html('')
   /* eslint-disable no-unused-vars */
-  var toc = new window.Toc('doc', {
-    'level': 3,
-    'top': -1,
-    'class': 'toc',
-    'ulClass': 'nav',
-    'targetId': id,
-    'process': getHeaderContent
+  const toc = new window.Toc('doc', {
+    level: 3,
+    top: -1,
+    class: 'toc',
+    ulClass: 'nav',
+    targetId: id,
+    process: getHeaderContent
   })
   /* eslint-enable no-unused-vars */
   if (target.text() === 'undefined') { target.html('') }
@@ -858,7 +863,7 @@ const linkifyAnchors = (level, containingElement) => {
   const headers = containingElement.getElementsByTagName(`h${level}`)
 
   for (let i = 0, l = headers.length; i < l; i++) {
-    let header = headers[i]
+    const header = headers[i]
     if (header.getElementsByClassName('anchor').length === 0) {
       if (typeof header.id === 'undefined' || header.id === '') {
         header.id = createHeaderId(getHeaderContent(header))
@@ -903,7 +908,7 @@ export function deduplicatedHeaderId (view) {
   if (window.linkifyHeaderStyle === 'gfm') {
     // consistent with GitHub, GitLab, Pandoc & co.
     // all headers contained in the document, in order of appearance
-    const allHeaders = view.find(`:header`).toArray()
+    const allHeaders = view.find(':header').toArray()
     // list of finaly assigned header IDs
     const headerIds = new Set()
     for (let j = 0; j < allHeaders.length; j++) {
@@ -938,12 +943,12 @@ export function renderTOC (view) {
     const target = $(`#${id}`)
     target.html('')
     /* eslint-disable no-unused-vars */
-    let TOC = new window.Toc('doc', {
-      'level': 3,
-      'top': -1,
-      'class': 'toc',
-      'targetId': id,
-      'process': getHeaderContent
+    const TOC = new window.Toc('doc', {
+      level: 3,
+      top: -1,
+      class: 'toc',
+      targetId: id,
+      process: getHeaderContent
     })
     /* eslint-enable no-unused-vars */
     if (target.text() === 'undefined') { target.html('') }
@@ -991,7 +996,7 @@ function highlightRender (code, lang) {
   return result.value
 }
 
-export let md = markdownit('default', {
+export const md = markdownit('default', {
   html: true,
   breaks: true,
   langPrefix: '',
@@ -1044,7 +1049,7 @@ md.use(markdownitContainer, 'info', { render: renderContainer })
 md.use(markdownitContainer, 'warning', { render: renderContainer })
 md.use(markdownitContainer, 'danger', { render: renderContainer })
 
-let defaultImageRender = md.renderer.rules.image
+const defaultImageRender = md.renderer.rules.image
 md.renderer.rules.image = function (tokens, idx, options, env, self) {
   tokens[idx].attrJoin('class', 'raw')
   return defaultImageRender(...arguments)
@@ -1203,7 +1208,8 @@ function meta (state, start, end, silent) {
   if (!get(state, start).match(/^---$/)) return false
 
   const data = []
-  for (var line = start + 1; line < end; line++) {
+  let line
+  for (line = start + 1; line < end; line++) {
     const str = get(state, line)
     if (str.match(/^(\.{3}|-{3})$/)) break
     if (state.tShift[line] < 0) break
diff --git a/public/js/history.js b/public/js/history.js
index e0154185..b8935eb3 100644
--- a/public/js/history.js
+++ b/public/js/history.js
@@ -147,7 +147,7 @@ export function writeHistory (title, tags) {
 }
 
 function writeHistoryToStorage (title, tags) {
-  let data = store.get('notehistory')
+  const data = store.get('notehistory')
   let notehistory
   if (data && typeof data === 'string') {
     notehistory = JSON.parse(data)
@@ -220,7 +220,7 @@ export function getStorageHistory (callback) {
     if (typeof data === 'string') { data = JSON.parse(data) }
     callback(data)
   }
-  // eslint-disable-next-line standard/no-callback-literal
+  // eslint-disable-next-line node/no-callback-literal
   callback([])
 }
 
@@ -263,7 +263,7 @@ function parseToHistory (list, notehistory, callback) {
     for (let i = 0; i < notehistory.length; i++) {
       // migrate LZString encoded id to base64url encoded id
       try {
-        let id = LZString.decompressFromBase64(notehistory[i].id)
+        const id = LZString.decompressFromBase64(notehistory[i].id)
         if (id && checkNoteIdValid(id)) {
           notehistory[i].id = encodeNoteId(id)
         }
diff --git a/public/js/index.js b/public/js/index.js
index adc95461..03cae1b4 100644
--- a/public/js/index.js
+++ b/public/js/index.js
@@ -85,19 +85,49 @@ require('../css/site.css')
 
 require('highlight.js/styles/github-gist.css')
 
-var defaultTextHeight = 20
-var viewportMargin = 20
-var defaultEditorMode = 'gfm'
-
-var idleTime = 300000 // 5 mins
-var updateViewDebounce = 100
-var cursorMenuThrottle = 50
-var cursorActivityDebounce = 50
-var cursorAnimatePeriod = 100
-var supportContainers = ['success', 'info', 'warning', 'danger']
-var supportCodeModes = ['javascript', 'typescript', 'jsx', 'htmlmixed', 'htmlembedded', 'css', 'xml', 'clike', 'clojure', 'ruby', 'python', 'shell', 'php', 'sql', 'haskell', 'coffeescript', 'yaml', 'pug', 'lua', 'cmake', 'nginx', 'perl', 'sass', 'r', 'dockerfile', 'tiddlywiki', 'mediawiki', 'go', 'gherkin'].concat(hljs.listLanguages())
-var supportCharts = ['sequence', 'flow', 'graphviz', 'mermaid', 'abc']
-var supportHeaders = [
+let defaultTextHeight = 20
+let viewportMargin = 20
+const defaultEditorMode = 'gfm'
+
+const idleTime = 300000 // 5 mins
+const updateViewDebounce = 100
+const cursorMenuThrottle = 50
+const cursorActivityDebounce = 50
+const cursorAnimatePeriod = 100
+const supportContainers = ['success', 'info', 'warning', 'danger']
+const supportCodeModes = [
+  'javascript',
+  'typescript',
+  'jsx',
+  'htmlmixed',
+  'htmlembedded',
+  'css',
+  'xml',
+  'clike',
+  'clojure',
+  'ruby',
+  'python',
+  'shell',
+  'php',
+  'sql',
+  'haskell',
+  'coffeescript',
+  'yaml',
+  'pug',
+  'lua',
+  'cmake',
+  'nginx',
+  'perl',
+  'sass',
+  'r',
+  'dockerfile',
+  'tiddlywiki',
+  'mediawiki',
+  'go',
+  'gherkin'
+].concat(hljs.listLanguages())
+const supportCharts = ['sequence', 'flow', 'graphviz', 'mermaid', 'abc']
+const supportHeaders = [
   {
     text: '# h1',
     search: '#'
@@ -225,7 +255,7 @@ const supportExtraTags = [
     text: '[random color tag]',
     search: '[]',
     command: function () {
-      var color = randomColor()
+      const color = randomColor()
       return '[color=' + color + ']'
     }
   }
@@ -259,7 +289,7 @@ let visibleMD = false
 let visibleLG = false
 const isTouchDevice = 'ontouchstart' in document.documentElement
 let currentStatus = statusType.offline
-let lastInfo = {
+const lastInfo = {
   needRestore: false,
   cursor: null,
   scroll: null,
@@ -285,14 +315,14 @@ let lastInfo = {
 let personalInfo = {}
 let onlineUsers = []
 const fileTypes = {
-  'pl': 'perl',
-  'cgi': 'perl',
-  'js': 'javascript',
-  'php': 'php',
-  'sh': 'bash',
-  'rb': 'ruby',
-  'html': 'html',
-  'py': 'python'
+  pl: 'perl',
+  cgi: 'perl',
+  js: 'javascript',
+  php: 'php',
+  sh: 'bash',
+  rb: 'ruby',
+  html: 'html',
+  py: 'python'
 }
 
 // editor settings
@@ -302,7 +332,7 @@ if (!textit) {
 }
 
 const editorInstance = new Editor()
-var editor = editorInstance.init(textit)
+const editor = editorInstance.init(textit)
 
 // FIXME: global referncing in jquery-textcomplete patch
 window.editor = editor
@@ -313,7 +343,7 @@ defaultTextHeight = parseInt($('.CodeMirror').css('line-height'))
 const ui = getUIElements()
 
 // page actions
-var opts = {
+const opts = {
   lines: 11, // The number of lines to draw
   length: 20, // The length of each line
   width: 2, // The line thickness
@@ -333,11 +363,11 @@ var opts = {
 }
 
 /* eslint-disable no-unused-vars */
-var spinner = new Spinner(opts).spin(ui.spinner[0])
+const spinner = new Spinner(opts).spin(ui.spinner[0])
 /* eslint-enable no-unused-vars */
 
 // idle
-var idle = new Idle({
+const idle = new Idle({
   onAway: function () {
     idle.isAway = true
     emitUserStatus()
@@ -356,7 +386,7 @@ ui.area.codemirror.on('touchstart', function () {
   idle.onActive()
 })
 
-var haveUnreadChanges = false
+let haveUnreadChanges = false
 
 function setHaveUnreadChanges (bool) {
   if (!window.loaded) return
@@ -379,7 +409,9 @@ function updateTitleReminder () {
 function setRefreshModal (status) {
   $('#refreshModal').modal('show')
   $('#refreshModal').find('.modal-body > div').hide()
-  $('#refreshModal').find('.' + status).show()
+  $('#refreshModal')
+    .find('.' + status)
+    .show()
 }
 
 function setNeedRefresh () {
@@ -395,9 +427,9 @@ setloginStateChangeEvent(function () {
 })
 
 // visibility
-var wasFocus = false
+let wasFocus = false
 Visibility.change(function (e, state) {
-  var hidden = Visibility.hidden()
+  const hidden = Visibility.hidden()
   if (hidden) {
     if (editorHasFocus()) {
       wasFocus = true
@@ -421,7 +453,7 @@ $(document).ready(function () {
   idle.checkAway()
   checkResponsive()
   // if in smaller screen, we don't need advanced scrollbar
-  var scrollbarStyle
+  let scrollbarStyle
   if (visibleXS) {
     scrollbarStyle = 'native'
   } else {
@@ -434,7 +466,7 @@ $(document).ready(function () {
   checkEditorStyle()
 
   /* cache dom references */
-  var $body = $('body')
+  const $body = $('body')
 
   /* we need this only on touch devices */
   if (isTouchDevice) {
@@ -463,7 +495,9 @@ $(document).ready(function () {
   $('[data-toggle="tooltip"]').tooltip()
   // shortcuts
   // allow on all tags
-  key.filter = function (e) { return true }
+  key.filter = function (e) {
+    return true
+  }
   key('ctrl+alt+e', function (e) {
     changeMode(modeType.edit)
   })
@@ -488,13 +522,18 @@ $(window).resize(function () {
 })
 // when page unload
 $(window).on('unload', function () {
-// updateHistoryInner();
+  // updateHistoryInner();
 })
 $(window).on('error', function () {
   // setNeedRefresh();
 })
 
-setupSyncAreas(ui.area.codemirrorScroll, ui.area.view, ui.area.markdown, editor)
+setupSyncAreas(
+  ui.area.codemirrorScroll,
+  ui.area.view,
+  ui.area.markdown,
+  editor
+)
 
 function autoSyncscroll () {
   if (editorHasFocus()) {
@@ -504,8 +543,8 @@ function autoSyncscroll () {
   }
 }
 
-var windowResizeDebounce = 200
-var windowResize = _.debounce(windowResizeInner, windowResizeDebounce)
+const windowResizeDebounce = 200
+const windowResize = _.debounce(windowResizeInner, windowResizeDebounce)
 
 function windowResizeInner (callback) {
   checkLayout()
@@ -520,7 +559,9 @@ function windowResizeInner (callback) {
         clearMap()
         autoSyncscroll()
         updateScrollspy()
-        if (callback && typeof callback === 'function') { callback() }
+        if (callback && typeof callback === 'function') {
+          callback()
+        }
       }, 1)
     } else {
       // force it load all docs at once to prevent scroll knob blink
@@ -530,18 +571,22 @@ function windowResizeInner (callback) {
         autoSyncscroll()
         editor.setOption('viewportMargin', viewportMargin)
         // add or update user cursors
-        for (var i = 0; i < onlineUsers.length; i++) {
-          if (onlineUsers[i].id !== personalInfo.id) { buildCursor(onlineUsers[i]) }
+        for (let i = 0; i < onlineUsers.length; i++) {
+          if (onlineUsers[i].id !== personalInfo.id) {
+            buildCursor(onlineUsers[i])
+          }
         }
         updateScrollspy()
-        if (callback && typeof callback === 'function') { callback() }
+        if (callback && typeof callback === 'function') {
+          callback()
+        }
       }, 1)
     }
   }
 }
 
 function checkLayout () {
-  var navbarHieght = $('.navbar').outerHeight()
+  const navbarHieght = $('.navbar').outerHeight()
   $('body').css('padding-top', navbarHieght + 'px')
 }
 
@@ -557,22 +602,28 @@ function checkResponsive () {
   visibleLG = $('.visible-lg').is(':visible')
 
   if (visibleXS && appState.currentMode === modeType.both) {
-    if (editorHasFocus()) { changeMode(modeType.edit) } else { changeMode(modeType.view) }
+    if (editorHasFocus()) {
+      changeMode(modeType.edit)
+    } else {
+      changeMode(modeType.view)
+    }
   }
 
   emitUserStatus()
 }
 
-var lastEditorWidth = 0
-var previousFocusOnEditor = null
+let lastEditorWidth = 0
+let previousFocusOnEditor = null
 
 function checkEditorStyle () {
-  var desireHeight = editorInstance.statusBar ? (ui.area.edit.height() - editorInstance.statusBar.outerHeight()) : ui.area.edit.height()
+  let desireHeight = editorInstance.statusBar
+    ? ui.area.edit.height() - editorInstance.statusBar.outerHeight()
+    : ui.area.edit.height()
   if (editorInstance.toolBar) {
     desireHeight = desireHeight - editorInstance.toolBar.outerHeight()
   }
   // set editor height and min height based on scrollbar style and mode
-  var scrollbarStyle = editor.getOption('scrollbarStyle')
+  const scrollbarStyle = editor.getOption('scrollbarStyle')
   if (scrollbarStyle === 'overlay' || appState.currentMode === modeType.both) {
     ui.area.codemirrorScroll.css('height', desireHeight + 'px')
     ui.area.codemirrorScroll.css('min-height', '')
@@ -590,9 +641,11 @@ function checkEditorStyle () {
       maxWidth: $(window).width() * 0.7,
       minWidth: $(window).width() * 0.2,
       create: function (e, ui) {
-        $(this).parent().on('resize', function (e) {
-          e.stopPropagation()
-        })
+        $(this)
+          .parent()
+          .on('resize', function (e) {
+            e.stopPropagation()
+          })
       },
       start: function (e) {
         editor.setOption('viewportMargin', Infinity)
@@ -622,23 +675,31 @@ function checkEditorStyle () {
     ui.area.resize.handle = $('.ui-resizable-handle')
   }
   if (!ui.area.resize.syncToggle.length) {
-    ui.area.resize.syncToggle = $('<button class="btn btn-lg btn-default ui-sync-toggle" title="Toggle sync scrolling"><i class="fa fa-link fa-fw"></i></button>')
-    ui.area.resize.syncToggle.hover(function () {
-      previousFocusOnEditor = editorHasFocus()
-    }, function () {
-      previousFocusOnEditor = null
-    })
+    ui.area.resize.syncToggle = $(
+      '<button class="btn btn-lg btn-default ui-sync-toggle" title="Toggle sync scrolling"><i class="fa fa-link fa-fw"></i></button>'
+    )
+    ui.area.resize.syncToggle.hover(
+      function () {
+        previousFocusOnEditor = editorHasFocus()
+      },
+      function () {
+        previousFocusOnEditor = null
+      }
+    )
     ui.area.resize.syncToggle.click(function () {
       appState.syncscroll = !appState.syncscroll
       checkSyncToggle()
     })
     ui.area.resize.handle.append(ui.area.resize.syncToggle)
     ui.area.resize.syncToggle.hide()
-    ui.area.resize.handle.hover(function () {
-      ui.area.resize.syncToggle.stop(true, true).delay(200).fadeIn(100)
-    }, function () {
-      ui.area.resize.syncToggle.stop(true, true).delay(300).fadeOut(300)
-    })
+    ui.area.resize.handle.hover(
+      function () {
+        ui.area.resize.syncToggle.stop(true, true).delay(200).fadeIn(100)
+      },
+      function () {
+        ui.area.resize.syncToggle.stop(true, true).delay(300).fadeOut(300)
+      }
+    )
   }
 }
 
@@ -651,37 +712,53 @@ function checkSyncToggle () {
       window.preventSyncScrollToEdit = false
       syncScrollToEdit()
     }
-    ui.area.resize.syncToggle.find('i').removeClass('fa-unlink').addClass('fa-link')
+    ui.area.resize.syncToggle
+      .find('i')
+      .removeClass('fa-unlink')
+      .addClass('fa-link')
   } else {
-    ui.area.resize.syncToggle.find('i').removeClass('fa-link').addClass('fa-unlink')
+    ui.area.resize.syncToggle
+      .find('i')
+      .removeClass('fa-link')
+      .addClass('fa-unlink')
   }
 }
 
-var checkEditorScrollbar = _.debounce(function () {
+const checkEditorScrollbar = _.debounce(function () {
   editor.operation(checkEditorScrollbarInner)
 }, 50)
 
 function checkEditorScrollbarInner () {
   // workaround simple scroll bar knob
   // will get wrong position when editor height changed
-  var scrollInfo = editor.getScrollInfo()
+  const scrollInfo = editor.getScrollInfo()
   editor.scrollTo(null, scrollInfo.top - 1)
   editor.scrollTo(null, scrollInfo.top)
 }
 
 function checkTocStyle () {
   // toc right
-  var paddingRight = parseFloat(ui.area.markdown.css('padding-right'))
-  var right = ($(window).width() - (ui.area.markdown.offset().left + ui.area.markdown.outerWidth() - paddingRight))
+  const paddingRight = parseFloat(ui.area.markdown.css('padding-right'))
+  const right =
+    $(window).width() -
+    (ui.area.markdown.offset().left +
+      ui.area.markdown.outerWidth() -
+      paddingRight)
   ui.toc.toc.css('right', right + 'px')
   // affix toc left
-  var newbool
-  var rightMargin = (ui.area.markdown.parent().outerWidth() - ui.area.markdown.outerWidth()) / 2
+  let newbool
+  const rightMargin =
+    (ui.area.markdown.parent().outerWidth() - ui.area.markdown.outerWidth()) /
+    2
   // for ipad or wider device
   if (rightMargin >= 133) {
     newbool = true
-    var affixLeftMargin = (ui.toc.affix.outerWidth() - ui.toc.affix.width()) / 2
-    var left = ui.area.markdown.offset().left + ui.area.markdown.outerWidth() - affixLeftMargin
+    const affixLeftMargin =
+      (ui.toc.affix.outerWidth() - ui.toc.affix.width()) / 2
+    const left =
+      ui.area.markdown.offset().left +
+      ui.area.markdown.outerWidth() -
+      affixLeftMargin
     ui.toc.affix.css('left', left + 'px')
     ui.toc.affix.css('width', rightMargin + 'px')
   } else {
@@ -708,12 +785,12 @@ function checkTocStyle () {
 
 function showStatus (type, num) {
   currentStatus = type
-  var shortStatus = ui.toolbar.shortStatus
-  var status = ui.toolbar.status
-  var label = $('<span class="label"></span>')
-  var fa = $('<i class="fa"></i>')
-  var msg = ''
-  var shortMsg = ''
+  const shortStatus = ui.toolbar.shortStatus
+  const status = ui.toolbar.status
+  const label = $('<span class="label"></span>')
+  const fa = $('<i class="fa"></i>')
+  let msg = ''
+  let shortMsg = ''
 
   shortStatus.html('')
   status.html('')
@@ -738,7 +815,7 @@ function showStatus (type, num) {
   }
 
   label.append(fa)
-  var shortLabel = label.clone()
+  const shortLabel = label.clone()
 
   shortLabel.append(' ' + shortMsg)
   shortStatus.append(shortLabel)
@@ -761,7 +838,7 @@ function toggleMode () {
   }
 }
 
-var lastMode = null
+let lastMode = null
 
 function changeMode (type) {
   // lock navbar to prevent it hide after changeMode
@@ -771,8 +848,8 @@ function changeMode (type) {
     lastMode = appState.currentMode
     appState.currentMode = type
   }
-  var responsiveClass = 'col-lg-6 col-md-6 col-sm-6'
-  var scrollClass = 'ui-scrollable'
+  const responsiveClass = 'col-lg-6 col-md-6 col-sm-6'
+  const scrollClass = 'ui-scrollable'
   ui.area.codemirror.removeClass(scrollClass)
   ui.area.edit.removeClass(responsiveClass)
   ui.area.view.removeClass(scrollClass)
@@ -798,11 +875,20 @@ function changeMode (type) {
       break
   }
   // save mode to url
-  if (history.replaceState && window.loaded) history.replaceState(null, '', serverurl + '/' + noteid + '?' + appState.currentMode.name)
+  if (history.replaceState && window.loaded) {
+    history.replaceState(
+      null,
+      '',
+      serverurl + '/' + noteid + '?' + appState.currentMode.name
+    )
+  }
   if (appState.currentMode === modeType.view) {
     editor.getInputField().blur()
   }
-  if (appState.currentMode === modeType.edit || appState.currentMode === modeType.both) {
+  if (
+    appState.currentMode === modeType.edit ||
+    appState.currentMode === modeType.both
+  ) {
     // add and update status bar
     if (!editorInstance.statusBar) {
       editorInstance.addStatusBar()
@@ -820,7 +906,10 @@ function changeMode (type) {
     $(document.body).css('background-color', 'white')
     updateView()
   } else {
-    $(document.body).css('background-color', ui.area.codemirror.css('background-color'))
+    $(document.body).css(
+      'background-color',
+      ui.area.codemirror.css('background-color')
+    )
   }
   // check resizable editor style
   if (appState.currentMode === modeType.both) {
@@ -864,15 +953,18 @@ function changeMode (type) {
   ui.toolbar.both.removeClass('active')
   ui.toolbar.edit.removeClass('active')
   ui.toolbar.view.removeClass('active')
-  var modeIcon = ui.toolbar.mode.find('i')
+  const modeIcon = ui.toolbar.mode.find('i')
   modeIcon.removeClass('fa-pencil').removeClass('fa-eye')
-  if (ui.area.edit.is(':visible') && ui.area.view.is(':visible')) { // both
+  if (ui.area.edit.is(':visible') && ui.area.view.is(':visible')) {
+    // both
     ui.toolbar.both.addClass('active')
     modeIcon.addClass('fa-eye')
-  } else if (ui.area.edit.is(':visible')) { // edit
+  } else if (ui.area.edit.is(':visible')) {
+    // edit
     ui.toolbar.edit.addClass('active')
     modeIcon.addClass('fa-eye')
-  } else if (ui.area.view.is(':visible')) { // view
+  } else if (ui.area.view.is(':visible')) {
+    // view
     ui.toolbar.view.addClass('active')
     modeIcon.addClass('fa-pencil')
   }
@@ -883,17 +975,27 @@ function lockNavbar () {
   $('.navbar').addClass('locked')
 }
 
-var unlockNavbar = _.debounce(function () {
+const unlockNavbar = _.debounce(function () {
   $('.navbar').removeClass('locked')
 }, 200)
 
 function showMessageModal (title, header, href, text, success) {
-  var modal = $('.message-modal')
+  const modal = $('.message-modal')
   modal.find('.modal-title').html(title)
   modal.find('.modal-body h5').html(header)
-  if (href) { modal.find('.modal-body a').attr('href', href).text(text) } else { modal.find('.modal-body a').removeAttr('href').text(text) }
-  modal.find('.modal-footer button').removeClass('btn-default btn-success btn-danger')
-  if (success) { modal.find('.modal-footer button').addClass('btn-success') } else { modal.find('.modal-footer button').addClass('btn-danger') }
+  if (href) {
+    modal.find('.modal-body a').attr('href', href).text(text)
+  } else {
+    modal.find('.modal-body a').removeAttr('href').text(text)
+  }
+  modal
+    .find('.modal-footer button')
+    .removeClass('btn-default btn-success btn-danger')
+  if (success) {
+    modal.find('.modal-footer button').addClass('btn-success')
+  } else {
+    modal.find('.modal-footer button').addClass('btn-danger')
+  }
   modal.modal('show')
 }
 
@@ -923,9 +1025,9 @@ ui.toolbar.extra.slide.attr('href', noteurl + '/slide')
 ui.toolbar.download.markdown.click(function (e) {
   e.preventDefault()
   e.stopPropagation()
-  var filename = renderFilename(ui.area.markdown) + '.md'
-  var markdown = editor.getValue()
-  var blob = new Blob([markdown], {
+  const filename = renderFilename(ui.area.markdown) + '.md'
+  const markdown = editor.getValue()
+  const blob = new Blob([markdown], {
     type: 'text/markdown;charset=utf-8'
   })
   saveAs(blob, filename, true)
@@ -945,12 +1047,12 @@ ui.toolbar.download.rawhtml.click(function (e) {
 // export to dropbox
 ui.toolbar.export.dropbox.click(function (event) {
   event.preventDefault()
-  var filename = renderFilename(ui.area.markdown) + '.md'
-  var options = {
+  const filename = renderFilename(ui.area.markdown) + '.md'
+  const options = {
     files: [
       {
-        'url': noteurl + '/download',
-        'filename': filename
+        url: noteurl + '/download',
+        filename: filename
       }
     ],
     error: function (errorMessage) {
@@ -971,25 +1073,48 @@ ui.toolbar.export.snippet.click(function () {
       $('#snippetExportModalVersion').val(data.version)
       $('#snippetExportModalLoading').hide()
       $('#snippetExportModal').modal('toggle')
-      $('#snippetExportModalProjects').find('option').remove().end().append('<option value="init" selected="selected" disabled="disabled">Select From Available Projects</option>')
+      $('#snippetExportModalProjects')
+        .find('option')
+        .remove()
+        .end()
+        .append(
+          '<option value="init" selected="selected" disabled="disabled">Select From Available Projects</option>'
+        )
       if (data.projects) {
         data.projects.sort(function (a, b) {
-          return (a.path_with_namespace < b.path_with_namespace) ? -1 : ((a.path_with_namespace > b.path_with_namespace) ? 1 : 0)
+          return a.path_with_namespace < b.path_with_namespace
+            ? -1
+            : a.path_with_namespace > b.path_with_namespace
+              ? 1
+              : 0
         })
         data.projects.forEach(function (project) {
-          if (!project.snippets_enabled ||
-                        (project.permissions.project_access === null && project.permissions.group_access === null) ||
-                        (project.permissions.project_access !== null && project.permissions.project_access.access_level < 20)) {
+          if (
+            !project.snippets_enabled ||
+            (project.permissions.project_access === null &&
+              project.permissions.group_access === null) ||
+            (project.permissions.project_access !== null &&
+              project.permissions.project_access.access_level < 20)
+          ) {
             return
           }
-          $('<option>').val(project.id).text(project.path_with_namespace).appendTo('#snippetExportModalProjects')
+          $('<option>')
+            .val(project.id)
+            .text(project.path_with_namespace)
+            .appendTo('#snippetExportModalProjects')
         })
         $('#snippetExportModalProjects').prop('disabled', false)
       }
       $('#snippetExportModalLoading').hide()
     })
     .fail(function (data) {
-      showMessageModal('<i class="fa fa-gitlab"></i> Import from Snippet', 'Unable to fetch gitlab parameters :(', '', '', false)
+      showMessageModal(
+        '<i class="fa fa-gitlab"></i> Import from Snippet',
+        'Unable to fetch gitlab parameters :(',
+        '',
+        '',
+        false
+      )
     })
     .always(function () {
       ui.spinner.hide()
@@ -998,10 +1123,10 @@ ui.toolbar.export.snippet.click(function () {
 // import from dropbox
 ui.toolbar.import.dropbox.click(function (event) {
   event.preventDefault()
-  var options = {
+  const options = {
     success: function (files) {
       ui.spinner.show()
-      var url = files[0].link
+      const url = files[0].link
       importFromUrl(url)
     },
     linkType: 'direct',
@@ -1026,25 +1151,48 @@ ui.toolbar.import.snippet.click(function () {
       $('#snippetImportModalConfirm').prop('disabled', false)
       $('#snippetImportModalLoading').hide()
       $('#snippetImportModal').modal('toggle')
-      $('#snippetImportModalProjects').find('option').remove().end().append('<option value="init" selected="selected" disabled="disabled">Select From Available Projects</option>')
+      $('#snippetImportModalProjects')
+        .find('option')
+        .remove()
+        .end()
+        .append(
+          '<option value="init" selected="selected" disabled="disabled">Select From Available Projects</option>'
+        )
       if (data.projects) {
         data.projects.sort(function (a, b) {
-          return (a.path_with_namespace < b.path_with_namespace) ? -1 : ((a.path_with_namespace > b.path_with_namespace) ? 1 : 0)
+          return a.path_with_namespace < b.path_with_namespace
+            ? -1
+            : a.path_with_namespace > b.path_with_namespace
+              ? 1
+              : 0
         })
         data.projects.forEach(function (project) {
-          if (!project.snippets_enabled ||
-                        (project.permissions.project_access === null && project.permissions.group_access === null) ||
-                        (project.permissions.project_access !== null && project.permissions.project_access.access_level < 20)) {
+          if (
+            !project.snippets_enabled ||
+            (project.permissions.project_access === null &&
+              project.permissions.group_access === null) ||
+            (project.permissions.project_access !== null &&
+              project.permissions.project_access.access_level < 20)
+          ) {
             return
           }
-          $('<option>').val(project.id).text(project.path_with_namespace).appendTo('#snippetImportModalProjects')
+          $('<option>')
+            .val(project.id)
+            .text(project.path_with_namespace)
+            .appendTo('#snippetImportModalProjects')
         })
         $('#snippetImportModalProjects').prop('disabled', false)
       }
       $('#snippetImportModalLoading').hide()
     })
     .fail(function (data) {
-      showMessageModal('<i class="fa fa-gitlab"></i> Import from Snippet', 'Unable to fetch gitlab parameters :(', '', '', false)
+      showMessageModal(
+        '<i class="fa fa-gitlab"></i> Import from Snippet',
+        'Unable to fetch gitlab parameters :(',
+        '',
+        '',
+        false
+      )
     })
     .always(function () {
       ui.spinner.hide()
@@ -1060,15 +1208,15 @@ $('a[href="#"]').click(function (e) {
 })
 
 // modal actions
-var revisions = []
-var revisionViewer = null
-var revisionInsert = []
-var revisionDelete = []
-var revisionInsertAnnotation = null
-var revisionDeleteAnnotation = null
-var revisionList = ui.modal.revision.find('.ui-revision-list')
-var revision = null
-var revisionTime = null
+let revisions = []
+let revisionViewer = null
+let revisionInsert = []
+let revisionDelete = []
+let revisionInsertAnnotation = null
+let revisionDeleteAnnotation = null
+const revisionList = ui.modal.revision.find('.ui-revision-list')
+let revision = null
+let revisionTime = null
 ui.modal.revision.on('show.bs.modal', function (e) {
   $.get(noteurl + '/revision')
     .done(function (data) {
@@ -1087,7 +1235,7 @@ ui.modal.revision.on('show.bs.modal', function (e) {
 })
 function checkRevisionViewer () {
   if (revisionViewer) {
-    var container = $(revisionViewer.display.wrapper).parent()
+    const container = $(revisionViewer.display.wrapper).parent()
     $(revisionViewer.display.scroller).css('height', container.height() + 'px')
     revisionViewer.refresh()
   }
@@ -1097,23 +1245,27 @@ $(window).resize(checkRevisionViewer)
 function parseRevisions (_revisions) {
   if (_revisions.length !== revisions) {
     revisions = _revisions
-    var lastRevision = null
+    let lastRevision = null
     if (revisionList.children().length > 0) {
       lastRevision = revisionList.find('.active').attr('data-revision-time')
     }
     revisionList.html('')
-    for (var i = 0; i < revisions.length; i++) {
-      var revision = revisions[i]
-      var item = $('<a class="list-group-item"></a>')
+    for (let i = 0; i < revisions.length; i++) {
+      const revision = revisions[i]
+      const item = $('<a class="list-group-item"></a>')
       item.attr('data-revision-time', revision.time)
       if (lastRevision === revision.time) item.addClass('active')
-      var itemHeading = $('<h5 class="list-group-item-heading"></h5>')
-      itemHeading.html('<i class="fa fa-clock-o"></i> ' + moment(revision.time).format('llll'))
-      var itemText = $('<p class="list-group-item-text"></p>')
-      itemText.html('<i class="fa fa-file-text"></i> Length: ' + revision.length)
+      const itemHeading = $('<h5 class="list-group-item-heading"></h5>')
+      itemHeading.html(
+        '<i class="fa fa-clock-o"></i> ' + moment(revision.time).format('llll')
+      )
+      const itemText = $('<p class="list-group-item-text"></p>')
+      itemText.html(
+        '<i class="fa fa-file-text"></i> Length: ' + revision.length
+      )
       item.append(itemHeading).append(itemText)
       item.click(function (e) {
-        var time = $(this).attr('data-revision-time')
+        const time = $(this).attr('data-revision-time')
         selectRevision(time)
       })
       revisionList.append(item)
@@ -1129,52 +1281,59 @@ function selectRevision (time) {
     .done(function (data) {
       revision = data
       revisionTime = time
-      var lastScrollInfo = revisionViewer.getScrollInfo()
+      const lastScrollInfo = revisionViewer.getScrollInfo()
       revisionList.children().removeClass('active')
-      revisionList.find('[data-revision-time="' + time + '"]').addClass('active')
-      var content = revision.content
+      revisionList
+        .find('[data-revision-time="' + time + '"]')
+        .addClass('active')
+      const content = revision.content
       revisionViewer.setValue(content)
       revisionViewer.scrollTo(null, lastScrollInfo.top)
       revisionInsert = []
       revisionDelete = []
       // mark the text which have been insert or delete
       if (revision.patch.length > 0) {
-        var bias = 0
-        for (var j = 0; j < revision.patch.length; j++) {
-          var patch = revision.patch[j]
-          var currIndex = patch.start1 + bias
-          for (var i = 0; i < patch.diffs.length; i++) {
-            var diff = patch.diffs[i]
+        let bias = 0
+        for (let j = 0; j < revision.patch.length; j++) {
+          const patch = revision.patch[j]
+          let currIndex = patch.start1 + bias
+          for (let i = 0; i < patch.diffs.length; i++) {
+            const diff = patch.diffs[i]
             // ignore if diff only contains line breaks
-            if ((diff[1].match(/\n/g) || []).length === diff[1].length) continue
-            var prePos
-            var postPos
+            if ((diff[1].match(/\n/g) || []).length === diff[1].length) { continue }
+            let prePos, postPos
             switch (diff[0]) {
               case 0: // retain
                 currIndex += diff[1].length
                 break
               case 1: // insert
                 prePos = revisionViewer.posFromIndex(currIndex)
-                postPos = revisionViewer.posFromIndex(currIndex + diff[1].length)
+                postPos = revisionViewer.posFromIndex(
+                  currIndex + diff[1].length
+                )
                 revisionInsert.push({
                   from: prePos,
                   to: postPos
                 })
                 revisionViewer.markText(prePos, postPos, {
-                  css: 'background-color: rgba(230,255,230,0.7); text-decoration: underline;'
+                  css:
+                    'background-color: rgba(230,255,230,0.7); text-decoration: underline;'
                 })
                 currIndex += diff[1].length
                 break
               case -1: // delete
                 prePos = revisionViewer.posFromIndex(currIndex)
                 revisionViewer.replaceRange(diff[1], prePos)
-                postPos = revisionViewer.posFromIndex(currIndex + diff[1].length)
+                postPos = revisionViewer.posFromIndex(
+                  currIndex + diff[1].length
+                )
                 revisionDelete.push({
                   from: prePos,
                   to: postPos
                 })
                 revisionViewer.markText(prePos, postPos, {
-                  css: 'background-color: rgba(255,230,230,0.7); text-decoration: line-through;'
+                  css:
+                    'background-color: rgba(255,230,230,0.7); text-decoration: line-through;'
                 })
                 bias += diff[1].length
                 currIndex += diff[1].length
@@ -1198,7 +1357,7 @@ function selectRevision (time) {
 }
 function initRevisionViewer () {
   if (revisionViewer) return
-  var revisionViewerTextArea = document.getElementById('revisionViewer')
+  const revisionViewerTextArea = document.getElementById('revisionViewer')
   revisionViewer = CodeMirror.fromTextArea(revisionViewerTextArea, {
     mode: defaultEditorMode,
     viewportMargin: viewportMargin,
@@ -1213,14 +1372,19 @@ function initRevisionViewer () {
     autoRefresh: true,
     scrollbarStyle: 'overlay'
   })
-  revisionInsertAnnotation = revisionViewer.annotateScrollbar({ className: 'CodeMirror-insert-match' })
-  revisionDeleteAnnotation = revisionViewer.annotateScrollbar({ className: 'CodeMirror-delete-match' })
+  revisionInsertAnnotation = revisionViewer.annotateScrollbar({
+    className: 'CodeMirror-insert-match'
+  })
+  revisionDeleteAnnotation = revisionViewer.annotateScrollbar({
+    className: 'CodeMirror-delete-match'
+  })
   checkRevisionViewer()
 }
 $('#revisionModalDownload').click(function () {
   if (!revision) return
-  var filename = renderFilename(ui.area.markdown) + '_' + revisionTime + '.md'
-  var blob = new Blob([revision.content], {
+  const filename =
+    renderFilename(ui.area.markdown) + '_' + revisionTime + '.md'
+  const blob = new Blob([revision.content], {
     type: 'text/markdown;charset=utf-8'
   })
   saveAs(blob, filename, true)
@@ -1232,17 +1396,34 @@ $('#revisionModalRevert').click(function () {
 })
 // snippet projects
 ui.modal.snippetImportProjects.change(function () {
-  var accesstoken = $('#snippetImportModalAccessToken').val()
-  var baseURL = $('#snippetImportModalBaseURL').val()
-  var project = $('#snippetImportModalProjects').val()
-  var version = $('#snippetImportModalVersion').val()
+  const accesstoken = $('#snippetImportModalAccessToken').val()
+  const baseURL = $('#snippetImportModalBaseURL').val()
+  const project = $('#snippetImportModalProjects').val()
+  const version = $('#snippetImportModalVersion').val()
   $('#snippetImportModalLoading').show()
   $('#snippetImportModalContent').val('/projects/' + project)
-  $.get(baseURL + '/api/' + version + '/projects/' + project + '/snippets?access_token=' + accesstoken)
+  $.get(
+    baseURL +
+      '/api/' +
+      version +
+      '/projects/' +
+      project +
+      '/snippets?access_token=' +
+      accesstoken
+  )
     .done(function (data) {
-      $('#snippetImportModalSnippets').find('option').remove().end().append('<option value="init" selected="selected" disabled="disabled">Select From Available Snippets</option>')
+      $('#snippetImportModalSnippets')
+        .find('option')
+        .remove()
+        .end()
+        .append(
+          '<option value="init" selected="selected" disabled="disabled">Select From Available Snippets</option>'
+        )
       data.forEach(function (snippet) {
-        $('<option>').val(snippet.id).text(snippet.title).appendTo($('#snippetImportModalSnippets'))
+        $('<option>')
+          .val(snippet.id)
+          .text(snippet.title)
+          .appendTo($('#snippetImportModalSnippets'))
       })
       $('#snippetImportModalLoading').hide()
       $('#snippetImportModalSnippets').prop('disabled', false)
@@ -1259,44 +1440,68 @@ ui.modal.snippetImportProjects.change(function () {
 })
 // snippet snippets
 ui.modal.snippetImportSnippets.change(function () {
-  var snippet = $('#snippetImportModalSnippets').val()
-  $('#snippetImportModalContent').val($('#snippetImportModalContent').val() + '/snippets/' + snippet)
+  const snippet = $('#snippetImportModalSnippets').val()
+  $('#snippetImportModalContent').val(
+    $('#snippetImportModalContent').val() + '/snippets/' + snippet
+  )
 })
 
 function scrollToTop () {
   if (appState.currentMode === modeType.both) {
-    if (editor.getScrollInfo().top !== 0) { editor.scrollTo(0, 0) } else {
-      ui.area.view.animate({
-        scrollTop: 0
-      }, 100, 'linear')
+    if (editor.getScrollInfo().top !== 0) {
+      editor.scrollTo(0, 0)
+    } else {
+      ui.area.view.animate(
+        {
+          scrollTop: 0
+        },
+        100,
+        'linear'
+      )
     }
   } else {
-    $('body, html').stop(true, true).animate({
-      scrollTop: 0
-    }, 100, 'linear')
+    $('body, html').stop(true, true).animate(
+      {
+        scrollTop: 0
+      },
+      100,
+      'linear'
+    )
   }
 }
 
 function scrollToBottom () {
   if (appState.currentMode === modeType.both) {
-    var scrollInfo = editor.getScrollInfo()
-    var scrollHeight = scrollInfo.height
-    if (scrollInfo.top !== scrollHeight) { editor.scrollTo(0, scrollHeight * 2) } else {
-      ui.area.view.animate({
-        scrollTop: ui.area.view[0].scrollHeight
-      }, 100, 'linear')
+    const scrollInfo = editor.getScrollInfo()
+    const scrollHeight = scrollInfo.height
+    if (scrollInfo.top !== scrollHeight) {
+      editor.scrollTo(0, scrollHeight * 2)
+    } else {
+      ui.area.view.animate(
+        {
+          scrollTop: ui.area.view[0].scrollHeight
+        },
+        100,
+        'linear'
+      )
     }
   } else {
-    $('body, html').stop(true, true).animate({
-      scrollTop: $(document.body)[0].scrollHeight
-    }, 100, 'linear')
+    $('body, html')
+      .stop(true, true)
+      .animate(
+        {
+          scrollTop: $(document.body)[0].scrollHeight
+        },
+        100,
+        'linear'
+      )
   }
 }
 
 window.scrollToTop = scrollToTop
 window.scrollToBottom = scrollToBottom
 
-var enoughForAffixToc = true
+let enoughForAffixToc = true
 
 // scrollspy
 function generateScrollspy () {
@@ -1320,29 +1525,53 @@ function generateScrollspy () {
 }
 
 function updateScrollspy () {
-  var headers = ui.area.markdown.find('h1, h2, h3').toArray()
-  var headerMap = []
-  for (var i = 0; i < headers.length; i++) {
-    headerMap.push($(headers[i]).offset().top - parseInt($(headers[i]).css('margin-top')))
+  const headers = ui.area.markdown.find('h1, h2, h3').toArray()
+  const headerMap = []
+  for (let i = 0; i < headers.length; i++) {
+    headerMap.push(
+      $(headers[i]).offset().top - parseInt($(headers[i]).css('margin-top'))
+    )
   }
-  applyScrollspyActive($(window).scrollTop(), headerMap, headers,
-    $('.scrollspy-body'), 0)
-  var offset = ui.area.view.scrollTop() - ui.area.view.offset().top
-  applyScrollspyActive(ui.area.view.scrollTop(), headerMap, headers,
-    $('.scrollspy-view'), offset - 10)
+  applyScrollspyActive(
+    $(window).scrollTop(),
+    headerMap,
+    headers,
+    $('.scrollspy-body'),
+    0
+  )
+  const offset = ui.area.view.scrollTop() - ui.area.view.offset().top
+  applyScrollspyActive(
+    ui.area.view.scrollTop(),
+    headerMap,
+    headers,
+    $('.scrollspy-view'),
+    offset - 10
+  )
 }
 
 function applyScrollspyActive (top, headerMap, headers, target, offset) {
-  var index = 0
-  for (var i = headerMap.length - 1; i >= 0; i--) {
-    if (top >= (headerMap[i] + offset) && headerMap[i + 1] && top < (headerMap[i + 1] + offset)) {
+  let index = 0
+  for (let i = headerMap.length - 1; i >= 0; i--) {
+    if (
+      top >= headerMap[i] + offset &&
+      headerMap[i + 1] &&
+      top < headerMap[i + 1] + offset
+    ) {
       index = i
       break
     }
   }
-  var header = $(headers[index])
-  var active = target.find('a[href="#' + header.attr('id') + '"]')
-  active.closest('li').addClass('active').parent().closest('li').addClass('active').parent().closest('li').addClass('active')
+  const header = $(headers[index])
+  const active = target.find('a[href="#' + header.attr('id') + '"]')
+  active
+    .closest('li')
+    .addClass('active')
+    .parent()
+    .closest('li')
+    .addClass('active')
+    .parent()
+    .closest('li')
+    .addClass('active')
 }
 
 // clipboard modal
@@ -1354,7 +1583,7 @@ $('#clipboardModalClear').click(function () {
   $('#clipboardModalContent').html('')
 })
 $('#clipboardModalConfirm').click(function () {
-  var data = $('#clipboardModalContent').html()
+  const data = $('#clipboardModalContent').html()
   if (data) {
     parseToEditor(data)
     $('#clipboardModal').modal('hide')
@@ -1372,22 +1601,34 @@ $('#gistImportModalClear').click(function () {
   $('#gistImportModalContent').val('')
 })
 $('#gistImportModalConfirm').click(function () {
-  var gisturl = $('#gistImportModalContent').val()
+  const gisturl = $('#gistImportModalContent').val()
   if (!gisturl) return
   $('#gistImportModal').modal('hide')
   $('#gistImportModalContent').val('')
   if (!isValidURL(gisturl)) {
-    showMessageModal('<i class="fa fa-github"></i> Import from Gist', 'Not a valid URL :(', '', '', false)
+    showMessageModal(
+      '<i class="fa fa-github"></i> Import from Gist',
+      'Not a valid URL :(',
+      '',
+      '',
+      false
+    )
   } else {
-    var hostname = url('hostname', gisturl)
+    const hostname = url('hostname', gisturl)
     if (hostname !== 'gist.github.com') {
-      showMessageModal('<i class="fa fa-github"></i> Import from Gist', 'Not a valid Gist URL :(', '', '', false)
+      showMessageModal(
+        '<i class="fa fa-github"></i> Import from Gist',
+        'Not a valid Gist URL :(',
+        '',
+        '',
+        false
+      )
     } else {
       ui.spinner.show()
       $.get('https://api.github.com/gists/' + url('-1', gisturl))
         .done(function (data) {
           if (data.files) {
-            var contents = ''
+            let contents = ''
             Object.keys(data.files).forEach(function (key) {
               contents += key
               contents += '\n---\n'
@@ -1396,11 +1637,23 @@ $('#gistImportModalConfirm').click(function () {
             })
             replaceAll(contents)
           } else {
-            showMessageModal('<i class="fa fa-github"></i> Import from Gist', 'Unable to fetch gist files :(', '', '', false)
+            showMessageModal(
+              '<i class="fa fa-github"></i> Import from Gist',
+              'Unable to fetch gist files :(',
+              '',
+              '',
+              false
+            )
           }
         })
         .fail(function (data) {
-          showMessageModal('<i class="fa fa-github"></i> Import from Gist', 'Not a valid Gist URL :(', '', JSON.stringify(data), false)
+          showMessageModal(
+            '<i class="fa fa-github"></i> Import from Gist',
+            'Not a valid Gist URL :(',
+            '',
+            JSON.stringify(data),
+            false
+          )
         })
         .always(function () {
           ui.spinner.hide()
@@ -1417,21 +1670,32 @@ $('#snippetImportModalClear').click(function () {
   $('#snippetImportModalSnippets').prop('disabled', true)
 })
 $('#snippetImportModalConfirm').click(function () {
-  var snippeturl = $('#snippetImportModalContent').val()
+  const snippeturl = $('#snippetImportModalContent').val()
   if (!snippeturl) return
   $('#snippetImportModal').modal('hide')
   $('#snippetImportModalContent').val('')
   if (!/^.+\/snippets\/.+$/.test(snippeturl)) {
-    showMessageModal('<i class="fa fa-github"></i> Import from Snippet', 'Not a valid Snippet URL :(', '', '', false)
+    showMessageModal(
+      '<i class="fa fa-github"></i> Import from Snippet',
+      'Not a valid Snippet URL :(',
+      '',
+      '',
+      false
+    )
   } else {
     ui.spinner.show()
-    var accessToken = '?access_token=' + $('#snippetImportModalAccessToken').val()
-    var fullURL = $('#snippetImportModalBaseURL').val() + '/api/' + $('#snippetImportModalVersion').val() + snippeturl
+    const accessToken =
+      '?access_token=' + $('#snippetImportModalAccessToken').val()
+    const fullURL =
+      $('#snippetImportModalBaseURL').val() +
+      '/api/' +
+      $('#snippetImportModalVersion').val() +
+      snippeturl
     $.get(fullURL + accessToken)
       .done(function (data) {
-        var content = '# ' + (data.title || 'Snippet Import')
-        var fileInfo = data.file_name.split('.')
-        fileInfo[1] = (fileInfo[1]) ? fileInfo[1] : 'md'
+        let content = '# ' + (data.title || 'Snippet Import')
+        const fileInfo = data.file_name.split('.')
+        fileInfo[1] = fileInfo[1] ? fileInfo[1] : 'md'
         $.get(fullURL + '/raw' + accessToken)
           .done(function (raw) {
             if (raw) {
@@ -1447,82 +1711,147 @@ $('#snippetImportModalConfirm').click(function () {
             }
           })
           .fail(function (data) {
-            showMessageModal('<i class="fa fa-gitlab"></i> Import from Snippet', 'Not a valid Snippet URL :(', '', JSON.stringify(data), false)
+            showMessageModal(
+              '<i class="fa fa-gitlab"></i> Import from Snippet',
+              'Not a valid Snippet URL :(',
+              '',
+              JSON.stringify(data),
+              false
+            )
           })
           .always(function () {
             ui.spinner.hide()
           })
       })
       .fail(function (data) {
-        showMessageModal('<i class="fa fa-gitlab"></i> Import from Snippet', 'Not a valid Snippet URL :(', '', JSON.stringify(data), false)
+        showMessageModal(
+          '<i class="fa fa-gitlab"></i> Import from Snippet',
+          'Not a valid Snippet URL :(',
+          '',
+          JSON.stringify(data),
+          false
+        )
       })
   }
 })
 
 // snippet export modal
 $('#snippetExportModalConfirm').click(function () {
-  var accesstoken = $('#snippetExportModalAccessToken').val()
-  var baseURL = $('#snippetExportModalBaseURL').val()
-  var version = $('#snippetExportModalVersion').val()
+  const accesstoken = $('#snippetExportModalAccessToken').val()
+  const baseURL = $('#snippetExportModalBaseURL').val()
+  const version = $('#snippetExportModalVersion').val()
 
-  var data = {
+  const data = {
     title: $('#snippetExportModalTitle').val(),
     file_name: $('#snippetExportModalFileName').val(),
     code: editor.getValue(),
     visibility_level: $('#snippetExportModalVisibility').val(),
-    visibility: $('#snippetExportModalVisibility').val() === '0' ? 'private' : ($('#snippetExportModalVisibility').val() === '10' ? 'internal' : 'private')
-  }
-
-  if (!data.title || !data.file_name || !data.code || !data.visibility_level || !$('#snippetExportModalProjects').val()) return
+    visibility:
+      $('#snippetExportModalVisibility').val() === '0'
+        ? 'private'
+        : $('#snippetExportModalVisibility').val() === '10'
+          ? 'internal'
+          : 'private'
+  }
+
+  if (
+    !data.title ||
+    !data.file_name ||
+    !data.code ||
+    !data.visibility_level ||
+    !$('#snippetExportModalProjects').val()
+  ) { return }
   $('#snippetExportModalLoading').show()
-  var fullURL = baseURL + '/api/' + version + '/projects/' + $('#snippetExportModalProjects').val() + '/snippets?access_token=' + accesstoken
-  $.post(fullURL
-    , data
-    , function (ret) {
-      $('#snippetExportModalLoading').hide()
-      $('#snippetExportModal').modal('hide')
-      var redirect = baseURL + '/' + $("#snippetExportModalProjects option[value='" + $('#snippetExportModalProjects').val() + "']").text() + '/snippets/' + ret.id
-      showMessageModal('<i class="fa fa-gitlab"></i> Export to Snippet', 'Export Successful!', redirect, 'View Snippet Here', true)
-    }
-  )
+  const fullURL =
+    baseURL +
+    '/api/' +
+    version +
+    '/projects/' +
+    $('#snippetExportModalProjects').val() +
+    '/snippets?access_token=' +
+    accesstoken
+  $.post(fullURL, data, function (ret) {
+    $('#snippetExportModalLoading').hide()
+    $('#snippetExportModal').modal('hide')
+    const redirect =
+      baseURL +
+      '/' +
+      $(
+        "#snippetExportModalProjects option[value='" +
+          $('#snippetExportModalProjects').val() +
+          "']"
+      ).text() +
+      '/snippets/' +
+      ret.id
+    showMessageModal(
+      '<i class="fa fa-gitlab"></i> Export to Snippet',
+      'Export Successful!',
+      redirect,
+      'View Snippet Here',
+      true
+    )
+  })
 })
 
 function parseToEditor (data) {
-  var turndownService = new TurndownService({
+  const turndownService = new TurndownService({
     defaultReplacement: function (innerHTML, node) {
       return node.isBlock ? '\n\n' + node.outerHTML + '\n\n' : node.outerHTML
     }
   })
-  var parsed = turndownService.turndown(data)
-  if (parsed) { replaceAll(parsed) }
+  const parsed = turndownService.turndown(data)
+  if (parsed) {
+    replaceAll(parsed)
+  }
 }
 
 function replaceAll (data) {
-  editor.replaceRange(data, {
-    line: 0,
-    ch: 0
-  }, {
-    line: editor.lastLine(),
-    ch: editor.lastLine().length
-  }, '+input')
+  editor.replaceRange(
+    data,
+    {
+      line: 0,
+      ch: 0
+    },
+    {
+      line: editor.lastLine(),
+      ch: editor.lastLine().length
+    },
+    '+input'
+  )
 }
 
 function importFromUrl (url) {
   // console.debug(url);
   if (!url) return
   if (!isValidURL(url)) {
-    showMessageModal('<i class="fa fa-cloud-download"></i> Import from URL', 'Not a valid URL :(', '', '', false)
+    showMessageModal(
+      '<i class="fa fa-cloud-download"></i> Import from URL',
+      'Not a valid URL :(',
+      '',
+      '',
+      false
+    )
     return
   }
   $.ajax({
     method: 'GET',
     url: url,
     success: function (data) {
-      var extension = url.split('.').pop()
-      if (extension === 'html') { parseToEditor(data) } else { replaceAll(data) }
+      const extension = url.split('.').pop()
+      if (extension === 'html') {
+        parseToEditor(data)
+      } else {
+        replaceAll(data)
+      }
     },
     error: function (data) {
-      showMessageModal('<i class="fa fa-cloud-download"></i> Import from URL', 'Import failed :(', '', JSON.stringify(data), false)
+      showMessageModal(
+        '<i class="fa fa-cloud-download"></i> Import from URL',
+        'Import failed :(',
+        '',
+        JSON.stringify(data),
+        false
+      )
     },
     complete: function () {
       ui.spinner.hide()
@@ -1584,8 +1913,8 @@ $('.ui-delete-modal-confirm').click(function () {
 })
 
 function toggleNightMode () {
-  var $body = $('body')
-  var isActive = ui.toolbar.night.hasClass('active')
+  const $body = $('body')
+  const isActive = ui.toolbar.night.hasClass('active')
   if (isActive) {
     $body.removeClass('night')
     appState.nightMode = false
@@ -1613,8 +1942,8 @@ function updatePermission (newPermission) {
     permission = newPermission
     if (window.loaded) refreshView()
   }
-  var label = null
-  var title = null
+  let label = null
+  let title = null
   switch (permission) {
     case 'freely':
       label = '<i class="fa fa-leaf"></i> Freely'
@@ -1641,7 +1970,11 @@ function updatePermission (newPermission) {
       title = 'Only owner can view & edit'
       break
   }
-  if (personalInfo.userid && window.owner && personalInfo.userid === window.owner) {
+  if (
+    personalInfo.userid &&
+    window.owner &&
+    personalInfo.userid === window.owner
+  ) {
     label += ' <i class="fa fa-caret-down"></i>'
     ui.infobar.permission.label.removeClass('disabled')
   } else {
@@ -1651,7 +1984,7 @@ function updatePermission (newPermission) {
 }
 
 function havePermission () {
-  var bool = false
+  let bool = false
   switch (permission) {
     case 'freely':
       bool = true
@@ -1680,8 +2013,8 @@ function havePermission () {
 window.havePermission = havePermission
 
 // socket.io actions
-var io = require('socket.io-client')
-var socket = io.connect({
+const io = require('socket.io-client')
+const socket = io.connect({
   path: urlpath ? '/' + urlpath + '/socket.io/' : '',
   query: {
     noteId: noteid
@@ -1690,13 +2023,17 @@ var socket = io.connect({
   reconnectionAttempts: 20 // retry 20 times on connect failed
 })
 // overwrite original event for checking login state
-var on = socket.on
+const on = socket.on
 socket.on = function () {
-  if (!checkLoginStateChanged() && !needRefresh) { return on.apply(socket, arguments) }
+  if (!checkLoginStateChanged() && !needRefresh) {
+    return on.apply(socket, arguments)
+  }
 }
-var emit = socket.emit
+const emit = socket.emit
 socket.emit = function () {
-  if (!checkLoginStateChanged() && !needRefresh) { emit.apply(socket, arguments) }
+  if (!checkLoginStateChanged() && !needRefresh) {
+    emit.apply(socket, arguments)
+  }
 }
 socket.on('info', function (data) {
   console.error(data)
@@ -1714,7 +2051,9 @@ socket.on('info', function (data) {
 })
 socket.on('error', function (data) {
   console.error(data)
-  if (data.message && data.message.indexOf('AUTH failed') === 0) { location.href = serverurl + '/403' }
+  if (data.message && data.message.indexOf('AUTH failed') === 0) {
+    location.href = serverurl + '/403'
+  }
 })
 socket.on('delete', function () {
   if (personalInfo.login) {
@@ -1723,13 +2062,13 @@ socket.on('delete', function () {
     })
   } else {
     getHistory(function (notehistory) {
-      var newnotehistory = removeHistory(noteid, notehistory)
+      const newnotehistory = removeHistory(noteid, notehistory)
       saveHistory(newnotehistory)
       location.href = serverurl
     })
   }
 })
-var retryTimer = null
+let retryTimer = null
 socket.on('maintenance', function () {
   cmClient.revision = -1
 })
@@ -1739,7 +2078,9 @@ socket.on('disconnect', function (data) {
     saveInfo()
     lastInfo.history = editor.getHistory()
   }
-  if (!editor.getOption('readOnly')) { editor.setOption('readOnly', true) }
+  if (!editor.getOption('readOnly')) {
+    editor.setOption('readOnly', true)
+  }
   if (!retryTimer) {
     retryTimer = setInterval(function () {
       if (!needRefresh) socket.connect()
@@ -1755,7 +2096,7 @@ socket.on('reconnect', function (data) {
 socket.on('connect', function (data) {
   clearInterval(retryTimer)
   retryTimer = null
-  personalInfo['id'] = socket.id
+  personalInfo.id = socket.id
   showStatus(statusType.connected)
   socket.emit('version')
 })
@@ -1769,40 +2110,58 @@ socket.on('version', function (data) {
     }
   }
 })
-var authors = []
-var authorship = []
-var authorMarks = {} // temp variable
-var addTextMarkers = [] // temp variable
+let authors = []
+let authorship = []
+let authorMarks = {} // temp variable
+let addTextMarkers = [] // temp variable
 function updateInfo (data) {
   // console.debug(data);
-  if (data.hasOwnProperty('createtime') && window.createtime !== data.createtime) {
+  if (
+    Object.prototype.hasOwnProperty.call(data, 'createtime') &&
+    window.createtime !== data.createtime
+  ) {
     window.createtime = data.createtime
     updateLastChange()
   }
-  if (data.hasOwnProperty('updatetime') && window.lastchangetime !== data.updatetime) {
+  if (
+    Object.prototype.hasOwnProperty.call(data, 'updatetime') &&
+    window.lastchangetime !== data.updatetime
+  ) {
     window.lastchangetime = data.updatetime
     updateLastChange()
   }
-  if (data.hasOwnProperty('owner') && window.owner !== data.owner) {
+  if (
+    Object.prototype.hasOwnProperty.call(data, 'owner') &&
+    window.owner !== data.owner
+  ) {
     window.owner = data.owner
     window.ownerprofile = data.ownerprofile
     updateOwner()
   }
-  if (data.hasOwnProperty('lastchangeuser') && window.lastchangeuser !== data.lastchangeuser) {
+  if (
+    Object.prototype.hasOwnProperty.call(data, 'lastchangeuser') &&
+    window.lastchangeuser !== data.lastchangeuser
+  ) {
     window.lastchangeuser = data.lastchangeuser
     window.lastchangeuserprofile = data.lastchangeuserprofile
     updateLastChangeUser()
     updateOwner()
   }
-  if (data.hasOwnProperty('authors') && authors !== data.authors) {
+  if (
+    Object.prototype.hasOwnProperty.call(data, 'authors') &&
+    authors !== data.authors
+  ) {
     authors = data.authors
   }
-  if (data.hasOwnProperty('authorship') && authorship !== data.authorship) {
+  if (
+    Object.prototype.hasOwnProperty.call(data, 'authorship') &&
+    authorship !== data.authorship
+  ) {
     authorship = data.authorship
     updateAuthorship()
   }
 }
-var updateAuthorship = _.debounce(function () {
+const updateAuthorship = _.debounce(function () {
   editor.operation(updateAuthorshipInner)
 }, 50)
 function initMark () {
@@ -1822,46 +2181,59 @@ function initMarkAndCheckGutter (mark, author, timestamp) {
   }
   return mark
 }
-var addStyleRule = (function () {
-  var added = {}
-  var styleElement = document.createElement('style')
-  document.documentElement.getElementsByTagName('head')[0].appendChild(styleElement)
-  var styleSheet = styleElement.sheet
+const addStyleRule = (function () {
+  const added = {}
+  const styleElement = document.createElement('style')
+  document.documentElement
+    .getElementsByTagName('head')[0]
+    .appendChild(styleElement)
+  const styleSheet = styleElement.sheet
 
   return function (css) {
     if (added[css]) {
       return
     }
     added[css] = true
-    styleSheet.insertRule(css, (styleSheet.cssRules || styleSheet.rules).length)
+    styleSheet.insertRule(
+      css,
+      (styleSheet.cssRules || styleSheet.rules).length
+    )
   }
-}())
+})()
 function updateAuthorshipInner () {
   // ignore when ot not synced yet
   if (havePendingOperation()) return
   authorMarks = {}
   for (let i = 0; i < authorship.length; i++) {
-    var atom = authorship[i]
-    let author = authors[atom[0]]
+    const atom = authorship[i]
+    const author = authors[atom[0]]
     if (author) {
-      var prePos = editor.posFromIndex(atom[1])
-      var preLine = editor.getLine(prePos.line)
-      var postPos = editor.posFromIndex(atom[2])
-      var postLine = editor.getLine(postPos.line)
+      const prePos = editor.posFromIndex(atom[1])
+      const preLine = editor.getLine(prePos.line)
+      const postPos = editor.posFromIndex(atom[2])
+      const postLine = editor.getLine(postPos.line)
       if (prePos.ch === 0 && postPos.ch === postLine.length) {
         for (let j = prePos.line; j <= postPos.line; j++) {
           if (editor.getLine(j)) {
-            authorMarks[j] = initMarkAndCheckGutter(authorMarks[j], author, atom[3])
+            authorMarks[j] = initMarkAndCheckGutter(
+              authorMarks[j],
+              author,
+              atom[3]
+            )
           }
         }
       } else if (postPos.line - prePos.line >= 1) {
-        var startLine = prePos.line
-        var endLine = postPos.line
+        let startLine = prePos.line
+        let endLine = postPos.line
         if (prePos.ch === preLine.length) {
           startLine++
         } else if (prePos.ch !== 0) {
-          let mark = initMarkAndCheckGutter(authorMarks[prePos.line], author, atom[3])
-          var _postPos = {
+          const mark = initMarkAndCheckGutter(
+            authorMarks[prePos.line],
+            author,
+            atom[3]
+          )
+          const _postPos = {
             line: prePos.line,
             ch: preLine.length
           }
@@ -1877,8 +2249,12 @@ function updateAuthorshipInner () {
         if (postPos.ch === 0) {
           endLine--
         } else if (postPos.ch !== postLine.length) {
-          let mark = initMarkAndCheckGutter(authorMarks[postPos.line], author, atom[3])
-          var _prePos = {
+          const mark = initMarkAndCheckGutter(
+            authorMarks[postPos.line],
+            author,
+            atom[3]
+          )
+          const _prePos = {
             line: postPos.line,
             ch: 0
           }
@@ -1893,11 +2269,19 @@ function updateAuthorshipInner () {
         }
         for (let j = startLine; j <= endLine; j++) {
           if (editor.getLine(j)) {
-            authorMarks[j] = initMarkAndCheckGutter(authorMarks[j], author, atom[3])
+            authorMarks[j] = initMarkAndCheckGutter(
+              authorMarks[j],
+              author,
+              atom[3]
+            )
           }
         }
       } else {
-        let mark = initMarkAndCheckGutter(authorMarks[prePos.line], author, atom[3])
+        const mark = initMarkAndCheckGutter(
+          authorMarks[prePos.line],
+          author,
+          atom[3]
+        )
         if (JSON.stringify(prePos) !== JSON.stringify(postPos)) {
           mark.textmarkers.push({
             userid: author.userid,
@@ -1910,38 +2294,45 @@ function updateAuthorshipInner () {
   }
   addTextMarkers = []
   editor.eachLine(iterateLine)
-  var allTextMarks = editor.getAllMarks()
+  const allTextMarks = editor.getAllMarks()
   for (let i = 0; i < allTextMarks.length; i++) {
-    let _textMarker = allTextMarks[i]
-    var pos = _textMarker.find()
-    var found = false
+    const _textMarker = allTextMarks[i]
+    const pos = _textMarker.find()
+    let found = false
     for (let j = 0; j < addTextMarkers.length; j++) {
-      let textMarker = addTextMarkers[j]
-      let author = authors[textMarker.userid]
-      let className = 'authorship-inline-' + author.color.substr(1)
-      var obj = {
+      const textMarker = addTextMarkers[j]
+      const author = authors[textMarker.userid]
+      const className = 'authorship-inline-' + author.color.substr(1)
+      const obj = {
         from: textMarker.pos[0],
         to: textMarker.pos[1]
       }
-      if (JSON.stringify(pos) === JSON.stringify(obj) && _textMarker.className &&
-                _textMarker.className.indexOf(className) > -1) {
+      if (
+        JSON.stringify(pos) === JSON.stringify(obj) &&
+        _textMarker.className &&
+        _textMarker.className.indexOf(className) > -1
+      ) {
         addTextMarkers.splice(j, 1)
         j--
         found = true
         break
       }
     }
-    if (!found && _textMarker.className && _textMarker.className.indexOf('authorship-inline') > -1) {
+    if (
+      !found &&
+      _textMarker.className &&
+      _textMarker.className.indexOf('authorship-inline') > -1
+    ) {
       _textMarker.clear()
     }
   }
   for (let i = 0; i < addTextMarkers.length; i++) {
-    let textMarker = addTextMarkers[i]
-    let author = authors[textMarker.userid]
+    const textMarker = addTextMarkers[i]
+    const author = authors[textMarker.userid]
     const rgbcolor = hex2rgb(author.color)
     const colorString = `rgba(${rgbcolor.red},${rgbcolor.green},${rgbcolor.blue},0.7)`
     const styleString = `background-image: linear-gradient(to top, ${colorString} 1px, transparent 1px);`
-    let className = `authorship-inline-${author.color.substr(1)}`
+    const className = `authorship-inline-${author.color.substr(1)}`
     const rule = `.${className} { ${styleString} }`
     addStyleRule(rule)
     editor.markText(textMarker.pos[0], textMarker.pos[1], {
@@ -1951,19 +2342,22 @@ function updateAuthorshipInner () {
   }
 }
 function iterateLine (line) {
-  var lineNumber = line.lineNo()
-  var currMark = authorMarks[lineNumber]
-  var author = currMark ? authors[currMark.gutter.userid] : null
+  const lineNumber = line.lineNo()
+  const currMark = authorMarks[lineNumber]
+  const author = currMark ? authors[currMark.gutter.userid] : null
   if (currMark && author) {
-    let className = 'authorship-gutter-' + author.color.substr(1)
+    const className = 'authorship-gutter-' + author.color.substr(1)
     const gutters = line.gutterMarkers
-    if (!gutters || !gutters['authorship-gutters'] ||
-        !gutters['authorship-gutters'].className ||
-        !gutters['authorship-gutters'].className.indexOf(className) < 0) {
+    if (
+      !gutters ||
+      !gutters['authorship-gutters'] ||
+      !gutters['authorship-gutters'].className ||
+      !gutters['authorship-gutters'].className.indexOf(className) < 0
+    ) {
       const styleString = `border-left: 3px solid ${author.color}; height: ${defaultTextHeight}px; margin-left: 3px;`
       const rule = `.${className} { ${styleString} }`
       addStyleRule(rule)
-      var gutter = $('<div>', {
+      const gutter = $('<div>', {
         class: 'authorship-gutter ' + className,
         title: author.name
       })
@@ -1973,8 +2367,8 @@ function iterateLine (line) {
     editor.setGutterMarker(line, 'authorship-gutters', null)
   }
   if (currMark && currMark.textmarkers.length > 0) {
-    for (var i = 0; i < currMark.textmarkers.length; i++) {
-      let textMarker = currMark.textmarkers[i]
+    for (let i = 0; i < currMark.textmarkers.length; i++) {
+      const textMarker = currMark.textmarkers[i]
       if (textMarker.userid !== currMark.gutter.userid) {
         addTextMarkers.push(textMarker)
       }
@@ -1985,17 +2379,17 @@ editorInstance.on('update', function () {
   $('.authorship-gutter:not([data-original-title])').tooltip({
     container: '.CodeMirror-lines',
     placement: 'right',
-    delay: { 'show': 500, 'hide': 100 }
+    delay: { show: 500, hide: 100 }
   })
   $('.authorship-inline:not([data-original-title])').tooltip({
     container: '.CodeMirror-lines',
     placement: 'bottom',
-    delay: { 'show': 500, 'hide': 100 }
+    delay: { show: 500, hide: 100 }
   })
   // clear tooltip which described element has been removed
   $('[id^="tooltip"]').each(function (index, element) {
-    var $ele = $(element)
-    if ($('[aria-describedby="' + $ele.attr('id') + '"]').length <= 0) $ele.remove()
+    const $ele = $(element)
+    if ($('[aria-describedby="' + $ele.attr('id') + '"]').length <= 0) { $ele.remove() }
   })
 })
 socket.on('check', function (data) {
@@ -2006,7 +2400,7 @@ socket.on('permission', function (data) {
   updatePermission(data.permission)
 })
 
-var permission = null
+let permission = null
 socket.on('refresh', function (data) {
   // console.debug(data);
   editorInstance.config.docmaxlength = data.docmaxlength
@@ -2015,13 +2409,17 @@ socket.on('refresh', function (data) {
   updatePermission(data.permission)
   if (!window.loaded) {
     // auto change mode if no content detected
-    var nocontent = editor.getValue().length <= 0
+    const nocontent = editor.getValue().length <= 0
     if (nocontent) {
-      if (visibleXS) { appState.currentMode = modeType.edit } else { appState.currentMode = modeType.both }
+      if (visibleXS) {
+        appState.currentMode = modeType.edit
+      } else {
+        appState.currentMode = modeType.both
+      }
     }
     // parse mode from url
     if (window.location.search.length > 0) {
-      var urlMode = modeType[window.location.search.substr(1)]
+      const urlMode = modeType[window.location.search.substr(1)]
       if (urlMode) appState.currentMode = urlMode
     }
     changeMode(appState.currentMode)
@@ -2041,23 +2439,34 @@ socket.on('refresh', function (data) {
       scrollToHash()
     }, 1)
   }
-  if (editor.getOption('readOnly')) { editor.setOption('readOnly', false) }
+  if (editor.getOption('readOnly')) {
+    editor.setOption('readOnly', false)
+  }
 })
 
-var EditorClient = ot.EditorClient
-var SocketIOAdapter = ot.SocketIOAdapter
-var CodeMirrorAdapter = ot.CodeMirrorAdapter
-var cmClient = null
-var synchronized_ = null
+const EditorClient = ot.EditorClient
+const SocketIOAdapter = ot.SocketIOAdapter
+const CodeMirrorAdapter = ot.CodeMirrorAdapter
+let cmClient = null
+let synchronized_ = null
 
 function havePendingOperation () {
-  return !!((cmClient && cmClient.state && cmClient.state.hasOwnProperty('outstanding')))
+  return !!(
+    cmClient &&
+    cmClient.state &&
+    Object.prototype.hasOwnProperty.call(cmClient, 'outstanding')
+  )
 }
 
 socket.on('doc', function (obj) {
-  var body = obj.str
-  var bodyMismatch = editor.getValue() !== body
-  var setDoc = !cmClient || (cmClient && (cmClient.revision === -1 || (cmClient.revision !== obj.revision && !havePendingOperation()))) || obj.force
+  const body = obj.str
+  const bodyMismatch = editor.getValue() !== body
+  const setDoc =
+    !cmClient ||
+    (cmClient &&
+      (cmClient.revision === -1 ||
+        (cmClient.revision !== obj.revision && !havePendingOperation()))) ||
+    obj.force
 
   saveInfo()
   if (setDoc && bodyMismatch) {
@@ -2079,8 +2488,10 @@ socket.on('doc', function (obj) {
 
   if (!cmClient) {
     cmClient = window.cmClient = new EditorClient(
-      obj.revision, obj.clients,
-      new SocketIOAdapter(socket), new CodeMirrorAdapter(editor)
+      obj.revision,
+      obj.clients,
+      new SocketIOAdapter(socket),
+      new CodeMirrorAdapter(editor)
     )
     synchronized_ = cmClient.state
   } else if (setDoc) {
@@ -2115,91 +2526,120 @@ socket.on('operation', function () {
 })
 
 socket.on('online users', function (data) {
-  if (debug) { console.debug(data) }
+  if (debug) {
+    console.debug(data)
+  }
   onlineUsers = data.users
   updateOnlineStatus()
-  $('.CodeMirror-other-cursors').children().each(function (key, value) {
-    var found = false
-    for (var i = 0; i < data.users.length; i++) {
-      var user = data.users[i]
-      if ($(this).attr('id') === user.id) { found = true }
-    }
-    if (!found) {
-      $(this).stop(true).fadeOut('normal', function () {
-        $(this).remove()
-      })
+  $('.CodeMirror-other-cursors')
+    .children()
+    .each(function (key, value) {
+      let found = false
+      for (let i = 0; i < data.users.length; i++) {
+        const user = data.users[i]
+        if ($(this).attr('id') === user.id) {
+          found = true
+        }
+      }
+      if (!found) {
+        $(this)
+          .stop(true)
+          .fadeOut('normal', function () {
+            $(this).remove()
+          })
+      }
+    })
+  for (let i = 0; i < data.users.length; i++) {
+    const user = data.users[i]
+    if (user.id !== socket.id) {
+      buildCursor(user)
+    } else {
+      personalInfo = user
     }
-  })
-  for (var i = 0; i < data.users.length; i++) {
-    var user = data.users[i]
-    if (user.id !== socket.id) { buildCursor(user) } else { personalInfo = user }
   }
 })
 socket.on('user status', function (data) {
-  if (debug) { console.debug(data) }
-  for (var i = 0; i < onlineUsers.length; i++) {
+  if (debug) {
+    console.debug(data)
+  }
+  for (let i = 0; i < onlineUsers.length; i++) {
     if (onlineUsers[i].id === data.id) {
       onlineUsers[i] = data
     }
   }
   updateOnlineStatus()
-  if (data.id !== socket.id) { buildCursor(data) }
+  if (data.id !== socket.id) {
+    buildCursor(data)
+  }
 })
 socket.on('cursor focus', function (data) {
-  if (debug) { console.debug(data) }
-  for (var i = 0; i < onlineUsers.length; i++) {
+  if (debug) {
+    console.debug(data)
+  }
+  for (let i = 0; i < onlineUsers.length; i++) {
     if (onlineUsers[i].id === data.id) {
       onlineUsers[i].cursor = data.cursor
     }
   }
-  if (data.id !== socket.id) { buildCursor(data) }
+  if (data.id !== socket.id) {
+    buildCursor(data)
+  }
   // force show
-  var cursor = $('div[data-clientid="' + data.id + '"]')
+  const cursor = $('div[data-clientid="' + data.id + '"]')
   if (cursor.length > 0) {
     cursor.stop(true).fadeIn()
   }
 })
 socket.on('cursor activity', function (data) {
-  if (debug) { console.debug(data) }
-  for (var i = 0; i < onlineUsers.length; i++) {
+  if (debug) {
+    console.debug(data)
+  }
+  for (let i = 0; i < onlineUsers.length; i++) {
     if (onlineUsers[i].id === data.id) {
       onlineUsers[i].cursor = data.cursor
     }
   }
-  if (data.id !== socket.id) { buildCursor(data) }
+  if (data.id !== socket.id) {
+    buildCursor(data)
+  }
 })
 socket.on('cursor blur', function (data) {
-  if (debug) { console.debug(data) }
-  for (var i = 0; i < onlineUsers.length; i++) {
+  if (debug) {
+    console.debug(data)
+  }
+  for (let i = 0; i < onlineUsers.length; i++) {
     if (onlineUsers[i].id === data.id) {
       onlineUsers[i].cursor = null
     }
   }
-  if (data.id !== socket.id) { buildCursor(data) }
+  if (data.id !== socket.id) {
+    buildCursor(data)
+  }
   // force hide
-  var cursor = $('div[data-clientid="' + data.id + '"]')
+  const cursor = $('div[data-clientid="' + data.id + '"]')
   if (cursor.length > 0) {
     cursor.stop(true).fadeOut()
   }
 })
 
-var options = {
+const options = {
   valueNames: ['id', 'name'],
-  item: '<li class="ui-user-item">' +
-        '<span class="id" style="display:none;"></span>' +
-        '<a href="#">' +
-            '<span class="pull-left"><i class="ui-user-icon"></i></span><span class="ui-user-name name"></span><span class="pull-right"><i class="fa fa-circle ui-user-status"></i></span>' +
-        '</a>' +
-        '</li>'
+  item:
+    '<li class="ui-user-item">' +
+    '<span class="id" style="display:none;"></span>' +
+    '<a href="#">' +
+    '<span class="pull-left"><i class="ui-user-icon"></i></span><span class="ui-user-name name"></span><span class="pull-right"><i class="fa fa-circle ui-user-status"></i></span>' +
+    '</a>' +
+    '</li>'
 }
-var onlineUserList = new List('online-user-list', options)
-var shortOnlineUserList = new List('short-online-user-list', options)
+const onlineUserList = new List('online-user-list', options)
+const shortOnlineUserList = new List('short-online-user-list', options)
 
 function updateOnlineStatus () {
   if (!window.loaded || !socket.connected) return
-  var _onlineUsers = deduplicateOnlineUsers(onlineUsers)
+  const _onlineUsers = deduplicateOnlineUsers(onlineUsers)
   showStatus(statusType.online, _onlineUsers.length)
-  var items = onlineUserList.items
+  const items = onlineUserList.items
   // update or remove current list items
   for (let i = 0; i < items.length; i++) {
     let found = false
@@ -2211,7 +2651,7 @@ function updateOnlineStatus () {
         break
       }
     }
-    let id = items[i].values().id
+    const id = items[i].values().id
     if (found) {
       onlineUserList.get('id', id)[0].values(_onlineUsers[foundindex])
       shortOnlineUserList.get('id', id)[0].values(_onlineUsers[foundindex])
@@ -2246,23 +2686,57 @@ function sortOnlineUserList (list) {
   // sort order by isSelf, login state, idle state, alphabet name, color brightness
   list.sort('', {
     sortFunction: function (a, b) {
-      var usera = a.values()
-      var userb = b.values()
-      var useraIsSelf = (usera.id === personalInfo.id || (usera.login && usera.userid === personalInfo.userid))
-      var userbIsSelf = (userb.id === personalInfo.id || (userb.login && userb.userid === personalInfo.userid))
+      const usera = a.values()
+      const userb = b.values()
+      const useraIsSelf =
+        usera.id === personalInfo.id ||
+        (usera.login && usera.userid === personalInfo.userid)
+      const userbIsSelf =
+        userb.id === personalInfo.id ||
+        (userb.login && userb.userid === personalInfo.userid)
       if (useraIsSelf && !userbIsSelf) {
         return -1
       } else if (!useraIsSelf && userbIsSelf) {
         return 1
       } else {
-        if (usera.login && !userb.login) { return -1 } else if (!usera.login && userb.login) { return 1 } else {
-          if (!usera.idle && userb.idle) { return -1 } else if (usera.idle && !userb.idle) { return 1 } else {
-            if (usera.name && userb.name && usera.name.toLowerCase() < userb.name.toLowerCase()) {
+        if (usera.login && !userb.login) {
+          return -1
+        } else if (!usera.login && userb.login) {
+          return 1
+        } else {
+          if (!usera.idle && userb.idle) {
+            return -1
+          } else if (usera.idle && !userb.idle) {
+            return 1
+          } else {
+            if (
+              usera.name &&
+              userb.name &&
+              usera.name.toLowerCase() < userb.name.toLowerCase()
+            ) {
               return -1
-            } else if (usera.name && userb.name && usera.name.toLowerCase() > userb.name.toLowerCase()) {
+            } else if (
+              usera.name &&
+              userb.name &&
+              usera.name.toLowerCase() > userb.name.toLowerCase()
+            ) {
               return 1
             } else {
-              if (usera.color && userb.color && usera.color.toLowerCase() < userb.color.toLowerCase()) { return -1 } else if (usera.color && userb.color && usera.color.toLowerCase() > userb.color.toLowerCase()) { return 1 } else { return 0 }
+              if (
+                usera.color &&
+                userb.color &&
+                usera.color.toLowerCase() < userb.color.toLowerCase()
+              ) {
+                return -1
+              } else if (
+                usera.color &&
+                userb.color &&
+                usera.color.toLowerCase() > userb.color.toLowerCase()
+              ) {
+                return 1
+              } else {
+                return 0
+              }
             }
           }
         }
@@ -2272,11 +2746,11 @@ function sortOnlineUserList (list) {
 }
 
 function renderUserStatusList (list) {
-  var items = list.items
-  for (var j = 0; j < items.length; j++) {
-    var item = items[j]
-    var userstatus = $(item.elm).find('.ui-user-status')
-    var usericon = $(item.elm).find('.ui-user-icon')
+  const items = list.items
+  for (let j = 0; j < items.length; j++) {
+    const item = items[j]
+    const userstatus = $(item.elm).find('.ui-user-status')
+    const usericon = $(item.elm).find('.ui-user-icon')
     if (item.values().login && item.values().photo) {
       usericon.css('background-image', 'url(' + item.values().photo + ')')
       // add 1px more to right, make it feel aligned
@@ -2286,18 +2760,26 @@ function renderUserStatusList (list) {
     } else {
       usericon.css('background-color', item.values().color)
     }
-    userstatus.removeClass('ui-user-status-offline ui-user-status-online ui-user-status-idle')
-    if (item.values().idle) { userstatus.addClass('ui-user-status-idle') } else { userstatus.addClass('ui-user-status-online') }
+    userstatus.removeClass(
+      'ui-user-status-offline ui-user-status-online ui-user-status-idle'
+    )
+    if (item.values().idle) {
+      userstatus.addClass('ui-user-status-idle')
+    } else {
+      userstatus.addClass('ui-user-status-online')
+    }
   }
 }
 
 function deduplicateOnlineUsers (list) {
-  var _onlineUsers = []
-  for (var i = 0; i < list.length; i++) {
-    var user = $.extend({}, list[i])
-    if (!user.userid) { _onlineUsers.push(user) } else {
-      var found = false
-      for (var j = 0; j < _onlineUsers.length; j++) {
+  const _onlineUsers = []
+  for (let i = 0; i < list.length; i++) {
+    const user = $.extend({}, list[i])
+    if (!user.userid) {
+      _onlineUsers.push(user)
+    } else {
+      let found = false
+      for (let j = 0; j < _onlineUsers.length; j++) {
         if (_onlineUsers[j].userid === user.userid) {
           // keep self color when login
           if (user.id === personalInfo.id) {
@@ -2312,29 +2794,39 @@ function deduplicateOnlineUsers (list) {
           break
         }
       }
-      if (!found) { _onlineUsers.push(user) }
+      if (!found) {
+        _onlineUsers.push(user)
+      }
     }
   }
   return _onlineUsers
 }
 
-var userStatusCache = null
+let userStatusCache = null
 
 function emitUserStatus (force) {
   if (!window.loaded) return
-  var type = null
-  if (visibleXS) { type = 'xs' } else if (visibleSM) { type = 'sm' } else if (visibleMD) { type = 'md' } else if (visibleLG) { type = 'lg' }
+  let type = null
+  if (visibleXS) {
+    type = 'xs'
+  } else if (visibleSM) {
+    type = 'sm'
+  } else if (visibleMD) {
+    type = 'md'
+  } else if (visibleLG) {
+    type = 'lg'
+  }
 
-  personalInfo['idle'] = idle.isAway
-  personalInfo['type'] = type
+  personalInfo.idle = idle.isAway
+  personalInfo.type = type
 
-  for (var i = 0; i < onlineUsers.length; i++) {
+  for (let i = 0; i < onlineUsers.length; i++) {
     if (onlineUsers[i].id === personalInfo.id) {
       onlineUsers[i] = personalInfo
     }
   }
 
-  var userStatus = {
+  const userStatus = {
     idle: idle.isAway,
     type: type
   }
@@ -2348,24 +2840,24 @@ function emitUserStatus (force) {
 function checkCursorTag (coord, ele) {
   if (!ele) return // return if element not exists
   // set margin
-  var tagRightMargin = 0
-  var tagBottomMargin = 2
+  const tagRightMargin = 0
+  const tagBottomMargin = 2
   // use sizer to get the real doc size (won't count status bar and gutters)
-  var docWidth = ui.area.codemirrorSizer.width()
+  const docWidth = ui.area.codemirrorSizer.width()
   // get editor size (status bar not count in)
-  var editorHeight = ui.area.codemirror.height()
+  const editorHeight = ui.area.codemirror.height()
   // get element size
-  var width = ele.outerWidth()
-  var height = ele.outerHeight()
-  var padding = (ele.outerWidth() - ele.width()) / 2
+  const width = ele.outerWidth()
+  const height = ele.outerHeight()
+  const padding = (ele.outerWidth() - ele.width()) / 2
   // get coord position
-  var left = coord.left
-  var top = coord.top
+  const left = coord.left
+  const top = coord.top
   // get doc top offset (to workaround with viewport)
-  var docTopOffset = ui.area.codemirrorSizerInner.position().top
+  const docTopOffset = ui.area.codemirrorSizerInner.position().top
   // set offset
-  var offsetLeft = -3
-  var offsetTop = defaultTextHeight
+  let offsetLeft = -3
+  let offsetTop = defaultTextHeight
   // only do when have width and height
   if (width > 0 && height > 0) {
     // flip x when element right bound larger than doc width
@@ -2374,8 +2866,12 @@ function checkCursorTag (coord, ele) {
     }
     // flip y when element bottom bound larger than doc height
     // and element top position is larger than element height
-    if (top + docTopOffset + height + offsetTop + tagBottomMargin > Math.max(editor.doc.height, editorHeight) && top + docTopOffset > height + tagBottomMargin) {
-      offsetTop = -(height)
+    if (
+      top + docTopOffset + height + offsetTop + tagBottomMargin >
+        Math.max(editor.doc.height, editorHeight) &&
+      top + docTopOffset > height + tagBottomMargin
+    ) {
+      offsetTop = -height
     }
   }
   // set position
@@ -2386,10 +2882,10 @@ function checkCursorTag (coord, ele) {
 function buildCursor (user) {
   if (appState.currentMode === modeType.view) return
   if (!user.cursor) return
-  var coord = editor.charCoords(user.cursor, 'windows')
+  const coord = editor.charCoords(user.cursor, 'windows')
   coord.left = coord.left < 4 ? 4 : coord.left
   coord.top = coord.top < 0 ? 0 : coord.top
-  var iconClass = 'fa-user'
+  let iconClass = 'fa-user'
   switch (user.type) {
     case 'xs':
       iconClass = 'fa-mobile'
@@ -2405,19 +2901,29 @@ function buildCursor (user) {
       break
   }
   if ($('div[data-clientid="' + user.id + '"]').length <= 0) {
-    let cursor = $('<div data-clientid="' + user.id + '" class="CodeMirror-other-cursor" style="display:none;"></div>')
+    const cursor = $(
+      '<div data-clientid="' +
+        user.id +
+        '" class="CodeMirror-other-cursor" style="display:none;"></div>'
+    )
     cursor.attr('data-line', user.cursor.line)
     cursor.attr('data-ch', user.cursor.ch)
     cursor.attr('data-offset-left', 0)
     cursor.attr('data-offset-top', 0)
 
-    let cursorbar = $('<div class="cursorbar">&nbsp;</div>')
+    const cursorbar = $('<div class="cursorbar">&nbsp;</div>')
     cursorbar[0].style.height = defaultTextHeight + 'px'
     cursorbar[0].style.borderLeft = '2px solid ' + user.color
 
-    var icon = '<i class="fa ' + iconClass + '"></i>'
+    const icon = '<i class="fa ' + iconClass + '"></i>'
 
-    let cursortag = $('<div class="cursortag">' + icon + '&nbsp;<span class="name">' + user.name + '</span></div>')
+    const cursortag = $(
+      '<div class="cursortag">' +
+        icon +
+        '&nbsp;<span class="name">' +
+        user.name +
+        '</span></div>'
+    )
     // cursortag[0].style.background = color;
     cursortag[0].style.color = user.color
 
@@ -2425,28 +2931,43 @@ function buildCursor (user) {
     cursortag.delay(2000).fadeOut('fast')
     cursor.hover(
       function () {
-        if (cursor.attr('data-mode') === 'hover') { cursortag.stop(true).fadeIn('fast') }
+        if (cursor.attr('data-mode') === 'hover') {
+          cursortag.stop(true).fadeIn('fast')
+        }
       },
       function () {
-        if (cursor.attr('data-mode') === 'hover') { cursortag.stop(true).fadeOut('fast') }
-      })
+        if (cursor.attr('data-mode') === 'hover') {
+          cursortag.stop(true).fadeOut('fast')
+        }
+      }
+    )
 
-    var hideCursorTagDelay = 2000
-    var hideCursorTagTimer = null
+    const hideCursorTagDelay = 2000
+    let hideCursorTagTimer = null
 
-    var switchMode = function (ele) {
-      if (ele.attr('data-mode') === 'state') { ele.attr('data-mode', 'hover') } else if (ele.attr('data-mode') === 'hover') { ele.attr('data-mode', 'state') }
+    const switchMode = function (ele) {
+      if (ele.attr('data-mode') === 'state') {
+        ele.attr('data-mode', 'hover')
+      } else if (ele.attr('data-mode') === 'hover') {
+        ele.attr('data-mode', 'state')
+      }
     }
 
-    var switchTag = function (ele) {
-      if (ele.css('display') === 'none') { ele.stop(true).fadeIn('fast') } else { ele.stop(true).fadeOut('fast') }
+    const switchTag = function (ele) {
+      if (ele.css('display') === 'none') {
+        ele.stop(true).fadeIn('fast')
+      } else {
+        ele.stop(true).fadeOut('fast')
+      }
     }
 
-    var hideCursorTag = function () {
-      if (cursor.attr('data-mode') === 'hover') { cursortag.fadeOut('fast') }
+    const hideCursorTag = function () {
+      if (cursor.attr('data-mode') === 'hover') {
+        cursortag.fadeOut('fast')
+      }
     }
     cursor.on('touchstart', function (e) {
-      var display = cursortag.css('display')
+      const display = cursortag.css('display')
       cursortag.stop(true).fadeIn('fast')
       clearTimeout(hideCursorTagTimer)
       hideCursorTagTimer = setTimeout(hideCursorTag, hideCursorTagDelay)
@@ -2456,7 +2977,9 @@ function buildCursor (user) {
       }
     })
     cursortag.on('mousedown touchstart', function (e) {
-      if (cursor.attr('data-mode') === 'state') { switchTag(cursortag) }
+      if (cursor.attr('data-mode') === 'state') {
+        switchTag(cursortag)
+      }
       switchMode(cursor)
       e.preventDefault()
       e.stopPropagation()
@@ -2469,19 +2992,21 @@ function buildCursor (user) {
     cursor[0].style.top = coord.top + 'px'
     $('.CodeMirror-other-cursors').append(cursor)
 
-    if (!user.idle) { cursor.stop(true).fadeIn() }
+    if (!user.idle) {
+      cursor.stop(true).fadeIn()
+    }
 
     checkCursorTag(coord, cursortag)
   } else {
-    let cursor = $('div[data-clientid="' + user.id + '"]')
+    const cursor = $('div[data-clientid="' + user.id + '"]')
     cursor.attr('data-line', user.cursor.line)
     cursor.attr('data-ch', user.cursor.ch)
 
-    let cursorbar = cursor.find('.cursorbar')
+    const cursorbar = cursor.find('.cursorbar')
     cursorbar[0].style.height = defaultTextHeight + 'px'
     cursorbar[0].style.borderLeft = '2px solid ' + user.color
 
-    let cursortag = cursor.find('.cursortag')
+    const cursortag = cursor.find('.cursortag')
     cursortag.find('i').removeClass().addClass('fa').addClass(iconClass)
     cursortag.find('.name').text(user.name)
 
@@ -2489,16 +3014,23 @@ function buildCursor (user) {
       cursor[0].style.left = coord.left + 'px'
       cursor[0].style.top = coord.top + 'px'
     } else {
-      cursor.animate({
-        'left': coord.left,
-        'top': coord.top
-      }, {
-        duration: cursorAnimatePeriod,
-        queue: false
-      })
+      cursor.animate(
+        {
+          left: coord.left,
+          top: coord.top
+        },
+        {
+          duration: cursorAnimatePeriod,
+          queue: false
+        }
+      )
     }
 
-    if (user.idle && cursor.css('display') !== 'none') { cursor.stop(true).fadeOut() } else if (!user.idle && cursor.css('display') === 'none') { cursor.stop(true).fadeIn() }
+    if (user.idle && cursor.css('display') !== 'none') {
+      cursor.stop(true).fadeOut()
+    } else if (!user.idle && cursor.css('display') === 'none') {
+      cursor.stop(true).fadeIn()
+    }
 
     checkCursorTag(coord, cursortag)
   }
@@ -2506,18 +3038,23 @@ function buildCursor (user) {
 
 // editor actions
 function removeNullByte (cm, change) {
-  var str = change.text.join('\n')
+  const str = change.text.join('\n')
   // eslint-disable-next-line no-control-regex
   if (/\u0000/g.test(str) && change.update) {
-    // eslint-disable-next-line no-control-regex
-    change.update(change.from, change.to, str.replace(/\u0000/g, '').split('\n'))
+    change.update(
+      change.from,
+      change.to,
+      // eslint-disable-next-line no-control-regex
+      str.replace(/\u0000/g, '').split('\n')
+    )
   }
 }
 function enforceMaxLength (cm, change) {
-  var maxLength = cm.getOption('maxLength')
+  const maxLength = cm.getOption('maxLength')
   if (maxLength && change.update) {
-    var str = change.text.join('\n')
-    var delta = str.length - (cm.indexFromPos(change.to) - cm.indexFromPos(change.from))
+    let str = change.text.join('\n')
+    let delta =
+      str.length - (cm.indexFromPos(change.to) - cm.indexFromPos(change.from))
     if (delta <= 0) {
       return false
     }
@@ -2530,14 +3067,16 @@ function enforceMaxLength (cm, change) {
   }
   return false
 }
-var ignoreEmitEvents = ['setValue', 'ignoreHistory']
+const ignoreEmitEvents = ['setValue', 'ignoreHistory']
 editorInstance.on('beforeChange', function (cm, change) {
-  if (debug) { console.debug(change) }
+  if (debug) {
+    console.debug(change)
+  }
   removeNullByte(cm, change)
   if (enforceMaxLength(cm, change)) {
     $('.limit-modal').modal('show')
   }
-  var isIgnoreEmitEvent = (ignoreEmitEvents.indexOf(change.origin) !== -1)
+  const isIgnoreEmitEvent = ignoreEmitEvents.indexOf(change.origin) !== -1
   if (!isIgnoreEmitEvent) {
     if (!havePermission()) {
       change.canceled = true
@@ -2557,7 +3096,9 @@ editorInstance.on('beforeChange', function (cm, change) {
       updateTitleReminder()
     }
   }
-  if (cmClient && !socket.connected) { cmClient.editorAdapter.ignoreNextChange = true }
+  if (cmClient && !socket.connected) {
+    cmClient.editorAdapter.ignoreNextChange = true
+  }
 })
 editorInstance.on('cut', function () {
   // na
@@ -2567,9 +3108,9 @@ editorInstance.on('paste', function () {
 })
 editorInstance.on('changes', function (editor, changes) {
   updateHistory()
-  var docLength = editor.getValue().length
+  const docLength = editor.getValue().length
   // workaround for big documents
-  var newViewportMargin = 20
+  let newViewportMargin = 20
   if (docLength > 20000) {
     newViewportMargin = 1
   } else if (docLength > 10000) {
@@ -2582,7 +3123,10 @@ editorInstance.on('changes', function (editor, changes) {
     windowResize()
   }
   checkEditorScrollbar()
-  if (ui.area.codemirrorScroll[0].scrollHeight > ui.area.view[0].scrollHeight && editorHasFocus()) {
+  if (
+    ui.area.codemirrorScroll[0].scrollHeight > ui.area.view[0].scrollHeight &&
+    editorHasFocus()
+  ) {
     postUpdateEvent = function () {
       syncScrollToView()
       postUpdateEvent = null
@@ -2590,12 +3134,12 @@ editorInstance.on('changes', function (editor, changes) {
   }
 })
 editorInstance.on('focus', function (editor) {
-  for (var i = 0; i < onlineUsers.length; i++) {
+  for (let i = 0; i < onlineUsers.length; i++) {
     if (onlineUsers[i].id === personalInfo.id) {
       onlineUsers[i].cursor = editor.getCursor()
     }
   }
-  personalInfo['cursor'] = editor.getCursor()
+  personalInfo.cursor = editor.getCursor()
   socket.emit('cursor focus', editor.getCursor())
 })
 
@@ -2603,12 +3147,12 @@ const cursorActivity = _.debounce(cursorActivityInner, cursorActivityDebounce)
 
 function cursorActivityInner (editor) {
   if (editorHasFocus() && !Visibility.hidden()) {
-    for (var i = 0; i < onlineUsers.length; i++) {
+    for (let i = 0; i < onlineUsers.length; i++) {
       if (onlineUsers[i].id === personalInfo.id) {
         onlineUsers[i].cursor = editor.getCursor()
       }
     }
-    personalInfo['cursor'] = editor.getCursor()
+    personalInfo.cursor = editor.getCursor()
     socket.emit('cursor activity', editor.getCursor())
   }
 }
@@ -2632,7 +3176,7 @@ editorInstance.on('beforeSelectionChange', function (doc, selections) {
 
     // borrow from brackets EditorStatusBar.js
     if (start.line !== end.line) {
-      var lines = end.line - start.line + 1
+      let lines = end.line - start.line + 1
       if (end.ch === 0) {
         lines--
       }
@@ -2650,19 +3194,19 @@ editorInstance.on('beforeSelectionChange', function (doc, selections) {
 })
 
 editorInstance.on('blur', function (cm) {
-  for (var i = 0; i < onlineUsers.length; i++) {
+  for (let i = 0; i < onlineUsers.length; i++) {
     if (onlineUsers[i].id === personalInfo.id) {
       onlineUsers[i].cursor = null
     }
   }
-  personalInfo['cursor'] = null
+  personalInfo.cursor = null
   socket.emit('cursor blur')
 })
 
 function saveInfo () {
-  var scrollbarStyle = editor.getOption('scrollbarStyle')
-  var left = $(window).scrollLeft()
-  var top = $(window).scrollTop()
+  const scrollbarStyle = editor.getOption('scrollbarStyle')
+  const left = $(window).scrollLeft()
+  const top = $(window).scrollTop()
   switch (appState.currentMode) {
     case modeType.edit:
       if (scrollbarStyle === 'native') {
@@ -2688,10 +3232,10 @@ function saveInfo () {
 }
 
 function restoreInfo () {
-  var scrollbarStyle = editor.getOption('scrollbarStyle')
+  const scrollbarStyle = editor.getOption('scrollbarStyle')
   if (lastInfo.needRestore) {
-    var line = lastInfo.edit.cursor.line
-    var ch = lastInfo.edit.cursor.ch
+    const line = lastInfo.edit.cursor.line
+    const ch = lastInfo.edit.cursor.ch
     editor.setCursor(line, ch)
     editor.setSelections(lastInfo.edit.selections)
     switch (appState.currentMode) {
@@ -2700,8 +3244,8 @@ function restoreInfo () {
           $(window).scrollLeft(lastInfo.edit.scroll.left)
           $(window).scrollTop(lastInfo.edit.scroll.top)
         } else {
-          let left = lastInfo.edit.scroll.left
-          let top = lastInfo.edit.scroll.top
+          const left = lastInfo.edit.scroll.left
+          const top = lastInfo.edit.scroll.top
           editor.scrollIntoView()
           editor.scrollTo(left, top)
         }
@@ -2711,10 +3255,8 @@ function restoreInfo () {
         $(window).scrollTop(lastInfo.view.scroll.top)
         break
       case modeType.both:
-        let left = lastInfo.edit.scroll.left
-        let top = lastInfo.edit.scroll.top
         editor.scrollIntoView()
-        editor.scrollTo(left, top)
+        editor.scrollTo(lastInfo.edit.scroll.left, lastInfo.edit.scroll.top)
         ui.area.view.scrollLeft(lastInfo.view.scroll.left)
         ui.area.view.scrollTop(lastInfo.view.scroll.top)
         break
@@ -2731,27 +3273,30 @@ function refreshView () {
   updateViewInner()
 }
 
-var updateView = _.debounce(function () {
+const updateView = _.debounce(function () {
   editor.operation(updateViewInner)
 }, updateViewDebounce)
 
-var lastResult = null
-var postUpdateEvent = null
+let lastResult = null
+let postUpdateEvent = null
 
 function updateViewInner () {
   if (appState.currentMode === modeType.edit || !isDirty) return
-  var value = editor.getValue()
-  var lastMeta = md.meta
+  const value = editor.getValue()
+  const lastMeta = md.meta
   md.meta = {}
   delete md.metaError
-  var rendered = md.render(value)
+  let rendered = md.render(value)
   if (md.meta.type && md.meta.type === 'slide') {
     ui.area.view.addClass('black')
-    var slideOptions = {
+    const slideOptions = {
       separator: '^(\r\n?|\n)---(\r\n?|\n)$',
       verticalSeparator: '^(\r\n?|\n)----(\r\n?|\n)$'
     }
-    var slides = window.RevealMarkdown.slidify(editor.getValue(), slideOptions)
+    const slides = window.RevealMarkdown.slidify(
+      editor.getValue(),
+      slideOptions
+    )
     ui.area.markdown.html(slides)
     window.RevealMarkdown.initialize()
     // prevent XSS
@@ -2769,14 +3314,22 @@ function updateViewInner () {
     }
     // only render again when meta changed
     if (JSON.stringify(md.meta) !== JSON.stringify(lastMeta)) {
-      parseMeta(md, ui.area.codemirror, ui.area.markdown, $('#ui-toc'), $('#ui-toc-affix'))
+      parseMeta(
+        md,
+        ui.area.codemirror,
+        ui.area.markdown,
+        $('#ui-toc'),
+        $('#ui-toc-affix')
+      )
       rendered = md.render(value)
     }
     // prevent XSS
     rendered = preventXSS(rendered)
-    var result = postProcess(rendered).children().toArray()
+    const result = postProcess(rendered).children().toArray()
     partialUpdate(result, lastResult, ui.area.markdown.children().toArray())
-    if (result && lastResult && result.length !== lastResult.length) { updateDataAttrs(result, ui.area.markdown.children().toArray()) }
+    if (result && lastResult && result.length !== lastResult.length) {
+      updateDataAttrs(result, ui.area.markdown.children().toArray())
+    }
     lastResult = $(result).clone()
   }
   removeDOMEvents(ui.area.markdown)
@@ -2794,12 +3347,14 @@ function updateViewInner () {
   clearMap()
   // buildMap();
   updateTitleReminder()
-  if (postUpdateEvent && typeof postUpdateEvent === 'function') { postUpdateEvent() }
+  if (postUpdateEvent && typeof postUpdateEvent === 'function') {
+    postUpdateEvent()
+  }
 }
 
-var updateHistoryDebounce = 600
+const updateHistoryDebounce = 600
 
-var updateHistory = _.debounce(updateHistoryInner, updateHistoryDebounce)
+const updateHistory = _.debounce(updateHistoryInner, updateHistoryDebounce)
 
 function updateHistoryInner () {
   writeHistory(renderFilename(ui.area.markdown), renderTags(ui.area.markdown))
@@ -2807,50 +3362,59 @@ function updateHistoryInner () {
 
 function updateDataAttrs (src, des) {
   // sync data attr startline and endline
-  for (var i = 0; i < src.length; i++) {
+  for (let i = 0; i < src.length; i++) {
     copyAttribute(src[i], des[i], 'data-startline')
     copyAttribute(src[i], des[i], 'data-endline')
   }
 }
 
 function partialUpdate (src, tar, des) {
-  if (!src || src.length === 0 || !tar || tar.length === 0 || !des || des.length === 0) {
+  if (
+    !src ||
+    src.length === 0 ||
+    !tar ||
+    tar.length === 0 ||
+    !des ||
+    des.length === 0
+  ) {
     ui.area.markdown.html(src)
     return
   }
-  if (src.length === tar.length) { // same length
+  if (src.length === tar.length) {
+    // same length
     for (let i = 0; i < src.length; i++) {
       copyAttribute(src[i], des[i], 'data-startline')
       copyAttribute(src[i], des[i], 'data-endline')
-      var rawSrc = cloneAndRemoveDataAttr(src[i])
-      var rawTar = cloneAndRemoveDataAttr(tar[i])
+      const rawSrc = cloneAndRemoveDataAttr(src[i])
+      const rawTar = cloneAndRemoveDataAttr(tar[i])
       if (rawSrc.outerHTML !== rawTar.outerHTML) {
         // console.debug(rawSrc);
         // console.debug(rawTar);
         $(des[i]).replaceWith(src[i])
       }
     }
-  } else { // diff length
-    var start = 0
+  } else {
+    // diff length
+    let start = 0
     // find diff start position
     for (let i = 0; i < tar.length; i++) {
       // copyAttribute(src[i], des[i], 'data-startline');
       // copyAttribute(src[i], des[i], 'data-endline');
-      let rawSrc = cloneAndRemoveDataAttr(src[i])
-      let rawTar = cloneAndRemoveDataAttr(tar[i])
+      const rawSrc = cloneAndRemoveDataAttr(src[i])
+      const rawTar = cloneAndRemoveDataAttr(tar[i])
       if (!rawSrc || !rawTar || rawSrc.outerHTML !== rawTar.outerHTML) {
         start = i
         break
       }
     }
     // find diff end position
-    var srcEnd = 0
-    var tarEnd = 0
+    let srcEnd = 0
+    let tarEnd = 0
     for (let i = 0; i < src.length; i++) {
       // copyAttribute(src[i], des[i], 'data-startline');
       // copyAttribute(src[i], des[i], 'data-endline');
-      let rawSrc = cloneAndRemoveDataAttr(src[i])
-      let rawTar = cloneAndRemoveDataAttr(tar[i])
+      const rawSrc = cloneAndRemoveDataAttr(src[i])
+      const rawTar = cloneAndRemoveDataAttr(tar[i])
       if (!rawSrc || !rawTar || rawSrc.outerHTML !== rawTar.outerHTML) {
         start = i
         break
@@ -2858,12 +3422,12 @@ function partialUpdate (src, tar, des) {
     }
     // tar end
     for (let i = 1; i <= tar.length + 1; i++) {
-      let srcLength = src.length
-      let tarLength = tar.length
+      const srcLength = src.length
+      const tarLength = tar.length
       // copyAttribute(src[srcLength - i], des[srcLength - i], 'data-startline');
       // copyAttribute(src[srcLength - i], des[srcLength - i], 'data-endline');
-      let rawSrc = cloneAndRemoveDataAttr(src[srcLength - i])
-      let rawTar = cloneAndRemoveDataAttr(tar[tarLength - i])
+      const rawSrc = cloneAndRemoveDataAttr(src[srcLength - i])
+      const rawTar = cloneAndRemoveDataAttr(tar[tarLength - i])
       if (!rawSrc || !rawTar || rawSrc.outerHTML !== rawTar.outerHTML) {
         tarEnd = tar.length - i
         break
@@ -2871,25 +3435,35 @@ function partialUpdate (src, tar, des) {
     }
     // src end
     for (let i = 1; i <= src.length + 1; i++) {
-      let srcLength = src.length
-      let tarLength = tar.length
+      const srcLength = src.length
+      const tarLength = tar.length
       // copyAttribute(src[srcLength - i], des[srcLength - i], 'data-startline');
       // copyAttribute(src[srcLength - i], des[srcLength - i], 'data-endline');
-      let rawSrc = cloneAndRemoveDataAttr(src[srcLength - i])
-      let rawTar = cloneAndRemoveDataAttr(tar[tarLength - i])
+      const rawSrc = cloneAndRemoveDataAttr(src[srcLength - i])
+      const rawTar = cloneAndRemoveDataAttr(tar[tarLength - i])
       if (!rawSrc || !rawTar || rawSrc.outerHTML !== rawTar.outerHTML) {
         srcEnd = src.length - i
         break
       }
     }
     // check if tar end overlap tar start
-    var overlap = 0
-    for (var i = start; i >= 0; i--) {
-      var rawTarStart = cloneAndRemoveDataAttr(tar[i - 1])
-      var rawTarEnd = cloneAndRemoveDataAttr(tar[tarEnd + 1 + start - i])
-      if (rawTarStart && rawTarEnd && rawTarStart.outerHTML === rawTarEnd.outerHTML) { overlap++ } else { break }
+    let overlap = 0
+    for (let i = start; i >= 0; i--) {
+      const rawTarStart = cloneAndRemoveDataAttr(tar[i - 1])
+      const rawTarEnd = cloneAndRemoveDataAttr(tar[tarEnd + 1 + start - i])
+      if (
+        rawTarStart &&
+        rawTarEnd &&
+        rawTarStart.outerHTML === rawTarEnd.outerHTML
+      ) {
+        overlap++
+      } else {
+        break
+      }
+    }
+    if (debug) {
+      console.debug('overlap:' + overlap)
     }
-    if (debug) { console.debug('overlap:' + overlap) }
     // show diff content
     if (debug) {
       console.debug('start:' + start)
@@ -2898,10 +3472,10 @@ function partialUpdate (src, tar, des) {
     }
     tarEnd += overlap
     srcEnd += overlap
-    var repeatAdd = (start - srcEnd) < (start - tarEnd)
-    var repeatDiff = Math.abs(srcEnd - tarEnd) - 1
+    const repeatAdd = start - srcEnd < start - tarEnd
+    const repeatDiff = Math.abs(srcEnd - tarEnd) - 1
     // push new elements
-    var newElements = []
+    const newElements = []
     if (srcEnd >= start) {
       for (let j = start; j <= srcEnd; j++) {
         if (!src[j]) continue
@@ -2914,7 +3488,7 @@ function partialUpdate (src, tar, des) {
       }
     }
     // push remove elements
-    var removeElements = []
+    const removeElements = []
     if (tarEnd >= start) {
       for (let j = start; j <= tarEnd; j++) {
         if (!des[j]) continue
@@ -2931,28 +3505,38 @@ function partialUpdate (src, tar, des) {
       console.debug('ADD ELEMENTS')
       console.debug(newElements.join('\n'))
     }
-    if (des[start]) { $(newElements.join('')).insertBefore(des[start]) } else { $(newElements.join('')).insertAfter(des[start - 1]) }
+    if (des[start]) {
+      $(newElements.join('')).insertBefore(des[start])
+    } else {
+      $(newElements.join('')).insertAfter(des[start - 1])
+    }
     // remove elements
-    if (debug) { console.debug('REMOVE ELEMENTS') }
+    if (debug) {
+      console.debug('REMOVE ELEMENTS')
+    }
     for (let j = 0; j < removeElements.length; j++) {
       if (debug) {
         console.debug(removeElements[j].outerHTML)
       }
-      if (removeElements[j]) { $(removeElements[j]).remove() }
+      if (removeElements[j]) {
+        $(removeElements[j]).remove()
+      }
     }
   }
 }
 
 function cloneAndRemoveDataAttr (el) {
   if (!el) return
-  var rawEl = $(el).clone()
+  const rawEl = $(el).clone()
   rawEl.removeAttr('data-startline data-endline')
   rawEl.find('[data-startline]').removeAttr('data-startline data-endline')
   return rawEl[0]
 }
 
 function copyAttribute (src, des, attr) {
-  if (src && src.getAttribute(attr) && des) { des.setAttribute(attr, src.getAttribute(attr)) }
+  if (src && src.getAttribute(attr) && des) {
+    des.setAttribute(attr, src.getAttribute(attr))
+  }
 }
 
 if ($('.cursor-menu').length <= 0) {
@@ -2960,69 +3544,83 @@ if ($('.cursor-menu').length <= 0) {
 }
 
 function reverseSortCursorMenu (dropdown) {
-  var items = dropdown.find('.textcomplete-item')
+  const items = dropdown.find('.textcomplete-item')
   items.sort(function (a, b) {
     return $(b).attr('data-index') - $(a).attr('data-index')
   })
   return items
 }
 
-var checkCursorMenu = _.throttle(checkCursorMenuInner, cursorMenuThrottle)
+const checkCursorMenu = _.throttle(checkCursorMenuInner, cursorMenuThrottle)
 
 function checkCursorMenuInner () {
   // get element
-  var dropdown = $('.cursor-menu > .dropdown-menu')
+  const dropdown = $('.cursor-menu > .dropdown-menu')
   // return if not exists
   if (dropdown.length <= 0) return
   // set margin
-  var menuRightMargin = 10
-  var menuBottomMargin = 4
+  const menuRightMargin = 10
+  const menuBottomMargin = 4
   // use sizer to get the real doc size (won't count status bar and gutters)
-  var docWidth = ui.area.codemirrorSizer.width()
+  const docWidth = ui.area.codemirrorSizer.width()
   // get editor size (status bar not count in)
-  var editorHeight = ui.area.codemirror.height()
+  const editorHeight = ui.area.codemirror.height()
   // get element size
-  var width = dropdown.outerWidth()
-  var height = dropdown.outerHeight()
+  const width = dropdown.outerWidth()
+  const height = dropdown.outerHeight()
   // get cursor
-  var cursor = editor.getCursor()
+  const cursor = editor.getCursor()
   // set element cursor data
-  if (!dropdown.hasClass('CodeMirror-other-cursor')) { dropdown.addClass('CodeMirror-other-cursor') }
+  if (!dropdown.hasClass('CodeMirror-other-cursor')) {
+    dropdown.addClass('CodeMirror-other-cursor')
+  }
   dropdown.attr('data-line', cursor.line)
   dropdown.attr('data-ch', cursor.ch)
   // get coord position
-  var coord = editor.charCoords({
-    line: cursor.line,
-    ch: cursor.ch
-  }, 'windows')
-  var left = coord.left
-  var top = coord.top
+  const coord = editor.charCoords(
+    {
+      line: cursor.line,
+      ch: cursor.ch
+    },
+    'windows'
+  )
+  const left = coord.left
+  const top = coord.top
   // get doc top offset (to workaround with viewport)
-  var docTopOffset = ui.area.codemirrorSizerInner.position().top
+  const docTopOffset = ui.area.codemirrorSizerInner.position().top
   // set offset
-  var offsetLeft = 0
-  var offsetTop = defaultTextHeight
+  let offsetLeft = 0
+  let offsetTop = defaultTextHeight
   // set up side down
   window.upSideDown = false
-  var lastUpSideDown = window.upSideDown = false
+  let lastUpSideDown = (window.upSideDown = false)
   // only do when have width and height
   if (width > 0 && height > 0) {
     // make element right bound not larger than doc width
-    if (left + width + offsetLeft + menuRightMargin > docWidth) { offsetLeft = -(left + width - docWidth + menuRightMargin) }
+    if (left + width + offsetLeft + menuRightMargin > docWidth) {
+      offsetLeft = -(left + width - docWidth + menuRightMargin)
+    }
     // flip y when element bottom bound larger than doc height
     // and element top position is larger than element height
-    if (top + docTopOffset + height + offsetTop + menuBottomMargin > Math.max(editor.doc.height, editorHeight) && top + docTopOffset > height + menuBottomMargin) {
+    if (
+      top + docTopOffset + height + offsetTop + menuBottomMargin >
+        Math.max(editor.doc.height, editorHeight) &&
+      top + docTopOffset > height + menuBottomMargin
+    ) {
       offsetTop = -(height + menuBottomMargin)
       // reverse sort menu because upSideDown
       dropdown.html(reverseSortCursorMenu(dropdown))
       window.upSideDown = true
     }
-    var textCompleteDropdown = $(editor.getInputField()).data('textComplete').dropdown
+    const textCompleteDropdown = $(editor.getInputField()).data('textComplete')
+      .dropdown
     lastUpSideDown = textCompleteDropdown.upSideDown
     textCompleteDropdown.upSideDown = window.upSideDown
   }
   // make menu scroll top only if upSideDown changed
-  if (window.upSideDown !== lastUpSideDown) { dropdown.scrollTop(dropdown[0].scrollHeight) }
+  if (window.upSideDown !== lastUpSideDown) {
+    dropdown.scrollTop(dropdown[0].scrollHeight)
+  }
   // set element offset data
   dropdown.attr('data-offset-left', offsetLeft)
   dropdown.attr('data-offset-top', offsetTop)
@@ -3033,33 +3631,37 @@ function checkCursorMenuInner () {
 
 function checkInIndentCode () {
   // if line starts with tab or four spaces is a code block
-  var line = editor.getLine(editor.getCursor().line)
-  var isIndentCode = ((line.substr(0, 4) === '    ') || (line.substr(0, 1) === '\t'))
+  const line = editor.getLine(editor.getCursor().line)
+  const isIndentCode =
+    line.substr(0, 4) === '    ' || line.substr(0, 1) === '\t'
   return isIndentCode
 }
 
-var isInCode = false
+let isInCode = false
 
 function checkInCode () {
   isInCode = checkAbove(matchInCode) || checkInIndentCode()
 }
 
 function checkAbove (method) {
-  var cursor = editor.getCursor()
-  var text = []
-  for (var i = 0; i < cursor.line; i++) { // contain current line
+  const cursor = editor.getCursor()
+  let text = []
+  for (let i = 0; i < cursor.line; i++) {
+    // contain current line
     text.push(editor.getLine(i))
   }
-  text = text.join('\n') + '\n' + editor.getLine(cursor.line).slice(0, cursor.ch)
+  text =
+    text.join('\n') + '\n' + editor.getLine(cursor.line).slice(0, cursor.ch)
   // console.debug(text);
   return method(text)
 }
 
 function checkBelow (method) {
-  var cursor = editor.getCursor()
-  var count = editor.lineCount()
-  var text = []
-  for (var i = cursor.line + 1; i < count; i++) { // contain current line
+  const cursor = editor.getCursor()
+  const count = editor.lineCount()
+  let text = []
+  for (let i = cursor.line + 1; i < count; i++) {
+    // contain current line
     text.push(editor.getLine(i))
   }
   text = editor.getLine(cursor.line).slice(cursor.ch) + '\n' + text.join('\n')
@@ -3068,7 +3670,7 @@ function checkBelow (method) {
 }
 
 function matchInCode (text) {
-  var match
+  let match
   match = text.match(/`{3,}/g)
   if (match && match.length % 2) {
     return true
@@ -3082,8 +3684,8 @@ function matchInCode (text) {
   }
 }
 
-var isInContainer = false
-var isInContainerSyntax = false
+let isInContainer = false
+let isInContainerSyntax = false
 
 function checkInContainer () {
   isInContainer = checkAbove(matchInContainer) && !checkInIndentCode()
@@ -3091,13 +3693,12 @@ function checkInContainer () {
 
 function checkInContainerSyntax () {
   // if line starts with :::, it's in container syntax
-  var line = editor.getLine(editor.getCursor().line)
-  isInContainerSyntax = (line.substr(0, 3) === ':::')
+  const line = editor.getLine(editor.getCursor().line)
+  isInContainerSyntax = line.substr(0, 3) === ':::'
 }
 
 function matchInContainer (text) {
-  var match
-  match = text.match(/:{3,}/g)
+  const match = text.match(/:{3,}/g)
   if (match && match.length % 2) {
     return true
   } else {
@@ -3106,194 +3707,244 @@ function matchInContainer (text) {
 }
 
 $(editor.getInputField())
-  .textcomplete([
-    { // emoji strategy
-      match: /(^|\n|\s)\B:([-+\w]*)$/,
-      search: function (term, callback) {
-        var line = editor.getLine(editor.getCursor().line)
-        term = line.match(this.match)[2]
-        var list = []
-        $.map(window.emojify.emojiNames, function (emoji) {
-          if (emoji.indexOf(term) === 0) { // match at first character
-            list.push(emoji)
+  .textcomplete(
+    [
+      {
+        // emoji strategy
+        match: /(^|\n|\s)\B:([-+\w]*)$/,
+        search: function (term, callback) {
+          const line = editor.getLine(editor.getCursor().line)
+          term = line.match(this.match)[2]
+          const list = []
+          $.map(window.emojify.emojiNames, function (emoji) {
+            if (emoji.indexOf(term) === 0) {
+              // match at first character
+              list.push(emoji)
+            }
+          })
+          $.map(window.emojify.emojiNames, function (emoji) {
+            if (emoji.indexOf(term) !== -1) {
+              // match inside the word
+              list.push(emoji)
+            }
+          })
+          callback(list)
+        },
+        template: function (value) {
+          return (
+            '<img class="emoji" src="' +
+            serverurl +
+            '/build/emojify.js/dist/images/basic/' +
+            value +
+            '.png"></img> ' +
+            value
+          )
+        },
+        replace: function (value) {
+          return '$1:' + value + ': '
+        },
+        index: 1,
+        context: function (text) {
+          checkInCode()
+          checkInContainer()
+          checkInContainerSyntax()
+          return !isInCode && !isInContainerSyntax
+        }
+      },
+      {
+        // Code block language strategy
+        langs: supportCodeModes,
+        charts: supportCharts,
+        match: /(^|\n)```(\w+)$/,
+        search: function (term, callback) {
+          const line = editor.getLine(editor.getCursor().line)
+          term = line.match(this.match)[2]
+          const list = []
+          $.map(this.langs, function (lang) {
+            if (lang.indexOf(term) === 0 && lang !== term) {
+              list.push(lang)
+            }
+          })
+          $.map(this.charts, function (chart) {
+            if (chart.indexOf(term) === 0 && chart !== term) {
+              list.push(chart)
+            }
+          })
+          callback(list)
+        },
+        replace: function (lang) {
+          let ending = ''
+          if (!checkBelow(matchInCode)) {
+            ending = '\n\n```'
           }
-        })
-        $.map(window.emojify.emojiNames, function (emoji) {
-          if (emoji.indexOf(term) !== -1) { // match inside the word
-            list.push(emoji)
+          if (this.langs.indexOf(lang) !== -1) {
+            return '$1```' + lang + '=' + ending
+          } else if (this.charts.indexOf(lang) !== -1) {
+            return '$1```' + lang + ending
           }
-        })
-        callback(list)
-      },
-      template: function (value) {
-        return '<img class="emoji" src="' + serverurl + '/build/emojify.js/dist/images/basic/' + value + '.png"></img> ' + value
-      },
-      replace: function (value) {
-        return '$1:' + value + ': '
-      },
-      index: 1,
-      context: function (text) {
-        checkInCode()
-        checkInContainer()
-        checkInContainerSyntax()
-        return !isInCode && !isInContainerSyntax
-      }
-    },
-    { // Code block language strategy
-      langs: supportCodeModes,
-      charts: supportCharts,
-      match: /(^|\n)```(\w+)$/,
-      search: function (term, callback) {
-        var line = editor.getLine(editor.getCursor().line)
-        term = line.match(this.match)[2]
-        var list = []
-        $.map(this.langs, function (lang) {
-          if (lang.indexOf(term) === 0 && lang !== term) { list.push(lang) }
-        })
-        $.map(this.charts, function (chart) {
-          if (chart.indexOf(term) === 0 && chart !== term) { list.push(chart) }
-        })
-        callback(list)
-      },
-      replace: function (lang) {
-        var ending = ''
-        if (!checkBelow(matchInCode)) {
-          ending = '\n\n```'
+        },
+        done: function () {
+          const cursor = editor.getCursor()
+          let text = []
+          text.push(editor.getLine(cursor.line - 1))
+          text.push(editor.getLine(cursor.line))
+          text = text.join('\n')
+          // console.debug(text);
+          if (text === '\n```') {
+            editor.doc.cm.execCommand('goLineUp')
+          }
+        },
+        context: function (text) {
+          return isInCode
         }
-        if (this.langs.indexOf(lang) !== -1) { return '$1```' + lang + '=' + ending } else if (this.charts.indexOf(lang) !== -1) { return '$1```' + lang + ending }
       },
-      done: function () {
-        var cursor = editor.getCursor()
-        var text = []
-        text.push(editor.getLine(cursor.line - 1))
-        text.push(editor.getLine(cursor.line))
-        text = text.join('\n')
-        // console.debug(text);
-        if (text === '\n```') { editor.doc.cm.execCommand('goLineUp') }
-      },
-      context: function (text) {
-        return isInCode
-      }
-    },
-    { // Container strategy
-      containers: supportContainers,
-      match: /(^|\n):::(\s*)(\w*)$/,
-      search: function (term, callback) {
-        var line = editor.getLine(editor.getCursor().line)
-        term = line.match(this.match)[3].trim()
-        var list = []
-        $.map(this.containers, function (container) {
-          if (container.indexOf(term) === 0 && container !== term) { list.push(container) }
-        })
-        callback(list)
-      },
-      replace: function (lang) {
-        var ending = ''
-        if (!checkBelow(matchInContainer)) {
-          ending = '\n\n:::'
+      {
+        // Container strategy
+        containers: supportContainers,
+        match: /(^|\n):::(\s*)(\w*)$/,
+        search: function (term, callback) {
+          const line = editor.getLine(editor.getCursor().line)
+          term = line.match(this.match)[3].trim()
+          const list = []
+          $.map(this.containers, function (container) {
+            if (container.indexOf(term) === 0 && container !== term) {
+              list.push(container)
+            }
+          })
+          callback(list)
+        },
+        replace: function (lang) {
+          let ending = ''
+          if (!checkBelow(matchInContainer)) {
+            ending = '\n\n:::'
+          }
+          if (this.containers.indexOf(lang) !== -1) {
+            return '$1:::$2' + lang + ending
+          }
+        },
+        done: function () {
+          const cursor = editor.getCursor()
+          let text = []
+          text.push(editor.getLine(cursor.line - 1))
+          text.push(editor.getLine(cursor.line))
+          text = text.join('\n')
+          // console.debug(text);
+          if (text === '\n:::') {
+            editor.doc.cm.execCommand('goLineUp')
+          }
+        },
+        context: function (text) {
+          return !isInCode && isInContainer
         }
-        if (this.containers.indexOf(lang) !== -1) { return '$1:::$2' + lang + ending }
-      },
-      done: function () {
-        var cursor = editor.getCursor()
-        var text = []
-        text.push(editor.getLine(cursor.line - 1))
-        text.push(editor.getLine(cursor.line))
-        text = text.join('\n')
-        // console.debug(text);
-        if (text === '\n:::') { editor.doc.cm.execCommand('goLineUp') }
-      },
-      context: function (text) {
-        return !isInCode && isInContainer
-      }
-    },
-    { // header
-      match: /(?:^|\n)(\s{0,3})(#{1,6}\w*)$/,
-      search: function (term, callback) {
-        callback($.map(supportHeaders, function (header) {
-          return header.search.indexOf(term) === 0 ? header.text : null
-        }))
-      },
-      replace: function (value) {
-        return '$1' + value
-      },
-      context: function (text) {
-        return !isInCode
-      }
-    },
-    { // extra tags for list
-      match: /(^[>\s]*[-+*]\s(?:\[[x ]\]|.*))(\[\])(\w*)$/,
-      search: function (term, callback) {
-        var list = []
-        $.map(supportExtraTags, function (extratag) {
-          if (extratag.search.indexOf(term) === 0) { list.push(extratag.command()) }
-        })
-        $.map(supportReferrals, function (referral) {
-          if (referral.search.indexOf(term) === 0) { list.push(referral.text) }
-        })
-        callback(list)
       },
-      replace: function (value) {
-        return '$1' + value
+      {
+        // header
+        match: /(?:^|\n)(\s{0,3})(#{1,6}\w*)$/,
+        search: function (term, callback) {
+          callback(
+            $.map(supportHeaders, function (header) {
+              return header.search.indexOf(term) === 0 ? header.text : null
+            })
+          )
+        },
+        replace: function (value) {
+          return '$1' + value
+        },
+        context: function (text) {
+          return !isInCode
+        }
       },
-      context: function (text) {
-        return !isInCode
-      }
-    },
-    { // extra tags for blockquote
-      match: /(?:^|\n|\s)(>.*|\s|)((\^|)\[(\^|)\](\[\]|\(\)|:|)\s*\w*)$/,
-      search: function (term, callback) {
-        var line = editor.getLine(editor.getCursor().line)
-        var quote = line.match(this.match)[1].trim()
-        var list = []
-        if (quote.indexOf('>') === 0) {
+      {
+        // extra tags for list
+        match: /(^[>\s]*[-+*]\s(?:\[[x ]\]|.*))(\[\])(\w*)$/,
+        search: function (term, callback) {
+          const list = []
           $.map(supportExtraTags, function (extratag) {
-            if (extratag.search.indexOf(term) === 0) { list.push(extratag.command()) }
+            if (extratag.search.indexOf(term) === 0) {
+              list.push(extratag.command())
+            }
           })
+          $.map(supportReferrals, function (referral) {
+            if (referral.search.indexOf(term) === 0) {
+              list.push(referral.text)
+            }
+          })
+          callback(list)
+        },
+        replace: function (value) {
+          return '$1' + value
+        },
+        context: function (text) {
+          return !isInCode
         }
-        $.map(supportReferrals, function (referral) {
-          if (referral.search.indexOf(term) === 0) { list.push(referral.text) }
-        })
-        callback(list)
-      },
-      replace: function (value) {
-        return '$1' + value
-      },
-      context: function (text) {
-        return !isInCode
-      }
-    },
-    { // referral
-      match: /(^\s*|\n|\s{2})((\[\]|\[\]\[\]|\[\]\(\)|!|!\[\]|!\[\]\[\]|!\[\]\(\))\s*\w*)$/,
-      search: function (term, callback) {
-        callback($.map(supportReferrals, function (referral) {
-          return referral.search.indexOf(term) === 0 ? referral.text : null
-        }))
-      },
-      replace: function (value) {
-        return '$1' + value
       },
-      context: function (text) {
-        return !isInCode
-      }
-    },
-    { // externals
-      match: /(^|\n|\s)\{\}(\w*)$/,
-      search: function (term, callback) {
-        callback($.map(supportExternals, function (external) {
-          return external.search.indexOf(term) === 0 ? external.text : null
-        }))
+      {
+        // extra tags for blockquote
+        match: /(?:^|\n|\s)(>.*|\s|)((\^|)\[(\^|)\](\[\]|\(\)|:|)\s*\w*)$/,
+        search: function (term, callback) {
+          const line = editor.getLine(editor.getCursor().line)
+          const quote = line.match(this.match)[1].trim()
+          const list = []
+          if (quote.indexOf('>') === 0) {
+            $.map(supportExtraTags, function (extratag) {
+              if (extratag.search.indexOf(term) === 0) {
+                list.push(extratag.command())
+              }
+            })
+          }
+          $.map(supportReferrals, function (referral) {
+            if (referral.search.indexOf(term) === 0) {
+              list.push(referral.text)
+            }
+          })
+          callback(list)
+        },
+        replace: function (value) {
+          return '$1' + value
+        },
+        context: function (text) {
+          return !isInCode
+        }
       },
-      replace: function (value) {
-        return '$1' + value
+      {
+        // referral
+        match: /(^\s*|\n|\s{2})((\[\]|\[\]\[\]|\[\]\(\)|!|!\[\]|!\[\]\[\]|!\[\]\(\))\s*\w*)$/,
+        search: function (term, callback) {
+          callback(
+            $.map(supportReferrals, function (referral) {
+              return referral.search.indexOf(term) === 0 ? referral.text : null
+            })
+          )
+        },
+        replace: function (value) {
+          return '$1' + value
+        },
+        context: function (text) {
+          return !isInCode
+        }
       },
-      context: function (text) {
-        return !isInCode
+      {
+        // externals
+        match: /(^|\n|\s)\{\}(\w*)$/,
+        search: function (term, callback) {
+          callback(
+            $.map(supportExternals, function (external) {
+              return external.search.indexOf(term) === 0 ? external.text : null
+            })
+          )
+        },
+        replace: function (value) {
+          return '$1' + value
+        },
+        context: function (text) {
+          return !isInCode
+        }
       }
+    ],
+    {
+      appendTo: $('.cursor-menu')
     }
-  ], {
-    appendTo: $('.cursor-menu')
-  })
+  )
   .on({
     'textComplete:beforeSearch': function (e) {
       // NA
@@ -3307,22 +3958,22 @@ $(editor.getInputField())
     'textComplete:show': function (e) {
       $(this).data('autocompleting', true)
       editor.setOption('extraKeys', {
-        'Up': function () {
+        Up: function () {
           return false
         },
-        'Right': function () {
+        Right: function () {
           editor.doc.cm.execCommand('goCharRight')
         },
-        'Down': function () {
+        Down: function () {
           return false
         },
-        'Left': function () {
+        Left: function () {
           editor.doc.cm.execCommand('goCharLeft')
         },
-        'Enter': function () {
+        Enter: function () {
           return false
         },
-        'Backspace': function () {
+        Backspace: function () {
           editor.doc.cm.execCommand('delCharBefore')
         }
       })
diff --git a/public/js/lib/appState.js b/public/js/lib/appState.js
index 87aaf737..f409908c 100644
--- a/public/js/lib/appState.js
+++ b/public/js/lib/appState.js
@@ -1,6 +1,6 @@
 import modeType from './modeType'
 
-let state = {
+const state = {
   syncscroll: true,
   currentMode: modeType.view,
   nightMode: false
diff --git a/public/js/lib/common/login.js b/public/js/lib/common/login.js
index 3f7a3e4d..88e8f8cf 100644
--- a/public/js/lib/common/login.js
+++ b/public/js/lib/common/login.js
@@ -7,7 +7,7 @@ let checkAuth = false
 let profile = null
 let lastLoginState = getLoginState()
 let lastUserId = getUserId()
-var loginStateChangeEvent = null
+let loginStateChangeEvent = null
 
 export function setloginStateChangeEvent (func) {
   loginStateChangeEvent = func
diff --git a/public/js/lib/editor/config.js b/public/js/lib/editor/config.js
index 9508b847..338ef6dc 100644
--- a/public/js/lib/editor/config.js
+++ b/public/js/lib/editor/config.js
@@ -1,4 +1,4 @@
-let config = {
+const config = {
   docmaxlength: null
 }
 
diff --git a/public/js/lib/editor/index.js b/public/js/lib/editor/index.js
index d86ebf3c..c84a3725 100644
--- a/public/js/lib/editor/index.js
+++ b/public/js/lib/editor/index.js
@@ -35,30 +35,30 @@ export default class Editor {
       },
       Enter: 'newlineAndIndentContinueMarkdownList',
       Tab: function (cm) {
-        var tab = '\t'
+        const tab = '\t'
 
         // contruct x length spaces
-        var spaces = Array(parseInt(cm.getOption('indentUnit')) + 1).join(' ')
+        const spaces = Array(parseInt(cm.getOption('indentUnit')) + 1).join(' ')
 
         // auto indent whole line when in list or blockquote
-        var cursor = cm.getCursor()
-        var line = cm.getLine(cursor.line)
+        const cursor = cm.getCursor()
+        const line = cm.getLine(cursor.line)
 
         // this regex match the following patterns
         // 1. blockquote starts with "> " or ">>"
         // 2. unorder list starts with *+-
         // 3. order list starts with "1." or "1)"
-        var regex = /^(\s*)(>[> ]*|[*+-]\s|(\d+)([.)]))/
+        const regex = /^(\s*)(>[> ]*|[*+-]\s|(\d+)([.)]))/
 
-        var match
-        var multiple = cm.getSelection().split('\n').length > 1 ||
+        let match
+        const multiple = cm.getSelection().split('\n').length > 1 ||
           cm.getSelections().length > 1
 
         if (multiple) {
           cm.execCommand('defaultTab')
         } else if ((match = regex.exec(line)) !== null) {
-          var ch = match[1].length
-          var pos = {
+          const ch = match[1].length
+          const pos = {
             line: cursor.line,
             ch: ch
           }
@@ -77,8 +77,8 @@ export default class Editor {
       },
       'Cmd-Left': 'goLineLeftSmart',
       'Cmd-Right': 'goLineRight',
-      'Home': 'goLineLeftSmart',
-      'End': 'goLineRight',
+      Home: 'goLineLeftSmart',
+      End: 'goLineRight',
       'Ctrl-C': function (cm) {
         if (!isMac && cm.getOption('keyMap').substr(0, 3) === 'vim') {
           document.execCommand('copy')
@@ -140,27 +140,27 @@ export default class Editor {
   }
 
   addToolBar () {
-    var inlineAttach = inlineAttachment.editors.codemirror4.attach(this.editor)
+    const inlineAttach = inlineAttachment.editors.codemirror4.attach(this.editor)
     this.toolBar = $(toolBarTemplate)
     this.toolbarPanel = this.editor.addPanel(this.toolBar[0], {
       position: 'top'
     })
 
-    var makeBold = $('#makeBold')
-    var makeItalic = $('#makeItalic')
-    var makeStrike = $('#makeStrike')
-    var makeHeader = $('#makeHeader')
-    var makeCode = $('#makeCode')
-    var makeQuote = $('#makeQuote')
-    var makeGenericList = $('#makeGenericList')
-    var makeOrderedList = $('#makeOrderedList')
-    var makeCheckList = $('#makeCheckList')
-    var makeLink = $('#makeLink')
-    var makeImage = $('#makeImage')
-    var makeTable = $('#makeTable')
-    var makeLine = $('#makeLine')
-    var makeComment = $('#makeComment')
-    var uploadImage = $('#uploadImage')
+    const makeBold = $('#makeBold')
+    const makeItalic = $('#makeItalic')
+    const makeStrike = $('#makeStrike')
+    const makeHeader = $('#makeHeader')
+    const makeCode = $('#makeCode')
+    const makeQuote = $('#makeQuote')
+    const makeGenericList = $('#makeGenericList')
+    const makeOrderedList = $('#makeOrderedList')
+    const makeCheckList = $('#makeCheckList')
+    const makeLink = $('#makeLink')
+    const makeImage = $('#makeImage')
+    const makeTable = $('#makeTable')
+    const makeLine = $('#makeLine')
+    const makeComment = $('#makeComment')
+    const uploadImage = $('#uploadImage')
 
     makeBold.click(() => {
       utils.wrapTextWith(this.editor, this.editor, '**')
@@ -223,7 +223,7 @@ export default class Editor {
     })
 
     uploadImage.bind('change', function (e) {
-      var files = e.target.files || e.dataTransfer.files
+      const files = e.target.files || e.dataTransfer.files
       e.dataTransfer = {}
       e.dataTransfer.files = files
       inlineAttach.onDrop(e)
@@ -256,12 +256,12 @@ export default class Editor {
   updateStatusBar () {
     if (!this.statusBar) return
 
-    var cursor = this.editor.getCursor()
-    var cursorText = 'Line ' + (cursor.line + 1) + ', Columns ' + (cursor.ch + 1)
+    const cursor = this.editor.getCursor()
+    const cursorText = 'Line ' + (cursor.line + 1) + ', Columns ' + (cursor.ch + 1)
     this.statusCursor.text(cursorText)
-    var fileText = ' — ' + editor.lineCount() + ' Lines'
+    const fileText = ' — ' + editor.lineCount() + ' Lines'
     this.statusFile.text(fileText)
-    var docLength = editor.getValue().length
+    const docLength = editor.getValue().length
     this.statusLength.text('Length ' + docLength)
     if (docLength > (config.docmaxlength * 0.95)) {
       this.statusLength.css('color', 'red')
@@ -276,9 +276,9 @@ export default class Editor {
   }
 
   setIndent () {
-    var cookieIndentType = Cookies.get('indent_type')
-    var cookieTabSize = parseInt(Cookies.get('tab_size'))
-    var cookieSpaceUnits = parseInt(Cookies.get('space_units'))
+    const cookieIndentType = Cookies.get('indent_type')
+    let cookieTabSize = parseInt(Cookies.get('tab_size'))
+    let cookieSpaceUnits = parseInt(Cookies.get('space_units'))
     if (cookieIndentType) {
       if (cookieIndentType === 'tab') {
         this.editor.setOption('indentWithTabs', true)
@@ -296,9 +296,9 @@ export default class Editor {
       this.editor.setOption('tabSize', cookieTabSize)
     }
 
-    var type = this.statusIndicators.find('.indent-type')
-    var widthLabel = this.statusIndicators.find('.indent-width-label')
-    var widthInput = this.statusIndicators.find('.indent-width-input')
+    const type = this.statusIndicators.find('.indent-type')
+    const widthLabel = this.statusIndicators.find('.indent-width-label')
+    const widthInput = this.statusIndicators.find('.indent-width-input')
 
     const setType = () => {
       if (this.editor.getOption('indentWithTabs')) {
@@ -318,7 +318,7 @@ export default class Editor {
     setType()
 
     const setUnit = () => {
-      var unit = this.editor.getOption('indentUnit')
+      const unit = this.editor.getOption('indentUnit')
       if (this.editor.getOption('indentWithTabs')) {
         Cookies.set('tab_size', unit, {
           expires: 365,
@@ -364,7 +364,7 @@ export default class Editor {
       }
     })
     widthInput.on('change', () => {
-      var val = parseInt(widthInput.val())
+      let val = parseInt(widthInput.val())
       if (!val) val = this.editor.getOption('indentUnit')
       if (val < 1) val = 1
       else if (val > 10) val = 10
@@ -382,18 +382,18 @@ export default class Editor {
   }
 
   setKeymap () {
-    var cookieKeymap = Cookies.get('keymap')
+    const cookieKeymap = Cookies.get('keymap')
     if (cookieKeymap) {
       this.editor.setOption('keyMap', cookieKeymap)
     }
 
-    var label = this.statusIndicators.find('.ui-keymap-label')
-    var sublime = this.statusIndicators.find('.ui-keymap-sublime')
-    var emacs = this.statusIndicators.find('.ui-keymap-emacs')
-    var vim = this.statusIndicators.find('.ui-keymap-vim')
+    const label = this.statusIndicators.find('.ui-keymap-label')
+    const sublime = this.statusIndicators.find('.ui-keymap-sublime')
+    const emacs = this.statusIndicators.find('.ui-keymap-emacs')
+    const vim = this.statusIndicators.find('.ui-keymap-vim')
 
     const setKeymapLabel = () => {
-      var keymap = this.editor.getOption('keyMap')
+      const keymap = this.editor.getOption('keyMap')
       Cookies.set('keymap', keymap, {
         expires: 365,
         sameSite: window.cookiePolicy
@@ -419,15 +419,15 @@ export default class Editor {
   }
 
   setTheme () {
-    var cookieTheme = Cookies.get('theme')
+    const cookieTheme = Cookies.get('theme')
     if (cookieTheme) {
       this.editor.setOption('theme', cookieTheme)
     }
 
-    var themeToggle = this.statusTheme.find('.ui-theme-toggle')
+    const themeToggle = this.statusTheme.find('.ui-theme-toggle')
 
     const checkTheme = () => {
-      var theme = this.editor.getOption('theme')
+      const theme = this.editor.getOption('theme')
       if (theme === 'one-dark') {
         themeToggle.removeClass('active')
       } else {
@@ -436,7 +436,7 @@ export default class Editor {
     }
 
     themeToggle.click(() => {
-      var theme = this.editor.getOption('theme')
+      let theme = this.editor.getOption('theme')
       if (theme === 'one-dark') {
         theme = 'default'
       } else {
@@ -455,9 +455,9 @@ export default class Editor {
   }
 
   setSpellcheck () {
-    var cookieSpellcheck = Cookies.get('spellcheck')
+    const cookieSpellcheck = Cookies.get('spellcheck')
     if (cookieSpellcheck) {
-      var mode = null
+      let mode = null
       if (cookieSpellcheck === 'true' || cookieSpellcheck === true) {
         mode = 'spell-checker'
       } else {
@@ -468,10 +468,10 @@ export default class Editor {
       }
     }
 
-    var spellcheckToggle = this.statusSpellcheck.find('.ui-spellcheck-toggle')
+    const spellcheckToggle = this.statusSpellcheck.find('.ui-spellcheck-toggle')
 
     const checkSpellcheck = () => {
-      var mode = this.editor.getOption('mode')
+      const mode = this.editor.getOption('mode')
       if (mode === defaultEditorMode) {
         spellcheckToggle.removeClass('active')
       } else {
@@ -480,7 +480,7 @@ export default class Editor {
     }
 
     spellcheckToggle.click(() => {
-      var mode = this.editor.getOption('mode')
+      let mode = this.editor.getOption('mode')
       if (mode === defaultEditorMode) {
         mode = 'spell-checker'
       } else {
@@ -501,7 +501,7 @@ export default class Editor {
 
     // workaround spellcheck might not activate beacuse the ajax loading
     if (window.num_loaded < 2) {
-      var spellcheckTimer = setInterval(
+      const spellcheckTimer = setInterval(
         () => {
           if (window.num_loaded >= 2) {
             if (this.editor.getOption('mode') === 'spell-checker') {
@@ -516,7 +516,7 @@ export default class Editor {
   }
 
   resetEditorKeymapToBrowserKeymap () {
-    var keymap = this.editor.getOption('keyMap')
+    const keymap = this.editor.getOption('keyMap')
     if (!this.jumpToAddressBarKeymapValue) {
       this.jumpToAddressBarKeymapValue = CodeMirror.keyMap[keymap][jumpToAddressBarKeymapName]
       delete CodeMirror.keyMap[keymap][jumpToAddressBarKeymapName]
@@ -524,14 +524,15 @@ export default class Editor {
   }
 
   restoreOverrideEditorKeymap () {
-    var keymap = this.editor.getOption('keyMap')
+    const keymap = this.editor.getOption('keyMap')
     if (this.jumpToAddressBarKeymapValue) {
       CodeMirror.keyMap[keymap][jumpToAddressBarKeymapName] = this.jumpToAddressBarKeymapValue
       this.jumpToAddressBarKeymapValue = null
     }
   }
+
   setOverrideBrowserKeymap () {
-    var overrideBrowserKeymap = $(
+    const overrideBrowserKeymap = $(
       '.ui-preferences-override-browser-keymap label > input[type="checkbox"]'
     )
     if (overrideBrowserKeymap.is(':checked')) {
@@ -547,10 +548,10 @@ export default class Editor {
   }
 
   setPreferences () {
-    var overrideBrowserKeymap = $(
+    const overrideBrowserKeymap = $(
       '.ui-preferences-override-browser-keymap label > input[type="checkbox"]'
     )
-    var cookieOverrideBrowserKeymap = Cookies.get(
+    const cookieOverrideBrowserKeymap = Cookies.get(
       'preferences-override-browser-keymap'
     )
     if (cookieOverrideBrowserKeymap && cookieOverrideBrowserKeymap === 'true') {
diff --git a/public/js/lib/editor/utils.js b/public/js/lib/editor/utils.js
index d87c7e41..70428b28 100644
--- a/public/js/lib/editor/utils.js
+++ b/public/js/lib/editor/utils.js
@@ -3,17 +3,17 @@ export function wrapTextWith (editor, cm, symbol) {
   if (!cm.getSelection()) {
     return CodeMirror.Pass
   } else {
-    let ranges = cm.listSelections()
+    const ranges = cm.listSelections()
     for (let i = 0; i < ranges.length; i++) {
-      let range = ranges[i]
+      const range = ranges[i]
       if (!range.empty()) {
         const from = range.from()
         const to = range.to()
 
         if (symbol !== 'Backspace') {
-          let selection = cm.getRange(from, to)
-          let anchorIndex = editor.indexFromPos(ranges[i].anchor)
-          let headIndex = editor.indexFromPos(ranges[i].head)
+          const selection = cm.getRange(from, to)
+          const anchorIndex = editor.indexFromPos(ranges[i].anchor)
+          const headIndex = editor.indexFromPos(ranges[i].head)
           cm.replaceRange(symbol + selection + symbol, from, to, '+input')
           if (anchorIndex > headIndex) {
             ranges[i].anchor.ch += symbol.length
@@ -24,18 +24,18 @@ export function wrapTextWith (editor, cm, symbol) {
           }
           cm.setSelections(ranges)
         } else {
-          let preEndPos = {
+          const preEndPos = {
             line: to.line,
             ch: to.ch + symbol.length
           }
-          let preText = cm.getRange(to, preEndPos)
-          let preIndex = wrapSymbols.indexOf(preText)
-          let postEndPos = {
+          const preText = cm.getRange(to, preEndPos)
+          const preIndex = wrapSymbols.indexOf(preText)
+          const postEndPos = {
             line: from.line,
             ch: from.ch - symbol.length
           }
-          let postText = cm.getRange(postEndPos, from)
-          let postIndex = wrapSymbols.indexOf(postText)
+          const postText = cm.getRange(postEndPos, from)
+          const postIndex = wrapSymbols.indexOf(postText)
           // check if surround symbol are list in array and matched
           if (preIndex > -1 && postIndex > -1 && preIndex === postIndex) {
             cm.replaceRange('', to, preEndPos, '+delete')
@@ -48,25 +48,25 @@ export function wrapTextWith (editor, cm, symbol) {
 }
 
 export function insertText (cm, text, cursorEnd = 0) {
-  let cursor = cm.getCursor()
+  const cursor = cm.getCursor()
   cm.replaceSelection(text, cursor, cursor)
   cm.focus()
   cm.setCursor({ line: cursor.line, ch: cursor.ch + cursorEnd })
 }
 
 export function insertLink (cm, isImage) {
-  let cursor = cm.getCursor()
-  let ranges = cm.listSelections()
+  const cursor = cm.getCursor()
+  const ranges = cm.listSelections()
   const linkEnd = '](https://)'
   const symbol = (isImage) ? '![' : '['
 
   for (let i = 0; i < ranges.length; i++) {
-    let range = ranges[i]
+    const range = ranges[i]
     if (!range.empty()) {
       const from = range.from()
       const to = range.to()
-      let anchorIndex = editor.indexFromPos(ranges[i].anchor)
-      let headIndex = editor.indexFromPos(ranges[i].head)
+      const anchorIndex = editor.indexFromPos(ranges[i].anchor)
+      const headIndex = editor.indexFromPos(ranges[i].head)
       let selection = cm.getRange(from, to)
       selection = symbol + selection + linkEnd
       cm.replaceRange(selection, from, to)
@@ -87,9 +87,9 @@ export function insertLink (cm, isImage) {
 }
 
 export function insertHeader (cm) {
-  let cursor = cm.getCursor()
-  let startOfLine = { line: cursor.line, ch: 0 }
-  let startOfLineText = cm.getRange(startOfLine, { line: cursor.line, ch: 1 })
+  const cursor = cm.getCursor()
+  const startOfLine = { line: cursor.line, ch: 0 }
+  const startOfLineText = cm.getRange(startOfLine, { line: cursor.line, ch: 1 })
   // See if it is already a header
   if (startOfLineText === '#') {
     cm.replaceRange('#', startOfLine, startOfLine)
@@ -100,11 +100,11 @@ export function insertHeader (cm) {
 }
 
 export function insertOnStartOfLines (cm, symbol) {
-  let cursor = cm.getCursor()
-  let ranges = cm.listSelections()
+  const cursor = cm.getCursor()
+  const ranges = cm.listSelections()
 
   for (let i = 0; i < ranges.length; i++) {
-    let range = ranges[i]
+    const range = ranges[i]
     if (!range.empty()) {
       const from = range.from()
       const to = range.to()
diff --git a/public/js/lib/syncscroll.js b/public/js/lib/syncscroll.js
index d492fbc9..f033d00d 100644
--- a/public/js/lib/syncscroll.js
+++ b/public/js/lib/syncscroll.js
@@ -155,12 +155,12 @@ const buildMap = _.throttle(buildMapInner, buildMapThrottle)
 // Optimizations are required only for big texts.
 function buildMapInner (callback) {
   if (!viewArea || !markdownArea) return
-  let i, offset, nonEmptyList, pos, a, b, _lineHeightMap, linesCount, acc, _scrollMap
+  let i, pos, a, b, acc
 
-  offset = viewArea.scrollTop() - viewArea.offset().top
-  _scrollMap = []
-  nonEmptyList = []
-  _lineHeightMap = []
+  const offset = viewArea.scrollTop() - viewArea.offset().top
+  const _scrollMap = []
+  const nonEmptyList = []
+  const _lineHeightMap = []
   viewTop = 0
   viewBottom = viewArea[0].scrollHeight - viewArea.height()
 
@@ -181,7 +181,7 @@ function buildMapInner (callback) {
     acc += Math.round(h / lineHeight)
   }
   _lineHeightMap.push(acc)
-  linesCount = acc
+  const linesCount = acc
 
   for (i = 0; i < linesCount; i++) {
     _scrollMap.push(-1)
@@ -290,11 +290,12 @@ export function syncScrollToEdit (event, preventAnimate) {
     posTo += Math.ceil(posToNextDiff)
   }
 
+  let duration = 0
   if (preventAnimate) {
     editArea.scrollTop(posTo)
   } else {
     const posDiff = Math.abs(scrollInfo.top - posTo)
-    var duration = posDiff / 50
+    duration = posDiff / 50
     duration = duration >= 100 ? duration : 100
     editArea.stop(true, true).animate({
       scrollTop: posTo
@@ -331,11 +332,11 @@ export function syncScrollToView (event, preventAnimate) {
   }
   if (viewScrolling) return
 
-  let lineNo, posTo
+  let posTo
   let topDiffPercent, posToNextDiff
   const scrollInfo = editor.getScrollInfo()
   const textHeight = editor.defaultTextHeight()
-  lineNo = Math.floor(scrollInfo.top / textHeight)
+  const lineNo = Math.floor(scrollInfo.top / textHeight)
   // if reach the last line, will start lerp to the bottom
   const diffToBottom = (scrollInfo.top + scrollInfo.clientHeight) - (scrollInfo.height - textHeight)
   if (scrollInfo.height > scrollInfo.clientHeight && diffToBottom > 0) {
@@ -350,11 +351,12 @@ export function syncScrollToView (event, preventAnimate) {
     posTo += Math.floor(posToNextDiff)
   }
 
+  let duration = 0
   if (preventAnimate) {
     viewArea.scrollTop(posTo)
   } else {
     const posDiff = Math.abs(viewArea.scrollTop() - posTo)
-    var duration = posDiff / 50
+    duration = posDiff / 50
     duration = duration >= 100 ? duration : 100
     viewArea.stop(true, true).animate({
       scrollTop: posTo
diff --git a/public/js/render.js b/public/js/render.js
index ebda2984..af6fb3d4 100644
--- a/public/js/render.js
+++ b/public/js/render.js
@@ -1,40 +1,40 @@
 /* eslint-env browser, jquery */
 // allow some attributes
 
-var filterXSS = require('xss')
+const filterXSS = require('xss')
 
-var whiteListAttr = ['id', 'class', 'style']
+const whiteListAttr = ['id', 'class', 'style']
 window.whiteListAttr = whiteListAttr
 // allow link starts with '.', '/' and custom protocol with '://', exclude link starts with javascript://
-var linkRegex = /^(?!javascript:\/\/)([\w|-]+:\/\/)|^([.|/])+/i
+const linkRegex = /^(?!javascript:\/\/)([\w|-]+:\/\/)|^([.|/])+/i
 // allow data uri, from https://gist.github.com/bgrins/6194623
-var dataUriRegex = /^\s*data:([a-z]+\/[a-z0-9-+.]+(;[a-z-]+=[a-z0-9-]+)?)?(;base64)?,([a-z0-9!$&',()*+;=\-._~:@/?%\s]*)\s*$/i
+const dataUriRegex = /^\s*data:([a-z]+\/[a-z0-9-+.]+(;[a-z-]+=[a-z0-9-]+)?)?(;base64)?,([a-z0-9!$&',()*+;=\-._~:@/?%\s]*)\s*$/i
 // custom white list
-var whiteList = filterXSS.whiteList
+const whiteList = filterXSS.whiteList
 // allow ol specify start number
-whiteList['ol'] = ['start']
+whiteList.ol = ['start']
 // allow li specify value number
-whiteList['li'] = ['value']
+whiteList.li = ['value']
 // allow style tag
-whiteList['style'] = []
+whiteList.style = []
 // allow kbd tag
-whiteList['kbd'] = []
+whiteList.kbd = []
 // allow ifram tag with some safe attributes
-whiteList['iframe'] = ['allowfullscreen', 'name', 'referrerpolicy', 'src', 'width', 'height']
+whiteList.iframe = ['allowfullscreen', 'name', 'referrerpolicy', 'src', 'width', 'height']
 // allow summary tag
-whiteList['summary'] = []
+whiteList.summary = []
 // allow ruby tag
-whiteList['ruby'] = []
+whiteList.ruby = []
 // allow rp tag for ruby
-whiteList['rp'] = []
+whiteList.rp = []
 // allow rt tag for ruby
-whiteList['rt'] = []
+whiteList.rt = []
 // allow figure tag
-whiteList['figure'] = []
+whiteList.figure = []
 // allow figcaption tag
-whiteList['figcaption'] = []
+whiteList.figcaption = []
 
-var filterXSSOptions = {
+const filterXSSOptions = {
   allowCommentTag: true,
   whiteList: whiteList,
   escapeHtml: function (html) {
diff --git a/public/js/reveal-markdown.js b/public/js/reveal-markdown.js
index c49bb9a2..89cd0887 100644
--- a/public/js/reveal-markdown.js
+++ b/public/js/reveal-markdown.js
@@ -17,28 +17,28 @@ import { md } from './extra'
     root.RevealMarkdown.initialize()
   }
 }(this, function () {
-  var DEFAULT_SLIDE_SEPARATOR = '^\r?\n---\r?\n$'
-  var DEFAULT_NOTES_SEPARATOR = '^note:'
-  var DEFAULT_ELEMENT_ATTRIBUTES_SEPARATOR = '\\.element\\s*?(.+?)$'
-  var DEFAULT_SLIDE_ATTRIBUTES_SEPARATOR = '\\.slide:\\s*?(\\S.+?)$'
+  const DEFAULT_SLIDE_SEPARATOR = '^\r?\n---\r?\n$'
+  const DEFAULT_NOTES_SEPARATOR = '^note:'
+  const DEFAULT_ELEMENT_ATTRIBUTES_SEPARATOR = '\\.element\\s*?(.+?)$'
+  const DEFAULT_SLIDE_ATTRIBUTES_SEPARATOR = '\\.slide:\\s*?(\\S.+?)$'
 
-  var SCRIPT_END_PLACEHOLDER = '__SCRIPT_END__'
+  const SCRIPT_END_PLACEHOLDER = '__SCRIPT_END__'
 
   /**
    * Retrieves the markdown contents of a slide section
    * element. Normalizes leading tabs/whitespace.
    */
   function getMarkdownFromSlide (section) {
-    var template = section.querySelector('script')
+    const template = section.querySelector('script')
 
     // strip leading whitespace so it isn't evaluated as code
-    var text = (template || section).textContent
+    let text = (template || section).textContent
 
     // restore script end tags
     text = text.replace(new RegExp(SCRIPT_END_PLACEHOLDER, 'g'), '</script>')
 
-    var leadingWs = text.match(/^\n?(\s*)/)[1].length
-    var leadingTabs = text.match(/^\n?(\t*)/)[1].length
+    const leadingWs = text.match(/^\n?(\s*)/)[1].length
+    const leadingTabs = text.match(/^\n?(\t*)/)[1].length
 
     if (leadingTabs > 0) {
       text = text.replace(new RegExp('\\n?\\t{' + leadingTabs + '}', 'g'), '\n')
@@ -56,12 +56,12 @@ import { md } from './extra'
    * to the output markdown slide.
    */
   function getForwardedAttributes (section) {
-    var attributes = section.attributes
-    var result = []
+    const attributes = section.attributes
+    const result = []
 
-    for (var i = 0, len = attributes.length; i < len; i++) {
-      var name = attributes[i].name
-      var value = attributes[i].value
+    for (let i = 0, len = attributes.length; i < len; i++) {
+      const name = attributes[i].name
+      const value = attributes[i].value
 
       // disregard attributes that are used for markdown loading/parsing
       if (/data-(markdown|separator|vertical|notes)/gi.test(name)) continue
@@ -95,7 +95,7 @@ import { md } from './extra'
   function createMarkdownSlide (content, options) {
     options = getSlidifyOptions(options)
 
-    var notesMatch = content.split(new RegExp(options.notesSeparator, 'mgi'))
+    const notesMatch = content.split(new RegExp(options.notesSeparator, 'mgi'))
 
     if (notesMatch.length === 2) {
       content = notesMatch[0] + '<aside class="notes" data-markdown>' + notesMatch[1].trim() + '</aside>'
@@ -115,15 +115,15 @@ import { md } from './extra'
   function slidify (markdown, options) {
     options = getSlidifyOptions(options)
 
-    var separatorRegex = new RegExp(options.separator + (options.verticalSeparator ? '|' + options.verticalSeparator : ''), 'mg')
-    var horizontalSeparatorRegex = new RegExp(options.separator)
+    const separatorRegex = new RegExp(options.separator + (options.verticalSeparator ? '|' + options.verticalSeparator : ''), 'mg')
+    const horizontalSeparatorRegex = new RegExp(options.separator)
 
-    var matches
-    var lastIndex = 0
-    var isHorizontal
-    var wasHorizontal = true
-    var content
-    var sectionStack = []
+    let matches
+    let lastIndex = 0
+    let isHorizontal
+    let wasHorizontal = true
+    let content
+    const sectionStack = []
 
     // iterate until all blocks between separators are stacked up
     while ((matches = separatorRegex.exec(markdown)) !== null) {
@@ -153,10 +153,10 @@ import { md } from './extra'
     // add the remaining slide
     (wasHorizontal ? sectionStack : sectionStack[sectionStack.length - 1]).push(markdown.substring(lastIndex))
 
-    var markdownSections = ''
+    let markdownSections = ''
 
     // flatten the hierarchical stack, and insert <section data-markdown> tags
-    for (var i = 0, len = sectionStack.length; i < len; i++) {
+    for (let i = 0, len = sectionStack.length; i < len; i++) {
       // vertical
       if (sectionStack[i] instanceof Array) {
         markdownSections += '<section ' + options.attributes + '>'
@@ -180,17 +180,17 @@ import { md } from './extra'
    * handles loading of external markdown.
    */
   function processSlides () {
-    var sections = document.querySelectorAll('[data-markdown]')
-    var section
+    const sections = document.querySelectorAll('[data-markdown]')
+    let section
 
-    for (var i = 0, len = sections.length; i < len; i++) {
+    for (let i = 0, len = sections.length; i < len; i++) {
       section = sections[i]
 
       if (section.getAttribute('data-markdown').length) {
-        var xhr = new XMLHttpRequest()
-        var url = section.getAttribute('data-markdown')
+        const xhr = new XMLHttpRequest()
+        const url = section.getAttribute('data-markdown')
 
-        var datacharset = section.getAttribute('data-charset')
+        const datacharset = section.getAttribute('data-charset')
 
         // see https://developer.mozilla.org/en-US/docs/Web/API/element.getAttribute#Notes
         if (datacharset !== null && datacharset !== '') {
@@ -247,18 +247,18 @@ import { md } from './extra'
    * http://stackoverflow.com/questions/5690269/disabling-chrome-cache-for-website-development/7000899#answer-11786277
    */
   function addAttributeInElement (node, elementTarget, separator) {
-    var mardownClassesInElementsRegex = new RegExp(separator, 'mg')
-    var mardownClassRegex = new RegExp('([^"= ]+?)="([^"=]+?)"', 'mg')
-    var nodeValue = node.nodeValue
-    var matches
-    var matchesClass
+    const mardownClassesInElementsRegex = new RegExp(separator, 'mg')
+    const mardownClassRegex = /([^"= ]+?)="([^"=]+?)"/mg
+    let nodeValue = node.nodeValue
+    let matches
+    let matchesClass
     if ((matches = mardownClassesInElementsRegex.exec(nodeValue))) {
-      var classes = matches[1]
+      const classes = matches[1]
       nodeValue = nodeValue.substring(0, matches.index) + nodeValue.substring(mardownClassesInElementsRegex.lastIndex)
       node.nodeValue = nodeValue
       while ((matchesClass = mardownClassRegex.exec(classes))) {
-        var name = matchesClass[1]
-        var value = matchesClass[2]
+        const name = matchesClass[1]
+        const value = matchesClass[2]
         if (name.substr(0, 5) === 'data-' || window.whiteListAttr.indexOf(name) !== -1) { elementTarget.setAttribute(name, escapeAttrValue(value)) }
       }
       return true
@@ -272,13 +272,13 @@ import { md } from './extra'
    */
   function addAttributes (section, element, previousElement, separatorElementAttributes, separatorSectionAttributes) {
     if (element != null && element.childNodes !== undefined && element.childNodes.length > 0) {
-      var previousParentElement = element
-      for (var i = 0; i < element.childNodes.length; i++) {
-        var childElement = element.childNodes[i]
+      let previousParentElement = element
+      for (let i = 0; i < element.childNodes.length; i++) {
+        const childElement = element.childNodes[i]
         if (i > 0) {
           let j = i - 1
           while (j >= 0) {
-            var aPreviousChildElement = element.childNodes[j]
+            const aPreviousChildElement = element.childNodes[j]
             if (typeof aPreviousChildElement.setAttribute === 'function' && aPreviousChildElement.tagName !== 'BR') {
               previousParentElement = aPreviousChildElement
               break
@@ -286,7 +286,7 @@ import { md } from './extra'
             j = j - 1
           }
         }
-        var parentSection = section
+        let parentSection = section
         if (childElement.nodeName === 'section') {
           parentSection = childElement
           previousParentElement = childElement
@@ -309,21 +309,21 @@ import { md } from './extra'
    * DOM to HTML.
    */
   function convertSlides () {
-    var sections = document.querySelectorAll('[data-markdown]')
+    const sections = document.querySelectorAll('[data-markdown]')
 
-    for (var i = 0, len = sections.length; i < len; i++) {
-      var section = sections[i]
+    for (let i = 0, len = sections.length; i < len; i++) {
+      const section = sections[i]
 
       // Only parse the same slide once
       if (!section.getAttribute('data-markdown-parsed')) {
         section.setAttribute('data-markdown-parsed', true)
 
-        var notes = section.querySelector('aside.notes')
-        var markdown = getMarkdownFromSlide(section)
+        const notes = section.querySelector('aside.notes')
+        let markdown = getMarkdownFromSlide(section)
         markdown = markdown.replace(/&lt;/g, '<').replace(/&gt;/g, '>')
-        var rendered = md.render(markdown)
+        let rendered = md.render(markdown)
         rendered = preventXSS(rendered)
-        var result = window.postProcess(rendered)
+        const result = window.postProcess(rendered)
         section.innerHTML = result[0].outerHTML
         addAttributes(section, section, null, section.getAttribute('data-element-attributes') ||
         section.parentNode.getAttribute('data-element-attributes') ||
diff --git a/public/js/slide.js b/public/js/slide.js
index b8374cbb..5a28993f 100644
--- a/public/js/slide.js
+++ b/public/js/slide.js
@@ -26,7 +26,7 @@ function extend () {
 
   for (const source of arguments) {
     for (const key in source) {
-      if (source.hasOwnProperty(key)) {
+      if (Object.prototype.hasOwnProperty.call(source, key)) {
         target[key] = source[key]
       }
     }
@@ -36,18 +36,21 @@ function extend () {
 }
 
 // Optional libraries used to extend on reveal.js
-const deps = [{
-  src: `${serverurl}/build/reveal.js/lib/js/classList.js`,
-  condition () {
-    return !document.body.classList
-  }
-}, {
-  src: `${serverurl}/build/reveal.js/plugin/notes/notes.js`,
-  async: true,
-  condition () {
-    return !!document.body.classList
+const deps = [
+  {
+    src: `${serverurl}/build/reveal.js/lib/js/classList.js`,
+    condition () {
+      return !document.body.classList
+    }
+  },
+  {
+    src: `${serverurl}/build/reveal.js/plugin/notes/notes.js`,
+    async: true,
+    condition () {
+      return !!document.body.classList
+    }
   }
-}]
+]
 
 const slideOptions = {
   separator: '^(\r\n?|\n)---(\r\n?|\n)$',
@@ -73,60 +76,64 @@ const defaultOptions = {
 // options from yaml meta
 const meta = JSON.parse($('#meta').text())
 const metaSlideOptions = !!meta && !!meta.slideOptions ? meta.slideOptions : {}
-var options = {
-  autoPlayMedia: metaSlideOptions.autoPlayMedia,
-  autoSlide: metaSlideOptions.autoSlide,
-  autoSlideStoppable: metaSlideOptions.autoSlideStoppable,
-  backgroundTransition: metaSlideOptions.backgroundTransition,
-  center: metaSlideOptions.center,
-  controls: metaSlideOptions.controls,
-  controlsBackArrows: metaSlideOptions.controlsBackArrows,
-  controlsLayout: metaSlideOptions.controlsLayout,
-  controlsTutorial: metaSlideOptions.controlsTutorial,
-  defaultTiming: metaSlideOptions.defaultTiming,
-  display: metaSlideOptions.display,
-  embedded: metaSlideOptions.embedded,
-  fragmentInURL: metaSlideOptions.fragmentInURL,
-  fragments: metaSlideOptions.fragments,
-  hash: metaSlideOptions.hash,
-  height: metaSlideOptions.height,
-  help: metaSlideOptions.help,
-  hideAddressBar: metaSlideOptions.hideAddressBar,
-  hideCursorTime: metaSlideOptions.hideCursorTime,
-  hideInactiveCursor: metaSlideOptions.hideInactiveCursor,
-  history: metaSlideOptions.history,
-  keyboard: metaSlideOptions.keyboard,
-  loop: metaSlideOptions.loop,
-  margin: metaSlideOptions.margin,
-  maxScale: metaSlideOptions.maxScale,
-  minScale: metaSlideOptions.minScale,
-  minimumTimePerSlide: metaSlideOptions.minimumTimePerSlide,
-  mobileViewDistance: metaSlideOptions.mobileViewDistance,
-  mouseWheel: metaSlideOptions.mouseWheel,
-  navigationMode: metaSlideOptions.navigationMode,
-  overview: metaSlideOptions.overview,
-  parallaxBackgroundHorizontal: metaSlideOptions.parallaxBackgroundHorizontal,
-  parallaxBackgroundImage: metaSlideOptions.parallaxBackgroundImage,
-  parallaxBackgroundSize: metaSlideOptions.parallaxBackgroundSize,
-  parallaxBackgroundVertical: metaSlideOptions.parallaxBackgroundVertical,
-  preloadIframes: metaSlideOptions.preloadIframes,
-  previewLinks: metaSlideOptions.previewLinks,
-  progress: metaSlideOptions.progress,
-  rtl: metaSlideOptions.rtl,
-  showNotes: metaSlideOptions.showNotes,
-  shuffle: metaSlideOptions.shuffle,
-  slideNumber: metaSlideOptions.slideNumber,
-  theme: metaSlideOptions.theme,
-  totalTime: metaSlideOptions.totalTime,
-  touch: metaSlideOptions.touch,
-  transition: metaSlideOptions.transition,
-  transitionSpeed: metaSlideOptions.transitionSpeed,
-  viewDistance: metaSlideOptions.viewDistance,
-  width: metaSlideOptions.width
-} || {}
+let options =
+  {
+    autoPlayMedia: metaSlideOptions.autoPlayMedia,
+    autoSlide: metaSlideOptions.autoSlide,
+    autoSlideStoppable: metaSlideOptions.autoSlideStoppable,
+    backgroundTransition: metaSlideOptions.backgroundTransition,
+    center: metaSlideOptions.center,
+    controls: metaSlideOptions.controls,
+    controlsBackArrows: metaSlideOptions.controlsBackArrows,
+    controlsLayout: metaSlideOptions.controlsLayout,
+    controlsTutorial: metaSlideOptions.controlsTutorial,
+    defaultTiming: metaSlideOptions.defaultTiming,
+    display: metaSlideOptions.display,
+    embedded: metaSlideOptions.embedded,
+    fragmentInURL: metaSlideOptions.fragmentInURL,
+    fragments: metaSlideOptions.fragments,
+    hash: metaSlideOptions.hash,
+    height: metaSlideOptions.height,
+    help: metaSlideOptions.help,
+    hideAddressBar: metaSlideOptions.hideAddressBar,
+    hideCursorTime: metaSlideOptions.hideCursorTime,
+    hideInactiveCursor: metaSlideOptions.hideInactiveCursor,
+    history: metaSlideOptions.history,
+    keyboard: metaSlideOptions.keyboard,
+    loop: metaSlideOptions.loop,
+    margin: metaSlideOptions.margin,
+    maxScale: metaSlideOptions.maxScale,
+    minScale: metaSlideOptions.minScale,
+    minimumTimePerSlide: metaSlideOptions.minimumTimePerSlide,
+    mobileViewDistance: metaSlideOptions.mobileViewDistance,
+    mouseWheel: metaSlideOptions.mouseWheel,
+    navigationMode: metaSlideOptions.navigationMode,
+    overview: metaSlideOptions.overview,
+    parallaxBackgroundHorizontal: metaSlideOptions.parallaxBackgroundHorizontal,
+    parallaxBackgroundImage: metaSlideOptions.parallaxBackgroundImage,
+    parallaxBackgroundSize: metaSlideOptions.parallaxBackgroundSize,
+    parallaxBackgroundVertical: metaSlideOptions.parallaxBackgroundVertical,
+    preloadIframes: metaSlideOptions.preloadIframes,
+    previewLinks: metaSlideOptions.previewLinks,
+    progress: metaSlideOptions.progress,
+    rtl: metaSlideOptions.rtl,
+    showNotes: metaSlideOptions.showNotes,
+    shuffle: metaSlideOptions.shuffle,
+    slideNumber: metaSlideOptions.slideNumber,
+    theme: metaSlideOptions.theme,
+    totalTime: metaSlideOptions.totalTime,
+    touch: metaSlideOptions.touch,
+    transition: metaSlideOptions.transition,
+    transitionSpeed: metaSlideOptions.transitionSpeed,
+    viewDistance: metaSlideOptions.viewDistance,
+    width: metaSlideOptions.width
+  } || {}
 
 for (const key in options) {
-  if (options.hasOwnProperty(key) && options[key] === undefined) {
+  if (
+    Object.prototype.hasOwnProperty.call(options, key) &&
+    options[key] === undefined
+  ) {
     delete options[key]
   }
 }
@@ -165,14 +172,14 @@ window.viewAjaxCallback = () => {
 function renderSlide (event) {
   if (window.location.search.match(/print-pdf/gi)) {
     const slides = $('.slides')
-    let title = document.title
+    const title = document.title
     finishView(slides)
     document.title = title
     Reveal.layout()
   } else {
     const markdown = $(event.currentSlide)
     if (!markdown.attr('data-rendered')) {
-      let title = document.title
+      const title = document.title
       finishView(markdown)
       markdown.attr('data-rendered', 'true')
       document.title = title
@@ -181,7 +188,7 @@ function renderSlide (event) {
   }
 }
 
-Reveal.addEventListener('ready', event => {
+Reveal.addEventListener('ready', (event) => {
   renderSlide(event)
   const markdown = $(event.currentSlide)
   // force browser redraw
diff --git a/public/js/utils.js b/public/js/utils.js
index 91e7f133..d42a18e7 100644
--- a/public/js/utils.js
+++ b/public/js/utils.js
@@ -1,9 +1,9 @@
 import base64url from 'base64url'
 
-let uuidRegex = /^[0-9a-f]{8}-[0-9a-f]{4}-[1-5][0-9a-f]{3}-[89ab][0-9a-f]{3}-[0-9a-f]{12}$/i
+const uuidRegex = /^[0-9a-f]{8}-[0-9a-f]{4}-[1-5][0-9a-f]{3}-[89ab][0-9a-f]{3}-[0-9a-f]{12}$/i
 
 export function checkNoteIdValid (id) {
-  let result = id.match(uuidRegex)
+  const result = id.match(uuidRegex)
   if (result && result.length === 1) {
     return true
   } else {
@@ -13,16 +13,16 @@ export function checkNoteIdValid (id) {
 
 export function encodeNoteId (id) {
   // remove dashes in UUID and encode in url-safe base64
-  let str = id.replace(/-/g, '')
-  let hexStr = Buffer.from(str, 'hex')
+  const str = id.replace(/-/g, '')
+  const hexStr = Buffer.from(str, 'hex')
   return base64url.encode(hexStr)
 }
 
 export function decodeNoteId (encodedId) {
   // decode from url-safe base64
-  let id = base64url.toBuffer(encodedId).toString('hex')
+  const id = base64url.toBuffer(encodedId).toString('hex')
   // add dashes between the UUID string parts
-  let idParts = []
+  const idParts = []
   idParts.push(id.substr(0, 8))
   idParts.push(id.substr(8, 4))
   idParts.push(id.substr(12, 4))