Resolve dependency module requiring

* es5 style module exports
* remove script tag require
* webpack config ProvidePlugin

Note that this commit only fix JavaScript module loading runtime error.

package.json

@@ -64,6 +64,7 @@
     "morgan": "^1.7.0",
     "mysql": "^2.11.1",
     "node-uuid": "^1.4.7",
+    "ot": "0.0.15",
     "passport": "^0.3.2",
     "passport-dropbox-oauth2": "^1.1.0",
     "passport-facebook": "^2.1.1",
@@ -84,6 +85,7 @@
     "sequelize-cli": "^2.4.0",
     "shortid": "2.2.6",
     "socket.io": "1.4.8",
+    "socket.io-client": "^1.4.8",
     "sqlite3": "^3.1.4",
     "store": "^1.3.20",
     "string": "^3.3.1",

public/js/extra.js

@@ -489,6 +489,8 @@ function exportToRawHTML(view) {
     saveAs(blob, filename);
 }
 
+var common = require('./common.js');
+var serverurl = common.serverurl;
 //extract markdown body to html and compile to template
 function exportToHTML(view) {
     var title = renderTitle(ui.area.markdown);
@@ -794,7 +796,10 @@ emojify.setConfig({
     ignore_emoticons: true
 });
 
-var md = window.markdownit('default', {
+var markdownit = require('markdown-it');
+var markdownitContainer = require('markdown-it-container');
+
+var md = markdownit('default', {
     html: true,
     breaks: true,
     langPrefix: "",
@@ -802,25 +807,27 @@ var md = window.markdownit('default', {
     typographer: true,
     highlight: highlightRender
 });
-md.use(window.markdownitAbbr);
-md.use(window.markdownitFootnote);
-md.use(window.markdownitDeflist);
-md.use(window.markdownitMark);
-md.use(window.markdownitIns);
-md.use(window.markdownitSub);
-md.use(window.markdownitSup);
-md.use(window.markdownitMathjax);
-md.use(window.markdownitImsize);
+
+md.use(require('markdown-it-abbr'));
+md.use(require('markdown-it-footnote'));
+md.use(require('markdown-it-deflist'));
+md.use(require('markdown-it-mark'));
+md.use(require('markdown-it-ins'));
+md.use(require('markdown-it-sub'));
+md.use(require('markdown-it-sup'));
+md.use(require('markdown-it-mathjax'));
+md.use(require('markdown-it-imsize'));
+
 function renderContainer(tokens, idx, options, env, self) {
     tokens[idx].attrJoin('role', 'alert');
     tokens[idx].attrJoin('class', 'alert');
     tokens[idx].attrJoin('class', 'alert-' + tokens[idx].info.trim());
     return self.renderToken.apply(self, arguments);
 }
-md.use(window.markdownitContainer, 'success', { render: renderContainer });
-md.use(window.markdownitContainer, 'info', { render: renderContainer });
-md.use(window.markdownitContainer, 'warning', { render: renderContainer });
-md.use(window.markdownitContainer, 'danger', { render: renderContainer });
+md.use(markdownitContainer, 'success', { render: renderContainer });
+md.use(markdownitContainer, 'info', { render: renderContainer });
+md.use(markdownitContainer, 'warning', { render: renderContainer });
+md.use(markdownitContainer, 'danger', { render: renderContainer });
 
 md.renderer.rules.image = function (tokens, idx, options, env, self) {
     tokens[idx].attrJoin('class', 'raw');
@@ -865,6 +872,9 @@ md.renderer.rules.fence = function (tokens, idx, options, env, self) {
         + '</code></pre>\n';
 };
 
+/* Defined regex markdown it plugins */
+var Plugin = require('markdown-it-regexp');
+
 //youtube
 var youtubePlugin = new Plugin(
     // regexp to match
@@ -1012,3 +1022,22 @@ md.use(tocPlugin);
 md.use(slidesharePlugin);
 md.use(speakerdeckPlugin);
 md.use(pdfPlugin);
+
+module.exports = {
+  md: md,
+  createtime: createtime,
+  lastchangetime: lastchangetime,
+  updateLastChange: updateLastChange,
+  lastchangeui: lastchangeui,
+  lastchangeuser: lastchangeuser,
+  postProcess: postProcess,
+  finishView: finishView,
+  autoLinkify: autoLinkify,
+  deduplicatedHeaderId: deduplicatedHeaderId,
+  renderTOC: renderTOC,
+  renderTitle: renderTitle,
+  renderFilename: renderFilename,
+  generateToc: generateToc,
+  smoothHashScroll: smoothHashScroll,
+  scrollToHash: scrollToHash
+};

public/js/history.js

@@ -1,3 +1,13 @@
+var store = require('store');
+
+var common = require('./common');
+var checkIfAuth = common.checkIfAuth;
+var urlpath = common.urlpath;
+
+var extra = require('./extra');
+var renderFilename = extra.renderFilename;
+var md = extra.md;
+
 var migrateHistoryFromTempCallback = null;
 
 migrateHistoryFromTemp();
@@ -366,3 +376,7 @@ function parseToHistory(list, notehistory, callback) {
     }
     callback(list, notehistory);
 }
+
+module.exports = {
+  writeHistory: writeHistory
+}

public/js/index.js

@@ -18,15 +18,14 @@ require('bootstrap');
 require('codemirror/keymap/vim');
 require('codemirror/keymap/emacs');
 require('codemirror/keymap/sublime');
-
-require('../vendor/inlineAttachment/inline-attachment');
-require('../vendor/inlineAttachment/codemirror.inline-attachment');
-require('../vendor/codemirror-spell-checker/spell-checker.min');
+require('codemirror/addon/display/panel');
 
 /* operational transformation */
-require('../vendor/ot/ot.min');
+require('ot/lib/socketio-adapter');
+require('ot/lib/codemirror-adapter');
+require('ot/lib/undo-manager');
+require('../vendor/ot/editor-client');
 
-/* other vendors plugin */
 require('markdown-it');
 require('markdown-it-abbr');
 require('markdown-it-footnote');
@@ -40,14 +39,13 @@ require('markdown-it-mathjax');
 require('markdown-it-regexp');
 require('markdown-it-imsize');
 
+/* other vendors plugin */
 require('gist-embed');
-require('lz-string');
 require('string');
 require('highlight.js');
 require('prismjs');
 require('prismjs/components/prism-wiki');
 require('js-cookie');
-require('emojify.js');
 require('to-markdown');
 
 require('raphael');
@@ -63,11 +61,48 @@ require('visibilityjs');
 require('list.js');
 require('../vendor/md-toc');
 require('randomcolor');
-require('keymaster');
 
 var common = require('./common.js');
-
+var urlpath = common.urlpath;
+var debug = common.debug;
+var version = common.version;
 var serverurl = common.serverurl;
+var GOOGLE_API_KEY = common.GOOGLE_API_KEY;
+var GOOGLE_CLIENT_ID = common.GOOGLE_CLIENT_ID;
+var DROPBOX_APP_KEY = common.DROPBOX_APP_KEY;
+var noteurl = common.noteurl;
+
+var checkLoginStateChanged = common.checkLoginStateChanged;
+
+var syncScroll = require('./syncscroll');
+var setupSyncAreas = syncScroll.setupSyncAreas;
+var clearMap = syncScroll.clearMap;
+var syncScrollToEdit = syncScroll.syncScrollToEdit;
+
+var extra = require('./extra');
+var md = extra.md;
+var createtime = extra.createtime;
+var updateLastChange = extra.updateLastChange;
+var postProcess = extra.postProcess;
+var finishView = extra.finishView;
+var lastchangetime = extra.lastchangetime;
+var autoLinkify = extra.autoLinkify;
+var generateToc = extra.generateToc;
+var smoothHashScroll = extra.smoothHashScroll;
+var lastchangeuser = extra.lastchangeuser;
+var deduplicatedHeaderId = extra.deduplicatedHeaderId;
+var renderTOC = extra.renderTOC;
+var renderTitle = extra.renderTitle;
+var renderFilename = extra.renderFilename;
+var scrollToHash = extra.scrollToHash;
+
+var history = require('./history');
+var writeHistory = history.writeHistory;
+
+var pretty = require('./pretty');
+
+var renderer = require('./render');
+var preventXSS = renderer.preventXSS;
 
 var defaultTextHeight = 20;
 var viewportMargin = 20;
@@ -349,7 +384,7 @@ var supportExtraTags = [
         }
     }
 ];
-var modeType = {
+window.modeType = {
     edit: {
         name: "edit"
     },
@@ -389,7 +424,7 @@ var visibleSM = false;
 var visibleMD = false;
 var visibleLG = false;
 var isTouchDevice = 'ontouchstart' in document.documentElement;
-var currentMode = defaultMode;
+window.currentMode = defaultMode;
 var currentStatus = statusType.offline;
 var lastInfo = {
     needRestore: false,

public/js/pretty.js

@@ -1,3 +1,16 @@
+var extra = require('./extra')
+var md = extra.md;
+var finishView = extra.finishView;
+var autoLinkify = extra.autoLinkify;
+var deduplicatedHeaderId = extra.deduplicatedHeaderId;
+var renderTOC = extra.renderTOC;
+var generateToc = extra.generateToc;
+var smoothHashScroll = extra.smoothHashScroll;
+var postProcess = extra.postProcess;
+var lastchangeui = extra.lastchangeui;
+var updateLastChange = extra.updateLastChange;
+var preventXSS = require('./render').preventXSS;
+
 var markdown = $(".markdown-body");
 var text = $('<textarea/>').html(markdown.html()).text();
 var lastMeta = md.meta;
@@ -110,3 +123,7 @@ function scrollToBottom() {
         scrollTop: $(document.body)[0].scrollHeight
     }, 100, "linear");
 }
+
+module.exports = {
+  scrollToBottom: scrollToBottom
+}

public/js/render.js

@@ -51,3 +51,7 @@ var filterXSSOptions = {
 function preventXSS(html) {
     return filterXSS(html, filterXSSOptions);
 }
+
+module.exports = {
+  preventXSS: preventXSS
+}

public/js/syncscroll.js

@@ -1,5 +1,8 @@
 // Inject line numbers for sync scroll.
 
+var extra = require('./extra');
+var md = extra.md;
+
 function addPart(tokens, idx) {
     if (tokens[idx].map && tokens[idx].level === 0) {
         var startline = tokens[idx].map[0] + 1;
@@ -99,10 +102,12 @@ function renderContainer(tokens, idx, options, env, self) {
     addPart(tokens, idx);
     return self.renderToken.apply(self, arguments);
 }
-md.use(window.markdownitContainer, 'success', { render: renderContainer });
-md.use(window.markdownitContainer, 'info', { render: renderContainer });
-md.use(window.markdownitContainer, 'warning', { render: renderContainer });
-md.use(window.markdownitContainer, 'danger', { render: renderContainer });
+
+var markdownitContainer = require('markdown-it-container');
+md.use(markdownitContainer, 'success', { render: renderContainer });
+md.use(markdownitContainer, 'info', { render: renderContainer });
+md.use(markdownitContainer, 'warning', { render: renderContainer });
+md.use(markdownitContainer, 'danger', { render: renderContainer });
 
 var syncscroll = true;
 
@@ -361,3 +366,9 @@ function syncScrollToView(event, preventAnimate) {
 function editScrollingTimeoutInner() {
     editScrolling = false;
 }
+
+module.exports = {
+  setupSyncAreas: setupSyncAreas,
+  clearMap: clearMap,
+  syncScrollToEdit: syncScrollToEdit
+};

public/views/foot.ejs

@@ -22,13 +22,12 @@
 <script src="<%- url %>/vendor/mermaid/dist/mermaid.min.js" defer></script>
 <% } %>
 <script src="<%- url %>/vendor/idle.min.js" defer></script>
+<script src="<%- url %>/vendor/codemirror/codemirror.min.js" defer></script>
+<script src="<%- url %>/vendor/codemirror-spell-checker/spell-checker.min.js" defer></script>
+<script src="<%- url %>/vendor/inlineAttachment/inline-attachment.js" defer></script>
+<script src="<%- url %>/vendor/inlineAttachment/codemirror.inline-attachment.js" defer></script>
 <script src="<%- url %>/vendor/xss.min.js" defer></script>
 <script src="<%- url %>/build/js/app.js" defer></script>
 <script src="<%- url %>/js/google-drive-upload.js" defer></script>
 <script src="<%- url %>/js/google-drive-picker.js" defer></script>
-<script src="<%- url %>/js/common.js" defer></script>
-<script src="<%- url %>/js/extra.js" defer></script>
-<script src="<%- url %>/js/render.js" defer></script>
-<script src="<%- url %>/js/history.js" defer></script>
 <script src="<%- url %>/js/reveal-markdown.js" defer></script>
-<script src="<%- url %>/js/syncscroll.js" defer></script>

webpack.config.js

@@ -12,7 +12,12 @@ module.exports = {
       "window.jQuery": "jquery",
       Visibility: "visibilityjs",
       Cookies: "js-cookie",
-      CodeMirror: "codemirror"
+      CodeMirror: "codemirror",
+      emojify: "emojify.js",
+      ot: "ot",
+      io: "socket.io-client",
+      LZString: "lz-string",
+      key: "keymaster"
     }),
     new webpack.DefinePlugin({
       "require.specified": "require.resolve"