Fuse-box client scripts integration + deps update

client/index.js

@@ -8,8 +8,6 @@ switch (logic) {
     require('./js/login.js')
     break
   default:
-    require('./node_modules/highlight.js/styles/tomorrow.css')
-    require('./node_modules/simplemde/dist/simplemde.min.css')
     require('./scss/app.scss')
     require('./js/app.js')
     break

client/js/app.js

@@ -2,14 +2,14 @@
 
 /* global alertsData */
 
-import jQuery from 'jquery'
+import $ from 'jquery'
 import _ from 'lodash'
-import Sticky from 'sticky-js'
 import io from 'socket.io-client'
 import Alerts from './components/alerts.js'
-/* eslint-disable spaced-comment */
+import 'jquery-smooth-scroll'
+import Sticky from 'sticky-js'
 
-jQuery(document).ready(function ($) {
+$(() => {
   // ====================================
   // Scroll
   // ====================================
@@ -45,24 +45,17 @@ jQuery(document).ready(function ($) {
   // Establish WebSocket connection
   // ====================================
 
-  var socket = io(window.location.origin) // eslint-disable-line no-unused-vars
+  var socket = io(window.location.origin)
 
-  //=include components/search.js
+  require('./components/search.js')(socket)
 
   // ====================================
   // Pages logic
   // ====================================
 
-  //=include pages/view.js
+  require('./pages/view.js')(alerts)
-  //=include pages/create.js
+  // require('./pages/create.js')
-  //=include pages/edit.js
+  require('./pages/edit.js')(alerts, socket)
-  //=include pages/source.js
+  require('./pages/source.js')(alerts)
-  //=include pages/admin.js
+  require('./pages/admin.js')(alerts)
 })
-
-//=include helpers/form.js
-//=include helpers/pages.js
-
-//=include components/alerts.js
-
-/* eslint-enable spaced-comment */

client/js/components/editor-codeblock.js

@@ -1,6 +1,12 @@
-/* global $, Vue, ace, mde, _ */
+'use strict'
+
+import $ from 'jquery'
+import Vue from 'vue'
+import _ from 'lodash'
+import * as ace from 'brace'
+import 'brace/theme/tomorrow_night'
+import 'brace/mode/markdown'
 
-let modelist = ace.require('ace/ext/modelist')
 let codeEditor = null
 
 // ACE - Mode Loader
@@ -24,6 +30,8 @@ let loadAceMode = (m) => {
 
 // Vue Code Block instance
 
+module.exports = (mde, mdeModalOpenState) => {
+  let modelist = {} // ace.require('ace/ext/modelist')
   let vueCodeBlock = new Vue({
     el: '#modal-editor-codeblock',
     data: {
@@ -73,3 +81,5 @@ let vueCodeBlock = new Vue({
       }
     }
   })
+  return vueCodeBlock
+}

client/js/components/editor-file.js

@@ -1,5 +1,12 @@
-/* global $, Vue, _, alerts, mde, socket */
+'use strict'
 
+import $ from 'jquery'
+import Vue from 'vue'
+import _ from 'lodash'
+import 'jquery-contextmenu'
+import 'jquery-simple-upload'
+
+module.exports = (alerts, mde, mdeModalOpenState, socket) => {
   let vueFile = new Vue({
     el: '#modal-editor-file',
     data: {
@@ -350,3 +357,5 @@ $('#btn-editor-file-upload input').on('change', (ev) => {
 
     })
   })
+  return vueFile
+}

client/js/components/editor-image.js

@@ -1,5 +1,12 @@
-/* global $, Vue, mde, _, alerts, socket */
+'use strict'
 
+import $ from 'jquery'
+import Vue from 'vue'
+import _ from 'lodash'
+import 'jquery-contextmenu'
+import 'jquery-simple-upload'
+
+module.exports = (alerts, mde, mdeModalOpenState, socket) => {
   let vueImage = new Vue({
     el: '#modal-editor-image',
     data: {
@@ -27,12 +34,12 @@ let vueImage = new Vue({
     methods: {
 
       open: () => {
-      mdeModalOpenState = true // eslint-disable-line no-undef
+        mdeModalOpenState = true
         $('#modal-editor-image').addClass('is-active')
         vueImage.refreshFolders()
       },
       cancel: (ev) => {
-      mdeModalOpenState = false // eslint-disable-line no-undef
+        mdeModalOpenState = false
         $('#modal-editor-image').removeClass('is-active')
       },
 
@@ -395,3 +402,5 @@ $('#btn-editor-image-upload input').on('change', (ev) => {
 
     })
   })
+  return vueImage
+}

client/js/components/editor-video.js

@@ -1,4 +1,8 @@
-/* global $, Vue, mde, _ */
+'use strict'
+
+import $ from 'jquery'
+import Vue from 'vue'
+import _ from 'lodash'
 
 const videoRules = {
   'youtube': new RegExp(/(?:(?:youtu\.be\/|v\/|vi\/|u\/\w\/|embed\/)|(?:(?:watch)?\?v(?:i)?=|&v(?:i)?=))([^#&?]*).*/, 'i'),
@@ -6,6 +10,7 @@ const videoRules = {
   'dailymotion': new RegExp(/(?:dailymotion\.com(?:\/embed)?(?:\/video|\/hub)|dai\.ly)\/([0-9a-z]+)(?:[-_0-9a-zA-Z]+(?:#video=)?([a-z0-9]+)?)?/, 'i')
 }
 
+module.exports = (mde, mdeModalOpenState) => {
   // Vue Video instance
 
   let vueVideo = new Vue({
@@ -46,3 +51,5 @@ let vueVideo = new Vue({
       }
     }
   })
+  return vueVideo
+}

client/js/components/editor.js

@@ -1,27 +1,29 @@
 'use strict'
 
-/* global $, Vue, _, filesize, SimpleMDE, alerts, vueImage, vueFile, vueVideo, vueCodeBlock */
+import $ from 'jquery'
+import Vue from 'vue'
+import _ from 'lodash'
+import filesize from 'filesize.js'
+import SimpleMDE from 'simplemde'
 
 // ====================================
 // Markdown Editor
 // ====================================
 
+module.exports = (alerts, pageEntryPath, socket) => {
   if ($('#mk-editor').length === 1) {
-  let mdeModalOpenState = false
-  let mdeCurrentEditor = null // eslint-disable-line no-unused-vars
-
     Vue.filter('filesize', (v) => {
       return _.toUpper(filesize(v))
     })
 
-  /* eslint-disable spaced-comment */
+    let mde
-  //=include editor-image.js
+    let mdeModalOpenState = false
-  //=include editor-file.js
+    let vueImage = require('./editor-image.js')(alerts, mde, mdeModalOpenState, socket)
-  //=include editor-video.js
+    let vueFile = require('./editor-file.js')(alerts, mde, mdeModalOpenState, socket)
-  //=include editor-codeblock.js
+    let vueVideo = require('./editor-video.js')(mde, mdeModalOpenState)
-  /* eslint-enable spaced-comment */
+    let vueCodeBlock = require('./editor-codeblock.js')(mde, mdeModalOpenState)
 
-  var mde = new SimpleMDE({
+    mde = new SimpleMDE({
       autofocus: true,
       autoDownloadFontAwesome: false,
       element: $('#mk-editor').get(0),
@@ -218,3 +220,4 @@ if ($('#mk-editor').length === 1) {
       }
     })
   }
+}

client/js/components/search.js

@@ -1,7 +1,10 @@
 'use strict'
 
-/* global $, Vue, _, socket */
+import $ from 'jquery'
+import _ from 'lodash'
+import Vue from 'vue'
 
+module.exports = (socket) => {
   if ($('#search-input').length) {
     $('#search-input').focus()
 
@@ -81,3 +84,4 @@ if ($('#search-input').length) {
 
     $('main').on('click', vueHeader.closeSearch)
   }
+}

client/js/helpers/form.js

@@ -1,6 +1,13 @@
-/* eslint-disable no-unused-vars */
+'use strict'
 
-function setInputSelection (input, startPos, endPos) {
+module.exports = {
+  /**
+   * Set Input Selection
+   * @param {DOMElement} input The input element
+   * @param {number} startPos The starting position
+   * @param {nunber} endPos The ending position
+   */
+  setInputSelection: (input, startPos, endPos) => {
     input.focus()
     if (typeof input.selectionStart !== 'undefined') {
       input.selectionStart = startPos
@@ -15,5 +22,4 @@ function setInputSelection (input, startPos, endPos) {
       range.select()
     }
   }
-
+}
-/* eslint-enable no-unused-vars */

client/js/helpers/pages.js

@@ -1,7 +1,14 @@
-/* global _ */
+'use strict'
-/* eslint-disable no-unused-vars */
 
-function makeSafePath (rawPath) {
+import _ from 'lodash'
+
+module.exports = {
+  /**
+   * Convert raw path to safe path
+   * @param {string} rawPath Raw path
+   * @returns {string} Safe path
+   */
+  makeSafePath: (rawPath) => {
     let rawParts = _.split(_.trim(rawPath), '/')
     rawParts = _.map(rawParts, (r) => {
       return _.kebabCase(_.deburr(_.trim(r)))
@@ -9,5 +16,4 @@ function makeSafePath (rawPath) {
 
     return _.join(_.filter(rawParts, (r) => { return !_.isEmpty(r) }), '/')
   }
-
+}
-/* eslint-enable no-unused-vars */

client/js/modals/admin-users-create.js

@@ -1,7 +1,11 @@
-/* global $, Vue, alerts */
+'use strict'
+
+import $ from 'jquery'
+import Vue from 'vue'
 
 // Vue Create User instance
 
+module.exports = (alerts) => {
   let vueCreateUser = new Vue({
     el: '#modal-admin-users-create',
     data: {
@@ -49,3 +53,4 @@ let vueCreateUser = new Vue({
   })
 
   $('.btn-create-prompt').on('click', vueCreateUser.open)
+}

client/js/modals/admin-users-delete.js

@@ -1,7 +1,15 @@
-/* global $, Vue, usrData, alerts */
+'use strict'
+
+/* global usrData */
+
+'use strict'
+
+import $ from 'jquery'
+import Vue from 'vue'
 
 // Vue Delete User instance
 
+module.exports = (alerts) => {
   let vueDeleteUser = new Vue({
     el: '#modal-admin-users-delete',
     data: {
@@ -32,3 +40,4 @@ let vueDeleteUser = new Vue({
   })
 
   $('.btn-deluser-prompt').on('click', vueDeleteUser.open)
+}

client/js/modals/create.js

@@ -1,13 +1,19 @@
-/* global $, _, currentBasePath */
+'use strict'
+
+import $ from 'jquery'
+import _ from 'lodash'
+import { setInputSelection } from '../helpers/form'
+import { makeSafePath } from '../helpers/pages'
 
 // -> Create New Document
 
+module.exports = (currentBasePath) => {
   let suggestedCreatePath = currentBasePath + '/new-page'
 
   $('.btn-create-prompt').on('click', (ev) => {
     $('#txt-create-prompt').val(suggestedCreatePath)
     $('#modal-create-prompt').toggleClass('is-active')
-  setInputSelection($('#txt-create-prompt').get(0), currentBasePath.length + 1, suggestedCreatePath.length) // eslint-disable-line no-undef
+    setInputSelection($('#txt-create-prompt').get(0), currentBasePath.length + 1, suggestedCreatePath.length)
     $('#txt-create-prompt').removeClass('is-danger').next().addClass('is-hidden')
   })
 
@@ -18,7 +24,7 @@ $('#txt-create-prompt').on('keypress', (ev) => {
   })
 
   $('.btn-create-go').on('click', (ev) => {
-  let newDocPath = makeSafePath($('#txt-create-prompt').val()) // eslint-disable-line no-undef
+    let newDocPath = makeSafePath($('#txt-create-prompt').val())
     if (_.isEmpty(newDocPath)) {
       $('#txt-create-prompt').addClass('is-danger').next().removeClass('is-hidden')
     } else {
@@ -26,3 +32,4 @@ $('.btn-create-go').on('click', (ev) => {
       window.location.assign('/create/' + newDocPath)
     }
   })
+}

client/js/modals/move.js

@@ -1,7 +1,13 @@
-/* global $, _, alerts, currentBasePath */
+'use strict'
+
+import $ from 'jquery'
+import _ from 'lodash'
+import { makeSafePath } from '../helpers/form'
+import { setInputSelection } from '../helpers/pages'
 
 // -> Move Existing Document
 
+module.exports = (currentBasePath, alerts) => {
   if (currentBasePath !== '') {
     $('.btn-move-prompt').removeClass('is-hidden')
   }
@@ -11,7 +17,7 @@ let moveInitialDocument = _.lastIndexOf(currentBasePath, '/') + 1
   $('.btn-move-prompt').on('click', (ev) => {
     $('#txt-move-prompt').val(currentBasePath)
     $('#modal-move-prompt').toggleClass('is-active')
-  setInputSelection($('#txt-move-prompt').get(0), moveInitialDocument, currentBasePath.length) // eslint-disable-line no-undef
+    setInputSelection($('#txt-move-prompt').get(0), moveInitialDocument, currentBasePath.length)
     $('#txt-move-prompt').removeClass('is-danger').next().addClass('is-hidden')
   })
 
@@ -22,7 +28,7 @@ $('#txt-move-prompt').on('keypress', (ev) => {
   })
 
   $('.btn-move-go').on('click', (ev) => {
-  let newDocPath = makeSafePath($('#txt-move-prompt').val()) // eslint-disable-line no-undef
+    let newDocPath = makeSafePath($('#txt-move-prompt').val())
     if (_.isEmpty(newDocPath) || newDocPath === currentBasePath || newDocPath === 'home') {
       $('#txt-move-prompt').addClass('is-danger').next().removeClass('is-hidden')
     } else {
@@ -45,3 +51,4 @@ $('.btn-move-go').on('click', (ev) => {
       })
     }
   })
+}

client/js/pages/admin.js

@@ -1,5 +1,12 @@
-/* global $, Vue, alerts, _, usrData, usrDataName */
+'use strict'
 
+/* global usrData, usrDataName */
+
+import $ from 'jquery'
+import _ from 'lodash'
+import Vue from 'vue'
+
+module.exports = (alerts) => {
   if ($('#page-type-admin-profile').length) {
     let vueProfile = new Vue({
       el: '#page-type-admin-profile',
@@ -29,11 +36,7 @@ if ($('#page-type-admin-profile').length) {
       }
     })
   } else if ($('#page-type-admin-users').length) {
-
+    require('../modals/admin-users-create.js')(alerts)
-  /* eslint-disable spaced-comment */
-  //=include ../modals/admin-users-create.js
-  /* eslint-enable spaced-comment */
-
   } else if ($('#page-type-admin-users-edit').length) {
     let vueEditUser = new Vue({
       el: '#page-type-admin-users-edit',
@@ -94,10 +97,7 @@ if ($('#page-type-admin-profile').length) {
         }
       }
     })
-
+    require('../modals/admin-users-delete.js')(alerts)
-  /* eslint-disable spaced-comment */
-  //=include ../modals/admin-users-delete.js
-  /* eslint-enable spaced-comment */
   } else if ($('#page-type-admin-settings').length) {
     let vueSettings = new Vue({ // eslint-disable-line no-unused-vars
       el: '#page-type-admin-settings',
@@ -146,3 +146,4 @@ if ($('#page-type-admin-profile').length) {
       }
     })
   }
+}

client/js/pages/edit.js

@@ -1,7 +1,10 @@
-/* global $ */
+'use strict'
 
+import $ from 'jquery'
+
+module.exports = (alerts, socket) => {
   if ($('#page-type-edit').length) {
-  let pageEntryPath = $('#page-type-edit').data('entrypath') // eslint-disable-line no-unused-vars
+    let pageEntryPath = $('#page-type-edit').data('entrypath')
     // let pageCleanExit = false
 
     // -> Discard
@@ -14,7 +17,6 @@ if ($('#page-type-edit').length) {
     //   return (pageCleanExit) ? true : 'Unsaved modifications will be lost. Are you sure you want to navigate away from this page?'
     // }
 
-  /* eslint-disable spaced-comment */
+    require('../components/editor.js')(alerts, pageEntryPath, socket)
-  //=include ../components/editor.js
+  }
-  /* eslint-enable spaced-comment */
 }

client/js/pages/source.js

@@ -1,5 +1,11 @@
-/* global $, ace */
+'use strict'
 
+import $ from 'jquery'
+import * as ace from 'brace'
+import 'brace/theme/tomorrow_night'
+import 'brace/mode/markdown'
+
+module.exports = (alerts) => {
   if ($('#page-type-source').length) {
     var scEditor = ace.edit('source-display')
     scEditor.setTheme('ace/theme/tomorrow_night')
@@ -10,10 +16,9 @@ if ($('#page-type-source').length) {
     scEditor.setReadOnly(true)
     scEditor.renderer.updateFull()
 
-  let currentBasePath = ($('#page-type-source').data('entrypath') !== 'home') ? $('#page-type-source').data('entrypath') : '' // eslint-disable-line no-unused-vars
+    let currentBasePath = ($('#page-type-source').data('entrypath') !== 'home') ? $('#page-type-source').data('entrypath') : ''
 
-  /* eslint-disable spaced-comment */
+    require('../modals/create.js')(currentBasePath)
-  //=include ../modals/create.js
+    require('../modals/move.js')(currentBasePath, alerts)
-  //=include ../modals/move.js
+  }
-  /* eslint-enable spaced-comment */
 }

client/js/pages/view.js

@@ -1,10 +1,12 @@
-/* global $ */
+'use strict'
 
+import $ from 'jquery'
+
+module.exports = (alerts) => {
   if ($('#page-type-view').length) {
-  let currentBasePath = ($('#page-type-view').data('entrypath') !== 'home') ? $('#page-type-view').data('entrypath') : '' // eslint-disable-line no-unused-vars
+    let currentBasePath = ($('#page-type-view').data('entrypath') !== 'home') ? $('#page-type-view').data('entrypath') : ''
 
-  /* eslint-disable spaced-comment */
+    require('../modals/create.js')(currentBasePath)
-  //=include ../modals/create.js
+    require('../modals/move.js')(currentBasePath, alerts)
-  //=include ../modals/move.js
+  }
-  /* eslint-enable spaced-comment */
 }

client/scss/app.scss

@@ -19,6 +19,8 @@ $primary: 'indigo';
 
 @import './libs/twemoji-awesome';
 @import './libs/jquery-contextmenu';
+@import 'node_modules/highlight.js/styles/tomorrow';
+@import 'node_modules/simplemde/dist/simplemde.min';
 
 @import './components/_editor';
 

fuse.js

@@ -27,6 +27,21 @@ const args = require('yargs')
     .alias('h', 'help')
     .argv
 
+// Define aliases
+
+const ALIASES = {
+  'ace': 'ace-builds/src-min-noconflict/ace.js',
+  'simplemde': 'simplemde/dist/simplemde.min.js',
+  'socket.io-client': 'socket.io-client/dist/socket.io.min.js',
+  'vue': 'vue/dist/vue.js'
+}
+const SHIMS = {
+  jquery: {
+    source: 'node_modules/jquery/dist/jquery.js',
+    exports: '$'
+  }
+}
+
 if (args.d) {
   // =============================================
   // DEVELOPER MODE
@@ -41,9 +56,8 @@ if (args.d) {
   const fuse = fsbx.FuseBox.init({
     homeDir: './client',
     outFile: './assets/js/bundle.min.js',
-    alias: {
+    alias: ALIASES,
-      vue: 'vue/dist/vue.js'
+    shim: SHIMS,
-    },
     plugins: [
       [ fsbx.SassPlugin({ includePaths: ['../core'] }), fsbx.CSSPlugin() ],
       fsbx.BabelPlugin({ comments: false, presets: ['es2015'] }),
@@ -55,7 +69,8 @@ if (args.d) {
 
   fuse.devServer('>index.js', {
     port: 4444,
-    httpServer: false
+    httpServer: false,
+    hmr: false
   })
 
   // Server
@@ -80,7 +95,7 @@ if (args.d) {
   }, 1000)
 } else if (args.c) {
   // =============================================
-  // DEVELOPER MODE
+  // CONFIGURE - DEVELOPER MODE
   // =============================================
 
   console.info(colors.bgWhite.black(' Starting Fuse in CONFIGURE DEVELOPER mode... '))
@@ -92,9 +107,8 @@ if (args.d) {
   const fuse = fsbx.FuseBox.init({
     homeDir: './client',
     outFile: './assets/js/configure.min.js',
-    alias: {
+    alias: ALIASES,
-      vue: 'vue/dist/vue.js'
+    shim: SHIMS,
-    },
     plugins: [
       [ fsbx.SassPlugin({ includePaths: ['../core'] }), fsbx.CSSPlugin() ],
       fsbx.BabelPlugin({ comments: false, presets: ['es2015'] }),
@@ -131,9 +145,8 @@ if (args.d) {
 
   const fuse = fsbx.FuseBox.init({
     homeDir: './client',
-    alias: {
+    alias: ALIASES,
-      vue: 'vue/dist/vue.js'
+    shim: SHIMS,
-    },
     plugins: [
       [ fsbx.SassPlugin({ outputStyle: 'compressed', includePaths: ['./node_modules/requarks-core'] }), fsbx.CSSPlugin() ],
       fsbx.BabelPlugin({

package.json

@@ -43,13 +43,13 @@
   },
   "dependencies": {
     "auto-load": "^2.1.0",
-    "axios": "^0.15.3",
+    "axios": "^0.16.0",
     "bcryptjs-then": "^1.0.1",
     "bluebird": "^3.4.7",
     "body-parser": "^1.17.1",
     "bunyan": "^1.8.9",
     "cheerio": "^0.22.0",
-    "child-process-promise": "^2.2.0",
+    "child-process-promise": "^2.2.1",
     "chokidar": "^1.6.0",
     "commander": "^2.9.0",
     "compression": "^1.6.2",
@@ -61,7 +61,7 @@
     "express": "^4.15.2",
     "express-brute": "^1.0.0",
     "express-brute-mongoose": "0.0.7",
-    "express-session": "^1.15.1",
+    "express-session": "^1.15.2",
     "file-type": "^4.0.0",
     "filesize.js": "^1.0.2",
     "follow-redirects": "^1.2.3",
@@ -85,19 +85,19 @@
     "markdown-it-expand-tabs": "^1.0.11",
     "markdown-it-external-links": "0.0.6",
     "markdown-it-footnote": "^3.0.1",
-    "markdown-it-task-lists": "^1.4.1",
+    "markdown-it-task-lists": "^2.0.0",
     "memdown": "^1.2.4",
     "mime-types": "^2.1.15",
     "moment": "^2.18.1",
     "moment-timezone": "^0.5.11",
     "mongodb": "^2.2.25",
-    "mongoose": "^4.9.1",
+    "mongoose": "^4.9.2",
     "multer": "^1.2.1",
     "ora": "^1.2.0",
     "passport": "^0.3.2",
     "passport-local": "^1.0.0",
     "passport.socketio": "^3.7.0",
-    "pm2": "^2.4.2",
+    "pm2": "^2.4.3",
     "pug": "^2.0.0-beta11",
     "read-chunk": "^2.0.0",
     "remove-markdown": "^0.1.0",
@@ -119,33 +119,33 @@
     "winston": "^2.3.0"
   },
   "devDependencies": {
-    "ace-builds": "^1.2.6",
     "babel-cli": "^6.24.0",
     "babel-jest": "^19.0.0",
     "babel-preset-es2015": "^6.24.0",
+    "brace": "^0.10.0",
     "colors": "^1.1.2",
-    "eslint": "^3.18.0",
+    "eslint": "^3.19.0",
     "eslint-config-standard": "^7.1.0",
     "eslint-plugin-import": "^2.2.0",
-    "eslint-plugin-node": "^4.2.1",
+    "eslint-plugin-node": "^4.2.2",
     "eslint-plugin-promise": "^3.5.0",
     "eslint-plugin-standard": "^2.1.1",
-    "fuse-box": "^1.3.128",
+    "fuse-box": "^1.3.129",
     "jest": "^19.0.2",
     "jquery": "^3.2.1",
     "jquery-contextmenu": "^2.4.4",
     "jquery-simple-upload": "^1.0.0",
     "jquery-smooth-scroll": "^2.0.0",
-    "node-sass": "^4.5.1",
+    "node-sass": "^4.5.2",
     "nodemon": "^1.11.0",
     "pre-commit": "^1.2.2",
     "pug-lint": "^2.4.0",
-    "snyk": "^1.25.1",
+    "snyk": "^1.26.1",
     "standard": "^9.0.2",
     "sticky-js": "^1.1.9",
     "twemoji-awesome": "^1.0.4",
     "vee-validate": "^2.0.0-beta.25",
-    "vue": "^2.2.5"
+    "vue": "^2.2.6"
   },
   "standard": {
     "globals": [