From 43d46b4cfdce275747e67433f8c791b9915ec611 Mon Sep 17 00:00:00 2001
From: wwebfor <wwebfor@users.noreply.github.com>
Date: Fri, 25 Dec 2015 18:56:48 +0600
Subject: [PATCH 01/25] Switch to Codemirror

Why:
* It probably better supports Markdown syntax.
* It is easier to extend.
---
 app/scripts/modules/codemirror/controller.js  | 566 ++++++++++++++++++
 app/scripts/modules/codemirror/module.js      |  50 ++
 .../modules/codemirror/templates/editor.html  |  69 +++
 .../modules/codemirror/views/editor.js        |  55 ++
 4 files changed, 740 insertions(+)
 create mode 100644 app/scripts/modules/codemirror/controller.js
 create mode 100644 app/scripts/modules/codemirror/module.js
 create mode 100644 app/scripts/modules/codemirror/templates/editor.html
 create mode 100644 app/scripts/modules/codemirror/views/editor.js

diff --git a/app/scripts/modules/codemirror/controller.js b/app/scripts/modules/codemirror/controller.js
new file mode 100644
index 000000000..5633a8ec3
--- /dev/null
+++ b/app/scripts/modules/codemirror/controller.js
@@ -0,0 +1,566 @@
+/**
+ * Copyright (C) 2015 Laverna project Authors.
+ *
+ * This Source Code Form is subject to the terms of the Mozilla Public
+ * License, v. 2.0. If a copy of the MPL was not distributed with this
+ * file, You can obtain one at http://mozilla.org/MPL/2.0/.
+ */
+/* global define */
+define([
+    'underscore',
+    'marionette',
+    'backbone.radio',
+    'codemirror/lib/codemirror',
+    'modules/codemirror/views/editor',
+    'codemirror/mode/gfm/gfm',
+    'codemirror/mode/markdown/markdown',
+    'codemirror/addon/edit/continuelist',
+    'codemirror/addon/mode/overlay',
+], function(_, Marionette, Radio, CodeMirror, View) {
+    'use strict';
+
+    /**
+     * Codemirror module.
+     * Regex and WYSIWG button functions are based on simplemde-markdown-editor:
+     * https://github.com/NextStepWebs/simplemde-markdown-editor
+     */
+    var Controller = Marionette.Object.extend({
+
+        marks: {
+            strong: {
+                tag   : ['**', '__'],
+                start : /(\*\*|__)(?![\s\S]*(\*\*|__))/,
+                end   : /(\*\*|__)/,
+            },
+            em: {
+                tag   : ['*', '_'],
+                start : /(\*|_)(?![\s\S]*(\*|_))/,
+                end   : /(\*|_)/,
+            },
+            strikethrough: {
+                tag   : ['~~'],
+                start : /(\*\*|~~)(?![\s\S]*(\*\*|~~))/,
+                end   : /(\*\*|~~)/,
+            },
+            'code': {
+                tag    : '```\r\n',
+                tagEnd : '\r\n```',
+            },
+            'unordered-list': {
+                replace : /^(\s*)(\*|\-|\+)\s+/,
+                tag     : '* ',
+            },
+            'ordered-list': {
+                replace : /^(\s*)\d+\.\s+/,
+                tag     : '1. ',
+            },
+        },
+
+        initialize: function() {
+            _.bindAll(this, 'onChange', 'onScroll', 'onCursor', 'boldAction', 'italicAction', 'linkAction', 'headingAction', 'attachmentAction', 'codeAction', 'hrAction', 'listAction', 'numberedListAction');
+
+            // Get configs
+            this.configs = Radio.request('configs', 'get:object');
+
+            // Initialize the view
+            this.view = new View({
+                model   : Radio.request('notesForm', 'model'),
+                configs : this.configs
+            });
+
+            this.view.once('dom:refresh', this.initEditor, this);
+
+            // Events
+            this.listenTo(this.view, 'editor:action', this.onViewAction);
+
+            // Show the view and render Pagedown editor
+            Radio.request('notesForm', 'show:editor', this.view);
+
+            Radio.reply('editor', {
+                'get:data'      : this.getData,
+                'generate:link' : this.generateLink,
+                'generate:image': this.generateImage
+            }, this);
+        },
+
+        onDestroy: function() {
+            Radio.stopReplying('editor', 'get:data');
+        },
+
+        initEditor: function() {
+            this.editor = CodeMirror.fromTextArea(document.getElementById('editor--input'), {
+                mode          : {
+                    name        : 'gfm',
+                    gitHubSpice : false
+                },
+                lineNumbers   : false,
+                matchBrackets : true,
+                lineWrapping  : true,
+                extraKeys     : {
+                    'Cmd-B'  : this.boldAction,
+                    'Ctrl-B' : this.boldAction,
+
+                    'Cmd-I'  : this.italicAction,
+                    'Ctrl-I' : this.italicAction,
+
+                    'Cmd-H'  : this.headingAction,
+                    'Ctrl-H' : this.headingAction,
+
+                    'Cmd-L'  : this.linkAction,
+                    'Ctrl-L' : this.linkAction,
+
+                    'Cmd-K'  : this.codeAction,
+                    'Ctrl-K' : this.codeAction,
+
+                    'Cmd-O'  : this.numberedListAction,
+                    'Ctrl-O' : this.numberedListAction,
+
+                    'Cmd-U'  : this.listAction,
+                    'Ctrl-U' : this.listAction,
+
+                    // Ctrl+d - divider
+                    'Cmd-G'  : this.attachmentAction,
+                    'Ctrl-G' : this.attachmentAction,
+
+                    // Ctrl+d - divider
+                    'Cmd-D'  : this.hrAction,
+                    'Ctrl-D' : this.hrAction,
+
+                    'Enter': 'newlineAndIndentContinueMarkdownList'
+                }
+            });
+
+            window.dispatchEvent(new Event('resize'));
+            this.editor.on('change', this.onChange);
+            this.editor.on('scroll', this.onScroll);
+            this.editor.on('cursorActivity', this.onCursor);
+
+            // Show the preview
+            this.updatePreview();
+        },
+
+        /**
+         * Update the preview.
+         */
+        updatePreview: function() {
+            var self = this;
+
+            return Radio.request('markdown', 'render', this.editor.getValue())
+            .then(function(content) {
+                self.view.trigger('editor:change', content);
+            });
+        },
+
+        /**
+         * Text in the editor changed.
+         */
+        onChange: function() {
+
+            // Update the preview
+            this.updatePreview();
+
+            // Trigger autosave
+            this.autoSave();
+        },
+
+        /**
+         * Editor's cursor position changed.
+         */
+        onCursor: function() {
+            var state  = this.getState();
+            this.$btns = this.$btns || $('.editor--btns .btn');
+
+            // Make a specific button active depending on the type of the element under cursor
+            this.$btns.removeClass('btn-primary');
+            for (var i = 0; i < state.length; i++) {
+                this['$btn' + state[i]] = this['$btn' + state[i]] || $('.editor--btns [data-state="' + state[i] + '"]');
+                this['$btn' + state[i]].addClass('btn-primary');
+            }
+        },
+
+        /**
+         * Trigger 'save:auto' event.
+         */
+        autoSave: _.debounce(function() {
+            Radio.trigger('notesForm', 'save:auto');
+        }, 1000),
+
+        /**
+         * Synchronize the editor's scroll position with the preview's.
+         */
+        onScroll: _.debounce(function(e) {
+
+            // Don't do any computations
+            if (!e.doc.scrollTop) {
+                this.view.ui.preview.scrollTop(0);
+                return;
+            }
+
+            var info       = this.editor.getScrollInfo(),
+                lineNumber = this.editor.lineAtHeight(info.top, 'local'),
+                range      = this.editor.getRange({line: 0, ch: null}, {line: lineNumber, ch: null}),
+                self       = this,
+                fragment,
+                temp,
+                lines,
+                els;
+
+            Radio.request('markdown', 'render', range)
+            .then(function(html) {
+
+                // Create a fragment and attach rendered HTML
+                fragment       = document.createDocumentFragment();
+                temp           = document.createElement('div');
+                temp.innerHTML = html;
+                fragment.appendChild(temp);
+
+                // Get all elements in both the fragment and the preview
+                lines = temp.children;
+                els   = self.view.ui.preview[0].children;
+
+                // Get from the preview the last visible element of the editor
+                var newPos = els[lines.length].offsetTop;
+
+                /**
+                 * If the scroll position is on the same element,
+                 * change it according to the difference of scroll positions in the editor.
+                 */
+                if (self.scrollTop && self.scrollPos === newPos) {
+                    self.view.ui.preview.scrollTop(self.view.ui.preview.scrollTop() + (e.doc.scrollTop - self.scrollTop));
+                    self.scrollTop = e.doc.scrollTop;
+                    return;
+                }
+
+                // Scroll to the last visible element's position
+                self.view.ui.preview.animate({
+                    scrollTop: newPos
+                }, 70, 'swing');
+
+                self.scrollPos = newPos;
+                self.scrollTop = e.doc.scrollTop;
+            });
+        }, 10),
+
+        /**
+         * If the view triggered some action event, call a suitable function.
+         * For instance, when action='bold', call boldAction method.
+         */
+        onViewAction: function(action) {
+            action = action + 'Action';
+
+            if (this[action]) {
+                this[action]();
+            }
+        },
+
+        /**
+         * Return data from the editor.
+         */
+        getData: function() {
+            var content = this.editor.getValue();
+
+            return Radio.request('markdown', 'render', content)
+            .then(function() {
+                return {
+                    content: content,
+                    tags: [],
+                    tasks: []
+                };
+            });
+        },
+
+        /**
+         * Return state of the element under the cursor.
+         */
+        getState: function(pos) {
+            pos      = pos || this.editor.getCursor('start');
+            var stat = this.editor.getTokenAt(pos);
+
+            if (!stat.type) {
+                return [];
+            }
+
+            stat.type = stat.type.split(' ');
+
+            if (_.indexOf(stat.type, 'variable-2') !== -1) {
+                if (/^\s*\d+\.\s/.test(this.editor.getLine(pos.line))) {
+                    stat.type.push('ordered-list');
+                }
+                else {
+                    stat.type.push('unordered-list');
+                }
+            }
+
+
+            return stat.type;
+        },
+
+        /**
+         * Toggle Markdown block.
+         */
+        toggleBlock: function(type) {
+            var stat  = this.getState(),
+                start = this.editor.getCursor('start'),
+                end   = this.editor.getCursor('end'),
+		        text,
+		        startText,
+		        endText;
+
+            // Text is already [strong|italic|etc]
+            if (_.indexOf(stat, type) !== -1) {
+                text      = this.editor.getLine(start.line);
+                startText = text.slice(0, start.ch);
+                endText   = text.slice(start.ch);
+
+                // Remove Markdown tags from the text
+                startText = startText.replace(this.marks[type].start, '');
+                endText   = endText.replace(this.marks[type].end, '');
+
+                this.replaceRange(startText + endText, start.line);
+
+                start.ch -= this.marks[type].tag[0].length;
+                end.ch   -= this.marks[type].tag[0].length;
+            }
+            else {
+                text = this.editor.getSelection();
+
+			    for (var i = 0; i < this.marks[type].tag.length - 1; i++) {
+                    text = text.split(this.marks[type].tag[i]).join('');
+			    }
+
+		        this.editor.replaceSelection(this.marks[type].tag[0] + text + this.marks[type].tag[0]);
+
+                start.ch += this.marks[type].tag[0].length;
+                end.ch    = start.ch + text.length;
+            }
+
+            this.editor.setSelection(start, end);
+            this.editor.focus();
+        },
+
+        /**
+         * Make selected text strong.
+         */
+        boldAction: function() {
+            this.toggleBlock('strong');
+        },
+
+        /**
+         * Make selected text italicized.
+         */
+        italicAction: function() {
+            this.toggleBlock('em');
+        },
+
+        /**
+         * Create headings.
+         */
+        headingAction: function() {
+            var start = this.editor.getCursor('start'),
+                end   = this.editor.getCursor('end');
+
+            for (var i = start.line; i <= end.line; i++) {
+                this.toggleHeading(i);
+            }
+        },
+
+        /**
+         * Show a dialog to attach images or files.
+         */
+        attachmentAction: function() {
+            var self   = this,
+                dialog = Radio.request('editor', 'show:attachment', this.view.model);
+
+            if (!dialog) {
+                return;
+            }
+
+            dialog.then(function(text) {
+                if (!text || !text.length) {
+                    return;
+                }
+
+                self.editor.replaceSelection(text, true);
+                self.editor.focus();
+            });
+        },
+
+        /**
+         * Show a link dialog.
+         */
+        linkAction: function() {
+            var self   = this,
+                dialog = Radio.request('editor', 'show:link');
+
+            if (!dialog) {
+                return;
+            }
+
+            dialog.then(function(link) {
+                if (!link || !link.length) {
+                    return;
+                }
+
+                var cursor = self.editor.getCursor('start'),
+                    text   = self.editor.getSelection() || 'Link';
+
+                self.editor.replaceSelection('[' + text + '](' + link + ')');
+                self.editor.setSelection(
+                    {line: cursor.line, ch: cursor.ch + 1},
+                    {line: cursor.line, ch: cursor.ch + text.length + 1}
+                );
+                self.editor.focus();
+            });
+        },
+
+        /**
+         * Create a divider.
+         */
+        hrAction: function() {
+            var start = this.editor.getCursor('start');
+            this.editor.replaceSelection('\r\r-----\r\r');
+
+            start.line += 4;
+            start.ch    = 0;
+            this.editor.setSelection( start, start );
+            this.editor.focus();
+        },
+
+        /**
+         * Create a code block.
+         */
+        codeAction: function() {
+            var state = this.getState(),
+                start = this.editor.getCursor('start'),
+                end   = this.editor.getCursor('end'),
+                text;
+
+            if (_.indexOf(state, 'code') !== -1) {
+                return;
+            }
+            else {
+                text = this.editor.getSelection();
+                this.editor.replaceSelection(this.marks.code.tag + text + this.marks.code.tagEnd);
+            }
+            this.editor.setSelection({line: start.line + 1, ch: start.ch}, {line: end.line + 1, ch: end.ch});
+            this.editor.focus();
+        },
+
+        replaceRange: function(text, line) {
+            this.editor.replaceRange(text, {
+                line : line,
+                ch   : 0
+            }, {
+                line : line,
+                ch   : 99999999999999
+            });
+            this.editor.focus();
+        },
+
+        /**
+         * Convert a line to a headline.
+         */
+        toggleHeading: function(i) {
+            var text       = this.editor.getLine(i),
+			    headingLvl = text.search(/[^#]/);
+
+            // Create a default headline
+            if (headingLvl === -1) {
+                text = '# Heading';
+
+                this.replaceRange(text, i);
+                return this.editor.setSelection(
+                    {line: i, ch: 2},
+                    {line: i, ch: 9}
+                );
+            }
+
+            // Increase headline level up to 6th
+            if (headingLvl < 6) {
+                text = headingLvl > 0 ? text.substr(headingLvl + 1) : text;
+                text = new Array(headingLvl + 2).join('#') + ' ' + text;
+            }
+            else {
+                text = text.substr(headingLvl + 1);
+            }
+
+            this.replaceRange(text, i);
+        },
+
+        /**
+         * Convert selected text to unordered list.
+         */
+        listAction: function() {
+            this.toggleLists('unordered-list');
+        },
+
+        /**
+         * Convert selected text to ordered list.
+         */
+        numberedListAction: function() {
+            this.toggleLists('ordered-list', 1);
+        },
+
+        /**
+         * Convert several selected lines to ordered or unordered lists.
+         */
+        toggleLists: function(type, order) {
+            var state = this.getState(),
+                start = this.editor.getCursor('start'),
+                end   = this.editor.getCursor('end');
+
+            // Convert each line to list
+            _.each(new Array(end.line - start.line + 1), function(val, i) {
+                this.toggleList(type, start.line + i, state, order);
+                if (order) {
+                    order++;
+                }
+            }, this);
+        },
+
+        /**
+         * Convert selected text to an ordered or unordered list.
+         */
+        toggleList: function(name, line, state, order) {
+            var text = this.editor.getLine(line);
+
+            // If it is a list, convert it to normal text
+            if (_.indexOf(state, name) !== -1) {
+                text = text.replace(this.marks[name].replace, '$1');
+            }
+            else if (order) {
+                text = order + '. ' + text;
+            }
+            else {
+                text = this.marks[name].tag + text;
+            }
+
+            this.replaceRange(text, line);
+        },
+
+        /**
+         * Redo the last action in Codemirror.
+         */
+        redoAction: function() {
+            this.editor.redo();
+        },
+
+        /**
+         * Undo the last action in Codemirror.
+         */
+        undoAction: function() {
+            this.editor.undo();
+        },
+
+        generateLink: function(data) {
+            return '[' + data.text + ']' + '(' + data.url + ')';
+        },
+
+        generateImage: function(data) {
+            return '!' + this.generateLink(data);
+        },
+
+    });
+
+    return Controller;
+});
diff --git a/app/scripts/modules/codemirror/module.js b/app/scripts/modules/codemirror/module.js
new file mode 100644
index 000000000..9621131cb
--- /dev/null
+++ b/app/scripts/modules/codemirror/module.js
@@ -0,0 +1,50 @@
+/**
+ * Copyright (C) 2015 Laverna project Authors.
+ *
+ * This Source Code Form is subject to the terms of the Mozilla Public
+ * License, v. 2.0. If a copy of the MPL was not distributed with this
+ * file, You can obtain one at http://mozilla.org/MPL/2.0/.
+ */
+/* global define */
+define([
+    'underscore',
+    'backbone.radio',
+    'marionette',
+    'modules',
+    'modules/codemirror/controller'
+], function(_, Radio, Marionette, Modules, Controller) {
+    'use strict';
+
+    /**
+     * Codemirror module.
+     */
+    var Module = Modules.module('Codemirror', {});
+
+    /**
+     * Initializers & finalizers of the module
+     */
+    Module.on('start', function() {
+        console.info('Codemirror module has started');
+        Module.controller = new Controller();
+    });
+
+    Module.on('stop', function() {
+        console.info('Codemirror module has stoped');
+
+        Module.controller.destroy();
+        Module.controller = null;
+    });
+
+    // Add a global module initializer
+    Radio.request('init', 'add', 'module', function() {
+        console.info('Codemirror module has been initialized');
+
+        Radio.channel('notesForm')
+        .on('view:ready', Module.start, Module)
+        .on('view:destroy', Module.stop, Module);
+
+    });
+
+    return Module;
+
+});
diff --git a/app/scripts/modules/codemirror/templates/editor.html b/app/scripts/modules/codemirror/templates/editor.html
new file mode 100644
index 000000000..472a256bb
--- /dev/null
+++ b/app/scripts/modules/codemirror/templates/editor.html
@@ -0,0 +1,69 @@
+<div class="pagedown--bar dropdown text-center">
+    <div class="btn-group editor--btns">
+        <span data-action="bold" data-state="strong" class="btn">
+            <i class="icon-bold"></i>
+        </span>
+        <span data-action="italic" data-state="em" class="btn">
+            <i class="icon-italic"></i>
+        </span>
+        <span data-action="heading" data-state="header" class="btn">
+            <i class="icon-font"></i>
+        </span>
+    </div>
+
+    <div class="btn-group editor--btns">
+        <span data-action="link" data-state="link" class="btn">
+            <i class="icon-globe"></i>
+        </span>
+        <span data-action="attachment" class="btn">
+            <i class="icon-picture"></i>
+        </span>
+        <span data-action="code" data-state="comment" class="btn">
+            <i class="icon-code"></i>
+        </span>
+    </div>
+
+    <div class="btn-group editor--btns">
+        <span data-action="numberedList" data-state="ordered-list" class="btn">
+            <i class="icon-list-numbered"></i>
+        </span>
+        <span data-action="list" data-state="unordered-list" class="btn">
+            <i class="icon-list-bullet"></i>
+        </span>
+        <span data-action="hr" data-state="hr" class="btn">
+            <i class="icon-minus"></i>
+        </span>
+    </div>
+
+    <div class="btn-group editor--btns">
+        <span data-action="undo" class="btn">
+            <i class="icon-reply"></i>
+        </span>
+        <span data-action="redo" class="btn">
+            <i class="icon-share"></i>
+        </span>
+    </div>
+</div>
+
+<div class="btn-group btn-group-justified hidden -show">
+    <div class="btn-group">
+        <button data-col="left" class="btn btn-default active pagedown--col--btn">
+            {{i18n('Editor')}}
+        </button>
+    </div>
+    <div class="btn-group">
+        <button data-col="right" class="btn btn-default pagedown--col--btn">
+            {{i18n('Preview')}}
+        </button>
+    </div>
+</div>
+
+<div class="pagedown--row">
+    <div class="pagedown--layout -left -show">
+        <textarea class="pagedown--input" id="editor--input" name="content">{{content}}</textarea>
+    </div>
+
+    <div class="pagedown--layout -right">
+        <div class="pagedown--preview" id="wmd-preview"></div>
+    </div>
+</div>
diff --git a/app/scripts/modules/codemirror/views/editor.js b/app/scripts/modules/codemirror/views/editor.js
new file mode 100644
index 000000000..be56ec281
--- /dev/null
+++ b/app/scripts/modules/codemirror/views/editor.js
@@ -0,0 +1,55 @@
+/**
+ * Copyright (C) 2015 Laverna project Authors.
+ *
+ * This Source Code Form is subject to the terms of the Mozilla Public
+ * License, v. 2.0. If a copy of the MPL was not distributed with this
+ * file, You can obtain one at http://mozilla.org/MPL/2.0/.
+ */
+/* global define */
+define([
+    'underscore',
+    'marionette',
+    'backbone.radio',
+    'text!modules/codemirror/templates/editor.html'
+], function(_, Marionette, Radio, Tmpl) {
+    'use strict';
+
+    /**
+     * Codemirror view.
+     */
+    var View = Marionette.ItemView.extend({
+        template: _.template(Tmpl),
+        className: 'layout--body container-fluid',
+
+        ui: {
+            preview    : '#wmd-preview',
+        },
+
+        events: {
+            'click .editor--btns .btn': 'triggerAction'
+        },
+
+        initialize: function() {
+            this.listenTo(this, 'editor:change', this.onEditorChange);
+        },
+
+        serializeData: function() {
+            return {content: _.escape(this.model.get('content'))};
+        },
+
+        onEditorChange: function(content) {
+            this.ui.preview.html(content);
+        },
+
+        triggerAction: function(e) {
+            e.preventDefault();
+            var action = $(e.currentTarget).attr('data-action');
+
+            if (action) {
+                this.trigger('editor:action', action);
+            }
+        },
+    });
+
+    return View;
+});

From 99d871baa8ed9b11ad7fd1dfaf539e8c604dfb84 Mon Sep 17 00:00:00 2001
From: wwwredfish <wwwredfish@gmail.com>
Date: Fri, 25 Dec 2015 19:00:38 +0600
Subject: [PATCH 02/25] Switch from Pagedown to MarkdownIt

Why:
* It is easier to extend
* It is more modern
* It has a lot of plugins
---
 app/index.html                                |   3 +
 app/scripts/apps/confirm/show/controller.js   |  32 ++++--
 app/scripts/apps/notes/form/controller.js     |  18 ++-
 .../apps/notes/list/views/noteSidebarItem.js  |   4 +-
 app/scripts/apps/notes/show/controller.js     |  14 +++
 app/scripts/apps/notes/show/noteView.js       |   8 +-
 app/scripts/init.js                           |   4 +-
 app/scripts/main.js                           |  19 ++++
 .../modules/markdown/libs/markdown-it.js      |  69 ++++++++++++
 app/scripts/modules/markdown/libs/markdown.js | 105 ++++++++++++++++++
 app/scripts/modules/markdown/module.js        |  29 +++++
 .../modules/markdown/workers/markdown.js      |  71 ++++++++++++
 bower.json                                    |  10 +-
 gulpfile.js                                   |  22 +++-
 14 files changed, 382 insertions(+), 26 deletions(-)
 create mode 100644 app/scripts/modules/markdown/libs/markdown-it.js
 create mode 100644 app/scripts/modules/markdown/libs/markdown.js
 create mode 100644 app/scripts/modules/markdown/module.js
 create mode 100644 app/scripts/modules/markdown/workers/markdown.js

diff --git a/app/index.html b/app/index.html
index afb96b238..cf4bacefb 100644
--- a/app/index.html
+++ b/app/index.html
@@ -30,6 +30,9 @@
 
         <link rel="stylesheet" href="styles/core.css">
         <link rel="stylesheet" href="styles/theme-default.css">
+
+        <link rel="stylesheet" href="bower_components/prism/themes/prism.css">
+
         <script src="bower_components/modernizr/modernizr.js"></script>
     </head>
     <body class="-noscroll">
diff --git a/app/scripts/apps/confirm/show/controller.js b/app/scripts/apps/confirm/show/controller.js
index 8124e3fd1..f841af0d9 100644
--- a/app/scripts/apps/confirm/show/controller.js
+++ b/app/scripts/apps/confirm/show/controller.js
@@ -1,6 +1,6 @@
 /**
  * Copyright (C) 2015 Laverna project Authors.
- * 
+ *
  * This Source Code Form is subject to the terms of the Mozilla Public
  * License, v. 2.0. If a copy of the MPL was not distributed with this
  * file, You can obtain one at http://mozilla.org/MPL/2.0/.
@@ -8,10 +8,11 @@
 /* global define */
 define([
     'underscore',
+    'q',
     'marionette',
     'backbone.radio',
     'apps/confirm/show/view'
-], function(_, Marionette, Radio, View) {
+], function(_, Q, Marionette, Radio, View) {
     'use strict';
 
     /**
@@ -24,21 +25,28 @@ define([
     var Controller = Marionette.Object.extend({
 
         initialize: function(options) {
+            var self = this;
+
             if (typeof options === 'string') {
                 options = {content: options};
             }
 
-            // If instead of text a view was provided, render it
-            if (typeof options.content === 'object') {
-                options.content = options.content.render().$el.html();
-            }
-            // Try to make HTML from supposedly Markdown string
-            else {
-                options.content = Radio.request('editor', 'content:html', options.content);
-            }
-
             this.options = options;
-            this.show();
+            new Q((function() {
+
+                // If instead of text a view was provided, render it
+                if (typeof options.content === 'object') {
+                    return options.content.render().$el.html();
+                }
+
+                // Try to make HTML from supposedly Markdown string
+                return Radio.request('markdown', 'render', options.content);
+            })())
+            .then(function(content) {
+                self.options.content = content;
+                return self.show();
+            });
+
         },
 
         onDestroy: function() {
diff --git a/app/scripts/apps/notes/form/controller.js b/app/scripts/apps/notes/form/controller.js
index 15dc14e12..d7d2e75cb 100644
--- a/app/scripts/apps/notes/form/controller.js
+++ b/app/scripts/apps/notes/form/controller.js
@@ -105,16 +105,26 @@ define([
         },
 
         save: function() {
-            Radio.request('notes', 'save', this.view.model, this.getContent())
+            var self = this;
+
+            return this.getContent()
+            .then(function(data) {
+                return Radio.request('notes', 'save', self.view.model, data);
+            })
             .fail(function(e) {
                 console.error('Error', e);
             });
         },
 
         getContent: function() {
-            return _.extend(Radio.request('editor', 'get:content'), {
-                title      : this.view.ui.title.val().trim(),
-                notebookId : this.view.notebooks.currentView.ui.notebookId.val().trim(),
+            var self = this;
+
+            return Radio.request('editor', 'get:data')
+            .then(function(data) {
+                return _.extend(data, {
+                    title      : self.view.ui.title.val().trim(),
+                    notebookId : self.view.notebooks.currentView.ui.notebookId.val().trim(),
+                });
             });
         },
 
diff --git a/app/scripts/apps/notes/list/views/noteSidebarItem.js b/app/scripts/apps/notes/list/views/noteSidebarItem.js
index 5a4879333..4736b80d8 100644
--- a/app/scripts/apps/notes/list/views/noteSidebarItem.js
+++ b/app/scripts/apps/notes/list/views/noteSidebarItem.js
@@ -1,6 +1,6 @@
 /**
  * Copyright (C) 2015 Laverna project Authors.
- * 
+ *
  * This Source Code Form is subject to the terms of the Mozilla Public
  * License, v. 2.0. If a copy of the MPL was not distributed with this
  * file, You can obtain one at http://mozilla.org/MPL/2.0/.
@@ -65,7 +65,7 @@ define([
             return {
                 // Show only first 50 characters of the content
                 getContent: function() {
-                    return this.content.substring(0, 50);
+                    return _.escape(this.content.substring(0, 50));
                 },
 
                 // Strip from HTML tags the title
diff --git a/app/scripts/apps/notes/show/controller.js b/app/scripts/apps/notes/show/controller.js
index 0e14f0377..251fc43c2 100644
--- a/app/scripts/apps/notes/show/controller.js
+++ b/app/scripts/apps/notes/show/controller.js
@@ -27,6 +27,10 @@ define([
      * 2. channel: appNote, request: `remove:note`
      *    in order to destroy a model
      * 3. channel: global, request: `set:title`
+     *
+     * Requests:
+     * 1. channel: markdown, request: render
+     *    it expects to receive HTML.
      */
     var Controller = Marionette.Object.extend({
 
@@ -45,11 +49,21 @@ define([
         },
 
         _show: function(note, notebook) {
+            var self = this;
+
+            Radio.request('markdown', 'render', note.get('content'))
+            .then(function(content) {
+                return self.render(note, content, notebook);
+            });
+        },
+
+        render: function(note, content, notebook) {
             // Trigger an event that the model is active
             Radio.trigger('appNote', 'model:active', note);
 
             this.view = new View({
                 model    : note,
+                content  : content,
                 notebook : notebook,
                 args     : this.options,
                 files    : [],
diff --git a/app/scripts/apps/notes/show/noteView.js b/app/scripts/apps/notes/show/noteView.js
index cef8be8ba..4c33056c6 100644
--- a/app/scripts/apps/notes/show/noteView.js
+++ b/app/scripts/apps/notes/show/noteView.js
@@ -27,9 +27,7 @@ define([
      * 2. channel: noteView, event: view:destroy
      *    before the view is destroyed.
      * Requests:
-     * 1. channel: editor, request: content:html
-     *    it expects to receive HTML.
-     * 2. channel: global, request: configs
+     * 1. channel: global, request: configs
      */
     var View = Marionette.ItemView.extend({
         template: _.template(Tmpl),
@@ -154,9 +152,9 @@ define([
         },
 
         serializeData: function() {
-            var content = Radio.request('editor', 'content:html', this.model);
+            // var content = Radio.request('markdown', 'render', this.model);
             return _.extend(this.model.toJSON(), {
-                content  : content || this.model.get('content'),
+                content  : this.options.content || this.model.get('content'),
                 notebook : this.options.notebook.toJSON(),
                 uri      : Radio.request('uri', 'link:profile', '/')
             });
diff --git a/app/scripts/init.js b/app/scripts/init.js
index cf16f05c7..785ded95b 100644
--- a/app/scripts/init.js
+++ b/app/scripts/init.js
@@ -53,7 +53,9 @@ define([
         'apps/help/appHelp',
 
         // Optional modules
-        'modules/pagedown/module',
+        // 'modules/pagedown/module',
+        'modules/markdown/module',
+        'modules/codemirror/module',
         'modules/tags/module',
         'modules/tasks/module',
         'modules/linkDialog/module',
diff --git a/app/scripts/main.js b/app/scripts/main.js
index f72ed5094..18863e2b1 100644
--- a/app/scripts/main.js
+++ b/app/scripts/main.js
@@ -21,6 +21,12 @@ requirejs.config({
             location : '../bower_components/ace/lib/ace',
             main     : 'ace'
         },
+        // Codemirror editor
+        {
+            name     : 'codemirror',
+            location : '../bower_components/codemirror',
+            main     : 'lib/codemirror'
+        },
         // Pagedown editor
         {
             name     : 'pagedown',
@@ -33,6 +39,12 @@ requirejs.config({
             location : '../bower_components/pagedown-ace',
             main     : 'Markdown.Editor'
         },
+        // Prismjs
+        {
+            name     : 'prism',
+            location : '../bower_components/prism',
+            main     : 'bundle'
+        },
         // Xregexp
         {
             name     : 'xregexp',
@@ -69,12 +81,16 @@ requirejs.config({
         dropbox               : '../bower_components/dropbox/dropbox',
 
         // Markdown
+        'markdown-it'         : '../bower_components/markdown-it/dist/markdown-it',
+        'markdown-it-san'     : '../bower_components/markdown-it-sanitizer/dist/markdown-it-sanitizer',
+        'markdown-it-hash'    : '../bower_components/markdown-it-hashtag/dist/markdown-it-hashtag',
         'pagedown-extra'      : '../bower_components/pagedown-extra/Markdown.Extra',
         'to-markdown'         : '../bower_components/to-markdown/src/to-markdown',
 
         // Others
         dompurify             : '../bower_components/DOMPurify/src/purify',
         mathjax               : '../bower_components/MathJax/MathJax.js?config=TeX-AMS-MML_HTMLorMML',
+        hljs                  : '../bower_components/highlightjs/highlight.pack',
         prettify              : '../bower_components/google-code-prettify/src/prettify',
         dropzone              : '../bower_components/dropzone/dist/dropzone-amd-module',
         toBlob                : '../bower_components/blueimp-canvas-to-blob/js/canvas-to-blob',
@@ -169,6 +185,9 @@ requirejs.config({
         sjcl: {
             exports: 'sjcl'
         },
+        'prism/bundle': {
+            exports: 'Prism'
+        },
         bootstrap: {
             deps: ['jquery']
         },
diff --git a/app/scripts/modules/markdown/libs/markdown-it.js b/app/scripts/modules/markdown/libs/markdown-it.js
new file mode 100644
index 000000000..1b1b7f70f
--- /dev/null
+++ b/app/scripts/modules/markdown/libs/markdown-it.js
@@ -0,0 +1,69 @@
+/* global define */
+define([
+    'underscore',
+    'q',
+    'markdown-it',
+    'prism/bundle',
+    'markdown-it-san',
+    'markdown-it-hash',
+], function(_, Q, MarkdownIt, Prism, sanitizer, hash) {
+    'use strict';
+
+    /**
+     * Markdown parser helper.
+     */
+    function Markdown() {
+
+        // Initialize MarkdownIt
+        this.md = new MarkdownIt({
+            html     : true,
+            xhtmlOut : true,
+            breaks   : true,
+            linkify  : true,
+            highlight: function(code, lang) {
+                if (!Prism.languages[lang]) {
+                    return '';
+                }
+
+                return Prism.highlight(code, Prism.languages[lang]);
+            }
+        });
+
+        this.configure();
+    }
+
+    _.extend(Markdown.prototype, {
+
+        /**
+         * Configure MarkdownIt.
+         */
+        configure: function() {
+            this.md
+            .use(sanitizer)
+            .use(hash)
+            ;
+
+            this.md.renderer.rules.hashtag_open  = function(tokens, idx) { // jshint ignore:line
+                var tagName = tokens[idx].content.toLowerCase();
+                return '<a href="#/notes/f/tag/q/' + tagName + '" class="label label-default">';
+            };
+        },
+
+        /**
+         * Convert Markdown to HTML.
+         */
+        render: function(content) {
+            return new Q(
+                this.md.render(content)
+            );
+        },
+
+        parse: function(content) {
+            return new Q(
+                this.md.parse(content)
+            );
+        },
+    });
+
+    return Markdown;
+});
diff --git a/app/scripts/modules/markdown/libs/markdown.js b/app/scripts/modules/markdown/libs/markdown.js
new file mode 100644
index 000000000..b2b9e6469
--- /dev/null
+++ b/app/scripts/modules/markdown/libs/markdown.js
@@ -0,0 +1,105 @@
+/**
+ * Copyright (C) 2015 Laverna project Authors.
+ *
+ * This Source Code Form is subject to the terms of the Mozilla Public
+ * License, v. 2.0. If a copy of the MPL was not distributed with this
+ * file, You can obtain one at http://mozilla.org/MPL/2.0/.
+ */
+/* global define, Modernizr */
+define([
+    'q',
+    'underscore',
+    'modules/markdown/libs/markdown-it'
+], function(Q, _, MarkdownIt) {
+    'use strict';
+
+    /**
+     * Parse Markdown in WebWorker.
+     */
+    function Markdown() {
+        var self    = this;
+        this.worker = new Worker('scripts/modules/markdown/workers/markdown.js');
+
+        // Promise which signifies whether the worker is ready
+        this.workerPromise = Q.defer();
+
+        this.worker.onmessage = function(data) {
+            var msg = data.data;
+
+            switch (msg.msg) {
+
+                // Webworker is ready
+                case 'ready':
+                    self.workerPromise.resolve();
+                    break;
+
+                // Request was fullfilled
+                case 'done':
+                    self.promises[msg.promiseId].resolve(msg.data);
+                    delete self.promises[msg.promiseId];
+                    break;
+
+                // Request failed with errors
+                case 'fail':
+                    self.promises[msg.promiseId].reject(msg.data);
+                    delete self.promises[msg.promiseId];
+                    break;
+
+                default:
+            }
+        };
+    }
+
+    _.extend(Markdown.prototype, {
+        promises: [],
+
+        render: function(content) {
+            return this._emit('render', content);
+        },
+
+        /**
+         * Send a message to the Webworker.
+         *
+         * @type string msg
+         * @type object data
+         */
+        _emit: function(msg, data) {
+            var self = this;
+
+            // Worker is ready
+            if (!this.workerPromise.promise.isPending()) {
+                return this._send(msg, data);
+            }
+
+            return this.workerPromise.promise
+            .then(function() {
+                return self._send(msg, data);
+            });
+        },
+
+        _send: function(msg, data) {
+
+            // Generate a unique ID for the worker's promise
+            var promiseId = ((1 + Math.random()) * 0x10000);
+            this.promises[promiseId] = Q.defer();
+
+            this.worker.postMessage({
+                msg       : msg,
+                promiseId : promiseId,
+                data      : data
+            });
+
+            return this.promises[promiseId].promise;
+        },
+
+    });
+
+
+    // Parse Markdown without Webworkers
+    if (!Modernizr.webworkers) {
+        return MarkdownIt;
+    }
+
+    return Markdown;
+
+});
diff --git a/app/scripts/modules/markdown/module.js b/app/scripts/modules/markdown/module.js
new file mode 100644
index 000000000..29335b774
--- /dev/null
+++ b/app/scripts/modules/markdown/module.js
@@ -0,0 +1,29 @@
+/**
+ * Copyright (C) 2015 Laverna project Authors.
+ *
+ * This Source Code Form is subject to the terms of the Mozilla Public
+ * License, v. 2.0. If a copy of the MPL was not distributed with this
+ * file, You can obtain one at http://mozilla.org/MPL/2.0/.
+ */
+/* global define */
+define([
+    'backbone.radio',
+    'modules/markdown/libs/markdown'
+], function(Radio, Markdown) {
+    'use strict';
+
+    // Add a global module initializer
+    Radio.request('init', 'add', 'module', function() {
+        console.info('Markdown module has been initialized');
+        var md = new Markdown();
+
+        Radio.reply('markdown', {
+            'render': md.render,
+        }, md);
+
+        if (md.workerPromise) {
+            return md.workerPromise.promise;
+        }
+    });
+
+});
diff --git a/app/scripts/modules/markdown/workers/markdown.js b/app/scripts/modules/markdown/workers/markdown.js
new file mode 100644
index 000000000..40c666e88
--- /dev/null
+++ b/app/scripts/modules/markdown/workers/markdown.js
@@ -0,0 +1,71 @@
+/**
+ * Copyright (C) 2015 Laverna project Authors.
+ *
+ * This Source Code Form is subject to the terms of the Mozilla Public
+ * License, v. 2.0. If a copy of the MPL was not distributed with this
+ * file, You can obtain one at http://mozilla.org/MPL/2.0/.
+ */
+/* global requirejs, importScripts, self */
+'use strict';
+importScripts('../../../../bower_components/requirejs/require.js');
+
+requirejs.config({
+    baseUrl: '../../../',
+    packages: [
+        // Prismjs
+        {
+            name     : 'prism',
+            location : '../bower_components/prism',
+            main     : 'bundle'
+        },
+    ],
+    paths: {
+        q                  : '../bower_components/q/q',
+        underscore         : '../bower_components/underscore/underscore',
+        'markdown-it'      : '../bower_components/markdown-it/dist/markdown-it',
+        'markdown-it-san'  : '../bower_components/markdown-it-sanitizer/dist/markdown-it-sanitizer',
+        'markdown-it-hash' : '../bower_components/markdown-it-hashtag/dist/markdown-it-hashtag',
+    },
+    shim: {
+        'prism/bundle': {
+            exports: 'Prism'
+        },
+    }
+});
+
+// Prevent Prismjs from listening to our events
+self.addEventListener = undefined;
+
+requirejs([
+    'modules/markdown/libs/markdown-it'
+], function(Markdown) {
+    var markdown = new Markdown();
+
+    // Listen to the webworker messages
+    self.onmessage = function(data) {
+        var msg = data.data;
+
+        if (markdown[msg.msg]) {
+            return markdown[msg.msg](msg.data)
+            .then(function(result) {
+                self.postMessage({
+                    msg       : 'done',
+                    promiseId : msg.promiseId,
+                    data      : result
+                });
+            })
+            .fail(function(e) {
+                self.postMessage({
+                    msg       : 'fail',
+                    promiseId : msg.promiseId,
+                    data      : e
+                });
+            });
+        }
+
+        console.error('MarkdownIt module:', 'Method doesn\'t exist', msg.msg);
+    };
+
+    // Post a message that the worker is ready
+    self.postMessage({msg: 'ready'});
+});
diff --git a/bower.json b/bower.json
index bc5b9d07c..0af29c7b4 100644
--- a/bower.json
+++ b/bower.json
@@ -42,7 +42,15 @@
     "xregexp": "~2.0.0",
     "jszip": "Stuk/jszip#~2.5.0"
   },
-  "devDependencies": {},
+  "devDependencies": {
+    "ace": "~1.2.2",
+    "markdown-it": "~5.0.2",
+    "codemirror": "~5.10.0",
+    "highlightjs": "~9.0.0",
+    "prism": "~1.3.0",
+    "markdown-it-sanitizer": "~0.4.1",
+    "markdown-it-hashtag": "~0.4.0"
+  },
   "resolutions": {
     "backbone": "~1.2.3",
     "underscore": "~1.8.3"
diff --git a/gulpfile.js b/gulpfile.js
index 4bf4b1aca..28ffe7865 100644
--- a/gulpfile.js
+++ b/gulpfile.js
@@ -6,7 +6,7 @@ var gulp         = require('gulp'),
     less         = require('gulp-less'),
     rename       = require('gulp-rename'),
     aprefix      = require('gulp-autoprefixer'),
-    // concat    = require('gulp-concat'),
+    concat    = require('gulp-concat'),
     rjs          = require('gulp-requirejs-optimize'),
     merge        = require('merge-stream'),
     uglify       = require('gulp-uglify'),
@@ -168,6 +168,26 @@ gulp.task('clean:dist', ['test'], function() {
     .pipe(clean());
 });
 
+gulp.task('build:prism', function() {
+    /* http://prismjs.com/download.html?themes=prism&languages=markup+css+clike+javascript+abap+actionscript+apacheconf+apl+applescript+aspnet+autoit+autohotkey+bash+basic+batch+c+brainfuck+bison+csharp+cpp+coffeescript+ruby+css-extras+d+dart+diff+docker+eiffel+elixir+erlang+fsharp+fortran+gherkin+git+glsl+go+groovy+handlebars+haskell+haxe+http+icon+inform7+ini+j+jade+java+julia+keyman+kotlin+latex+less+lolcode+lua+makefile+markdown+matlab+mel+mizar+monkey+nasm+nginx+nim+nix+nsis+objectivec+ocaml+oz+parigp+parser+pascal+perl+php+php-extras+powershell+processing+prolog+puppet+pure+python+q+qore+r+jsx+rest+rip+roboconf+crystal+rust+sas+sass+scss+scala+scheme+smalltalk+smarty+sql+stylus+swift+tcl+textile+twig+typescript+verilog+vhdl+vim+wiki+yaml */
+    var components = 'markup+css+clike+javascript+abap+actionscript+apacheconf+apl+applescript+aspnet+autoit+autohotkey+bash+basic+batch+c+brainfuck+bison+csharp+cpp+coffeescript+ruby+css-extras+d+dart+diff+docker+eiffel+elixir+erlang+fsharp+fortran+gherkin+git+glsl+go+groovy+handlebars+haskell+haxe+http+icon+inform7+ini+j+jade+java+julia+keyman+kotlin+latex+less+lolcode+lua+makefile+markdown+matlab+mel+mizar+monkey+nasm+nginx+nim+nix+nsis+objectivec+ocaml+oz+parigp+parser+pascal+perl+php+php-extras+powershell+processing+prolog+puppet+pure+python+q+qore+r+jsx+rest+rip+roboconf+crystal+rust+sas+sass+scss+scala+scheme+smalltalk+smarty+sql+stylus+swift+tcl+textile+twig+typescript+verilog+vhdl+vim+wiki+yaml',
+        files      = [];
+
+    components = components.split('+');
+    components.unshift('core');
+
+    components.forEach(function(item) {
+        files.push(
+            './app/bower_components/prism/components/prism-' + item + '.js'
+        );
+    });
+
+    return gulp.src(files)
+    .pipe(concat('bundle.js'))
+    // .pipe(uglify())
+    .pipe(gulp.dest('./app/bower_components/prism'));
+});
+
 /**
  * Minify JS files.
  * Require.js config example:

From 0c8b07701601db52ee552dd79045cd64205dcf80 Mon Sep 17 00:00:00 2001
From: wwebfor <wwebfor@users.noreply.github.com>
Date: Fri, 25 Dec 2015 19:02:53 +0600
Subject: [PATCH 03/25] Add Codemirror CSS styles

---
 app/styles/core/codemirror.less          | 344 +++++++++++++++++++++++
 app/styles/core/main.less                |   1 +
 app/styles/core/pagedown.less            |   2 +
 app/styles/theme-default/codemirror.less |  18 ++
 app/styles/theme-default/main.less       |   1 +
 5 files changed, 366 insertions(+)
 create mode 100644 app/styles/core/codemirror.less
 create mode 100644 app/styles/theme-default/codemirror.less

diff --git a/app/styles/core/codemirror.less b/app/styles/core/codemirror.less
new file mode 100644
index 000000000..911375ef0
--- /dev/null
+++ b/app/styles/core/codemirror.less
@@ -0,0 +1,344 @@
+/* BASICS */
+
+.CodeMirror {
+    /* Set height, width, borders, and global font properties here */
+    font-family : @font-family-sans-serif;
+    height      : auto;
+    position    : absolute !important;
+    top         : 0 !important;
+    bottom      : 0 !important;
+    left        : 0 !important;
+    right       : 0 !important;
+}
+
+/* PADDING */
+
+.CodeMirror-lines {
+    padding: 15px 10px; /* Vertical padding around content */
+}
+.CodeMirror pre {
+    padding: 0 4px; /* Horizontal padding of content */
+}
+
+.CodeMirror-scrollbar-filler, .CodeMirror-gutter-filler {
+    background-color: white; /* The little square between H and V scrollbars */
+}
+
+/* GUTTER */
+
+.CodeMirror-gutters {
+    border-right: 1px solid #ddd;
+    background-color: #f7f7f7;
+    white-space: nowrap;
+}
+.CodeMirror-linenumbers {}
+.CodeMirror-linenumber {
+    padding: 0 3px 0 5px;
+    min-width: 20px;
+    text-align: right;
+    color: #999;
+    white-space: nowrap;
+}
+
+.CodeMirror-guttermarker { color: black; }
+.CodeMirror-guttermarker-subtle { color: #999; }
+
+/* CURSOR */
+
+.CodeMirror-cursor {
+    border-left: 1px solid black;
+    border-right: none;
+    width: 0;
+}
+/* Shown when moving in bi-directional text */
+.CodeMirror div.CodeMirror-secondarycursor {
+    border-left: 1px solid silver;
+}
+.cm-fat-cursor .CodeMirror-cursor {
+    width: auto;
+    border: 0;
+    background: #7e7;
+}
+.cm-fat-cursor div.CodeMirror-cursors {
+    z-index: 1;
+}
+
+.cm-animate-fat-cursor {
+    width: auto;
+    border: 0;
+    -webkit-animation: blink 1.06s steps(1) infinite;
+    -moz-animation: blink 1.06s steps(1) infinite;
+    animation: blink 1.06s steps(1) infinite;
+    background-color: #7e7;
+}
+@-moz-keyframes blink {
+    0% {}
+    50% { background-color: transparent; }
+    100% {}
+}
+@-webkit-keyframes blink {
+    0% {}
+    50% { background-color: transparent; }
+    100% {}
+}
+@keyframes blink {
+    0% {}
+    50% { background-color: transparent; }
+    100% {}
+}
+
+/* Can style cursor different in overwrite (non-insert) mode */
+.CodeMirror-overwrite .CodeMirror-cursor {}
+
+.cm-tab { display: inline-block; text-decoration: inherit; }
+
+.CodeMirror-ruler {
+    border-left: 1px solid #ccc;
+    position: absolute;
+}
+
+/**
+ * Default theme
+ */
+.cm-s-default .cm-header-1 {
+    &:extend(h1);
+    line-height: floor((@font-size-h1 * @line-height-base));
+}
+.cm-s-default .cm-header-2 {
+    &:extend(h2);
+    line-height: floor((@font-size-h2 * @line-height-base));
+}
+.cm-s-default .cm-header-3 {
+    &:extend(h3);
+    line-height: floor((@font-size-h3 * @line-height-base));
+}
+.cm-s-default .cm-header-4 {
+    &:extend(h4);
+    line-height: floor((@font-size-h4 * @line-height-base));
+}
+.cm-s-default .cm-header-5 {
+    &:extend(h5);
+    line-height: floor((@font-size-h5 * @line-height-base));
+}
+.cm-s-default .cm-header-6 {
+    &:extend(h6);
+    line-height: floor((@font-size-h6 * @line-height-base));
+}
+
+.cm-s-default .cm-quote {
+}
+
+.cm-negative {}
+.cm-positive {}
+.cm-header, .cm-strong:extend(strong) {}
+.cm-em {
+    font-style: italic;
+}
+.cm-link {
+    text-decoration: underline;
+}
+.cm-strikethrough {text-decoration: line-through;}
+
+.CodeMirror-composing { border-bottom: 2px solid; }
+
+/* Default styles for common addons */
+
+div.CodeMirror span.CodeMirror-matchingbracket {color: #0f0;}
+div.CodeMirror span.CodeMirror-nonmatchingbracket {color: #f22;}
+.CodeMirror-matchingtag { background: rgba(255, 150, 0, .3); }
+.CodeMirror-activeline-background {background: #e8f2ff;}
+
+/* STOP */
+
+/* The rest of this file contains styles related to the mechanics of
+the editor. You probably shouldn't touch them. */
+
+.CodeMirror {
+    // position: relative;
+    // overflow: hidden;
+    // background: white;
+}
+
+.CodeMirror-scroll {
+    overflow: scroll !important; /* Things will break if this is overridden */
+    /* 30px is the magic margin used to hide the element's real scrollbars */
+    /* See overflow: hidden in .CodeMirror */
+    margin-bottom: -30px; margin-right: -30px;
+    padding-bottom: 30px;
+    height: 100%;
+    outline: none; /* Prevent dragging from highlighting the element */
+    position: relative;
+}
+.CodeMirror-sizer {
+    position: relative;
+    border-right: 30px solid transparent;
+}
+
+/* The fake, visible scrollbars. Used to force redraw during scrolling
+before actual scrolling happens, thus preventing shaking and
+flickering artifacts. */
+.CodeMirror-vscrollbar, .CodeMirror-hscrollbar, .CodeMirror-scrollbar-filler, .CodeMirror-gutter-filler {
+    position: absolute;
+    z-index: 6;
+    display: none;
+}
+.CodeMirror-vscrollbar {
+    right: 0; top: 0;
+    overflow-x: hidden;
+    overflow-y: scroll;
+}
+.CodeMirror-hscrollbar {
+    bottom: 0; left: 0;
+    overflow-y: hidden;
+    overflow-x: scroll;
+}
+.CodeMirror-scrollbar-filler {
+    right: 0; bottom: 0;
+}
+.CodeMirror-gutter-filler {
+    left: 0; bottom: 0;
+}
+
+.CodeMirror-gutters {
+    position: absolute; left: 0; top: 0;
+    z-index: 3;
+}
+.CodeMirror-gutter {
+    white-space: normal;
+    height: 100%;
+    display: inline-block;
+    margin-bottom: -30px;
+    /* Hack to make IE7 behave */
+    *zoom:1;
+    *display:inline;
+}
+.CodeMirror-gutter-wrapper {
+    position: absolute;
+    z-index: 4;
+    background: none !important;
+    border: none !important;
+}
+.CodeMirror-gutter-background {
+    position: absolute;
+    top: 0; bottom: 0;
+    z-index: 4;
+}
+.CodeMirror-gutter-elt {
+    position: absolute;
+    cursor: default;
+    z-index: 4;
+}
+.CodeMirror-gutter-wrapper {
+    -webkit-user-select: none;
+    -moz-user-select: none;
+    user-select: none;
+}
+
+.CodeMirror-lines {
+    cursor: text;
+    min-height: 1px; /* prevents collapsing before first draw */
+}
+.CodeMirror pre {
+    /* Reset some styles that the rest of the page might have set */
+    -moz-border-radius: 0; -webkit-border-radius: 0; border-radius: 0;
+    border-width: 0;
+    background: transparent;
+    font-family: inherit;
+    font-size: @font-size-base * 1;
+    line-height: floor((@font-size-base * 1 * @line-height-base));
+    margin: 0;
+    white-space: pre;
+    word-wrap: normal;
+    color: inherit;
+    z-index: 2;
+    position: relative;
+    overflow: visible;
+    -webkit-tap-highlight-color: transparent;
+}
+.CodeMirror-wrap pre {
+    word-wrap: break-word;
+    white-space: pre-wrap;
+    word-break: normal;
+}
+
+.CodeMirror-linebackground {
+    position: absolute;
+    left: 0; right: 0; top: 0; bottom: 0;
+    z-index: 0;
+}
+
+.CodeMirror-linewidget {
+    position: relative;
+    z-index: 2;
+    overflow: auto;
+}
+
+.CodeMirror-widget {}
+
+.CodeMirror-code {
+    outline: none;
+}
+
+/* Force content-box sizing for the elements where we expect it */
+.CodeMirror-scroll,
+.CodeMirror-sizer,
+.CodeMirror-gutter,
+.CodeMirror-gutters,
+.CodeMirror-linenumber {
+    -moz-box-sizing: content-box;
+    box-sizing: content-box;
+}
+
+.CodeMirror-measure {
+    position: absolute;
+    width: 100%;
+    height: 0;
+    overflow: hidden;
+    visibility: hidden;
+}
+
+.CodeMirror-cursor { position: absolute; }
+.CodeMirror-measure pre { position: static; }
+
+div.CodeMirror-cursors {
+    visibility: hidden;
+    position: relative;
+    z-index: 3;
+}
+div.CodeMirror-dragcursors {
+    visibility: visible;
+}
+
+.CodeMirror-focused div.CodeMirror-cursors {
+    visibility: visible;
+}
+
+.CodeMirror-selected { background: #d9d9d9; }
+.CodeMirror-focused .CodeMirror-selected { background: #d7d4f0; }
+.CodeMirror-crosshair { cursor: crosshair; }
+.CodeMirror-line::selection, .CodeMirror-line > span::selection, .CodeMirror-line > span > span::selection { background: #d7d4f0; }
+.CodeMirror-line::-moz-selection, .CodeMirror-line > span::-moz-selection, .CodeMirror-line > span > span::-moz-selection { background: #d7d4f0; }
+
+.cm-searching {
+    background: #ffa;
+    background: rgba(255, 255, 0, .4);
+}
+
+/* IE7 hack to prevent it from returning funny offsetTops on the spans */
+.CodeMirror span { *vertical-align: text-bottom; }
+
+/* Used to force a border model for a node */
+.cm-force-border { padding-right: .1px; }
+
+@media print {
+    /* Hide the cursor when printing */
+    .CodeMirror div.CodeMirror-cursors {
+        visibility: hidden;
+    }
+}
+
+/* See issue #2901 */
+.cm-tab-wrap-hack:after { content: ''; }
+
+/* Help users use markselection to safely style text background */
+span.CodeMirror-selectedtext { background: none; }
diff --git a/app/styles/core/main.less b/app/styles/core/main.less
index e55f40d38..52d4a009c 100644
--- a/app/styles/core/main.less
+++ b/app/styles/core/main.less
@@ -18,6 +18,7 @@
 @import 'fuzzy.less';
 
 // Editor
+@import 'codemirror.less';
 @import 'pagedown.less';
 @import 'editor.less';
 
diff --git a/app/styles/core/pagedown.less b/app/styles/core/pagedown.less
index 49b7d8af6..4fcd76d30 100644
--- a/app/styles/core/pagedown.less
+++ b/app/styles/core/pagedown.less
@@ -152,6 +152,8 @@
 
         &.-left {
             left: 0;
+            padding-left: 0;
+            padding-right: 0;
         }
         &.-right {
             right: 0;
diff --git a/app/styles/theme-default/codemirror.less b/app/styles/theme-default/codemirror.less
new file mode 100644
index 000000000..c8356dd71
--- /dev/null
+++ b/app/styles/theme-default/codemirror.less
@@ -0,0 +1,18 @@
+.CodeMirror {
+    background  : white;
+}
+
+.cm-link {
+    color: @gray;
+}
+.cm-url {
+    color: @gray-light;
+}
+
+.cm-comment {
+    background-color: lighten(@gray-lighter, 2);
+}
+
+.cm-quote {
+    color: @gray-light;
+}
diff --git a/app/styles/theme-default/main.less b/app/styles/theme-default/main.less
index 264f30cfb..a6f13906d 100644
--- a/app/styles/theme-default/main.less
+++ b/app/styles/theme-default/main.less
@@ -27,6 +27,7 @@
 
 // Pagedown editor
 @import 'editor.less';
+@import 'codemirror.less';
 @import 'pagedown.less';
 
 // Google code prettify

From 869852db2fc2aba434a4bde03c7612f46361c637 Mon Sep 17 00:00:00 2001
From: wwwredfish <wwwredfish@gmail.com>
Date: Fri, 25 Dec 2015 19:03:46 +0600
Subject: [PATCH 04/25] Fix fileDialog and linkDialog modules

---
 app/scripts/modules/fileDialog/controller.js |  7 ++--
 app/scripts/modules/fileDialog/module.js     | 37 +++++++++++++-------
 app/scripts/modules/linkDialog/module.js     | 27 +++++++-------
 3 files changed, 41 insertions(+), 30 deletions(-)

diff --git a/app/scripts/modules/fileDialog/controller.js b/app/scripts/modules/fileDialog/controller.js
index 8ce3ffe0f..5c25ed926 100644
--- a/app/scripts/modules/fileDialog/controller.js
+++ b/app/scripts/modules/fileDialog/controller.js
@@ -74,9 +74,7 @@ define([
 
                 // If there is only 1 file and its type is image
                 if (files.length === 1 && self.isImage(files[0])) {
-                    return self.attachImage(
-                        Radio.request('uri', 'link:file', files[0])
-                    );
+                    return self.attachImage(self.generateCode(files[0]));
                 }
 
                 // Otherwise, we will generate custom Markdown code
@@ -106,8 +104,7 @@ define([
                 }, this);
             }
 
-            Radio.request('editor', 'insert', str);
-            this.attachImage(null);
+            this.attachImage(str);
         },
 
         attachImage: function(url) {
diff --git a/app/scripts/modules/fileDialog/module.js b/app/scripts/modules/fileDialog/module.js
index bad02985b..1a7225911 100644
--- a/app/scripts/modules/fileDialog/module.js
+++ b/app/scripts/modules/fileDialog/module.js
@@ -1,6 +1,6 @@
 /**
  * Copyright (C) 2015 Laverna project Authors.
- * 
+ *
  * This Source Code Form is subject to the terms of the Mozilla Public
  * License, v. 2.0. If a copy of the MPL was not distributed with this
  * file, You can obtain one at http://mozilla.org/MPL/2.0/.
@@ -8,11 +8,12 @@
 /* global define */
 define([
     'underscore',
+    'q',
     'modules',
     'backbone.radio',
     'modules/fileDialog/controller',
     'modules/fileDialog/helper'
-], function(_, Modules, Radio, Controller, Helper) {
+], function(_, Q, Modules, Radio, Controller, Helper) {
     'use strict';
 
     /**
@@ -46,6 +47,8 @@ define([
     });
 
     FileDialog.on('before:stop', function() {
+        console.info('FileDialog stopped');
+
         Helper.revokeUrls();
         this.stopListening();
         FileDialog.controller = null;
@@ -70,23 +73,33 @@ define([
         });
     }
 
-    // Show custom dialog on `insertImageDialog` hook.
-    Radio.request('init', 'add', 'editor:before', function(editor, model) {
-        editor.hooks.set('insertImageDialog', function(fnc) {
-            FileDialog.start({callback: fnc, model: model});
-            return true;
-        });
-    });
+    // Radio.request('init', 'add', 'editor:before', function(editor, model) {
+    //     editor.hooks.set('insertImageDialog', function(fnc) {
+    //         return true;
+    //     });
+    // });
 
     Radio.request('init', 'add', 'module', function() {
+
+        // Stop the module when editor is closed.
+        Radio.on('editor', 'destroy', FileDialog.stop, FileDialog);
+
+        // Show custom dialog on `insertImageDialog` hook.
+        Radio.reply('editor', 'show:attachment', function(model) {
+            var defer = Q.defer();
+
+            FileDialog.start({model: model, callback: function(link) {
+                defer.resolve(link);
+            }});
+
+            return defer.promise;
+        });
+
         Radio.reply('editor', 'get:files', Helper.getFileIds, Helper);
 
         // When editor converter is initialized, add hooks
         Radio.on('editor', 'converter:init', addHook);
 
-        // Stop the module when editor is closed.
-        Radio.on('editor', 'destroy', FileDialog.stop, FileDialog);
-
         // Revoke all URLs when a note is closed.
         Radio.on('noteView', 'view:destroy', Helper.revokeUrls, Helper);
     });
diff --git a/app/scripts/modules/linkDialog/module.js b/app/scripts/modules/linkDialog/module.js
index 5f4d7bf1a..fc9827e20 100644
--- a/app/scripts/modules/linkDialog/module.js
+++ b/app/scripts/modules/linkDialog/module.js
@@ -8,10 +8,11 @@
 /* global define */
 define([
     'underscore',
+    'q',
     'modules',
     'backbone.radio',
     'modules/linkDialog/controller'
-], function(_, Modules, Radio, Controller) {
+], function(_, Q, Modules, Radio, Controller) {
     'use strict';
 
     /**
@@ -34,25 +35,25 @@ define([
     });
 
     LinkDialog.on('before:stop', function() {
+        console.info('LinkDialog stopped');
+
         this.stopListening();
         LinkDialog.controller = null;
     });
 
-    Radio.request('init', 'add', 'editor:before', function(editor) {
-        if (!editor.hooks.insertLinkDialog) {
-            return;
-        }
-
-        // Register a hook
-        editor.hooks.set('insertLinkDialog', function(fnc) {
-            LinkDialog.start({callback: fnc});
-            return true;
-        });
-    });
-
     // Stop the module when editor is closed
     Radio.request('init', 'add', 'module', function() {
         Radio.on('editor', 'destroy', LinkDialog.stop, LinkDialog);
+
+        Radio.reply('editor', 'show:link', function() {
+            var defer = Q.defer();
+
+            LinkDialog.start({callback: function(link) {
+                defer.resolve(link);
+            }});
+
+            return defer.promise;
+        });
     });
 
     return LinkDialog;

From f4e3bf9082245478824b10c650d4cf1c53f956f7 Mon Sep 17 00:00:00 2001
From: wwebfor <wwebfor@users.noreply.github.com>
Date: Mon, 28 Dec 2015 14:18:58 +0600
Subject: [PATCH 05/25] Fix Codemirror's fullscreen and normal modes

---
 app/scripts/modules/codemirror/controller.js  |   5 +
 .../modules/codemirror/templates/editor.html  |  16 +-
 app/styles/core/codemirror.less               | 346 +-----------------
 app/styles/core/codemirror/core.less          | 333 +++++++++++++++++
 app/styles/core/codemirror/theme.less         |  69 ++++
 app/styles/core/editor.less                   | 159 +++++++-
 app/styles/core/main.less                     |   2 +-
 app/styles/core/pagedown.less                 | 147 --------
 app/styles/theme-default/editor.less          |  32 +-
 app/styles/theme-default/main.less            |   2 +-
 app/styles/theme-default/pagedown.less        |  26 --
 11 files changed, 608 insertions(+), 529 deletions(-)
 create mode 100644 app/styles/core/codemirror/core.less
 create mode 100644 app/styles/core/codemirror/theme.less

diff --git a/app/scripts/modules/codemirror/controller.js b/app/scripts/modules/codemirror/controller.js
index 5633a8ec3..664429e0c 100644
--- a/app/scripts/modules/codemirror/controller.js
+++ b/app/scripts/modules/codemirror/controller.js
@@ -72,6 +72,7 @@ define([
 
             // Events
             this.listenTo(this.view, 'editor:action', this.onViewAction);
+            this.listenTo(Radio.channel('notesForm'), 'set:mode', this.changeMode);
 
             // Show the view and render Pagedown editor
             Radio.request('notesForm', 'show:editor', this.view);
@@ -139,6 +140,10 @@ define([
             this.updatePreview();
         },
 
+        changeMode: function() {
+            window.dispatchEvent(new Event('resize'));
+        },
+
         /**
          * Update the preview.
          */
diff --git a/app/scripts/modules/codemirror/templates/editor.html b/app/scripts/modules/codemirror/templates/editor.html
index 472a256bb..a40ed9712 100644
--- a/app/scripts/modules/codemirror/templates/editor.html
+++ b/app/scripts/modules/codemirror/templates/editor.html
@@ -1,4 +1,4 @@
-<div class="pagedown--bar dropdown text-center">
+<div class="editor--bar dropdown text-center">
     <div class="btn-group editor--btns">
         <span data-action="bold" data-state="strong" class="btn">
             <i class="icon-bold"></i>
@@ -47,23 +47,23 @@
 
 <div class="btn-group btn-group-justified hidden -show">
     <div class="btn-group">
-        <button data-col="left" class="btn btn-default active pagedown--col--btn">
+        <button data-col="left" class="btn btn-default active editor--col--btn">
             {{i18n('Editor')}}
         </button>
     </div>
     <div class="btn-group">
-        <button data-col="right" class="btn btn-default pagedown--col--btn">
+        <button data-col="right" class="btn btn-default editor--col--btn">
             {{i18n('Preview')}}
         </button>
     </div>
 </div>
 
-<div class="pagedown--row">
-    <div class="pagedown--layout -left -show">
-        <textarea class="pagedown--input" id="editor--input" name="content">{{content}}</textarea>
+<div class="editor--row">
+    <div class="editor--layout -left -show">
+        <textarea class="editor--input" id="editor--input" name="content">{{content}}</textarea>
     </div>
 
-    <div class="pagedown--layout -right">
-        <div class="pagedown--preview" id="wmd-preview"></div>
+    <div class="editor--layout -right">
+        <div class="editor--preview" id="wmd-preview"></div>
     </div>
 </div>
diff --git a/app/styles/core/codemirror.less b/app/styles/core/codemirror.less
index 911375ef0..e339c21ba 100644
--- a/app/styles/core/codemirror.less
+++ b/app/styles/core/codemirror.less
@@ -1,344 +1,2 @@
-/* BASICS */
-
-.CodeMirror {
-    /* Set height, width, borders, and global font properties here */
-    font-family : @font-family-sans-serif;
-    height      : auto;
-    position    : absolute !important;
-    top         : 0 !important;
-    bottom      : 0 !important;
-    left        : 0 !important;
-    right       : 0 !important;
-}
-
-/* PADDING */
-
-.CodeMirror-lines {
-    padding: 15px 10px; /* Vertical padding around content */
-}
-.CodeMirror pre {
-    padding: 0 4px; /* Horizontal padding of content */
-}
-
-.CodeMirror-scrollbar-filler, .CodeMirror-gutter-filler {
-    background-color: white; /* The little square between H and V scrollbars */
-}
-
-/* GUTTER */
-
-.CodeMirror-gutters {
-    border-right: 1px solid #ddd;
-    background-color: #f7f7f7;
-    white-space: nowrap;
-}
-.CodeMirror-linenumbers {}
-.CodeMirror-linenumber {
-    padding: 0 3px 0 5px;
-    min-width: 20px;
-    text-align: right;
-    color: #999;
-    white-space: nowrap;
-}
-
-.CodeMirror-guttermarker { color: black; }
-.CodeMirror-guttermarker-subtle { color: #999; }
-
-/* CURSOR */
-
-.CodeMirror-cursor {
-    border-left: 1px solid black;
-    border-right: none;
-    width: 0;
-}
-/* Shown when moving in bi-directional text */
-.CodeMirror div.CodeMirror-secondarycursor {
-    border-left: 1px solid silver;
-}
-.cm-fat-cursor .CodeMirror-cursor {
-    width: auto;
-    border: 0;
-    background: #7e7;
-}
-.cm-fat-cursor div.CodeMirror-cursors {
-    z-index: 1;
-}
-
-.cm-animate-fat-cursor {
-    width: auto;
-    border: 0;
-    -webkit-animation: blink 1.06s steps(1) infinite;
-    -moz-animation: blink 1.06s steps(1) infinite;
-    animation: blink 1.06s steps(1) infinite;
-    background-color: #7e7;
-}
-@-moz-keyframes blink {
-    0% {}
-    50% { background-color: transparent; }
-    100% {}
-}
-@-webkit-keyframes blink {
-    0% {}
-    50% { background-color: transparent; }
-    100% {}
-}
-@keyframes blink {
-    0% {}
-    50% { background-color: transparent; }
-    100% {}
-}
-
-/* Can style cursor different in overwrite (non-insert) mode */
-.CodeMirror-overwrite .CodeMirror-cursor {}
-
-.cm-tab { display: inline-block; text-decoration: inherit; }
-
-.CodeMirror-ruler {
-    border-left: 1px solid #ccc;
-    position: absolute;
-}
-
-/**
- * Default theme
- */
-.cm-s-default .cm-header-1 {
-    &:extend(h1);
-    line-height: floor((@font-size-h1 * @line-height-base));
-}
-.cm-s-default .cm-header-2 {
-    &:extend(h2);
-    line-height: floor((@font-size-h2 * @line-height-base));
-}
-.cm-s-default .cm-header-3 {
-    &:extend(h3);
-    line-height: floor((@font-size-h3 * @line-height-base));
-}
-.cm-s-default .cm-header-4 {
-    &:extend(h4);
-    line-height: floor((@font-size-h4 * @line-height-base));
-}
-.cm-s-default .cm-header-5 {
-    &:extend(h5);
-    line-height: floor((@font-size-h5 * @line-height-base));
-}
-.cm-s-default .cm-header-6 {
-    &:extend(h6);
-    line-height: floor((@font-size-h6 * @line-height-base));
-}
-
-.cm-s-default .cm-quote {
-}
-
-.cm-negative {}
-.cm-positive {}
-.cm-header, .cm-strong:extend(strong) {}
-.cm-em {
-    font-style: italic;
-}
-.cm-link {
-    text-decoration: underline;
-}
-.cm-strikethrough {text-decoration: line-through;}
-
-.CodeMirror-composing { border-bottom: 2px solid; }
-
-/* Default styles for common addons */
-
-div.CodeMirror span.CodeMirror-matchingbracket {color: #0f0;}
-div.CodeMirror span.CodeMirror-nonmatchingbracket {color: #f22;}
-.CodeMirror-matchingtag { background: rgba(255, 150, 0, .3); }
-.CodeMirror-activeline-background {background: #e8f2ff;}
-
-/* STOP */
-
-/* The rest of this file contains styles related to the mechanics of
-the editor. You probably shouldn't touch them. */
-
-.CodeMirror {
-    // position: relative;
-    // overflow: hidden;
-    // background: white;
-}
-
-.CodeMirror-scroll {
-    overflow: scroll !important; /* Things will break if this is overridden */
-    /* 30px is the magic margin used to hide the element's real scrollbars */
-    /* See overflow: hidden in .CodeMirror */
-    margin-bottom: -30px; margin-right: -30px;
-    padding-bottom: 30px;
-    height: 100%;
-    outline: none; /* Prevent dragging from highlighting the element */
-    position: relative;
-}
-.CodeMirror-sizer {
-    position: relative;
-    border-right: 30px solid transparent;
-}
-
-/* The fake, visible scrollbars. Used to force redraw during scrolling
-before actual scrolling happens, thus preventing shaking and
-flickering artifacts. */
-.CodeMirror-vscrollbar, .CodeMirror-hscrollbar, .CodeMirror-scrollbar-filler, .CodeMirror-gutter-filler {
-    position: absolute;
-    z-index: 6;
-    display: none;
-}
-.CodeMirror-vscrollbar {
-    right: 0; top: 0;
-    overflow-x: hidden;
-    overflow-y: scroll;
-}
-.CodeMirror-hscrollbar {
-    bottom: 0; left: 0;
-    overflow-y: hidden;
-    overflow-x: scroll;
-}
-.CodeMirror-scrollbar-filler {
-    right: 0; bottom: 0;
-}
-.CodeMirror-gutter-filler {
-    left: 0; bottom: 0;
-}
-
-.CodeMirror-gutters {
-    position: absolute; left: 0; top: 0;
-    z-index: 3;
-}
-.CodeMirror-gutter {
-    white-space: normal;
-    height: 100%;
-    display: inline-block;
-    margin-bottom: -30px;
-    /* Hack to make IE7 behave */
-    *zoom:1;
-    *display:inline;
-}
-.CodeMirror-gutter-wrapper {
-    position: absolute;
-    z-index: 4;
-    background: none !important;
-    border: none !important;
-}
-.CodeMirror-gutter-background {
-    position: absolute;
-    top: 0; bottom: 0;
-    z-index: 4;
-}
-.CodeMirror-gutter-elt {
-    position: absolute;
-    cursor: default;
-    z-index: 4;
-}
-.CodeMirror-gutter-wrapper {
-    -webkit-user-select: none;
-    -moz-user-select: none;
-    user-select: none;
-}
-
-.CodeMirror-lines {
-    cursor: text;
-    min-height: 1px; /* prevents collapsing before first draw */
-}
-.CodeMirror pre {
-    /* Reset some styles that the rest of the page might have set */
-    -moz-border-radius: 0; -webkit-border-radius: 0; border-radius: 0;
-    border-width: 0;
-    background: transparent;
-    font-family: inherit;
-    font-size: @font-size-base * 1;
-    line-height: floor((@font-size-base * 1 * @line-height-base));
-    margin: 0;
-    white-space: pre;
-    word-wrap: normal;
-    color: inherit;
-    z-index: 2;
-    position: relative;
-    overflow: visible;
-    -webkit-tap-highlight-color: transparent;
-}
-.CodeMirror-wrap pre {
-    word-wrap: break-word;
-    white-space: pre-wrap;
-    word-break: normal;
-}
-
-.CodeMirror-linebackground {
-    position: absolute;
-    left: 0; right: 0; top: 0; bottom: 0;
-    z-index: 0;
-}
-
-.CodeMirror-linewidget {
-    position: relative;
-    z-index: 2;
-    overflow: auto;
-}
-
-.CodeMirror-widget {}
-
-.CodeMirror-code {
-    outline: none;
-}
-
-/* Force content-box sizing for the elements where we expect it */
-.CodeMirror-scroll,
-.CodeMirror-sizer,
-.CodeMirror-gutter,
-.CodeMirror-gutters,
-.CodeMirror-linenumber {
-    -moz-box-sizing: content-box;
-    box-sizing: content-box;
-}
-
-.CodeMirror-measure {
-    position: absolute;
-    width: 100%;
-    height: 0;
-    overflow: hidden;
-    visibility: hidden;
-}
-
-.CodeMirror-cursor { position: absolute; }
-.CodeMirror-measure pre { position: static; }
-
-div.CodeMirror-cursors {
-    visibility: hidden;
-    position: relative;
-    z-index: 3;
-}
-div.CodeMirror-dragcursors {
-    visibility: visible;
-}
-
-.CodeMirror-focused div.CodeMirror-cursors {
-    visibility: visible;
-}
-
-.CodeMirror-selected { background: #d9d9d9; }
-.CodeMirror-focused .CodeMirror-selected { background: #d7d4f0; }
-.CodeMirror-crosshair { cursor: crosshair; }
-.CodeMirror-line::selection, .CodeMirror-line > span::selection, .CodeMirror-line > span > span::selection { background: #d7d4f0; }
-.CodeMirror-line::-moz-selection, .CodeMirror-line > span::-moz-selection, .CodeMirror-line > span > span::-moz-selection { background: #d7d4f0; }
-
-.cm-searching {
-    background: #ffa;
-    background: rgba(255, 255, 0, .4);
-}
-
-/* IE7 hack to prevent it from returning funny offsetTops on the spans */
-.CodeMirror span { *vertical-align: text-bottom; }
-
-/* Used to force a border model for a node */
-.cm-force-border { padding-right: .1px; }
-
-@media print {
-    /* Hide the cursor when printing */
-    .CodeMirror div.CodeMirror-cursors {
-        visibility: hidden;
-    }
-}
-
-/* See issue #2901 */
-.cm-tab-wrap-hack:after { content: ''; }
-
-/* Help users use markselection to safely style text background */
-span.CodeMirror-selectedtext { background: none; }
+@import 'codemirror/core.less';
+@import 'codemirror/theme.less';
diff --git a/app/styles/core/codemirror/core.less b/app/styles/core/codemirror/core.less
new file mode 100644
index 000000000..81ad35309
--- /dev/null
+++ b/app/styles/core/codemirror/core.less
@@ -0,0 +1,333 @@
+/**
+ * Core Codemirror styles.
+ */
+.CodeMirror {
+    /* Set height, width, borders, and global font properties here */
+    font-family    : @font-family-sans-serif;
+    height         : auto;
+    viewportMargin : Infinity;
+    position       : relative;
+    overflow       : hidden;
+}
+
+.editor--fullscreen.-preview {
+    .CodeMirror {
+        height      : 100% !important;
+        position    : absolute !important;
+        top         : 0 !important;
+        bottom      : 0 !important;
+        left        : 0 !important;
+        right       : 0 !important;
+    }
+    .CodeMirror-scroll {
+        overflow: scroll !important;
+    }
+}
+
+/**
+ * Scrollbar
+ */
+.CodeMirror-scroll {
+    overflow: scroll !important; /* Things will break if this is overridden */
+    /* 30px is the magic margin used to hide the element's real scrollbars */
+    /* See overflow: hidden in .CodeMirror */
+
+    margin-bottom  : -30px;
+    margin-right   : -30px;
+    padding-bottom : 30px;
+    height         : 100%;
+    outline        : none; // Prevent dragging from highlighting the element
+    position       : relative;
+}
+.CodeMirror-sizer {
+    position     : relative;
+    border-right : 30px solid transparent;
+}
+
+/* The fake, visible scrollbars. Used to force redraw during scrolling
+before actual scrolling happens, thus preventing shaking and
+flickering artifacts. */
+.CodeMirror-vscrollbar,
+.CodeMirror-hscrollbar,
+.CodeMirror-scrollbar-filler,
+.CodeMirror-gutter-filler {
+    position: absolute;
+    z-index: 6;
+    display: none;
+}
+.CodeMirror-vscrollbar {
+    right: 0; top: 0;
+    overflow-x: hidden;
+    overflow-y: scroll;
+}
+.CodeMirror-hscrollbar {
+    bottom: 0; left: 0;
+    overflow-y: hidden;
+    overflow-x: scroll;
+}
+.CodeMirror-scrollbar-filler {
+    right: 0; bottom: 0;
+}
+.CodeMirror-gutter-filler {
+    left: 0; bottom: 0;
+}
+
+/**
+ * Paddings
+ */
+.CodeMirror-lines {
+    padding    : 15px 10px; // Vertical padding around content
+    cursor     : text;
+    min-height : 1px;       // prevents collapsing before first draw
+}
+.CodeMirror pre {
+    padding: 0 4px; // Horizontal padding of content
+
+    /* Reset some styles that the rest of the page might have set */
+    -moz-border-radius    : 0;
+    -webkit-border-radius : 0;
+    border-radius         : 0;
+
+    border-width  : 0;
+    background    : transparent;
+    font-family   : inherit;
+    font-size     : @font-size-base * 1;
+    line-height   : floor((@font-size-base * 1 * @line-height-base));
+    margin        : 0;
+    white-space   : pre;
+    word-wrap     : normal;
+    color         : inherit;
+    z-index       : 2;
+    position      : relative;
+    overflow      : visible;
+    -webkit-tap-highlight-color: transparent;
+}
+.CodeMirror-wrap pre {
+    word-wrap   : break-word;
+    white-space : pre-wrap;
+    word-break  : normal;
+}
+
+.CodeMirror-linebackground {
+    position : absolute;
+    left     : 0;
+    right    : 0;
+    top      : 0;
+    bottom   : 0;
+    z-index  : 0;
+}
+
+.CodeMirror-linewidget {
+    position : relative;
+    z-index  : 2;
+    overflow : auto;
+}
+
+.CodeMirror-code {
+    outline: none;
+}
+
+// Force content-box sizing for the elements where we expect it
+.CodeMirror-scroll,
+.CodeMirror-sizer,
+.CodeMirror-gutter,
+.CodeMirror-gutters,
+.CodeMirror-linenumber {
+    -moz-box-sizing : content-box;
+    box-sizing      : content-box;
+}
+
+.CodeMirror-measure {
+    position   : absolute;
+    width      : 100%;
+    height     : 0;
+    overflow   : hidden;
+    visibility : hidden;
+}
+
+// The little square between H and V scrollbars
+.CodeMirror-scrollbar-filler,
+.CodeMirror-gutter-filler {
+    background-color: white;
+}
+
+.CodeMirror-measure pre {
+    position: static;
+}
+
+.CodeMirror-selected {
+    background: #d9d9d9;
+}
+.CodeMirror-focused .CodeMirror-selected {
+    background: #d7d4f0;
+}
+.CodeMirror-crosshair {
+    cursor: crosshair;
+}
+.CodeMirror-line::selection,
+.CodeMirror-line > span::selection,
+.CodeMirror-line > span > span::selection {
+    background: #d7d4f0;
+}
+.CodeMirror-line::-moz-selection,
+.CodeMirror-line > span::-moz-selection,
+.CodeMirror-line > span > span::-moz-selection {
+    background: #d7d4f0;
+}
+.cm-searching {
+    background : #ffa;
+    background : rgba(255, 255, 0, .4);
+}
+
+// IE7 hack to prevent it from returning funny offsetTops on the spans
+.CodeMirror span { *vertical-align: text-bottom; }
+
+// Used to force a border model for a node
+.cm-force-border { padding-right: .1px; }
+
+// See issue #2901
+.cm-tab-wrap-hack:after { content: ''; }
+
+// Help users use markselection to safely style text background
+span.CodeMirror-selectedtext { background: none; }
+
+/**
+ * Gutter
+ */
+.CodeMirror-gutters {
+    border-right     : 1px solid #ddd;
+    background-color : #f7f7f7;
+    white-space      : nowrap;
+    position         : absolute;
+    left             : 0;
+    top              : 0;
+    z-index          : 3;
+}
+.CodeMirror-gutter {
+    white-space   : normal;
+    height        : 100%;
+    display       : inline-block;
+    margin-bottom : -30px;
+    /* Hack to make IE7 behave */
+    *zoom:1;
+    *display:inline;
+}
+.CodeMirror-gutter-wrapper {
+    position   : absolute;
+    z-index    : 4;
+    background : none !important;
+    border     : none !important;
+}
+.CodeMirror-gutter-background {
+    position : absolute;
+    top      : 0;
+    bottom   : 0;
+    z-index  : 4;
+}
+.CodeMirror-gutter-elt {
+    position : absolute;
+    cursor   : default;
+    z-index  : 4;
+}
+.CodeMirror-gutter-wrapper {
+    -webkit-user-select : none;
+    -moz-user-select    : none;
+    user-select         : none;
+}
+
+.CodeMirror-linenumbers {}
+.CodeMirror-linenumber {
+    padding     : 0 3px 0 5px;
+    min-width   : 20px;
+    text-align  : right;
+    color       : #999;
+    white-space : nowrap;
+}
+
+.CodeMirror-guttermarker {
+    color: black;
+}
+.CodeMirror-guttermarker-subtle {
+    color: #999;
+}
+
+/**
+ * Cursors
+ */
+.CodeMirror-cursor {
+    position     : absolute;
+    border-left  : 1px solid black;
+    border-right : none;
+    width        : 0;
+}
+
+// Shown when moving in bi-directional text
+.CodeMirror div.CodeMirror-secondarycursor {
+    border-left: 1px solid silver;
+}
+.cm-fat-cursor .CodeMirror-cursor {
+    width: auto;
+    border: 0;
+    background: #7e7;
+}
+.cm-fat-cursor div.CodeMirror-cursors {
+    z-index: 1;
+}
+
+.cm-animate-fat-cursor {
+    width             : auto;
+    border            : 0;
+    -webkit-animation : blink 1.06s steps(1) infinite;
+    -moz-animation    : blink 1.06s steps(1) infinite;
+    animation         : blink 1.06s steps(1) infinite;
+    background-color  : #7e7;
+}
+
+div.CodeMirror-cursors {
+    visibility : hidden;
+    position   : relative;
+    z-index    : 3;
+}
+div.CodeMirror-dragcursors {
+    visibility: visible;
+}
+
+.CodeMirror-focused div.CodeMirror-cursors {
+    visibility: visible;
+}
+
+@-moz-keyframes blink {
+    0% {}
+    50% { background-color: transparent; }
+    100% {}
+}
+@-webkit-keyframes blink {
+    0% {}
+    50% { background-color: transparent; }
+    100% {}
+}
+@keyframes blink {
+    0% {}
+    50% { background-color: transparent; }
+    100% {}
+}
+
+// Can style cursor different in overwrite (non-insert) mode
+.CodeMirror-overwrite .CodeMirror-cursor {}
+
+.cm-tab {
+    display         : inline-block;
+    text-decoration : inherit;
+}
+
+.CodeMirror-ruler {
+    border-left : 1px solid #ccc;
+    position    : absolute;
+}
+
+@media print {
+    // Hide the cursor when printing
+    .CodeMirror div.CodeMirror-cursors {
+        visibility: hidden;
+    }
+}
diff --git a/app/styles/core/codemirror/theme.less b/app/styles/core/codemirror/theme.less
new file mode 100644
index 000000000..23fa52291
--- /dev/null
+++ b/app/styles/core/codemirror/theme.less
@@ -0,0 +1,69 @@
+/**
+ * Default theme for Codemirror.
+ */
+
+/**
+ * Headers
+ */
+.cm-s-default .cm-header-1 {
+    &:extend(h1);
+    line-height: floor((@font-size-h1 * @line-height-base));
+}
+.cm-s-default .cm-header-2 {
+    &:extend(h2);
+    line-height: floor((@font-size-h2 * @line-height-base));
+}
+.cm-s-default .cm-header-3 {
+    &:extend(h3);
+    line-height: floor((@font-size-h3 * @line-height-base));
+}
+.cm-s-default .cm-header-4 {
+    &:extend(h4);
+    line-height: floor((@font-size-h4 * @line-height-base));
+}
+.cm-s-default .cm-header-5 {
+    &:extend(h5);
+    line-height: floor((@font-size-h5 * @line-height-base));
+}
+.cm-s-default .cm-header-6 {
+    &:extend(h6);
+    line-height: floor((@font-size-h6 * @line-height-base));
+}
+
+/**
+ * Other styles
+ */
+.CodeMirror-composing {
+    border-bottom: 2px solid;
+}
+
+.cm-header,
+.cm-strong:extend(strong) {}
+
+.cm-em {
+    font-style: italic;
+}
+
+.cm-strikethrough {
+    text-decoration: line-through;
+}
+
+.cm-link {
+    text-decoration: underline;
+}
+
+/**
+ * Default styles for common addons
+ */
+div.CodeMirror span.CodeMirror-matchingbracket {
+    color: #0f0;
+}
+div.CodeMirror span.CodeMirror-nonmatchingbracket {
+    color: #f22;
+}
+.CodeMirror-matchingtag {
+    background: rgba(255, 150, 0, .3);
+}
+.CodeMirror-activeline-background {
+    background: #e8f2ff;
+}
diff --git a/app/styles/core/editor.less b/app/styles/core/editor.less
index 04b12452a..318af4b29 100644
--- a/app/styles/core/editor.less
+++ b/app/styles/core/editor.less
@@ -1,11 +1,60 @@
 /**
  * Editor module
  */
+
+/**
+ * Mixin for creating columns
+ */
+@pagedown-breakpoint: 500px;
+.make-pg-columns(@columns) {
+    .make-lg-column(@columns);
+    .make-md-column(@columns);
+    .make-sm-column(@columns);
+    .make-xs-column(@columns);
+
+    // Stretch columns on small screens
+    @media (max-width: @pagedown-breakpoint) {
+        width: percentage((12 / 12));
+    }
+}
+
 .editor--form {
     margin-top: 15px;
 }
 
-// Fullscreen mode
+/**
+ * WYSIWYG bar
+ */
+.editor--bar {
+    &:extend(.navbar);
+    margin-bottom : 0;
+    border-color  : rgb(217, 217, 217);
+    border-top    : 1px solid rgb(229, 229, 229);
+    border-bottom : 1px solid rgb(229, 229, 229);
+    padding       : 6px 0;
+}
+
+.editor--input {
+    overflow    : hidden;
+    font-weight : 400;
+    font-size   : 14px;
+    line-height : 20px;
+    margin-left : 0;
+    border      : none;
+    transition  : border-color 0.15s ease-in-out 0s, box-shadow 0.15s ease-in-out 0s;
+    width       : 100%;
+}
+.editor--input,
+.editor--preview {
+    width: 100%;
+}
+.editor--preview {
+    display: none;
+}
+
+/**
+ * Editor in fullscreen mode
+ */
 .editor--fullscreen {
     /**
      * We don't need to show the sidebar on fullscreen mode.
@@ -17,6 +66,114 @@
         width: 100%;
     }
 
+    /**
+     * Show WYSIWG bar on top of everything
+     */
+    .editor--bar {
+        &:extend(.navbar-fixed-top);
+        top: @navbar-height;
+    }
+
+    /**
+     * Prevent WYSIWG bar from overflowing the main navbar
+     */
+    .layout--navbar {
+        z-index: @zindex-navbar-fixed + 1;
+    }
+
+    /**
+     * Since we have two navbars, we need to change the position
+     * of the form.
+     */
+    .layout--body.-form {
+        top: @navbar-height * 2;
+    }
+}
+
+/**
+ * Pagedown in preview mode
+ */
+.editor--fullscreen.-preview {
+    overflow: hidden;
+
+    // Main layout shouldn't have scrollbars
+    .layout--body.-form {
+        overflow: hidden;
+    }
+
+    .navbar-form {
+        padding: 0;
+    }
+
+    // This is the main wrapper now
+    .editor--row {
+        &:extend(.layout--body);
+    }
+
+    /**
+     * We use it to create a two column view:
+     * the editor and the preview.
+     */
+    .editor--layout {
+        .make-pg-columns(5.94);
+        position: absolute;
+        height: auto;
+        top: 0;
+        bottom: @navbar-height + 15px;
+        overflow: hidden;
+        background-color: #FFF;
+
+        &.-left {
+            left: 0;
+            padding-left: 0;
+            padding-right: 0;
+        }
+        &.-right {
+            right: 0;
+        }
+    }
+
+    /**
+     * Add scrollbars to Pagedown editor and its preview.
+     */
+    .editor--preview,
+    .editor--input {
+        background-color: #FFF;
+        width: 100%;
+        min-height: 1px;
+        position: absolute;
+        overflow: auto;
+        top: 0;
+        bottom: 0;
+        left: 0;
+    }
+
+    // Pagedown preview styles
+    .editor--preview {
+        display: block;
+        word-wrap: break-word;
+        padding: 15px 20px 100px;
+    }
+
+    // Preview mode on small screens
+    @media (max-width: @pagedown-breakpoint) {
+        // Fix the scrollbar
+        .editor--layout {
+            bottom: 100px;
+        }
+
+        // Hide both columns
+        .editor--layout.-left,
+        .editor--layout.-right {
+            display: none;
+        }
+
+        .-show,
+        .editor--layout.-show,
+        .editor--show--column {
+            display: block !important;
+        }
+    }
 }
 
 // Notebook list
diff --git a/app/styles/core/main.less b/app/styles/core/main.less
index 52d4a009c..05c0f5b8e 100644
--- a/app/styles/core/main.less
+++ b/app/styles/core/main.less
@@ -19,7 +19,7 @@
 
 // Editor
 @import 'codemirror.less';
-@import 'pagedown.less';
+// @import 'pagedown.less';
 @import 'editor.less';
 
 // Core
diff --git a/app/styles/core/pagedown.less b/app/styles/core/pagedown.less
index 4fcd76d30..601efe4af 100644
--- a/app/styles/core/pagedown.less
+++ b/app/styles/core/pagedown.less
@@ -2,42 +2,10 @@
  * Pagedown module
  */
 
-/**
- * Mixin for creating columns
- */
-@pagedown-breakpoint: 500px;
-.make-pg-columns(@columns) {
-    .make-lg-column(@columns);
-    .make-md-column(@columns);
-    .make-sm-column(@columns);
-    .make-xs-column(@columns);
-
-    // Stretch columns on small screens
-    @media (max-width: @pagedown-breakpoint) {
-        width: percentage((12 / 12));
-    }
-}
 
 /**
  * Pagedown editor
  */
-.pagedown--input {
-    overflow: hidden;
-    font-weight: 400;
-    font-size: 14px;
-    line-height: 20px;
-    margin-left: 0;
-    border: none;
-    transition: border-color 0.15s ease-in-out 0s, box-shadow 0.15s ease-in-out 0s;
-    width: 100%;
-}
-.pagedown--input,
-.pagedown--preview {
-    width: 100%;
-}
-.pagedown--preview {
-    display: none;
-}
 
 // Textarea version of Pagedown
 .pagedown--input.-textarea {
@@ -54,14 +22,6 @@
 /**
  * WYSIWYG bar
  */
-.pagedown--bar {
-    &:extend(.navbar);
-    margin-bottom: 0;
-    border-color: rgb(217, 217, 217);
-    border-top: 1px solid rgb(229, 229, 229);
-    border-bottom: 1px solid rgb(229, 229, 229);
-    padding: 6px 0;
-}
 .wmd-button-row {
     margin: 0;
     text-align: center;
@@ -93,115 +53,8 @@
  */
 .editor--fullscreen {
 
-    /**
-     * Show WYSIWG bar on top of everything
-     */
-    .pagedown--bar {
-        &:extend(.navbar-fixed-top);
-        top: @navbar-height;
-    }
-
-    /**
-     * Prevent WYSIWG bar from overflowing the main navbar
-     */
-    .layout--navbar {
-        z-index: @zindex-navbar-fixed + 1;
-    }
-
-    /**
-     * Since we have two navbars, we need to change the position
-     * of the form.
-     */
-    .layout--body.-form {
-        top: @navbar-height * 2;
-    }
 }
 
-/**
- * Pagedown in preview mode
- */
-.editor--fullscreen.-preview {
-    overflow: hidden;
-
-    // Main layout shouldn't have scrollbars
-    .layout--body.-form {
-        overflow: hidden;
-    }
-
-    .navbar-form {
-        padding: 0;
-    }
-
-    // This is the main wrapper now
-    .pagedown--row {
-        &:extend(.layout--body);
-    }
-
-    /**
-     * We use it to create a two column view:
-     * the editor and the preview.
-     */
-    .pagedown--layout {
-        .make-pg-columns(5.94);
-        position: absolute;
-        height: auto;
-        top: 0;
-        bottom: @navbar-height + 15px;
-        overflow: hidden;
-        background-color: #FFF;
-
-        &.-left {
-            left: 0;
-            padding-left: 0;
-            padding-right: 0;
-        }
-        &.-right {
-            right: 0;
-        }
-    }
-
-    /**
-     * Add scrollbars to Pagedown editor and its preview.
-     */
-    .pagedown--preview,
-    .pagedown--input {
-        background-color: #FFF;
-        width: 100%;
-        min-height: 1px;
-        position: absolute;
-        overflow: auto;
-        top: 0;
-        bottom: 0;
-        left: 0;
-    }
-
-    // Pagedown preview styles
-    .pagedown--preview {
-        display: block;
-        word-wrap: break-word;
-        padding: 15px 20px 100px;
-    }
-
-    // Preview mode on small screens
-    @media (max-width: @pagedown-breakpoint) {
-        // Fix the scrollbar
-        .pagedown--layout {
-            bottom: 100px;
-        }
-
-        // Hide both columns
-        .pagedown--layout.-left,
-        .pagedown--layout.-right {
-            display: none;
-        }
-
-        .-show,
-        .pagedown--layout.-show,
-        .pagedown--show--column {
-            display: block !important;
-        }
-    }
-}
 
 .-pagedown--text {
     .pagedown--input {
diff --git a/app/styles/theme-default/editor.less b/app/styles/theme-default/editor.less
index a01767298..614675330 100644
--- a/app/styles/theme-default/editor.less
+++ b/app/styles/theme-default/editor.less
@@ -15,11 +15,41 @@
 }
 
 // Remove borders from Pagedown bar
-.pagedown--bar {
+.editor--bar {
     border-right-width : 0;
     border-left-width  : 0;
 }
 
+.editor--fullscreen .layout--body.-form {
+    top: @navbar-height + 40px;
+}
+
+.editor--fullscreen.-preview .layout--content {
+    background: @layout--form--bg;
+}
+
+/**
+ * Editor WYSIWG bar
+ */
+.editor--bar,
+.editor--fullscreen .editor--bar {
+    // Colors
+    background : @pagedown--bar--bg;
+    color      : @pagedown--bar--color;
+
+    border-top-width    : 1px;
+    border-bottom-width : 1px;
+    border-style        : solid;
+    border-color        : @pagedown--bar--border;
+    border-radius       : 0;
+
+    // Sizing
+    padding-top    : 4px;
+    padding-bottom : 4px;
+    min-height     : 20px;
+    height         : auto;
+}
+
 // Fullscree mode
 .editor--fullscreen {
     // Reduce font size of the title
diff --git a/app/styles/theme-default/main.less b/app/styles/theme-default/main.less
index a6f13906d..33e6304f0 100644
--- a/app/styles/theme-default/main.less
+++ b/app/styles/theme-default/main.less
@@ -28,7 +28,7 @@
 // Pagedown editor
 @import 'editor.less';
 @import 'codemirror.less';
-@import 'pagedown.less';
+// @import 'pagedown.less';
 
 // Google code prettify
 @import 'code-prettify.less';
diff --git a/app/styles/theme-default/pagedown.less b/app/styles/theme-default/pagedown.less
index 09a51307e..a55ba163b 100644
--- a/app/styles/theme-default/pagedown.less
+++ b/app/styles/theme-default/pagedown.less
@@ -1,24 +1,6 @@
 /**
  * Pagedown module
  */
-.pagedown--bar,
-.editor--fullscreen .pagedown--bar {
-    // Colors
-    background : @pagedown--bar--bg;
-    color      : @pagedown--bar--color;
-
-    border-top-width    : 1px;
-    border-bottom-width : 1px;
-    border-style        : solid;
-    border-color        : @pagedown--bar--border;
-    border-radius       : 0;
-
-    // Sizing
-    padding-top    : 4px;
-    padding-bottom : 4px;
-    min-height     : 20px;
-    height         : auto;
-}
 
 // Buttons
 .wmd-button {
@@ -34,11 +16,3 @@
 // Preview
 .pagedown--preview {
 }
-
-.editor--fullscreen .layout--body.-form {
-    top: @navbar-height + 40px;
-}
-
-.editor--fullscreen.-preview .layout--content {
-    background: @layout--form--bg;
-}

From 8fe39956b164b6e34a169b6fa8c8516962472462 Mon Sep 17 00:00:00 2001
From: wwwredfish <wwwredfish@gmail.com>
Date: Mon, 28 Dec 2015 14:29:09 +0600
Subject: [PATCH 06/25] :bug: Fix switching between preview and editor

Fix switching between preview and editor on small screens.
---
 .../modules/codemirror/views/editor.js        | 21 ++++++++++++++++++-
 1 file changed, 20 insertions(+), 1 deletion(-)

diff --git a/app/scripts/modules/codemirror/views/editor.js b/app/scripts/modules/codemirror/views/editor.js
index be56ec281..8a91edbc7 100644
--- a/app/scripts/modules/codemirror/views/editor.js
+++ b/app/scripts/modules/codemirror/views/editor.js
@@ -26,7 +26,8 @@ define([
         },
 
         events: {
-            'click .editor--btns .btn': 'triggerAction'
+            'click .editor--btns .btn' : 'triggerAction',
+            'click .editor--col--btn'  : 'showColumn'
         },
 
         initialize: function() {
@@ -49,6 +50,24 @@ define([
                 this.trigger('editor:action', action);
             }
         },
+
+        /**
+         * Shows either the preview or the editor.
+         */
+        showColumn: function(e) {
+            var $btn    = $(e.currentTarget),
+                col     = $btn.attr('data-col'),
+                hideCol = (col === 'left' ? 'right' : 'left');
+
+            // Add 'active' class to the button
+            this.$('.editor--col--btn.active').removeClass('active');
+            $btn.addClass('active');
+
+            // Show only one column
+            this.$('.-' + hideCol).removeClass('-show');
+            this.$('.-' + col).addClass('-show');
+        },
+
     });
 
     return View;

From cf93ca43c9a13013b75a14e2b6139c2737a0b937 Mon Sep 17 00:00:00 2001
From: wwebfor <wwebfor@users.noreply.github.com>
Date: Mon, 28 Dec 2015 15:41:14 +0600
Subject: [PATCH 07/25] Parse tags in Markdown-it plugin

---
 app/scripts/modules/codemirror/controller.js  |  6 +++---
 .../modules/markdown/libs/markdown-it.js      | 21 ++++++++++++++++---
 app/scripts/modules/markdown/libs/markdown.js |  4 ++++
 app/scripts/modules/markdown/module.js        |  1 +
 4 files changed, 26 insertions(+), 6 deletions(-)

diff --git a/app/scripts/modules/codemirror/controller.js b/app/scripts/modules/codemirror/controller.js
index 664429e0c..4434fb7c7 100644
--- a/app/scripts/modules/codemirror/controller.js
+++ b/app/scripts/modules/codemirror/controller.js
@@ -264,11 +264,11 @@ define([
         getData: function() {
             var content = this.editor.getValue();
 
-            return Radio.request('markdown', 'render', content)
-            .then(function() {
+            return Radio.request('markdown', 'parse', content)
+            .then(function(env) {
                 return {
                     content: content,
-                    tags: [],
+                    tags: env.tags || [],
                     tasks: []
                 };
             });
diff --git a/app/scripts/modules/markdown/libs/markdown-it.js b/app/scripts/modules/markdown/libs/markdown-it.js
index 1b1b7f70f..0e4bf44a8 100644
--- a/app/scripts/modules/markdown/libs/markdown-it.js
+++ b/app/scripts/modules/markdown/libs/markdown-it.js
@@ -43,8 +43,14 @@ define([
             .use(hash)
             ;
 
-            this.md.renderer.rules.hashtag_open  = function(tokens, idx) { // jshint ignore:line
+            this.md.renderer.rules.hashtag_open  = function(tokens, idx, f, env) { // jshint ignore:line
                 var tagName = tokens[idx].content.toLowerCase();
+
+                if (env) {
+                    env.tags = env.tags || [];
+                    env.tags.push(tagName);
+                }
+
                 return '<a href="#/notes/f/tag/q/' + tagName + '" class="label label-default">';
             };
         },
@@ -58,10 +64,19 @@ define([
             );
         },
 
+        /**
+         * Parse Markdown for tags, tasks, etc.
+         */
         parse: function(content) {
+            var env = {};
+
             return new Q(
-                this.md.parse(content)
-            );
+                this.md.render(content, env)
+            )
+            .then(function() {
+                env.tags = _.uniq(env.tags);
+                return env;
+            });
         },
     });
 
diff --git a/app/scripts/modules/markdown/libs/markdown.js b/app/scripts/modules/markdown/libs/markdown.js
index b2b9e6469..f9240b218 100644
--- a/app/scripts/modules/markdown/libs/markdown.js
+++ b/app/scripts/modules/markdown/libs/markdown.js
@@ -57,6 +57,10 @@ define([
             return this._emit('render', content);
         },
 
+        parse: function(content) {
+            return this._emit('parse', content);
+        },
+
         /**
          * Send a message to the Webworker.
          *
diff --git a/app/scripts/modules/markdown/module.js b/app/scripts/modules/markdown/module.js
index 29335b774..542573e67 100644
--- a/app/scripts/modules/markdown/module.js
+++ b/app/scripts/modules/markdown/module.js
@@ -19,6 +19,7 @@ define([
 
         Radio.reply('markdown', {
             'render': md.render,
+            'parse' : md.parse,
         }, md);
 
         if (md.workerPromise) {

From 17e23f11cd582c96525bd134503af55c849a89c4 Mon Sep 17 00:00:00 2001
From: wwwredfish <wwwredfish@gmail.com>
Date: Mon, 28 Dec 2015 18:17:44 +0600
Subject: [PATCH 08/25] Render MathJax expressions

* Install markdown-it-math plugin
* Fix MathJax module
---
 app/scripts/init.js                              | 6 +++---
 app/scripts/main.js                              | 3 ++-
 app/scripts/modules/codemirror/views/editor.js   | 6 ++++++
 app/scripts/modules/markdown/libs/markdown-it.js | 9 ++++++++-
 app/scripts/modules/markdown/workers/markdown.js | 1 +
 app/scripts/modules/mathjax/libs/mathjax.js      | 2 +-
 app/scripts/modules/mathjax/module.js            | 4 ++--
 bower.json                                       | 3 ++-
 8 files changed, 25 insertions(+), 9 deletions(-)

diff --git a/app/scripts/init.js b/app/scripts/init.js
index 785ded95b..5bf5a4765 100644
--- a/app/scripts/init.js
+++ b/app/scripts/init.js
@@ -56,12 +56,12 @@ define([
         // 'modules/pagedown/module',
         'modules/markdown/module',
         'modules/codemirror/module',
-        'modules/tags/module',
-        'modules/tasks/module',
+        // 'modules/tags/module',
+        // 'modules/tasks/module',
         'modules/linkDialog/module',
         'modules/fileDialog/module',
         'modules/fuzzySearch/module',
-        'modules/codePrettify/module',
+        // 'modules/codePrettify/module',
         'modules/importExport/module',
         'modules/mathjax/module'
     ], function(storage) {
diff --git a/app/scripts/main.js b/app/scripts/main.js
index 18863e2b1..b3c085a76 100644
--- a/app/scripts/main.js
+++ b/app/scripts/main.js
@@ -84,12 +84,13 @@ requirejs.config({
         'markdown-it'         : '../bower_components/markdown-it/dist/markdown-it',
         'markdown-it-san'     : '../bower_components/markdown-it-sanitizer/dist/markdown-it-sanitizer',
         'markdown-it-hash'    : '../bower_components/markdown-it-hashtag/dist/markdown-it-hashtag',
+        'markdown-it-math'    : '../bower_components/markdown-it-math/dist/markdown-it-math',
         'pagedown-extra'      : '../bower_components/pagedown-extra/Markdown.Extra',
         'to-markdown'         : '../bower_components/to-markdown/src/to-markdown',
 
         // Others
         dompurify             : '../bower_components/DOMPurify/src/purify',
-        mathjax               : '../bower_components/MathJax/MathJax.js?config=TeX-AMS-MML_HTMLorMML',
+        mathjax               : '../bower_components/MathJax/MathJax.js?config=MML_HTMLorMML',
         hljs                  : '../bower_components/highlightjs/highlight.pack',
         prettify              : '../bower_components/google-code-prettify/src/prettify',
         dropzone              : '../bower_components/dropzone/dist/dropzone-amd-module',
diff --git a/app/scripts/modules/codemirror/views/editor.js b/app/scripts/modules/codemirror/views/editor.js
index 8a91edbc7..03d68342a 100644
--- a/app/scripts/modules/codemirror/views/editor.js
+++ b/app/scripts/modules/codemirror/views/editor.js
@@ -40,6 +40,12 @@ define([
 
         onEditorChange: function(content) {
             this.ui.preview.html(content);
+
+            if (!this.isFirst) {
+                this.isFirst = true;
+                return Radio.trigger('editor', 'view:render', this);
+            }
+            Radio.trigger('editor', 'preview:refresh');
         },
 
         triggerAction: function(e) {
diff --git a/app/scripts/modules/markdown/libs/markdown-it.js b/app/scripts/modules/markdown/libs/markdown-it.js
index 0e4bf44a8..30b75adb8 100644
--- a/app/scripts/modules/markdown/libs/markdown-it.js
+++ b/app/scripts/modules/markdown/libs/markdown-it.js
@@ -6,7 +6,8 @@ define([
     'prism/bundle',
     'markdown-it-san',
     'markdown-it-hash',
-], function(_, Q, MarkdownIt, Prism, sanitizer, hash) {
+    'markdown-it-math',
+], function(_, Q, MarkdownIt, Prism, sanitizer, hash, math) {
     'use strict';
 
     /**
@@ -40,6 +41,12 @@ define([
         configure: function() {
             this.md
             .use(sanitizer)
+            .use(math, {
+                inlineOpen  : '$',
+                inlineClose : '$',
+                blockOpen   : '$$',
+                blockClose  : '$$',
+            })
             .use(hash)
             ;
 
diff --git a/app/scripts/modules/markdown/workers/markdown.js b/app/scripts/modules/markdown/workers/markdown.js
index 40c666e88..1bf97fb22 100644
--- a/app/scripts/modules/markdown/workers/markdown.js
+++ b/app/scripts/modules/markdown/workers/markdown.js
@@ -25,6 +25,7 @@ requirejs.config({
         'markdown-it'      : '../bower_components/markdown-it/dist/markdown-it',
         'markdown-it-san'  : '../bower_components/markdown-it-sanitizer/dist/markdown-it-sanitizer',
         'markdown-it-hash' : '../bower_components/markdown-it-hashtag/dist/markdown-it-hashtag',
+        'markdown-it-math' : '../bower_components/markdown-it-math/dist/markdown-it-math',
     },
     shim: {
         'prism/bundle': {
diff --git a/app/scripts/modules/mathjax/libs/mathjax.js b/app/scripts/modules/mathjax/libs/mathjax.js
index f70cb5586..fece3f4e2 100644
--- a/app/scripts/modules/mathjax/libs/mathjax.js
+++ b/app/scripts/modules/mathjax/libs/mathjax.js
@@ -22,7 +22,7 @@ define([
             var $divs;
 
             this.view = view || this.view;
-            $divs = this.view.$el.find('.mathjax');
+            $divs = this.view.$el.find('math');
 
             // Don't bother with processing MathJax
             if (!$divs.length) {
diff --git a/app/scripts/modules/mathjax/module.js b/app/scripts/modules/mathjax/module.js
index 69e29368e..91e332c21 100644
--- a/app/scripts/modules/mathjax/module.js
+++ b/app/scripts/modules/mathjax/module.js
@@ -1,6 +1,6 @@
 /**
  * Copyright (C) 2015 Laverna project Authors.
- * 
+ *
  * This Source Code Form is subject to the terms of the Mozilla Public
  * License, v. 2.0. If a copy of the MPL was not distributed with this
  * file, You can obtain one at http://mozilla.org/MPL/2.0/.
@@ -52,7 +52,7 @@ define([
      * Start listening to events.
      */
     Radio.request('init', 'add', 'module', function() {
-        Radio.on('editor', 'converter:init', math.onInitConverter, math);
+        // Radio.on('editor', 'converter:init', math.onInitConverter, math);
 
         // When a note is shown, start this module
         Radio.on('noteView', {
diff --git a/bower.json b/bower.json
index 86f81c590..3310aab81 100644
--- a/bower.json
+++ b/bower.json
@@ -40,7 +40,8 @@
     "tv4": "~1.2.7",
     "underscore": "~1.8.3",
     "xregexp": "~2.0.0",
-    "jszip": "Stuk/jszip#~2.5.0"
+    "jszip": "Stuk/jszip#~2.5.0",
+    "markdown-it-math": "~3.0.2"
   },
   "devDependencies": {
     "ace": "~1.2.2",

From ee7c6ecb4778abe31c9682c87c95dc0503e15c66 Mon Sep 17 00:00:00 2001
From: wwebfor <wwebfor@users.noreply.github.com>
Date: Wed, 30 Dec 2015 19:11:57 +0600
Subject: [PATCH 09/25] :bug: Fix MathJax module

* Install components/MathJax
* Don't use ASCII math
---
 app/scripts/main.js                           |  3 +--
 .../modules/codemirror/views/editor.js        |  4 ++++
 .../modules/markdown/libs/markdown-it.js      | 15 ++++++++----
 app/scripts/modules/mathjax/libs/mathjax.js   | 23 +------------------
 app/scripts/modules/mathjax/module.js         |  5 ++--
 bower.json                                    |  3 +--
 6 files changed, 21 insertions(+), 32 deletions(-)

diff --git a/app/scripts/main.js b/app/scripts/main.js
index b3c085a76..760cb2b08 100644
--- a/app/scripts/main.js
+++ b/app/scripts/main.js
@@ -90,8 +90,7 @@ requirejs.config({
 
         // Others
         dompurify             : '../bower_components/DOMPurify/src/purify',
-        mathjax               : '../bower_components/MathJax/MathJax.js?config=MML_HTMLorMML',
-        hljs                  : '../bower_components/highlightjs/highlight.pack',
+        mathjax               : '../bower_components/MathJax/MathJax.js?config=TeX-AMS-MML_HTMLorMML',
         prettify              : '../bower_components/google-code-prettify/src/prettify',
         dropzone              : '../bower_components/dropzone/dist/dropzone-amd-module',
         toBlob                : '../bower_components/blueimp-canvas-to-blob/js/canvas-to-blob',
diff --git a/app/scripts/modules/codemirror/views/editor.js b/app/scripts/modules/codemirror/views/editor.js
index 03d68342a..16d92c64e 100644
--- a/app/scripts/modules/codemirror/views/editor.js
+++ b/app/scripts/modules/codemirror/views/editor.js
@@ -38,6 +38,10 @@ define([
             return {content: _.escape(this.model.get('content'))};
         },
 
+        onDestroy: function() {
+            Radio.trigger('editor', 'view:destroy');
+        },
+
         onEditorChange: function(content) {
             this.ui.preview.html(content);
 
diff --git a/app/scripts/modules/markdown/libs/markdown-it.js b/app/scripts/modules/markdown/libs/markdown-it.js
index 30b75adb8..703bf6f45 100644
--- a/app/scripts/modules/markdown/libs/markdown-it.js
+++ b/app/scripts/modules/markdown/libs/markdown-it.js
@@ -42,10 +42,17 @@ define([
             this.md
             .use(sanitizer)
             .use(math, {
-                inlineOpen  : '$',
-                inlineClose : '$',
-                blockOpen   : '$$',
-                blockClose  : '$$',
+                inlineOpen       : '$',
+                inlineClose      : '$',
+                blockOpen        : '$$',
+                blockClose       : '$$',
+                renderingOptions : {},
+                inlineRenderer   : function(tokens) {
+                    return '<span class="math inline">$' + tokens + '$</span>';
+                },
+                blockRenderer    : function(tokens) {
+                    return '<div class="math block">$$' + tokens + '$$</div>';
+                },
             })
             .use(hash)
             ;
diff --git a/app/scripts/modules/mathjax/libs/mathjax.js b/app/scripts/modules/mathjax/libs/mathjax.js
index fece3f4e2..e46011e60 100644
--- a/app/scripts/modules/mathjax/libs/mathjax.js
+++ b/app/scripts/modules/mathjax/libs/mathjax.js
@@ -22,7 +22,7 @@ define([
             var $divs;
 
             this.view = view || this.view;
-            $divs = this.view.$el.find('math');
+            $divs = this.view.$el.find('.math');
 
             // Don't bother with processing MathJax
             if (!$divs.length) {
@@ -78,27 +78,6 @@ define([
             });
         },
 
-        /**
-         * Add hooks after converter is initialized.
-         * Place MathJax expressions inside div blocks.
-         */
-        onInitConverter: function(converter) {
-            converter.hooks.chain('preConversion', function(text) {
-
-                // Inline MathJax expressions with $
-                text = text.replace(/^\$.+?\$$/gm, function(str) {
-                    return '<div class="mathjax">' + str + '</div>';
-                });
-
-                // Multiline MathJax expressions with $$
-                text = text.replace(/^\$\$[^]+?\$\$$/gm, function(str) {
-                    return '<div class="mathjax">' + str + '</div>';
-                });
-
-                return text;
-            });
-        }
-
     };
 
     return MathHelper;
diff --git a/app/scripts/modules/mathjax/module.js b/app/scripts/modules/mathjax/module.js
index 91e332c21..916778b25 100644
--- a/app/scripts/modules/mathjax/module.js
+++ b/app/scripts/modules/mathjax/module.js
@@ -26,7 +26,7 @@ define([
         tex2jax : {
             inlineMath     : [['$', '$']],
             displayMath    : [['$$', '$$']],
-            processClass   : 'mathjax',
+            processClass   : 'math',
             ignoreClass    : 'layout',
             processEscapes : true
         }
@@ -44,6 +44,8 @@ define([
     });
 
     MathjaxModule.on('stop', function() {
+        console.info('MathJax has stopped');
+
         math.view = null;
         Radio.off('editor', 'preview:refresh');
     });
@@ -52,7 +54,6 @@ define([
      * Start listening to events.
      */
     Radio.request('init', 'add', 'module', function() {
-        // Radio.on('editor', 'converter:init', math.onInitConverter, math);
 
         // When a note is shown, start this module
         Radio.on('noteView', {
diff --git a/bower.json b/bower.json
index 3310aab81..795e727ed 100644
--- a/bower.json
+++ b/bower.json
@@ -25,7 +25,7 @@
     "jquery": "~2.1.4",
     "localforage": "~1.3.0",
     "marionette": "~2.3.2",
-    "MathJax": "2.5.3",
+    "MathJax": "components/MathJax#~2.5.3",
     "modernizr": "~2.8.3",
     "mousetrap": "~1.5.3",
     "pagedown": "git://github.com/ujifgc/pagedown.git",
@@ -47,7 +47,6 @@
     "ace": "~1.2.2",
     "markdown-it": "~5.0.2",
     "codemirror": "~5.10.0",
-    "highlightjs": "~9.0.0",
     "prism": "~1.3.0",
     "markdown-it-sanitizer": "~0.4.1",
     "markdown-it-hashtag": "~0.4.0"

From ea348c6f1dbc28089f3f85d6ff7e8c54aa6f6c18 Mon Sep 17 00:00:00 2001
From: wwwredfish <wwwredfish@gmail.com>
Date: Thu, 31 Dec 2015 19:16:24 +0600
Subject: [PATCH 10/25] Add task plugin for Markdown-it

---
 app/scripts/modules/codemirror/controller.js  |  9 +-
 .../modules/markdown/libs/markdown-it-task.js | 86 +++++++++++++++++++
 .../modules/markdown/libs/markdown-it.js      |  7 +-
 app/styles/theme-default/checkbox.less        |  4 +-
 4 files changed, 97 insertions(+), 9 deletions(-)
 create mode 100644 app/scripts/modules/markdown/libs/markdown-it-task.js

diff --git a/app/scripts/modules/codemirror/controller.js b/app/scripts/modules/codemirror/controller.js
index 4434fb7c7..59b89568f 100644
--- a/app/scripts/modules/codemirror/controller.js
+++ b/app/scripts/modules/codemirror/controller.js
@@ -266,11 +266,10 @@ define([
 
             return Radio.request('markdown', 'parse', content)
             .then(function(env) {
-                return {
-                    content: content,
-                    tags: env.tags || [],
-                    tasks: []
-                };
+                return _.extend(
+                    _.pick(env, 'tags', 'tasks', 'taskCompleted', 'taskAll'),
+                    {content: content}
+                );
             });
         },
 
diff --git a/app/scripts/modules/markdown/libs/markdown-it-task.js b/app/scripts/modules/markdown/libs/markdown-it-task.js
new file mode 100644
index 000000000..4909f5534
--- /dev/null
+++ b/app/scripts/modules/markdown/libs/markdown-it-task.js
@@ -0,0 +1,86 @@
+/**
+ * Copyright (C) 2015 Laverna project Authors.
+ *
+ * This Source Code Form is subject to the terms of the Mozilla Public
+ * License, v. 2.0. If a copy of the MPL was not distributed with this
+ * file, You can obtain one at http://mozilla.org/MPL/2.0/.
+ */
+/* global define */
+define([
+    'underscore',
+], function(_) {
+    'use strict';
+
+    /**
+     * Tasks plugin for Markdown-it.
+     */
+    function taskReplace(md) {
+        var pattern        = /\[(X|\s|\_|\-)?\]\s(.*)/i,
+            lastId         = 0,
+            arrayReplaceAt = md.utils.arrayReplaceAt;
+
+        /**
+         * Replace elements with checkboxes.
+         */
+        function replaceToken(original, Token) {
+            var matches = original.content.match(pattern),
+                value   = matches[1],
+                label   = matches[2],
+                checked = (value === 'X' || value === 'x'),
+                token;
+
+            // Create a new token
+            token = new Token('task_tag', '', 0);
+            token.meta = {
+                id      : lastId,
+                label   : label,
+                checked : checked
+            };
+            token.children = [];
+            lastId++;
+
+            return [token];
+        }
+
+        return function(state) {
+
+            // Go through tokens and continue if the block is inline
+            _.each(state.tokens, function(token) {
+                if (token.type !== 'inline') {
+                    return;
+                }
+
+                // Find children which match the pattern
+                _.each(token.children, function(child, i) {
+                    if (child.type === 'text' && pattern.test(child.content)) {
+                        token.children = arrayReplaceAt(token.children, i, replaceToken(child, state.Token));
+                    }
+                });
+            });
+        };
+    }
+
+    return function(md) {
+        md.core.ruler.push('task', taskReplace(md));
+
+        md.renderer.rules.task_tag = function(tokens, id, f, env) { // jshint ignore:line
+            var m = tokens[id].meta;
+
+            if (env) {
+                env.tasks = env.tasks || [];
+                env.tasks.push(m.label);
+
+                if (m.checked) {
+                    env.taskCompleted = (env.taskCompleted || 0) + 1;
+                }
+            }
+
+            return '<label class="task task--checkbox">' +
+                '<input data-task="' + m.id + '" type="checkbox"' + (m.checked ? 'checked="checked"' : '') + ' class="checkbox--input" />' +
+                '<svg class="checkbox--svg" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 100 100">' +
+                    '<path class="checkbox--path" d="M16.667,62.167c3.109,5.55,7.217,10.591,10.926,15.75 c2.614,3.636,5.149,7.519,8.161,10.853c-0.046-0.051,1.959,2.414,2.692,2.343c0.895-0.088,6.958-8.511,6.014-7.3 c5.997-7.695,11.68-15.463,16.931-23.696c6.393-10.025,12.235-20.373,18.104-30.707C82.004,24.988,84.802,20.601,87,16"></path>' +
+                '</svg>' +
+                '<span class="checkbox--text">' + m.label + '</span></label>';
+        };
+    };
+});
diff --git a/app/scripts/modules/markdown/libs/markdown-it.js b/app/scripts/modules/markdown/libs/markdown-it.js
index 703bf6f45..377c8542c 100644
--- a/app/scripts/modules/markdown/libs/markdown-it.js
+++ b/app/scripts/modules/markdown/libs/markdown-it.js
@@ -7,7 +7,8 @@ define([
     'markdown-it-san',
     'markdown-it-hash',
     'markdown-it-math',
-], function(_, Q, MarkdownIt, Prism, sanitizer, hash, math) {
+    'modules/markdown/libs/markdown-it-task',
+], function(_, Q, MarkdownIt, Prism, sanitizer, hash, math, task) {
     'use strict';
 
     /**
@@ -55,6 +56,7 @@ define([
                 },
             })
             .use(hash)
+            .use(task)
             ;
 
             this.md.renderer.rules.hashtag_open  = function(tokens, idx, f, env) { // jshint ignore:line
@@ -88,7 +90,8 @@ define([
                 this.md.render(content, env)
             )
             .then(function() {
-                env.tags = _.uniq(env.tags);
+                env.tags    = _.uniq(env.tags);
+                env.taskAll = env.tasks.length;
                 return env;
             });
         },
diff --git a/app/styles/theme-default/checkbox.less b/app/styles/theme-default/checkbox.less
index 051b0a7b8..baa858a22 100644
--- a/app/styles/theme-default/checkbox.less
+++ b/app/styles/theme-default/checkbox.less
@@ -1,7 +1,7 @@
 /**
  * Checkbox module
  */
-.checkbox {
+.task--checkbox {
     position : relative;
     cursor   : pointer;
     &:hover {
@@ -11,7 +11,7 @@
 
 // Text
 .checkbox--text {
-    margin-left: 25px;
+    margin-left: 10px;
     font-weight: 300;
 
     // Create checkbox border block

From a84f8afa611da7889623851d669d5f42b0241c53 Mon Sep 17 00:00:00 2001
From: wwebfor <wwebfor@users.noreply.github.com>
Date: Mon, 4 Jan 2016 17:38:43 +0600
Subject: [PATCH 11/25] Toggle Markdown tasks #324

It solves bugs described in issue #324.
---
 app/scripts/apps/notes/show/controller.js     |  30 ++---
 app/scripts/apps/notes/show/noteView.js       |   2 +-
 .../modules/markdown/libs/markdown-it-task.js | 127 ++++++++++++------
 .../modules/markdown/libs/markdown-it.js      |  15 ++-
 app/scripts/modules/markdown/libs/markdown.js |   4 +
 app/scripts/modules/markdown/module.js        |   6 +-
 6 files changed, 125 insertions(+), 59 deletions(-)

diff --git a/app/scripts/apps/notes/show/controller.js b/app/scripts/apps/notes/show/controller.js
index 251fc43c2..69e50911a 100644
--- a/app/scripts/apps/notes/show/controller.js
+++ b/app/scripts/apps/notes/show/controller.js
@@ -117,23 +117,19 @@ define([
          * counts of completed tasks and content with toggled task.
          */
         toggleTask: function(taskId) {
-            var model = this.view.model,
-
-                // Request the content with toggled task.
-                task = Radio.request('editor', 'task:toggle', {
-                    content : model.get('content'),
-                    taskId  : taskId
-                });
-
-            // No reply
-            if (!task) {
-                return;
-            }
-
-            // Save the note
-            Radio.request('notes', 'save', model, {
-                content       : task.content,
-                taskCompleted : task.completed
+            var model = this.view.model;
+
+            return Radio.request('markdown', 'task:toggle', {
+                content : model.get('content'),
+                taskId  : taskId
+            })
+            .then(function(data) {
+                if (!data) {
+                    return;
+                }
+
+                // Save the note
+                Radio.request('notes', 'save', model, _.pick(data, 'content', 'taskCompleted', 'taskAll'));
             });
         }
     });
diff --git a/app/scripts/apps/notes/show/noteView.js b/app/scripts/apps/notes/show/noteView.js
index 4c33056c6..e947fd4fc 100644
--- a/app/scripts/apps/notes/show/noteView.js
+++ b/app/scripts/apps/notes/show/noteView.js
@@ -132,7 +132,7 @@ define([
          * Toggle the status of a task
          */
         toggleTask: _.debounce(function(e) {
-            var $task = $(e.target),
+            var $task  = $(e.target),
                 taskId = Number($task.attr('data-task'));
 
             $task.blur();
diff --git a/app/scripts/modules/markdown/libs/markdown-it-task.js b/app/scripts/modules/markdown/libs/markdown-it-task.js
index 4909f5534..3bcf57852 100644
--- a/app/scripts/modules/markdown/libs/markdown-it-task.js
+++ b/app/scripts/modules/markdown/libs/markdown-it-task.js
@@ -14,16 +14,83 @@ define([
     /**
      * Tasks plugin for Markdown-it.
      */
-    function taskReplace(md) {
-        var pattern        = /\[(X|\s|\_|\-)?\]\s(.*)/i,
-            lastId         = 0,
-            arrayReplaceAt = md.utils.arrayReplaceAt;
+    var Task = {
+        pattern    : /\[(X|\s|\_|\-)?\]\s(.*)/i,
+        globPattern: /\[(X|\s|\_|\-)?\]\s(.*)/gi,
+
+        /**
+         * Initialize Markdown-it plugin
+         */
+        init: function(md) {
+            md.core.ruler.push('task', Task._taskReplace(md));
+            md.renderer.rules.task_tag = Task._renderTask; // jshint ignore:line
+        },
+
+        /**
+         * Toggle a Markdown task.
+         */
+        toggle: function(data) {
+            var count = 0;
+
+            data.content = data.content.replace(Task.globPattern, function(match, checked, value) {
+                count++;
+
+                // It's not the task we need to toggle
+                if (count !== data.taskId) {
+                    return match;
+                }
+
+                checked = (checked === 'x' || checked === 'X') ? ' ' : 'x';
+                return '[' + checked + '] ' + value;
+            });
+
+            return data.content;
+        },
+
+        /**
+         * Tasks plugin for Markdown-it.
+         */
+        _taskReplace: function(md) {
+            var arrayReplaceAt = md.utils.arrayReplaceAt;
+
+            return function(state) {
+                var count = 0,
+                    matches;
+
+                // Go through tokens and continue if the block is inline
+                _.each(state.tokens, function(token) {
+
+                    if (token.type !== 'inline') {
+                        matches = token.content.match(Task.globPattern);
+                        if (matches) {
+                            count += matches.length;
+                        }
+
+                        return;
+                    }
+
+                    // Find children which match the pattern
+                    _.each(token.children, function(child, i) {
+
+                        if (child.type === 'text' && Task.pattern.test(child.content)) {
+                            count++;
+
+                            token.children = arrayReplaceAt(
+                                token.children,
+                                i,
+                                Task._replaceToken(child, state.Token, count)
+                            );
+                        }
+                    });
+                });
+            };
+        },
 
         /**
          * Replace elements with checkboxes.
          */
-        function replaceToken(original, Token) {
-            var matches = original.content.match(pattern),
+        _replaceToken: function(original, Token, id) {
+            var matches = original.content.match(Task.pattern),
                 value   = matches[1],
                 label   = matches[2],
                 checked = (value === 'X' || value === 'x'),
@@ -32,40 +99,19 @@ define([
             // Create a new token
             token = new Token('task_tag', '', 0);
             token.meta = {
-                id      : lastId,
                 label   : label,
-                checked : checked
+                checked : checked,
+                id      : id
             };
             token.children = [];
-            lastId++;
 
             return [token];
-        }
+        },
 
-        return function(state) {
-
-            // Go through tokens and continue if the block is inline
-            _.each(state.tokens, function(token) {
-                if (token.type !== 'inline') {
-                    return;
-                }
-
-                // Find children which match the pattern
-                _.each(token.children, function(child, i) {
-                    if (child.type === 'text' && pattern.test(child.content)) {
-                        token.children = arrayReplaceAt(token.children, i, replaceToken(child, state.Token));
-                    }
-                });
-            });
-        };
-    }
-
-    return function(md) {
-        md.core.ruler.push('task', taskReplace(md));
-
-        md.renderer.rules.task_tag = function(tokens, id, f, env) { // jshint ignore:line
+        _renderTask: function(tokens, id, f, env) {
             var m = tokens[id].meta;
 
+            // Add task counts to env
             if (env) {
                 env.tasks = env.tasks || [];
                 env.tasks.push(m.label);
@@ -73,14 +119,19 @@ define([
                 if (m.checked) {
                     env.taskCompleted = (env.taskCompleted || 0) + 1;
                 }
+                else {
+                    env.taskCompleted = (env.taskCompleted || 0);
+                }
             }
 
             return '<label class="task task--checkbox">' +
-                '<input data-task="' + m.id + '" type="checkbox"' + (m.checked ? 'checked="checked"' : '') + ' class="checkbox--input" />' +
-                '<svg class="checkbox--svg" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 100 100">' +
-                    '<path class="checkbox--path" d="M16.667,62.167c3.109,5.55,7.217,10.591,10.926,15.75 c2.614,3.636,5.149,7.519,8.161,10.853c-0.046-0.051,1.959,2.414,2.692,2.343c0.895-0.088,6.958-8.511,6.014-7.3 c5.997-7.695,11.68-15.463,16.931-23.696c6.393-10.025,12.235-20.373,18.104-30.707C82.004,24.988,84.802,20.601,87,16"></path>' +
-                '</svg>' +
-                '<span class="checkbox--text">' + m.label + '</span></label>';
-        };
+                   '<input data-task="' + m.id + '" type="checkbox"' + (m.checked ? 'checked="checked"' : '') + ' class="checkbox--input" />' +
+                   '<svg class="checkbox--svg" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 100 100">' +
+                   '<path class="checkbox--path" d="M16.667,62.167c3.109,5.55,7.217,10.591,10.926,15.75 c2.614,3.636,5.149,7.519,8.161,10.853c-0.046-0.051,1.959,2.414,2.692,2.343c0.895-0.088,6.958-8.511,6.014-7.3 c5.997-7.695,11.68-15.463,16.931-23.696c6.393-10.025,12.235-20.373,18.104-30.707C82.004,24.988,84.802,20.601,87,16"></path>' +
+                   '</svg>' +
+                   '<span class="checkbox--text">' + m.label + '</span></label>';
+        },
     };
+
+    return Task;
 });
diff --git a/app/scripts/modules/markdown/libs/markdown-it.js b/app/scripts/modules/markdown/libs/markdown-it.js
index 377c8542c..253eadf95 100644
--- a/app/scripts/modules/markdown/libs/markdown-it.js
+++ b/app/scripts/modules/markdown/libs/markdown-it.js
@@ -56,7 +56,7 @@ define([
                 },
             })
             .use(hash)
-            .use(task)
+            .use(task.init)
             ;
 
             this.md.renderer.rules.hashtag_open  = function(tokens, idx, f, env) { // jshint ignore:line
@@ -75,11 +75,24 @@ define([
          * Convert Markdown to HTML.
          */
         render: function(content) {
+            // this.toggleTask(6, content);
             return new Q(
                 this.md.render(content)
             );
         },
 
+        /**
+         * Toggle a task's status.
+         */
+        taskToggle: function(data) {
+            data.content = task.toggle(data);
+
+            return this.parse(data.content)
+            .then(function(env) {
+                return _.extend({content: data.content}, env);
+            });
+        },
+
         /**
          * Parse Markdown for tags, tasks, etc.
          */
diff --git a/app/scripts/modules/markdown/libs/markdown.js b/app/scripts/modules/markdown/libs/markdown.js
index f9240b218..a3bbf3491 100644
--- a/app/scripts/modules/markdown/libs/markdown.js
+++ b/app/scripts/modules/markdown/libs/markdown.js
@@ -61,6 +61,10 @@ define([
             return this._emit('parse', content);
         },
 
+        taskToggle: function(data) {
+            return this._emit('taskToggle', data);
+        },
+
         /**
          * Send a message to the Webworker.
          *
diff --git a/app/scripts/modules/markdown/module.js b/app/scripts/modules/markdown/module.js
index 542573e67..2dc8dd38f 100644
--- a/app/scripts/modules/markdown/module.js
+++ b/app/scripts/modules/markdown/module.js
@@ -18,10 +18,12 @@ define([
         var md = new Markdown();
 
         Radio.reply('markdown', {
-            'render': md.render,
-            'parse' : md.parse,
+            'render'     : md.render,
+            'parse'      : md.parse,
+            'task:toggle': md.taskToggle,
         }, md);
 
+        // Make the initilizer wait until the worker has spawned
         if (md.workerPromise) {
             return md.workerPromise.promise;
         }

From 0434b870705ef91f9f55badf48d6978d95128c80 Mon Sep 17 00:00:00 2001
From: wwwredfish <wwwredfish@gmail.com>
Date: Tue, 5 Jan 2016 19:03:06 +0600
Subject: [PATCH 12/25] Add file plugin for Markdown-it #316

---
 app/scripts/apps/notes/show/controller.js     |  2 +-
 app/scripts/modules/codemirror/controller.js  |  5 +-
 .../modules/markdown/libs/markdown-it-file.js | 96 +++++++++++++++++++
 .../modules/markdown/libs/markdown-it.js      | 24 +++--
 app/scripts/modules/markdown/libs/markdown.js |  4 +-
 app/scripts/modules/markdown/module.js        | 11 ++-
 6 files changed, 129 insertions(+), 13 deletions(-)
 create mode 100644 app/scripts/modules/markdown/libs/markdown-it-file.js

diff --git a/app/scripts/apps/notes/show/controller.js b/app/scripts/apps/notes/show/controller.js
index 69e50911a..bdd25d0ac 100644
--- a/app/scripts/apps/notes/show/controller.js
+++ b/app/scripts/apps/notes/show/controller.js
@@ -51,7 +51,7 @@ define([
         _show: function(note, notebook) {
             var self = this;
 
-            Radio.request('markdown', 'render', note.get('content'))
+            Radio.request('markdown', 'render', note)
             .then(function(content) {
                 return self.render(note, content, notebook);
             });
diff --git a/app/scripts/modules/codemirror/controller.js b/app/scripts/modules/codemirror/controller.js
index 59b89568f..8d8a29fb5 100644
--- a/app/scripts/modules/codemirror/controller.js
+++ b/app/scripts/modules/codemirror/controller.js
@@ -149,8 +149,9 @@ define([
          */
         updatePreview: function() {
             var self = this;
+            this.view.model.attributes.content = this.editor.getValue();
 
-            return Radio.request('markdown', 'render', this.editor.getValue())
+            return Radio.request('markdown', 'render', this.view.model)
             .then(function(content) {
                 self.view.trigger('editor:change', content);
             });
@@ -267,7 +268,7 @@ define([
             return Radio.request('markdown', 'parse', content)
             .then(function(env) {
                 return _.extend(
-                    _.pick(env, 'tags', 'tasks', 'taskCompleted', 'taskAll'),
+                    _.pick(env, 'tags', 'tasks', 'taskCompleted', 'taskAll', 'files'),
                     {content: content}
                 );
             });
diff --git a/app/scripts/modules/markdown/libs/markdown-it-file.js b/app/scripts/modules/markdown/libs/markdown-it-file.js
new file mode 100644
index 000000000..56da8dfe9
--- /dev/null
+++ b/app/scripts/modules/markdown/libs/markdown-it-file.js
@@ -0,0 +1,96 @@
+/**
+ * Copyright (C) 2015 Laverna project Authors.
+ *
+ * This Source Code Form is subject to the terms of the Mozilla Public
+ * License, v. 2.0. If a copy of the MPL was not distributed with this
+ * file, You can obtain one at http://mozilla.org/MPL/2.0/.
+ */
+/* global define, URL, webkitURL */
+define([
+    'underscore'
+], function(_) {
+    'use strict';
+
+    /**
+     * A Markdown-it plugin which replaces pseudo file locations
+     * with generated ObjectURLs.
+     */
+    var File = {
+        pattern: /#file:([a-z0-9\-])+/,
+
+        init: function(md) {
+            var origI = md.renderer.rules.image;
+
+            md.renderer.rules.link_open = function(tokens, idx, opt, env, self) { // jshint ignore:line
+                File._replaceLink(tokens, idx, opt, env);
+                return self.renderToken(tokens, idx, opt);
+            };
+
+            md.renderer.rules.image = function(tokens, idx, opt, env, self) {
+                File._replaceLink(tokens, idx, opt, env);
+                return origI(tokens, idx, opt, env, self);
+            };
+        },
+
+        /**
+         * Revoke all ObjectURLs which aren't under use.
+         */
+        revokeURLs: function(objectURLs, model) {
+            _.each(objectURLs, function(obj, key) {
+                if (_.findWhere(model.files, {id: key})) {
+                    return;
+                }
+
+                (URL || webkitURL).revokeObjectURL(obj);
+                delete objectURLs[key];
+            });
+        },
+
+        /**
+         * Replace all pseudo IDs with objectURLs.
+         */
+        _replaceLink: function(tokens, idx, options, env) {
+            var type = (tokens[idx].type === 'image' ? 'src' : 'href'),
+                attr = tokens[idx].attrs[tokens[idx].attrIndex(type)];
+
+            if (!File.pattern.test(attr[1])) {
+                return;
+            }
+
+            var id  = attr[1].match(File.pattern)[0].replace('#file:', '');
+
+            // Add files IDs to env
+            if (env) {
+                env.files = env.files || [];
+                env.files.push(id);
+            }
+
+            if (!env.modelData) {
+                return;
+            }
+
+            File._createURL(attr, id, env);
+        },
+
+        /**
+         * Create an ObjectURL.
+         */
+        _createURL: function(attr, id, env) {
+            var file = _.findWhere(env.modelData.files, {id: id});
+
+            if (!file) {
+                return;
+            }
+
+            // Generate a new link only if it wasn't generated before
+            var src = env.objectURLs[file.id];
+            src     = src || (URL || webkitURL).createObjectURL(file.src);
+
+            env.objectURLs[file.id] = src;
+            attr[1] = src;
+        },
+    };
+
+    return File;
+
+});
diff --git a/app/scripts/modules/markdown/libs/markdown-it.js b/app/scripts/modules/markdown/libs/markdown-it.js
index 253eadf95..69f3af7bf 100644
--- a/app/scripts/modules/markdown/libs/markdown-it.js
+++ b/app/scripts/modules/markdown/libs/markdown-it.js
@@ -8,7 +8,8 @@ define([
     'markdown-it-hash',
     'markdown-it-math',
     'modules/markdown/libs/markdown-it-task',
-], function(_, Q, MarkdownIt, Prism, sanitizer, hash, math, task) {
+    'modules/markdown/libs/markdown-it-file',
+], function(_, Q, MarkdownIt, Prism, sanitizer, hash, math, task, file) {
     'use strict';
 
     /**
@@ -35,6 +36,7 @@ define([
     }
 
     _.extend(Markdown.prototype, {
+        objectURLs: {},
 
         /**
          * Configure MarkdownIt.
@@ -57,6 +59,7 @@ define([
             })
             .use(hash)
             .use(task.init)
+            .use(file.init)
             ;
 
             this.md.renderer.rules.hashtag_open  = function(tokens, idx, f, env) { // jshint ignore:line
@@ -74,10 +77,18 @@ define([
         /**
          * Convert Markdown to HTML.
          */
-        render: function(content) {
-            // this.toggleTask(6, content);
+        render: function(model) {
+            var env  = {
+                modelData : model,
+                objectURLs: this.objectURLs
+            };
+
+            if (model.id) {
+                file.revokeURLs(this.objectURLs, model);
+            }
+
             return new Q(
-                this.md.render(content)
+                this.md.render(model.content, env)
             );
         },
 
@@ -103,8 +114,9 @@ define([
                 this.md.render(content, env)
             )
             .then(function() {
-                env.tags    = _.uniq(env.tags);
-                env.taskAll = env.tasks.length;
+                env.tags    = env.tags ? _.uniq(env.tags) : [];
+                env.files   = env.files ? _.uniq(env.files) : [];
+                env.taskAll = env.tasks ? env.tasks.length : 0;
                 return env;
             });
         },
diff --git a/app/scripts/modules/markdown/libs/markdown.js b/app/scripts/modules/markdown/libs/markdown.js
index a3bbf3491..4e0df06a8 100644
--- a/app/scripts/modules/markdown/libs/markdown.js
+++ b/app/scripts/modules/markdown/libs/markdown.js
@@ -53,8 +53,8 @@ define([
     _.extend(Markdown.prototype, {
         promises: [],
 
-        render: function(content) {
-            return this._emit('render', content);
+        render: function(model) {
+            return this._emit('render', model);
         },
 
         parse: function(content) {
diff --git a/app/scripts/modules/markdown/module.js b/app/scripts/modules/markdown/module.js
index 2dc8dd38f..9a343dfc1 100644
--- a/app/scripts/modules/markdown/module.js
+++ b/app/scripts/modules/markdown/module.js
@@ -7,9 +7,10 @@
  */
 /* global define */
 define([
+    'underscore',
     'backbone.radio',
     'modules/markdown/libs/markdown'
-], function(Radio, Markdown) {
+], function(_, Radio, Markdown) {
     'use strict';
 
     // Add a global module initializer
@@ -18,7 +19,13 @@ define([
         var md = new Markdown();
 
         Radio.reply('markdown', {
-            'render'     : md.render,
+            'render'     : function(model) {
+                var data   = (typeof model === 'string' ? {content: model} : _.clone(model.attributes));
+                data.files = _.pluck(model.files || [], 'attributes');
+
+                return md.render(data);
+            },
+
             'parse'      : md.parse,
             'task:toggle': md.taskToggle,
         }, md);

From e399bef1b5113bb2bd56865d57894c05cc81955e Mon Sep 17 00:00:00 2001
From: wwebfor <wwebfor@users.noreply.github.com>
Date: Wed, 6 Jan 2016 13:25:49 +0600
Subject: [PATCH 13/25] :bug: Fix image attachment

---
 app/scripts/modules/fileDialog/controller.js | 15 ++++++++++++---
 app/scripts/modules/linkDialog/controller.js |  2 +-
 2 files changed, 13 insertions(+), 4 deletions(-)

diff --git a/app/scripts/modules/fileDialog/controller.js b/app/scripts/modules/fileDialog/controller.js
index 5c25ed926..fd21f2195 100644
--- a/app/scripts/modules/fileDialog/controller.js
+++ b/app/scripts/modules/fileDialog/controller.js
@@ -74,7 +74,7 @@ define([
 
                 // If there is only 1 file and its type is image
                 if (files.length === 1 && self.isImage(files[0])) {
-                    return self.attachImage(self.generateCode(files[0]));
+                    return self.attachText(self.generateCode(files[0]));
                 }
 
                 // Otherwise, we will generate custom Markdown code
@@ -104,11 +104,20 @@ define([
                 }, this);
             }
 
-            this.attachImage(str);
+            this.attachText(str);
         },
 
         attachImage: function(url) {
-            this.options.callback(url !== '' ? url : null);
+            var text = Radio.request('editor', 'generate:image', {
+                text : 'Alt description',
+                url  : url
+            });
+
+            this.attachText(text);
+        },
+
+        attachText: function(text) {
+            this.options.callback(text !== '' ? text : null);
 
             // Close the dialog
             this.options.callback = null;
diff --git a/app/scripts/modules/linkDialog/controller.js b/app/scripts/modules/linkDialog/controller.js
index 6e09946c8..cf192c909 100644
--- a/app/scripts/modules/linkDialog/controller.js
+++ b/app/scripts/modules/linkDialog/controller.js
@@ -1,6 +1,6 @@
 /**
  * Copyright (C) 2015 Laverna project Authors.
- * 
+ *
  * This Source Code Form is subject to the terms of the Mozilla Public
  * License, v. 2.0. If a copy of the MPL was not distributed with this
  * file, You can obtain one at http://mozilla.org/MPL/2.0/.

From 1e92e057700a8b3c19ea453340963ff33fead650 Mon Sep 17 00:00:00 2001
From: wwwredfish <wwwredfish@gmail.com>
Date: Wed, 6 Jan 2016 14:01:00 +0600
Subject: [PATCH 14/25] :bug: Show confirm dialog only if there are changes

---
 app/scripts/apps/notes/form/controller.js    | 20 ++++++++++++++------
 app/scripts/modules/codemirror/controller.js | 18 +++++++++++++++---
 app/scripts/modules/markdown/module.js       |  2 +-
 3 files changed, 30 insertions(+), 10 deletions(-)

diff --git a/app/scripts/apps/notes/form/controller.js b/app/scripts/apps/notes/form/controller.js
index d7d2e75cb..357cf0445 100644
--- a/app/scripts/apps/notes/form/controller.js
+++ b/app/scripts/apps/notes/form/controller.js
@@ -132,14 +132,22 @@ define([
          * Warn a user that they have made some changes.
          */
         showConfirm: function() {
-            var data  = _.pick(this.getContent(), 'title', 'content', 'notebookId'),
-                model = this.view.model.pick('title', 'content', 'notebookId');
+            var self = this;
 
-            if (_.isEqual(model, data)) {
-                return this.redirect();
-            }
+            return this.getContent()
+            .then(function(data) {
+                var model = self.view.model.pick('title', 'content', 'notebookId');
+                data  = _.pick(data, 'title', 'content', 'notebookId');
 
-            Radio.request('Confirm', 'start', $.t('You have unsaved changes.'));
+                if (_.isEqual(model, data)) {
+                    return self.redirect();
+                }
+
+                Radio.request('Confirm', 'start', $.t('You have unsaved changes.'));
+            })
+            .fail(function(e) {
+                console.error('form ShowConfirm', e);
+            });
         },
 
         redirect: function() {
diff --git a/app/scripts/modules/codemirror/controller.js b/app/scripts/modules/codemirror/controller.js
index 8d8a29fb5..f800b8482 100644
--- a/app/scripts/modules/codemirror/controller.js
+++ b/app/scripts/modules/codemirror/controller.js
@@ -73,6 +73,7 @@ define([
             // Events
             this.listenTo(this.view, 'editor:action', this.onViewAction);
             this.listenTo(Radio.channel('notesForm'), 'set:mode', this.changeMode);
+            this.listenTo(Radio.channel('editor'), 'focus', this.focus);
 
             // Show the view and render Pagedown editor
             Radio.request('notesForm', 'show:editor', this.view);
@@ -148,10 +149,14 @@ define([
          * Update the preview.
          */
         updatePreview: function() {
-            var self = this;
-            this.view.model.attributes.content = this.editor.getValue();
+            var self = this,
+                data = _.pick(this.view.model, 'attributes', 'files');
 
-            return Radio.request('markdown', 'render', this.view.model)
+            return Radio.request('markdown', 'render', _.extend({}, data, {
+                attributes: {
+                    content: this.editor.getValue()
+                }
+            }))
             .then(function(content) {
                 self.view.trigger('editor:change', content);
             });
@@ -557,6 +562,13 @@ define([
             this.editor.undo();
         },
 
+        /**
+         * Focus on the editor.
+         */
+        focus: function() {
+            this.editor.focus();
+        },
+
         generateLink: function(data) {
             return '[' + data.text + ']' + '(' + data.url + ')';
         },
diff --git a/app/scripts/modules/markdown/module.js b/app/scripts/modules/markdown/module.js
index 9a343dfc1..213ff2cd7 100644
--- a/app/scripts/modules/markdown/module.js
+++ b/app/scripts/modules/markdown/module.js
@@ -20,7 +20,7 @@ define([
 
         Radio.reply('markdown', {
             'render'     : function(model) {
-                var data   = (typeof model === 'string' ? {content: model} : _.clone(model.attributes));
+                var data   = (typeof model === 'string' ? {content: model} : _.clone(model.attributes || model));
                 data.files = _.pluck(model.files || [], 'attributes');
 
                 return md.render(data);

From 13ba762888bdd7d77be2cb218d9aa9a9b7e5da6c Mon Sep 17 00:00:00 2001
From: wwebfor <wwebfor@users.noreply.github.com>
Date: Wed, 6 Jan 2016 14:37:45 +0600
Subject: [PATCH 15/25] Increase paddings in Codemirror

---
 app/scripts/modules/codemirror/controller.js         | 6 +++---
 app/scripts/modules/codemirror/templates/editor.html | 4 +++-
 app/scripts/modules/codemirror/views/editor.js       | 3 ++-
 app/styles/core/codemirror/core.less                 | 2 +-
 app/styles/core/editor.less                          | 5 ++++-
 5 files changed, 13 insertions(+), 7 deletions(-)

diff --git a/app/scripts/modules/codemirror/controller.js b/app/scripts/modules/codemirror/controller.js
index f800b8482..1cbda354a 100644
--- a/app/scripts/modules/codemirror/controller.js
+++ b/app/scripts/modules/codemirror/controller.js
@@ -203,7 +203,7 @@ define([
 
             // Don't do any computations
             if (!e.doc.scrollTop) {
-                this.view.ui.preview.scrollTop(0);
+                this.view.ui.previewScroll.scrollTop(0);
                 return;
             }
 
@@ -237,13 +237,13 @@ define([
                  * change it according to the difference of scroll positions in the editor.
                  */
                 if (self.scrollTop && self.scrollPos === newPos) {
-                    self.view.ui.preview.scrollTop(self.view.ui.preview.scrollTop() + (e.doc.scrollTop - self.scrollTop));
+                    self.view.ui.previewScroll.scrollTop(self.view.ui.previewScroll.scrollTop() + (e.doc.scrollTop - self.scrollTop));
                     self.scrollTop = e.doc.scrollTop;
                     return;
                 }
 
                 // Scroll to the last visible element's position
-                self.view.ui.preview.animate({
+                self.view.ui.previewScroll.animate({
                     scrollTop: newPos
                 }, 70, 'swing');
 
diff --git a/app/scripts/modules/codemirror/templates/editor.html b/app/scripts/modules/codemirror/templates/editor.html
index a40ed9712..96583c80b 100644
--- a/app/scripts/modules/codemirror/templates/editor.html
+++ b/app/scripts/modules/codemirror/templates/editor.html
@@ -64,6 +64,8 @@
     </div>
 
     <div class="editor--layout -right">
-        <div class="editor--preview" id="wmd-preview"></div>
+        <div class="editor--preview">
+            <div id="wmd-preview" class="editor--preview--block"></div>
+        </div>
     </div>
 </div>
diff --git a/app/scripts/modules/codemirror/views/editor.js b/app/scripts/modules/codemirror/views/editor.js
index 16d92c64e..8e1958663 100644
--- a/app/scripts/modules/codemirror/views/editor.js
+++ b/app/scripts/modules/codemirror/views/editor.js
@@ -22,7 +22,8 @@ define([
         className: 'layout--body container-fluid',
 
         ui: {
-            preview    : '#wmd-preview',
+            preview       : '#wmd-preview',
+            previewScroll : '.editor--preview'
         },
 
         events: {
diff --git a/app/styles/core/codemirror/core.less b/app/styles/core/codemirror/core.less
index 81ad35309..2b58f465f 100644
--- a/app/styles/core/codemirror/core.less
+++ b/app/styles/core/codemirror/core.less
@@ -76,7 +76,7 @@ flickering artifacts. */
  * Paddings
  */
 .CodeMirror-lines {
-    padding    : 15px 10px; // Vertical padding around content
+    padding    : 15px 10px 100px; // Vertical padding around content
     cursor     : text;
     min-height : 1px;       // prevents collapsing before first draw
 }
diff --git a/app/styles/core/editor.less b/app/styles/core/editor.less
index 318af4b29..4ec20cbda 100644
--- a/app/styles/core/editor.less
+++ b/app/styles/core/editor.less
@@ -152,7 +152,10 @@
     .editor--preview {
         display: block;
         word-wrap: break-word;
-        padding: 15px 20px 100px;
+        padding: 15px 20px 0;
+    }
+    .editor--preview--block {
+        padding-bottom: 100px;
     }
 
     // Preview mode on small screens

From 21c43ba3f240d014bc34aa3d8014bc063e239cba Mon Sep 17 00:00:00 2001
From: wwwredfish <wwwredfish@gmail.com>
Date: Wed, 6 Jan 2016 16:39:52 +0600
Subject: [PATCH 16/25] Improve UX in normal mode

Improve UX in normal mode of the editor by making WYSIWYG buttons fixed
on top.
---
 app/scripts/apps/notes/form/views/formView.js |  2 +-
 app/scripts/modules/codemirror/controller.js  |  3 +-
 .../modules/codemirror/views/editor.js        | 41 ++++++++++++++++++-
 app/styles/core/codemirror/core.less          |  9 +++-
 app/styles/core/editor.less                   |  8 ++++
 5 files changed, 59 insertions(+), 4 deletions(-)

diff --git a/app/scripts/apps/notes/form/views/formView.js b/app/scripts/apps/notes/form/views/formView.js
index 04bfb5105..780d9ca15 100644
--- a/app/scripts/apps/notes/form/views/formView.js
+++ b/app/scripts/apps/notes/form/views/formView.js
@@ -1,6 +1,6 @@
 /**
  * Copyright (C) 2015 Laverna project Authors.
- * 
+ *
  * This Source Code Form is subject to the terms of the Mozilla Public
  * License, v. 2.0. If a copy of the MPL was not distributed with this
  * file, You can obtain one at http://mozilla.org/MPL/2.0/.
diff --git a/app/scripts/modules/codemirror/controller.js b/app/scripts/modules/codemirror/controller.js
index 1cbda354a..6f24d715b 100644
--- a/app/scripts/modules/codemirror/controller.js
+++ b/app/scripts/modules/codemirror/controller.js
@@ -141,8 +141,9 @@ define([
             this.updatePreview();
         },
 
-        changeMode: function() {
+        changeMode: function(mode) {
             window.dispatchEvent(new Event('resize'));
+            this.view.trigger('change:mode', mode);
         },
 
         /**
diff --git a/app/scripts/modules/codemirror/views/editor.js b/app/scripts/modules/codemirror/views/editor.js
index 8e1958663..89ddd8c9e 100644
--- a/app/scripts/modules/codemirror/views/editor.js
+++ b/app/scripts/modules/codemirror/views/editor.js
@@ -23,7 +23,8 @@ define([
 
         ui: {
             preview       : '#wmd-preview',
-            previewScroll : '.editor--preview'
+            previewScroll : '.editor--preview',
+            bar           : '.editor--bar'
         },
 
         events: {
@@ -32,7 +33,13 @@ define([
         },
 
         initialize: function() {
+            this.options.mode = Radio.request('configs', 'get:config', 'editMode');
+
             this.listenTo(this, 'editor:change', this.onEditorChange);
+            this.listenTo(this, 'change:mode', this.onChangeMode);
+
+            this.$layoutBody = $('.layout--body.-scroll.-form');
+            this.$layoutBody.on('scroll', _.bind(this.onScroll, this));
         },
 
         serializeData: function() {
@@ -40,9 +47,41 @@ define([
         },
 
         onDestroy: function() {
+            this.$layoutBody.off('scroll');
             Radio.trigger('editor', 'view:destroy');
         },
 
+        onChangeMode: function(mode) {
+            this.options.mode = mode;
+
+            if (mode !== 'normal') {
+
+                // Make the editor visible by scrolling back
+                this.$layoutBody.scrollTop(0);
+
+                // Change WYSIWYG bar width
+                this.ui.bar.css('width', 'initial');
+                return this.ui.bar.removeClass('-fixed');
+            }
+        },
+
+        onScroll: function() {
+
+            // If editor mode is not 'normal' mode, don't do anything
+            if (this.options.mode !== 'normal') {
+                return;
+            }
+
+            // Fix WYSIWYG bar on top
+            if (this.$layoutBody.scrollTop() > this.ui.bar.offset().top) {
+                this.ui.bar.css('width', this.$layoutBody.width());
+                return this.ui.bar.addClass('-fixed');
+            }
+
+            this.ui.bar.css('width', 'initial');
+            return this.ui.bar.removeClass('-fixed');
+        },
+
         onEditorChange: function(content) {
             this.ui.preview.html(content);
 
diff --git a/app/styles/core/codemirror/core.less b/app/styles/core/codemirror/core.less
index 2b58f465f..9a8dcff5a 100644
--- a/app/styles/core/codemirror/core.less
+++ b/app/styles/core/codemirror/core.less
@@ -76,7 +76,7 @@ flickering artifacts. */
  * Paddings
  */
 .CodeMirror-lines {
-    padding    : 15px 10px 100px; // Vertical padding around content
+    padding    : 15px 0 100px; // Vertical padding around content
     cursor     : text;
     min-height : 1px;       // prevents collapsing before first draw
 }
@@ -331,3 +331,10 @@ div.CodeMirror-dragcursors {
         visibility: hidden;
     }
 }
+
+.editor--fullscreen.-preview {
+    .CodeMirror-lines {
+        padding-left: 10px;
+        padding-right: 10px;
+    }
+}
diff --git a/app/styles/core/editor.less b/app/styles/core/editor.less
index 4ec20cbda..c2a30515d 100644
--- a/app/styles/core/editor.less
+++ b/app/styles/core/editor.less
@@ -32,6 +32,14 @@
     border-top    : 1px solid rgb(229, 229, 229);
     border-bottom : 1px solid rgb(229, 229, 229);
     padding       : 6px 0;
+
+    &.-fixed {
+        &:extend(.navbar-static-top);
+        position    : fixed;
+        z-index     : @zindex-navbar - 1;
+        top         : @navbar-height;
+        margin-left : -15px;
+    }
 }
 
 .editor--input {

From d236614e3d5349edf87fb1a77dd69202bc72af91 Mon Sep 17 00:00:00 2001
From: wwebfor <wwebfor@users.noreply.github.com>
Date: Wed, 6 Jan 2016 16:52:44 +0600
Subject: [PATCH 17/25] Add hover effect to WYSIWYG buttons

---
 .../modules/codemirror/templates/editor.html  | 22 +++++++++----------
 app/styles/theme-default/buttons.less         | 11 ++++++++++
 2 files changed, 22 insertions(+), 11 deletions(-)

diff --git a/app/scripts/modules/codemirror/templates/editor.html b/app/scripts/modules/codemirror/templates/editor.html
index 96583c80b..925136010 100644
--- a/app/scripts/modules/codemirror/templates/editor.html
+++ b/app/scripts/modules/codemirror/templates/editor.html
@@ -1,45 +1,45 @@
 <div class="editor--bar dropdown text-center">
     <div class="btn-group editor--btns">
-        <span data-action="bold" data-state="strong" class="btn">
+        <span data-action="bold" data-state="strong" class="btn btn--wysiwyg">
             <i class="icon-bold"></i>
         </span>
-        <span data-action="italic" data-state="em" class="btn">
+        <span data-action="italic" data-state="em" class="btn btn--wysiwyg">
             <i class="icon-italic"></i>
         </span>
-        <span data-action="heading" data-state="header" class="btn">
+        <span data-action="heading" data-state="header" class="btn btn--wysiwyg">
             <i class="icon-font"></i>
         </span>
     </div>
 
     <div class="btn-group editor--btns">
-        <span data-action="link" data-state="link" class="btn">
+        <span data-action="link" data-state="link" class="btn btn--wysiwyg">
             <i class="icon-globe"></i>
         </span>
-        <span data-action="attachment" class="btn">
+        <span data-action="attachment" class="btn btn--wysiwyg">
             <i class="icon-picture"></i>
         </span>
-        <span data-action="code" data-state="comment" class="btn">
+        <span data-action="code" data-state="comment" class="btn btn--wysiwyg">
             <i class="icon-code"></i>
         </span>
     </div>
 
     <div class="btn-group editor--btns">
-        <span data-action="numberedList" data-state="ordered-list" class="btn">
+        <span data-action="numberedList" data-state="ordered-list" class="btn btn--wysiwyg">
             <i class="icon-list-numbered"></i>
         </span>
-        <span data-action="list" data-state="unordered-list" class="btn">
+        <span data-action="list" data-state="unordered-list" class="btn btn--wysiwyg">
             <i class="icon-list-bullet"></i>
         </span>
-        <span data-action="hr" data-state="hr" class="btn">
+        <span data-action="hr" data-state="hr" class="btn btn--wysiwyg">
             <i class="icon-minus"></i>
         </span>
     </div>
 
     <div class="btn-group editor--btns">
-        <span data-action="undo" class="btn">
+        <span data-action="undo" class="btn btn--wysiwyg">
             <i class="icon-reply"></i>
         </span>
-        <span data-action="redo" class="btn">
+        <span data-action="redo" class="btn btn--wysiwyg">
             <i class="icon-share"></i>
         </span>
     </div>
diff --git a/app/styles/theme-default/buttons.less b/app/styles/theme-default/buttons.less
index 6f67b8a72..8eb501920 100644
--- a/app/styles/theme-default/buttons.less
+++ b/app/styles/theme-default/buttons.less
@@ -43,3 +43,14 @@
     }
 }
 
+/**
+ * WYSIWYG buttons
+ */
+.btn--wysiwyg {
+    border-radius : 0;
+    transition    : background .3s ease-in-out;
+
+    &:hover {
+        background : @pagedown--btn--hover--bg;
+    }
+}

From 7e75122761fa7f7e489b4d286f929edf860f1ad4 Mon Sep 17 00:00:00 2001
From: wwwredfish <wwwredfish@gmail.com>
Date: Wed, 6 Jan 2016 17:21:56 +0600
Subject: [PATCH 18/25] Make WYSIWYG bar responsive

---
 app/styles/theme-default/editor.less | 13 +++++++++++--
 1 file changed, 11 insertions(+), 2 deletions(-)

diff --git a/app/styles/theme-default/editor.less b/app/styles/theme-default/editor.less
index 614675330..e29db4e58 100644
--- a/app/styles/theme-default/editor.less
+++ b/app/styles/theme-default/editor.less
@@ -18,6 +18,15 @@
 .editor--bar {
     border-right-width : 0;
     border-left-width  : 0;
+
+    // Hide some buttons on small screens
+    max-height : @navbar-height - 6px;
+    height     : @navbar-height - 6px;
+    overflow   : hidden;
+}
+.editor--btns {
+    margin-top: 2px;
+    margin-bottom: 2px;
 }
 
 .editor--fullscreen .layout--body.-form {
@@ -44,8 +53,8 @@
     border-radius       : 0;
 
     // Sizing
-    padding-top    : 4px;
-    padding-bottom : 4px;
+    padding-top    : 2px;
+    padding-bottom : 2px;
     min-height     : 20px;
     height         : auto;
 }

From 8d227d1b915cee7e2adaa6600c854445d93a38e3 Mon Sep 17 00:00:00 2001
From: wwebfor <wwebfor@users.noreply.github.com>
Date: Wed, 6 Jan 2016 17:43:09 +0600
Subject: [PATCH 19/25] :fire: Remove Pagedown-ACE and its modules

---
 app/scripts/init.js                           |   4 -
 app/scripts/main.js                           |  43 -----
 app/scripts/modules/codePrettify/module.js    |  64 -------
 .../pagedown/controllers/controller.js        | 114 -----------
 .../modules/pagedown/controllers/pagedown.js  |  81 --------
 .../pagedown/controllers/pagedownAce.js       | 179 ------------------
 .../modules/pagedown/libs/converter.js        |  52 -----
 app/scripts/modules/pagedown/module.js        |  66 -------
 .../modules/pagedown/templates/editor.html    |  51 -----
 app/scripts/modules/pagedown/views/editor.js  | 108 -----------
 app/scripts/modules/tags/module.js            | 109 -----------
 app/scripts/modules/tasks/module.js           | 136 -------------
 bower.json                                    |  14 +-
 13 files changed, 4 insertions(+), 1017 deletions(-)
 delete mode 100644 app/scripts/modules/codePrettify/module.js
 delete mode 100644 app/scripts/modules/pagedown/controllers/controller.js
 delete mode 100644 app/scripts/modules/pagedown/controllers/pagedown.js
 delete mode 100644 app/scripts/modules/pagedown/controllers/pagedownAce.js
 delete mode 100644 app/scripts/modules/pagedown/libs/converter.js
 delete mode 100644 app/scripts/modules/pagedown/module.js
 delete mode 100644 app/scripts/modules/pagedown/templates/editor.html
 delete mode 100644 app/scripts/modules/pagedown/views/editor.js
 delete mode 100644 app/scripts/modules/tags/module.js
 delete mode 100644 app/scripts/modules/tasks/module.js

diff --git a/app/scripts/init.js b/app/scripts/init.js
index 5bf5a4765..cb4f50984 100644
--- a/app/scripts/init.js
+++ b/app/scripts/init.js
@@ -53,15 +53,11 @@ define([
         'apps/help/appHelp',
 
         // Optional modules
-        // 'modules/pagedown/module',
         'modules/markdown/module',
         'modules/codemirror/module',
-        // 'modules/tags/module',
-        // 'modules/tasks/module',
         'modules/linkDialog/module',
         'modules/fileDialog/module',
         'modules/fuzzySearch/module',
-        // 'modules/codePrettify/module',
         'modules/importExport/module',
         'modules/mathjax/module'
     ], function(storage) {
diff --git a/app/scripts/main.js b/app/scripts/main.js
index 760cb2b08..d835023f4 100644
--- a/app/scripts/main.js
+++ b/app/scripts/main.js
@@ -15,30 +15,12 @@ requirejs.config({
     nodeRequire: (typeof requireNode === 'undefined' ? null : requireNode),
 
     packages: [
-        // Ace editor
-        {
-            name     : 'ace',
-            location : '../bower_components/ace/lib/ace',
-            main     : 'ace'
-        },
         // Codemirror editor
         {
             name     : 'codemirror',
             location : '../bower_components/codemirror',
             main     : 'lib/codemirror'
         },
-        // Pagedown editor
-        {
-            name     : 'pagedown',
-            location : '../bower_components/pagedown',
-            main     : 'Markdown.Editor'
-        },
-        // Pagedown-ace editor
-        {
-            name     : 'pagedown-ace',
-            location : '../bower_components/pagedown-ace',
-            main     : 'Markdown.Editor'
-        },
         // Prismjs
         {
             name     : 'prism',
@@ -85,7 +67,6 @@ requirejs.config({
         'markdown-it-san'     : '../bower_components/markdown-it-sanitizer/dist/markdown-it-sanitizer',
         'markdown-it-hash'    : '../bower_components/markdown-it-hashtag/dist/markdown-it-hashtag',
         'markdown-it-math'    : '../bower_components/markdown-it-math/dist/markdown-it-math',
-        'pagedown-extra'      : '../bower_components/pagedown-extra/Markdown.Extra',
         'to-markdown'         : '../bower_components/to-markdown/src/to-markdown',
 
         // Others
@@ -138,30 +119,6 @@ requirejs.config({
         },
 
         // Markdown
-        ace: {
-            exports: 'ace'
-        },
-        'pagedown/Markdown.Editor': {
-            exports: 'Markdown.Editor',
-            deps: [ 'pagedown-extra' ]
-        },
-        'pagedown-ace/Markdown.Editor': {
-            exports: 'Markdown.Editor',
-            deps: [ 'pagedown-extra' ]
-        },
-        'pagedown-extra': {
-            exports: 'Markdown',
-            deps: [
-                'pagedown/Markdown.Converter',
-                'pagedown/Markdown.Sanitizer'
-            ]
-        },
-        'pagedown/Markdown.Converter': {
-            exports: 'Markdown'
-        },
-        'pagedown/Markdown.Sanitizer': {
-            deps: [ 'pagedown/Markdown.Converter' ]
-        },
         'to-markdown': {
             exports: 'toMarkdown'
         },
diff --git a/app/scripts/modules/codePrettify/module.js b/app/scripts/modules/codePrettify/module.js
deleted file mode 100644
index 5875d7ecd..000000000
--- a/app/scripts/modules/codePrettify/module.js
+++ /dev/null
@@ -1,64 +0,0 @@
-/**
- * Copyright (C) 2015 Laverna project Authors.
- * 
- * This Source Code Form is subject to the terms of the Mozilla Public
- * License, v. 2.0. If a copy of the MPL was not distributed with this
- * file, You can obtain one at http://mozilla.org/MPL/2.0/.
- */
-/* global define */
-define([
-    'jquery',
-    'underscore',
-    'marionette',
-    'modules',
-    'backbone.radio',
-    'prettify'
-], function($, _, Marionette, Modules, Radio, prettify) {
-    'use strict';
-
-    /**
-     * Google code prettify module.
-     */
-    var CodePrettify = Modules.module('CodePrettify', {});
-
-    function render(view) {
-        var $pre = view ? view.$('pre') : $('pre'),
-            code;
-
-        // Google code prettify
-        $pre.addClass('prettyprint').each(function(idx, el) {
-            code = el.firstChild;
-            code.innerHTML = prettify.prettyPrintOne(code.innerHTML);
-        });
-    }
-
-    /**
-     * Initializers & finalizers of the module
-     */
-    CodePrettify.on('start', function(view) {
-        render(view);
-
-        // Events
-        Radio.on('editor', 'preview:refresh', render);
-    });
-
-    CodePrettify.on('stop', function() {
-        Radio.off('editor', 'preview:refresh');
-    });
-
-    Radio.request('init', 'add', 'module', function() {
-        // When a note is shown, start this module
-        Radio.on('noteView', {
-            'view:render'  : CodePrettify.start,
-            'view:destroy' : CodePrettify.stop
-        }, CodePrettify);
-
-        // When an editor view is shown, start this module
-        Radio.on('editor', {
-            'view:render'  : CodePrettify.start,
-            'view:destroy' : CodePrettify.stop
-        }, CodePrettify);
-    });
-
-    return CodePrettify;
-});
diff --git a/app/scripts/modules/pagedown/controllers/controller.js b/app/scripts/modules/pagedown/controllers/controller.js
deleted file mode 100644
index eb863f494..000000000
--- a/app/scripts/modules/pagedown/controllers/controller.js
+++ /dev/null
@@ -1,114 +0,0 @@
-/**
- * Copyright (C) 2015 Laverna project Authors.
- *
- * This Source Code Form is subject to the terms of the Mozilla Public
- * License, v. 2.0. If a copy of the MPL was not distributed with this
- * file, You can obtain one at http://mozilla.org/MPL/2.0/.
- */
-/* global define */
-define([
-    'underscore',
-    'marionette',
-    'backbone.radio',
-    'modules/pagedown/libs/converter',
-    'modules/pagedown/views/editor',
-], function(_, Marionette, Radio, Converter, View) {
-    'use strict';
-
-    /**
-     * Basic controller from which both PagedownAce and Pagedown extend.
-     */
-    var Controller = Marionette.Object.extend({
-
-        /**
-         * @type object Markdown.Editor
-         */
-        Editor: null,
-
-        initialize: function() {
-            _.bindAll(this, 'onPreviewRefresh', 'triggerScroll', 'onChange');
-
-            // Get configs
-            this.configs = Radio.request('configs', 'get:object');
-
-            // Initialize the view
-            this.view = new View({
-                model   : Radio.request('notesForm', 'model'),
-                configs : this.configs
-            });
-
-            // Show the view and render Pagedown editor
-            Radio.request('notesForm', 'show:editor', this.view);
-
-            // Listen to events
-            this.vent = Radio.channel('editor');
-            this.listenTo(this.vent, 'focus', this.focus);
-
-            // Replies
-            this.vent.reply('get:content', this.getContent, this);
-            this.vent.reply('generate:link', this.getLinkCode, this);
-            this.vent.reply('generate:image', this.getImageCode, this);
-
-            // Replies
-            this.vent.reply('insert', this.insertText, this);
-        },
-
-        onDestroy: function() {
-            this.stopListening();
-            this.vent.stopReplying('get:content');
-            this.view.trigger('destroy');
-        },
-
-        /**
-         * Initialize Pagedown editor.
-         * @return promise
-         */
-        initMdEditor: function() {
-            var converter = Converter.getConverter(this.view.model);
-
-            // Start the Markdown editor
-            this.mdEditor = new this.Editor(converter);
-
-            // Register hooks
-            this.mdEditor.hooks.chain('onPreviewRefresh', this.onPreviewRefresh);
-
-            // Start initializers
-            return Radio.request('init', 'start', 'editor:before', this.mdEditor, this.view.model)();
-        },
-
-        /**
-         * Trigger `preview:refresh` when preview is refreshed.
-         */
-        onPreviewRefresh: function() {
-            this.vent.trigger('preview:refresh');
-        },
-
-        onChange: function() {
-            this.triggerSave();
-        },
-
-        /**
-         * Trigger auto:save.
-         */
-        triggerSave: _.debounce(function() {
-            if (this.getContent() !== '') {
-                Radio.trigger('notesForm', 'save:auto');
-            }
-        }, 1000),
-
-        triggerScroll: function() {
-            Radio.trigger('editor', 'pagedown:scroll');
-        },
-
-        getLinkCode: function(data) {
-            return '[' + data.text + ']' + '(' + data.url + ')';
-        },
-
-        getImageCode: function(data) {
-            return '!' + this.getLinkCode(data);
-        },
-
-    });
-
-    return Controller;
-});
diff --git a/app/scripts/modules/pagedown/controllers/pagedown.js b/app/scripts/modules/pagedown/controllers/pagedown.js
deleted file mode 100644
index d59b45f5f..000000000
--- a/app/scripts/modules/pagedown/controllers/pagedown.js
+++ /dev/null
@@ -1,81 +0,0 @@
-/* global define */
-define([
-    'underscore',
-    'q',
-    'marionette',
-    'backbone.radio',
-    'modules/pagedown/views/editor',
-    'modules/pagedown/libs/converter',
-    'modules/pagedown/controllers/controller',
-    'pagedown/Markdown.Editor',
-], function(_, Q, Marionette, Radio, View, Converter, Controller, Editor) {
-    'use strict';
-
-    /**
-     * Renders textarea version of Pagedown.
-     */
-    var Pagedown = Controller.extend({
-        Editor: Editor,
-
-        initialize: function() {
-            _.bindAll(this, 'startEditor', 'changeMode');
-
-            // Call parent initialize method
-            _.bind(Controller.prototype.initialize, this)();
-
-            this.listenTo(Radio.channel('notesForm'), 'set:mode', this.changeMode);
-
-            return new Q(this.initMdEditor())
-            .then(this.startEditor)
-            .fail(function(e) {
-                console.error('Markdown editor: error', e);
-            });
-        },
-
-        startEditor: function() {
-            var self = this;
-
-            // Replace div block with textarea
-            this.view.ui.input.replaceWith(function() {
-                return $('<textarea id="' + self.view.ui.input.attr('id') + '">')
-                    .addClass(this.className)
-                    .addClass('-textarea');
-            });
-
-            this.view.ui.input = $('#' + self.view.ui.input.attr('id'));
-
-            // Listen to scroll event
-            this.view.ui.input.on('scroll', function () {
-                self.triggerScroll();
-            });
-
-            this.view.ui.input.val(this.view.model.get('content'));
-
-            this.mdEditor.run();
-            this.changeMode();
-        },
-
-        changeMode: function(mode) {
-            this.$body = this.$body || $('body');
-
-            if (mode === 'preview') {
-                this.$body.removeClass('-pagedown--text');
-                return;
-            }
-
-            this.$body.addClass('-pagedown--text');
-        },
-
-        getContent: function() {
-            var data     = {};
-            data.content = this.view.ui.input.val().trim();
-            data.tags    = Converter.getTags(data.content);
-            data.files   = Radio.request('editor', 'get:files', data.content);
-            data = _.extend(data, Converter.countTasks(data.content));
-            return data;
-        },
-
-    });
-
-    return Pagedown;
-});
diff --git a/app/scripts/modules/pagedown/controllers/pagedownAce.js b/app/scripts/modules/pagedown/controllers/pagedownAce.js
deleted file mode 100644
index d64e1b8be..000000000
--- a/app/scripts/modules/pagedown/controllers/pagedownAce.js
+++ /dev/null
@@ -1,179 +0,0 @@
-/**
- * Copyright (C) 2015 Laverna project Authors.
- *
- * This Source Code Form is subject to the terms of the Mozilla Public
- * License, v. 2.0. If a copy of the MPL was not distributed with this
- * file, You can obtain one at http://mozilla.org/MPL/2.0/.
- */
-/* global define */
-define([
-    'underscore',
-    'q',
-    'backbone.radio',
-    'marionette',
-    'modules/pagedown/libs/converter',
-    'modules/pagedown/controllers/controller',
-    'ace',
-    'pagedown-ace/Markdown.Editor',
-    'ace/mode/markdown',
-    'ace/theme/github',
-    'pagedown-extra'
-], function(_, Q, Radio, Marionette, Converter, Controller, ace, Editor) {
-    'use strict';
-
-    /**
-     * This class renders pagedown editor.
-     *
-     * It executes `editor:before` initializer before starting the editor.
-     *
-     * Triggers the following
-     * Events:
-     * 1. channel: editor, event: pagedown:scroll
-     *    when a user scrolled through the editor.
-     * 2. channel: editor, event: ready
-     *    when pagedown is ready.
-     *
-     * Answers to the following
-     * Replies:
-     * 1. channel: editor, event: get:content
-     *    returns current value from the editor.
-     * 2. channel: editor, event: generate:link
-     *    generates Markdown code for a link.
-     * 3. channel: editor, event: generate:image
-     *    generates Markdown code for an image.
-     *
-     * Replies:
-     * 1. channel: editor, event: insert
-     *    inserts text to the editor.
-     */
-    var PagedownAce = Controller.extend({
-        Editor: Editor,
-
-        initialize: function() {
-            _.bindAll(this, 'initAce', 'startEditor');
-
-            // Call parent initialize method
-            _.bind(Controller.prototype.initialize, this)();
-
-            return new Q(this.initMdEditor())
-            .then(this.initAce)
-            .then(this.startEditor)
-            .fail(function(e) {
-                console.error('Markdown editor: error', e);
-            });
-        },
-
-        onDestroy: function() {
-            this.editor.destroy();
-
-            // Call parent onDestroy method
-            _.bind(Controller.prototype.onDestroy, this)();
-        },
-
-        /**
-         * Initialize ACE editor and configure it.
-         * @return object
-         */
-        initAce: function() {
-            // Initialize ACE editor
-            this.editor = ace.edit('wmd-input');
-
-            // Configure it
-            this.editor.getSession().setMode('ace/mode/markdown');
-            this.editor.setTheme('ace/theme/github');
-            this.editor.setFontSize(14);
-
-            // this.editor.setOption('spellcheck', true);
-            this.editor.setHighlightActiveLine(true);
-            this.editor.session.setUseWrapMode(true);
-            this.editor.session.setUseSoftTabs(true);
-            this.editor.session.setNewLineMode('unix');
-            this.editor.setShowPrintMargin(false);
-
-            this.editor.renderer.lineHeight = 16;
-            this.editor.renderer.setPrintMarginColumn(false);
-            this.editor.renderer.setShowGutter(false);
-
-            // Events
-            this.editor.session.on(
-                'changeScrollTop',
-                _.debounce(this.triggerScroll, 10, {maxWait: 10})
-            );
-            this.editor.session.on('change', this.onChange);
-
-            return this.editor;
-        },
-
-        /**
-         * Start Pagedown editor
-         */
-        startEditor: function() {
-            // Run Ace
-            this.mdEditor.run(this.editor);
-
-            // Trigger an event
-            this.vent.trigger('ready');
-
-            this.changeMode();
-            this.listenTo(Radio.channel('notesForm'), 'set:mode', this.changeMode);
-        },
-
-        /**
-         * Change mode of the editor.
-         */
-        changeMode: function(mode) {
-            mode = mode || this.configs.editMode;
-            var options = {
-                maxLines     : Infinity,
-                minLines     : 40,
-                marginTop    : 20,
-                marginBottom : 100
-            };
-
-            // Infinite scroll in Normal mode
-            if (mode === 'preview') {
-                options.maxLines = null;
-                options.minLines = 2;
-            }
-            else {
-                options.marginTop = 4;
-                options.marginBottom = 20;
-            }
-
-            this.editor.setOptions({
-                maxLines: options.maxLines,
-                minLines: options.minLines
-            });
-
-            // Margin: top bottom
-            this.editor.renderer.setScrollMargin(options.marginTop, options.marginBottom);
-            this.editor.renderer.setPadding(options.marginTop);
-            this.editor.session.setScrollTop(1);
-
-            // Update settings && resize
-            this.editor.renderer.updateFull(true);
-            this.editor.resize();
-        },
-
-        getContent: function() {
-            var data     = {};
-            data.content = !this.editor ? '' : this.editor.getSession().getValue().trim();
-            data.tags    = Converter.getTags(data.content);
-            data.files   = Radio.request('editor', 'get:files', data.content);
-            data = _.extend(data, Converter.countTasks(data.content));
-            return data;
-        },
-
-        focus: function() {
-            this.editor.focus();
-        },
-
-        insertText: function(text) {
-            this.editor.insert(text);
-        }
-
-    });
-
-    return PagedownAce;
-
-});
diff --git a/app/scripts/modules/pagedown/libs/converter.js b/app/scripts/modules/pagedown/libs/converter.js
deleted file mode 100644
index 7830619a6..000000000
--- a/app/scripts/modules/pagedown/libs/converter.js
+++ /dev/null
@@ -1,52 +0,0 @@
-/**
- * Copyright (C) 2015 Laverna project Authors.
- *
- * This Source Code Form is subject to the terms of the Mozilla Public
- * License, v. 2.0. If a copy of the MPL was not distributed with this
- * file, You can obtain one at http://mozilla.org/MPL/2.0/.
- */
-/* global define, Markdown */
-define([
-    'underscore',
-    'backbone.radio',
-    // 'libs/checklist',
-    // 'libs/tags',
-    'pagedown-extra'
-], function(_, Radio) {
-    'use strict';
-
-    /**
-     * Converts Markdown to HTML
-     */
-    var Converter = {
-        getConverter : function(model) {
-            model = typeof model !== 'string' ? model : null;
-
-            var converter = new Markdown.Converter();
-            Markdown.Extra.init(converter);
-
-            Radio.trigger('editor', 'converter:init', converter, model);
-            return converter;
-        },
-
-        countTasks: function(content) {
-            return Radio.request('editor', 'get:tasks', content);
-        },
-
-        getTags: function(content) {
-            return Radio.request('editor', 'get:tags', content);
-        },
-
-        toHtml: function(model) {
-            var content = (typeof model === 'string' ? model : model.get('content'));
-            return this.getConverter(model).makeHtml(content);
-        },
-
-        toggleTask: function(data) {
-            // return new Checklist().toggle(data.content, data.taskId);
-            return data;
-        }
-    };
-
-    return Converter;
-});
diff --git a/app/scripts/modules/pagedown/module.js b/app/scripts/modules/pagedown/module.js
deleted file mode 100644
index e9f98ca59..000000000
--- a/app/scripts/modules/pagedown/module.js
+++ /dev/null
@@ -1,66 +0,0 @@
-/**
- * Copyright (C) 2015 Laverna project Authors.
- *
- * This Source Code Form is subject to the terms of the Mozilla Public
- * License, v. 2.0. If a copy of the MPL was not distributed with this
- * file, You can obtain one at http://mozilla.org/MPL/2.0/.
- */
-/* global define */
-define([
-    'underscore',
-    'backbone.radio',
-    'marionette',
-    'modules',
-    'modules/pagedown/controllers/pagedownAce',
-    'modules/pagedown/controllers/pagedown',
-    'modules/pagedown/libs/converter'
-], function(_, Radio, Marionette, Modules, PagedownAce, Pagedown, converter) {
-    'use strict';
-
-    /**
-     * Pagedown module.
-     *
-     * Replies to the following requests on channel `editor`:
-     * 1. reply: content:html
-     *    converts Markdown content to html.
-     * 2. reply: task:toggle
-     *    returns an object with content and a number of completed tasks
-     */
-    var Module = Modules.module('Pagedown', {});
-
-    /**
-     * Initializers & finalizers of the module
-     */
-    Module.on('start', function() {
-        console.info('Pagedown module has started');
-
-        if (Radio.request('global', 'is:mobile')) {
-            Module.controller = new Pagedown();
-        }
-        else {
-            Module.controller = new PagedownAce();
-        }
-    });
-
-    Module.on('stop', function() {
-        Module.controller.destroy();
-        Module.controller = null;
-        console.info('Pagedown module has stoped');
-    });
-
-    // Add a global module initializer
-    Radio.request('init', 'add', 'module', function() {
-        console.info('Pagedown module has been initialized');
-
-        Radio.channel('notesForm')
-        .on('view:ready', Module.start, Module)
-        .on('view:destroy', Module.stop, Module);
-
-        Radio.channel('editor')
-        .reply('content:html', converter.toHtml, converter);
-        // .reply('task:toggle', converter.toggleTask, converter);
-    });
-
-    return Module;
-
-});
diff --git a/app/scripts/modules/pagedown/templates/editor.html b/app/scripts/modules/pagedown/templates/editor.html
deleted file mode 100644
index 1336ef697..000000000
--- a/app/scripts/modules/pagedown/templates/editor.html
+++ /dev/null
@@ -1,51 +0,0 @@
-<div class="pagedown--bar dropdown" id="wmd-button-bar">
-    <button class="visible-500 wmd-button btn-danger pull-right"
-        data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
-        <b class="caret"></b>
-    </button>
-    <div class="dropdown-menu dropdown-menu-right pagedown--buttons">
-        <div class="btn-group">
-            <button class="btn visible-400" data-button="wmd-olist-button">
-                <i class="icon-list-numbered"></i>
-            </button>
-            <button class="btn visible-400" data-button="wmd-ulist-button">
-                <i class="icon-list-bullet"></i>
-            </button>
-            <button class="btn" data-button="wmd-heading-button">
-                <i class="icon-font"></i>
-            </button>
-            <button class="btn" data-button="wmd-hr-button">
-                <i class="icon-minus"></i>
-            </button>
-            <button class="btn" data-button="wmd-undo-button">
-                <i class="icon-reply"></i>
-            </button>
-            <button class="btn" data-button="wmd-redo-button">
-                <i class="icon-share"></i>
-            </button>
-        </div>
-    </div>
-</div>
-
-<div class="btn-group btn-group-justified hidden -show">
-    <div class="btn-group">
-        <button data-col="left" class="btn btn-default active pagedown--col--btn">
-            {{i18n('Editor')}}
-        </button>
-    </div>
-    <div class="btn-group">
-        <button data-col="right" class="btn btn-default pagedown--col--btn">
-            {{i18n('Preview')}}
-        </button>
-    </div>
-</div>
-
-<div class="pagedown--row">
-    <div class="pagedown--layout -left -show">
-        <div class="pagedown--input" id="wmd-input">{{content}}</div>
-    </div>
-
-    <div class="pagedown--layout -right">
-        <div class="pagedown--preview" id="wmd-preview"></div>
-    </div>
-</div>
diff --git a/app/scripts/modules/pagedown/views/editor.js b/app/scripts/modules/pagedown/views/editor.js
deleted file mode 100644
index 9b1730b1d..000000000
--- a/app/scripts/modules/pagedown/views/editor.js
+++ /dev/null
@@ -1,108 +0,0 @@
-/**
- * Copyright (C) 2015 Laverna project Authors.
- *
- * This Source Code Form is subject to the terms of the Mozilla Public
- * License, v. 2.0. If a copy of the MPL was not distributed with this
- * file, You can obtain one at http://mozilla.org/MPL/2.0/.
- */
-/* global define */
-define([
-    'underscore',
-    'marionette',
-    'backbone.radio',
-    'text!modules/pagedown/templates/editor.html'
-], function(_, Marionette, Radio, Tmpl) {
-    'use strict';
-
-    /**
-     * Pagedown view.
-     */
-    var View = Marionette.ItemView.extend({
-        template: _.template(Tmpl),
-        className: 'layout--body container-fluid',
-
-        ui: {
-            wmdBar     : '#wmd-button-bar',
-            preview    : '#wmd-preview',
-            input      : '#wmd-input'
-        },
-
-        events: {
-            'click .pagedown--buttons button': 'triggerButton',
-            'click .pagedown--col--btn': 'showColumn'
-        },
-
-        serializeData: function() {
-            return {content: _.escape(this.model.get('content'))};
-        },
-
-        initialize: function() {
-            Radio.on('notesForm', 'set:mode', this.onChangeMode, this);
-            Radio.on('editor', 'ready', this.onPagedownReady, this);
-            Radio.on('editor', 'pagedown:scroll', this.syncScroll, this);
-        },
-
-        onDestroy: function() {
-            Radio.trigger('editor', 'view:destroy');
-            Radio.off('editor', 'pagedown:scroll ready');
-            Radio.off('notesForm', 'set:mode');
-        },
-
-        onPagedownReady: function() {
-            this.$scroll = $('.ace_scrollbar');
-            Radio.trigger('editor', 'view:render', this);
-        },
-
-        /**
-         * Shows either the preview or the editor.
-         */
-        showColumn: function(e) {
-            var $btn    = $(e.currentTarget),
-                col     = $btn.attr('data-col'),
-                hideCol = (col === 'left' ? 'right' : 'left');
-
-            // Add 'active' class to the button
-            this.$('.pagedown--col--btn.active').removeClass('active');
-            $btn.addClass('active');
-
-            // Show only one column
-            this.$('.-' + hideCol).removeClass('-show');
-            this.$('.-' + col).addClass('-show');
-        },
-
-        onChangeMode: function(mode) {
-            if (mode === 'preview') {
-                this.ui.input.css('height', 'auto');
-            }
-        },
-
-        triggerButton: function(e) {
-            var btn = $(e.currentTarget).attr('data-button');
-            $('#' + btn).trigger('click');
-        },
-
-        syncScroll: function() {
-            var scrollTop = this._getScroll(this.$scroll || this.ui.input, this.ui.preview);
-            this.ui.preview.stop(true).animate({scrollTop: scrollTop}, 100, 'linear');
-        },
-
-        _getScroll: function($source, $el) {
-            var scroll = this._getScrollVal($source),
-                percent = scroll.scrollTop / (scroll.scrollHeight - scroll.offsetHeight);
-
-            return percent * (
-                $el.prop('scrollHeight') - $el.offset().top
-            );
-        },
-
-        _getScrollVal: function($el) {
-            return {
-                scrollTop    : $el.scrollTop(),
-                scrollHeight : $el.prop('scrollHeight'),
-                offsetHeight : $el.offset().top
-            };
-        }
-    });
-
-    return View;
-});
diff --git a/app/scripts/modules/tags/module.js b/app/scripts/modules/tags/module.js
deleted file mode 100644
index 3c2fd0095..000000000
--- a/app/scripts/modules/tags/module.js
+++ /dev/null
@@ -1,109 +0,0 @@
-/**
- * Copyright (C) 2015 Laverna project Authors.
- *
- * This Source Code Form is subject to the terms of the Mozilla Public
- * License, v. 2.0. If a copy of the MPL was not distributed with this
- * file, You can obtain one at http://mozilla.org/MPL/2.0/.
- */
-/* global define */
-define([
-    'underscore',
-    'backbone.radio'
-    // 'xregexp/addons/unicode/unicode-categories'
-], function(_, Radio) {
-    'use strict';
-
-    /**
-     * Tag module.
-     *
-     * Replies to requests on channel `editor`:
-     * 1. `get:tags` - searches provided text for tags and returns them.
-     *
-     * Listens to events:
-     * 1. channel: `editor`, event: `converter:init`
-     *    adds custom hooks.
-     */
-    var Tags = {
-
-        /**
-         * Prepares the regular expression.
-         * For default, every word which begins with # symbol is considered as
-         * a tag but the symbol can be modified.
-         */
-        configure: function() {
-            this.symbol = Radio.request('configs', 'get:config', 'tagSymbol', '#');
-            // this.regex = new XRegExp('(^|[^' + this.symbol + '\\p{L}\\p{N}])' + this.symbol + '([\\p{L}\\p{N}\-\+]+)', 'g');
-
-            // Regex: /([^\s])?#+?([^\s\.#])+/gm;
-            this.regex = new RegExp('([^\\s])?' + this.symbol + '+?([^\\s\\.\\,' + this.symbol + '])+', 'gm');
-        },
-
-        /**
-         * Return true if:
-         * it starts with # symbol
-         * and
-         * it doesn't contain /
-         */
-        testForTag: function(tag) {
-            return (new RegExp('^' + this.symbol).test(tag) && /\//.test(tag) === false);
-        },
-
-        /**
-         * Search text for words which begin with a special symbol and replace
-         * them to a tag link.
-         */
-        replaceTags: function(text) {
-            var self = this,
-                uri;
-
-            return text.replace(this.regex, function(tag) {
-                if (!self.testForTag(tag)) {
-                    return tag;
-                }
-
-                uri = Radio.request('uri', 'link:profile', '/notes/f/tag/q/' + tag.replace('#', ''));
-                return ' <a class="label label-default" href="#' + uri +
-                     '">' + tag + '</a>';
-            });
-        },
-
-        /**
-         * Parse text for tags.
-         */
-        getTags: function(text) {
-            var result = text.match(this.regex),
-                tags   = [];
-
-            _.each(result, function(tag) {
-                if (this.testForTag(tag)) {
-                    tags.push(tag.trim().replace(Tags.symbol, ''));
-                }
-            }, this);
-
-            return _.uniq(tags);
-        },
-
-        /**
-         * Add hooks to Pagedown editor
-         */
-        addHook: function(converter) {
-            converter.hooks.chain('preBlockGamut', function(text) {
-                return Tags.replaceTags(text);
-            });
-        }
-    };
-
-    Radio.request('init', 'add', 'module', function() {
-        // Setup regex
-        Tags.configure();
-
-        // Parses text for tags
-        Radio.reply('editor', 'get:tags', Tags.getTags, Tags);
-
-        // When editor converter is initialized, add hooks
-        Radio.on('editor', 'converter:init', Tags.addHook, Tags);
-    });
-
-    return Tags;
-
-});
diff --git a/app/scripts/modules/tasks/module.js b/app/scripts/modules/tasks/module.js
deleted file mode 100644
index a57d56e02..000000000
--- a/app/scripts/modules/tasks/module.js
+++ /dev/null
@@ -1,136 +0,0 @@
-/**
- * Copyright (C) 2015 Laverna project Authors.
- * 
- * This Source Code Form is subject to the terms of the Mozilla Public
- * License, v. 2.0. If a copy of the MPL was not distributed with this
- * file, You can obtain one at http://mozilla.org/MPL/2.0/.
- */
-/* global define */
-define([
-    'underscore',
-    'backbone.radio'
-], function(_, Radio) {
-    'use strict';
-
-    /**
-     * Task module.
-     *
-     * Searches paragraphs which begin with [X?] and transforms them into checklists.
-     *
-     * Replies to requests on channel `editor`:
-     * 1. `get:tasks` - searches provided text for tasks and returns them.
-     *
-     * Listens to events:
-     * 1. channel: `editor`, event: `converter:init`
-     *    adds custom hooks.
-     */
-    var Tasks = {
-        regex: /\[([ x])?\] ?(.+)$/mgi,
-
-        replaceTasks: function(text) {
-            var count = 0,
-                checked;
-
-            return text.replace(this.regex, function(match, status, task) {
-                // Pseudo ID of the task
-                count++;
-
-                if (status === 'x' || status === 'X') {
-                    checked = ' checked="checked"';
-                }
-                else {
-                    checked = '';
-                }
-
-                return '<label class="task checkbox"><input data-task="' + count +
-                    '" type="checkbox"' + checked + ' class="checkbox--input" />' +
-                    '<svg class="checkbox--svg" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 100 100">' +
-                    '<path class="checkbox--path" d="M16.667,62.167c3.109,5.55,7.217,10.591,10.926,15.75 c2.614,3.636,5.149,7.519,8.161,10.853c-0.046-0.051,1.959,2.414,2.692,2.343c0.895-0.088,6.958-8.511,6.014-7.3 c5.997-7.695,11.68-15.463,16.931-23.696c6.393-10.025,12.235-20.373,18.104-30.707C82.004,24.988,84.802,20.601,87,16"></path>' +
-                    '</svg>' +
-                    '<span class="checkbox--text">' + task + '</span></label>';
-            });
-        },
-
-        /**
-         * @return object
-         */
-        getTasks: function(text) {
-            var result = {
-                    taskAll       : 0,
-                    taskCompleted : 0,
-                    tasks         : []
-                },
-                isActive,
-                myArr;
-
-            while ((myArr = this.regex.exec(text)) !== null) {
-                isActive = (myArr[1] === 'x' || myArr[1] === 'X') === false;
-
-                result.tasks.push({isActive: isActive, name: myArr[2]});
-                result.taskAll++;
-
-                if (!isActive) {
-                    result.taskCompleted++;
-                }
-            }
-
-            return result;
-        },
-
-        /**
-         * Toggle active status of a task
-         */
-        toggle: function(data) {
-            var count  = 0,
-                result = {completed: 0},
-                isComplete,
-                newStat;
-
-            result.content = data.content.replace(this.regex, function(match, status) {
-                count++;
-
-                isComplete = (status === 'x' || status === 'X');
-
-                if (count !== data.taskId) {
-                    result.completed = result.completed + (isComplete ? 1 : 0);
-                    return match;
-                }
-
-                // If it is active, unnactivate it
-                newStat = isComplete ? ' ' : 'x';
-                result.completed = result.completed + (isComplete ? 0 : 1);
-
-                return match.replace('[' + status + ']', '[' + newStat + ']');
-            });
-
-            return result;
-        },
-
-        /**
-         * Add hooks to Pagedown editor
-         */
-        addHook: function(converter) {
-            converter.hooks.chain('preBlockGamut', function(text) {
-                return Tasks.replaceTasks(text);
-            });
-
-            converter.hooks.chain('postBlockGamut', function(text) {
-                return text.replace(/<\/label>(\r|\n)+/mg, '<\/label>');
-            });
-        }
-    };
-
-    Radio.request('init', 'add', 'module', function() {
-        // Parses text for tasks
-        Radio.reply('editor', 'get:tasks', Tasks.getTasks, Tasks);
-
-        // Toggle the status of a task in a Markdown text
-        Radio.reply('editor', 'task:toggle', Tasks.toggle, Tasks);
-
-        // When editor converter is initialized, add hooks
-        Radio.on('editor', 'converter:init', Tasks.addHook, Tasks);
-    });
-
-    return Tasks;
-
-});
diff --git a/bower.json b/bower.json
index 7c13fc505..612b3d756 100644
--- a/bower.json
+++ b/bower.json
@@ -3,7 +3,6 @@
   "version": "0.7.1",
   "license": "MPL-2.0",
   "dependencies": {
-    "ace": "#79eda6d2a8c4f788530cb5e6b238af67bfcc609d",
     "backbone": "~1.2.3",
     "backbone.babysitter": "~0.1.10",
     "backbone.marionette": "marionette#~2.4.3",
@@ -19,7 +18,6 @@
     "enquire": "~2.1.0",
     "FileSaver": "*",
     "fuse": "~1.2.2",
-    "google-code-prettify": "master",
     "hammerjs": "~2.0.4",
     "i18next": "~1.7.2",
     "jquery": "~2.1.4",
@@ -28,9 +26,6 @@
     "MathJax": "components/MathJax#~2.5.3",
     "modernizr": "~2.8.3",
     "mousetrap": "~1.5.3",
-    "pagedown": "git://github.com/ujifgc/pagedown.git",
-    "pagedown-ace": "git://github.com/benweet/pagedown-ace.git#c9d41937e1e3b4e46f823856a47f9eb22a8108e1",
-    "pagedown-extra": "git://github.com/jmcmanus/pagedown-extra.git#bd0870e3e871e15bde1fa5a427e3e10028a09789",
     "q": "v1.3.0",
     "remotestorage.js": "git://github.com/remotestorage/remotestorage.js#0.12.1",
     "requirejs": "~2.1.15",
@@ -41,16 +36,15 @@
     "underscore": "~1.8.3",
     "xregexp": "~2.0.0",
     "jszip": "Stuk/jszip#~2.5.0",
-    "markdown-it-math": "~3.0.2"
-  },
-  "devDependencies": {
-    "ace": "~1.2.2",
-    "markdown-it": "~5.0.2",
+    "markdown-it-math": "~3.0.2",
+    "markdown-it": "~5.0.3",
     "codemirror": "~5.10.0",
     "prism": "~1.3.0",
     "markdown-it-sanitizer": "~0.4.1",
     "markdown-it-hashtag": "~0.4.0"
   },
+  "devDependencies": {
+  },
   "resolutions": {
     "backbone": "~1.2.3",
     "underscore": "~1.8.3"

From 57a4145dd7a2771bf0fa65da7d586e49bb3bd691 Mon Sep 17 00:00:00 2001
From: wwwredfish <wwwredfish@gmail.com>
Date: Thu, 7 Jan 2016 19:37:13 +0600
Subject: [PATCH 20/25] Split Gulp tasks to several files

---
 .travis.yml                                   |   2 +-
 app/scripts/main.js                           |   8 +-
 .../modules/markdown/workers/markdown.js      |   8 +-
 gulpfile.js                                   | 526 ++----------------
 gulps/clean.js                                |  18 +
 gulps/copy.js                                 |  85 +++
 gulps/copyDist.js                             |  11 +
 gulps/copyRelease.js                          |  35 ++
 gulps/cssmin.js                               |  14 +
 gulps/electron.js                             |  47 ++
 gulps/htmlManifest.js                         |  27 +
 gulps/htmlmin.js                              |  16 +
 gulps/jshint.js                               |  13 +
 gulps/jsonlint.js                             |  15 +
 gulps/less.js                                 |  28 +
 gulps/mocha.js                                |  12 +
 gulps/nightwatch.js                           |  25 +
 gulps/prism.js                                |  25 +
 gulps/reload.js                               |  41 ++
 gulps/require.js                              |  71 +++
 package.json                                  |   3 +
 21 files changed, 548 insertions(+), 482 deletions(-)
 create mode 100644 gulps/clean.js
 create mode 100644 gulps/copy.js
 create mode 100644 gulps/copyDist.js
 create mode 100644 gulps/copyRelease.js
 create mode 100644 gulps/cssmin.js
 create mode 100644 gulps/electron.js
 create mode 100644 gulps/htmlManifest.js
 create mode 100644 gulps/htmlmin.js
 create mode 100644 gulps/jshint.js
 create mode 100644 gulps/jsonlint.js
 create mode 100644 gulps/less.js
 create mode 100644 gulps/mocha.js
 create mode 100644 gulps/nightwatch.js
 create mode 100644 gulps/prism.js
 create mode 100644 gulps/reload.js
 create mode 100644 gulps/require.js

diff --git a/.travis.yml b/.travis.yml
index 41a13b199..a6a4b97f2 100644
--- a/.travis.yml
+++ b/.travis.yml
@@ -9,7 +9,7 @@ install:
     - cd test && bower install && cd ../
 script:
     - gulp build
-    - gulp server:dist &
+    - gulp --root dist &
     - set -e
     - gulp nightwatch --env ci; echo $?
     - killall gulp
diff --git a/app/scripts/main.js b/app/scripts/main.js
index d835023f4..5ef12c5a3 100644
--- a/app/scripts/main.js
+++ b/app/scripts/main.js
@@ -63,10 +63,10 @@ requirejs.config({
         dropbox               : '../bower_components/dropbox/dropbox',
 
         // Markdown
-        'markdown-it'         : '../bower_components/markdown-it/dist/markdown-it',
-        'markdown-it-san'     : '../bower_components/markdown-it-sanitizer/dist/markdown-it-sanitizer',
-        'markdown-it-hash'    : '../bower_components/markdown-it-hashtag/dist/markdown-it-hashtag',
-        'markdown-it-math'    : '../bower_components/markdown-it-math/dist/markdown-it-math',
+        'markdown-it'         : '../bower_components/markdown-it/dist/markdown-it.min',
+        'markdown-it-san'     : '../bower_components/markdown-it-sanitizer/dist/markdown-it-sanitizer.min',
+        'markdown-it-hash'    : '../bower_components/markdown-it-hashtag/dist/markdown-it-hashtag.min',
+        'markdown-it-math'    : '../bower_components/markdown-it-math/dist/markdown-it-math.min',
         'to-markdown'         : '../bower_components/to-markdown/src/to-markdown',
 
         // Others
diff --git a/app/scripts/modules/markdown/workers/markdown.js b/app/scripts/modules/markdown/workers/markdown.js
index 1bf97fb22..d53a5c8c8 100644
--- a/app/scripts/modules/markdown/workers/markdown.js
+++ b/app/scripts/modules/markdown/workers/markdown.js
@@ -22,10 +22,10 @@ requirejs.config({
     paths: {
         q                  : '../bower_components/q/q',
         underscore         : '../bower_components/underscore/underscore',
-        'markdown-it'      : '../bower_components/markdown-it/dist/markdown-it',
-        'markdown-it-san'  : '../bower_components/markdown-it-sanitizer/dist/markdown-it-sanitizer',
-        'markdown-it-hash' : '../bower_components/markdown-it-hashtag/dist/markdown-it-hashtag',
-        'markdown-it-math' : '../bower_components/markdown-it-math/dist/markdown-it-math',
+        'markdown-it'      : '../bower_components/markdown-it/dist/markdown-it.min',
+        'markdown-it-san'  : '../bower_components/markdown-it-sanitizer/dist/markdown-it-sanitizer.min',
+        'markdown-it-hash' : '../bower_components/markdown-it-hashtag/dist/markdown-it-hashtag.min',
+        'markdown-it-math' : '../bower_components/markdown-it-math/dist/markdown-it-math.min',
     },
     shim: {
         'prism/bundle': {
diff --git a/gulpfile.js b/gulpfile.js
index 9edb419b6..03f894913 100644
--- a/gulpfile.js
+++ b/gulpfile.js
@@ -1,490 +1,70 @@
 'use strict';
-var gulp         = require('gulp'),
-    util         = require('gulp-util'),
-    connect      = require('gulp-connect'),
-    path         = require('path'),
-    less         = require('gulp-less'),
-    rename       = require('gulp-rename'),
-    aprefix      = require('gulp-autoprefixer'),
-    concat    = require('gulp-concat'),
-    rjs          = require('gulp-requirejs-optimize'),
-    merge        = require('merge-stream'),
-    uglify       = require('gulp-uglify'),
-    clean        = require('gulp-clean'),
-    replace      = require('gulp-replace'),
-    manifest     = require('gulp-manifest'),
-    htmlmin      = require('gulp-minify-html'),
-    cssmin       = require('gulp-minify-css'),
-    shell        = require('gulp-shell'),
-    pkg          = require('./package.json'),
-
-    // Electron
-    electron     = require('gulp-electron'),
-
-    // Testing libraries
-    jshint       = require('gulp-jshint'),
-    jsonlint     = require('gulp-jsonlint'),
-    mocha        = require('gulp-mocha-phantomjs'),
-    nightwatch   = require('gulp-nightwatch');
-
-/**
- * Server for dist folder.
- */
-gulp.task('server:dist', function() {
-    connect.server({
-        port: 9000,
-        root: 'dist',
-        livereload: false
-    });
-});
-
-/**
- * -------------------------------------
- * Livereload.
- * -------------------------------------
- */
-gulp.task('reload:html', function() {
-    return gulp.src('./app/*.html')
-    .pipe(connect.reload());
-});
-
-gulp.task('reload:js', function() {
-    return gulp.src('./app/**/*.js')
-    .pipe(connect.reload());
-});
-
-gulp.task('default', ['less'], function() {
-    connect.server({
-        port: 9000,
-        root: 'app',
-        livereload: true
-    });
-
-    gulp.watch('app/**/*.html', ['reload:html']);
-    gulp.watch('app/**/*.js', ['reload:js']);
-    gulp.watch(['app/styles/**/*.less'], ['less']);
-});
-
-/**
- * ---------------------
- * Run tests.
- * ---------------------
- */
-gulp.task('jshint', function() {
-    return gulp.src(['./app/scripts/**/*.js',
-                     './app/scripts/*.js'])
-    .pipe(jshint())
-    .pipe(jshint.reporter('jshint-stylish'))
-    .pipe(jshint.reporter('fail'));
-});
-
-gulp.task('jsonlint', function() {
-    return gulp.src([
-        'app/manifest.webapp',
-        'bower.json',
-        'package.json',
-        'app/**/*.json'
-    ])
-    .pipe(jsonlint())
-    .pipe(jsonlint.failAfterError())
-    .pipe(jsonlint.reporter());
-});
-
-/**
- * Run unit tests.
- */
-gulp.task('mocha', ['jshint', 'jsonlint'], function() {
-    return gulp.src('./test/index.html')
-    .pipe(mocha({
-    }))
-    .once('error', function(err) {
-        console.log('Error', err.toString());
-        process.exit(1);
-    });
-});
-
-/**
- * Run UI tests.
- * Example of running tests:
- * gulp nightwatch --env [test_settings profile]
- */
-gulp.task('nightwatch', function() {
-    return gulp.src('./test/spec-ui/test.js', {read: false})
-    .pipe(nightwatch({
-        configFile : './test/nightwatch.json',
-        cliArgs    : [
-            // '--test ' + 'test/spec-ui/test.js',
-            '--env ' + (util.env.env || 'default')
-        ]
-    }))
-    .once('error', function(err) {
-        console.log('Error', err.toString());
-        process.exit(1);
-    });
-});
-
-gulp.task('test', ['jshint', 'mocha'], function() {
-    return;
-});
-
-/**
- * -------------------------------------
- * Compile, minify, and build everything.
- * -------------------------------------
- */
-/**
- * Build and autoprefix LESS.
- */
-gulp.task('less', function() {
-    return gulp.src('./app/styles/*/main.less')
-    .pipe(less({
-        paths: [
-            path.join(__dirname, 'less', 'includes'),
-            './app/bower_components/'
-        ]
-    }))
-    // Unique names for theme files
-    .pipe(rename(function(path) {
-        path.basename = path.dirname;
-        path.dirname  = '';
-        return path;
-    }))
-    // Autoprefixer
-    .pipe(aprefix({
-        browsers : ['> 5%'],
-        cascade  : false,
-        remove   : false,
-        add      : true
-    }))
-    .pipe(gulp.dest('./app/styles/'))
-    .pipe(connect.reload());
-});
-
-/**
- * Clean up dist directory.
- */
-gulp.task('clean:dist', ['test'], function() {
-    return gulp.src('./dist', {read: false})
-    .pipe(clean());
-});
-
-gulp.task('build:prism', function() {
-    /* http://prismjs.com/download.html?themes=prism&languages=markup+css+clike+javascript+abap+actionscript+apacheconf+apl+applescript+aspnet+autoit+autohotkey+bash+basic+batch+c+brainfuck+bison+csharp+cpp+coffeescript+ruby+css-extras+d+dart+diff+docker+eiffel+elixir+erlang+fsharp+fortran+gherkin+git+glsl+go+groovy+handlebars+haskell+haxe+http+icon+inform7+ini+j+jade+java+julia+keyman+kotlin+latex+less+lolcode+lua+makefile+markdown+matlab+mel+mizar+monkey+nasm+nginx+nim+nix+nsis+objectivec+ocaml+oz+parigp+parser+pascal+perl+php+php-extras+powershell+processing+prolog+puppet+pure+python+q+qore+r+jsx+rest+rip+roboconf+crystal+rust+sas+sass+scss+scala+scheme+smalltalk+smarty+sql+stylus+swift+tcl+textile+twig+typescript+verilog+vhdl+vim+wiki+yaml */
-    var components = 'markup+css+clike+javascript+abap+actionscript+apacheconf+apl+applescript+aspnet+autoit+autohotkey+bash+basic+batch+c+brainfuck+bison+csharp+cpp+coffeescript+ruby+css-extras+d+dart+diff+docker+eiffel+elixir+erlang+fsharp+fortran+gherkin+git+glsl+go+groovy+handlebars+haskell+haxe+http+icon+inform7+ini+j+jade+java+julia+keyman+kotlin+latex+less+lolcode+lua+makefile+markdown+matlab+mel+mizar+monkey+nasm+nginx+nim+nix+nsis+objectivec+ocaml+oz+parigp+parser+pascal+perl+php+php-extras+powershell+processing+prolog+puppet+pure+python+q+qore+r+jsx+rest+rip+roboconf+crystal+rust+sas+sass+scss+scala+scheme+smalltalk+smarty+sql+stylus+swift+tcl+textile+twig+typescript+verilog+vhdl+vim+wiki+yaml',
-        files      = [];
-
-    components = components.split('+');
-    components.unshift('core');
-
-    components.forEach(function(item) {
-        files.push(
-            './app/bower_components/prism/components/prism-' + item + '.js'
-        );
-    });
-
-    return gulp.src(files)
-    .pipe(concat('bundle.js'))
-    // .pipe(uglify())
-    .pipe(gulp.dest('./app/bower_components/prism'));
-});
+var gulp    = require('gulp'),
+    pkg     = require('./package.json'),
+    plugins = require('gulp-load-plugins')();
+
+function getTask(task) {
+    return require(`./gulps/${task}`)(gulp, plugins, pkg);
+}
+
+// Add Gulp tasks
+[
+    'jshint' , 'jsonlint'   , 'mocha'       , 'nightwatch',
+    'less'   , 'prism'      , 'require'     , 'electron'  ,
+    'htmlmin', 'cssmin'     , 'htmlManifest',
+    'copy'   , 'copyRelease', 'copyDist'    ,
+    'reload' , 'clean'
+]
+.forEach(function(task) {
+    var taskFun = getTask(task);
+
+    // It has several tasks
+    if (typeof taskFun === 'object') {
+        for (var key in taskFun) {
+            gulp.task(task + ':' + key, taskFun[key]);
+        }
+        return;
+    }
 
-/**
- * Minify JS files.
- * Require.js config example:
- * https://github.com/jrburke/r.js/blob/master/build/example.build.js
- */
-gulp.task('build:js', ['clean:dist'], function() {
-    return gulp.src('./app/scripts/main.js')
-    // Require.js optimizer
-    .pipe(rjs({
-        name: 'main',
-        baseUrl                : './app/scripts',
-        mainConfigFile         : './app/scripts/main.js',
-        optimize               : 'none',
-        paths: {
-            'workers': 'empty:'
-        },
-        exclude                : [
-            'helpers/db',
-            'helpers/migrate',
-            'migrate',
-            'mathjax',
-            'dropbox',
-            'tv4',
-            'bluebird',
-            'remotestorage'
-        ],
-        include                : [
-            // Because settings views are loaded dynamically
-            'apps/settings/show/views/encryption',
-            'apps/settings/show/views/general',
-            'apps/settings/show/views/importExport',
-            'apps/settings/show/views/keybindings',
-            'apps/settings/show/views/profiles',
-            'apps/settings/show/views/showView',
-            'apps/settings/show/views/sync',
-            'backbone.sync',
-            'backbone.noworker.sync',
-            'modules/remotestorage/module',
-            'modules/dropbox/module'
-        ],
-        findNestedDependencies : true,
-        generateSourceMaps     : true,
-        useStrict              : true,
-        wrapShim               : true,
-        preserveLicenseComments: true,
-        wrap                   : true
-    }))
-    .pipe(uglify({
-        preserveComments: 'license'
-    }))
-    .pipe(gulp.dest('./dist/scripts'));
+    gulp.task(task, taskFun);
 });
 
-/**
- * Minify HTML files.
- */
-gulp.task('htmlmin', ['clean:dist'], function() {
-    return gulp.src('./app/*.html')
-    .pipe(replace('<html class="no-js">', '<html manifest="app.appcache" class="no-js">'))
-    .pipe(htmlmin({
-        conditionals: true,
-        spare       : true
-    }))
-    .pipe(gulp.dest('./dist'));
+gulp.task('release:after', function() {
+    return gulp.src('./release')
+    .pipe(plugins.shell([
+        'cd ./release && zip -r ../release/webapp.zip ./laverna',
+    ]));
 });
 
 /**
- * Minify CSS files.
+ * Unit tests.
  */
-gulp.task('cssmin', ['clean:dist'], function() {
-    return gulp.src('./app/styles/*.css')
-    .pipe(cssmin({
-        compatibility: 'ie8'
-    }))
-    .pipe(gulp.dest('./dist/styles'));
-});
+gulp.task('test', ['jsonlint', 'jshint', 'mocha']);
 
 /**
- * Copy additional dependencies into dist directory.
+ * Build the app.
+ * ``gulp build --dev`` to build without minifying.
  */
-gulp.task('copy:deps', ['clean:dist'], function() {
-    var options = {base: './app/bower_components/'};
-
-    return merge.apply(merge, [
-        gulp.src([
-            './LICENSE'
-        ], {base: './'})
-        .pipe(gulp.dest('./dist')),
-
-        // Copy
-        gulp.src([
-            './app/images/**/*.+(png|jpg|gif|ico|icns)',
-            './app/docs/**',
-            './app/locales/**',
-            './app/.htaccess',
-            './app/*.+(xml|ico|txt|webapp)',
-            './app/styles/**/*.+(eot|svg|ttf|woff)',
-        ], {base: './app'})
-        .pipe(gulp.dest('./dist')),
-
-        // Copy and minify
-        gulp.src([
-            './app/scripts/helpers/db.js',
-            './app/scripts/helpers/migrate.js',
-            './app/scripts/migrate.js',
-            './app/scripts/workers/localForage.js',
-            './app/bower_components/requirejs/require.js',
-            './app/bower_components/modernizr/modernizr.js',
-            './app/bower_components/q/q.js',
-            './app/bower_components/underscore/underscore.js',
-            './app/bower_components/localforage/dist/localforage.js',
-            './app/bower_components/dropbox/dropbox.js',
-            './app/bower_components/remotestorage.js/release/stable/remotestorage.js',
-            './app/bower_components/tv4/tv4.js',
-            './app/bower_components/bluebird/js/browser/bluebird.min.js',
-            './app/bower_components/dropbox/dropbox.js',
-            './app/bower_components/sjcl/sjcl.js',
-        ], options)
-        .pipe(uglify({
-            preserveComments: 'license'
-        }))
-        .pipe(gulp.dest('./dist/bower_components/')),
-
-        // Copy MathJax files
-        gulp.src([
-            './app/bower_components/MathJax/*.js',
-            './app/bower_components/MathJax/config/TeX-AMS-MML_HTMLorMML.js',
-            './app/bower_components/MathJax/images/**',
-            './app/bower_components/MathJax/extensions/**',
-            './app/bower_components/MathJax/fonts/HTML-CSS/TeX/woff/**',
-            './app/bower_components/MathJax/jax/element/**',
-            './app/bower_components/MathJax/jax/input/+(MathML|TeX)/**',
-            './app/bower_components/MathJax/jax/output/+(HTML-CSS|NativeMML)/**',
-            './app/bower_components/MathJax/localization/en/**'
-        ], options)
-        .pipe(gulp.dest('./dist/bower_components/')),
-
-        // Copy ACE themes
-        gulp.src([
-            'bower_components/ace/lib/ace/css/editor.css',
-            'bower_components/ace/lib/ace/theme/textmate.css',
-            'bower_components/ace/lib/ace/theme/github.css'
-        ], options)
-        .pipe(gulp.dest('./dist/bower_components/')),
-    ]);
-});
+gulp.task('build', plugins.sequence(
+    'test',
+    'clean:dist',
+    ['less', 'prism', 'copy', 'require', 'htmlmin', 'cssmin'],
+    'htmlManifest'
+));
 
 /**
- * Generate HTML5 cache manifest file.
+ * Prepare the release files.
  */
-gulp.task('manifest', ['build:before'], function() {
-    return gulp.src([
-        'dist/**',
-        '!dist/bower_components/MathJax/**'
-    ], {base: './dist'})
-    .pipe(manifest({
-        hash         : true,
-        preferOnline : true,
-        network      : ['*'],
-        filename     : 'app.appcache',
-        exclude      : [
-            'app.appcache',
-            'dropbox.html'
-        ],
-        timestamp    : true,
-        master       : ['index.html'],
-        fallback     : ['/ 404.html']
-    }))
-    .pipe(gulp.dest('dist'));
-});
-
-gulp.task(
-    'build:before',
-    [
-        'clean:dist',
-        'less',
-        'copy:deps',
-        'build:js',
-        'htmlmin',
-        'cssmin'
-    ],
-    function() {
-        return;
-    }
-);
-
-gulp.task('build', ['build:before', 'manifest'], function() {
-    return;
-});
+gulp.task('release', plugins.sequence(
+    'build',
+    'clean:release',
+    ['copyDist', 'copyRelease'],
+    'electron',
+    'release:after'
+));
 
 /**
- * ------------------
- * Build Electron app.
- * ------------------
- */
-/**
- * To build an electron app for a specific platform, run:
- * gulp electron --platform darwin-x64
+ * Gulp server.
+ * ``gulp --root dist`` to server dist folder.
  */
-gulp.task('electron', ['copy:release'], function() {
-    var platforms = [
-        'darwin-x64',
-        // 'linux-arm',
-        'linux-ia32',
-        'linux-x64',
-        'win32-ia32',
-        'win32-x64'
-    ];
-
-    if (util.env.platform) {
-        platforms = [util.env.platform];
-    }
-
-    return gulp.src('./electron.js')
-    // .pipe(replace('__dirname + \'/dist\'', '__dirname'))
-    .pipe(gulp.dest('./release/laverna'))
-    .pipe(electron({
-        src         : './release/laverna',
-        packageJson : pkg,
-        release     : './release',
-        cache       : './.tmp',
-        version     : 'v0.35.2',
-        packaging   : true,
-        // rebuild     : true,
-        platforms   : platforms,
-        platformResources: {
-            darwin: {
-                CFBundleDisplayName : pkg.name,
-                CFBundleIdentifier  : pkg.name,
-                CFBundleName        : pkg.name,
-                CFBundleVersion     : pkg.version,
-                icon                : './app/images/icon/icon-512x512.icns'
-            },
-            win: {
-                'version-string'    : pkg.version,
-                'file-version'      : pkg.version,
-                'product-version'   : pkg.version,
-                'icon'              : './resources/app/images/icon/icon-120x120.png'
-            }
-        }
-    }));
-});
-
-gulp.task('clean:release', ['build'], function() {
-    return gulp.src('./release/*', {read: false})
-    .pipe(clean());
-});
-
-gulp.task('copy:release', ['copy:dist'], function() {
-    return gulp.src([
-        './node_modules/connect/**',
-        './node_modules/buffer-crc32/**',
-        './node_modules/fresh/**',
-        './node_modules/bytes/**',
-        './node_modules/cookie/**',
-        './node_modules/cookie-signature/**',
-        './node_modules/mime/**',
-        './node_modules/debug/**',
-        './node_modules/depd/**',
-        './node_modules/finalhandler/**',
-        './node_modules/on-headers/**',
-        './node_modules/parseurl/**',
-        './node_modules/range-parser/**',
-        './node_modules/serve-static/**',
-        './node_modules/type-is/**',
-        './node_modules/send/**',
-
-        './node_modules/colors/**',
-        './node_modules/optimist/**',
-        './node_modules/electron-window-state/**',
-        './node_modules/open/**',
-        './node_modules/jsonfile/**',
-        './node_modules/mkdirp/**',
-        './node_modules/wordwrap/**',
-        './server.js',
-        './package.json'
-    ], {base: './'})
-    .pipe(gulp.dest('./release/laverna'));
-});
-
-gulp.task('copy:dist', ['build', 'clean:release'], function() {
-    return gulp.src('./dist')
-    .pipe(shell([
-        'mkdir -p ./release/laverna',
-        'cp -R ./dist ./release/laverna/dist',
-    ]));
-});
-
-gulp.task('release', [
-    'build',
-    'clean:release',
-    'copy:dist',
-    'copy:release',
-    'electron'
-], function() {
-    return gulp.src('./release')
-    .pipe(shell([
-        'cd ./release && zip -r ../release/webapp.zip ./laverna',
-    ]));
-});
+gulp.task('default', ['reload:less', 'prism', 'reload:server']);
diff --git a/gulps/clean.js b/gulps/clean.js
new file mode 100644
index 000000000..29a0d1468
--- /dev/null
+++ b/gulps/clean.js
@@ -0,0 +1,18 @@
+'use strict';
+
+/**
+ * Tasks for cleaning up.
+ */
+module.exports = function(gulp, plugins) {
+    return {
+        dist: function() {
+            return gulp.src('./dist', {read: false})
+            .pipe(plugins.clean());
+        },
+
+        release: function() {
+            return gulp.src('./release/*', {read: false})
+            .pipe(plugins.clean());
+        },
+    };
+};
diff --git a/gulps/copy.js b/gulps/copy.js
new file mode 100644
index 000000000..3feeafac5
--- /dev/null
+++ b/gulps/copy.js
@@ -0,0 +1,85 @@
+'use strict';
+var merge = require('merge-stream');
+
+/**
+ * Copy additional dependencies into dist directory.
+ */
+module.exports = function(gulp, plugins) {
+    return function() {
+        var options = {base: './app/bower_components/'};
+
+        return merge.apply(merge, [
+            gulp.src([
+                './LICENSE'
+            ], {base: './'})
+            .pipe(gulp.dest('./dist')),
+
+            // Copy
+            gulp.src([
+                './app/bower_components/prism/themes/prism.css',
+                './app/images/**/*.+(png|jpg|gif|ico|icns)',
+                './app/docs/**',
+                './app/locales/**',
+                './app/.htaccess',
+                './app/*.+(xml|ico|txt|webapp)',
+                './app/styles/**/*.+(eot|svg|ttf|woff)',
+            ], {base: './app'})
+            .pipe(gulp.dest('./dist')),
+
+            // Copy and minify excluded modules
+            gulp.src([
+                './app/scripts/modules/markdown/libs/markdown-it-file.js',
+                './app/scripts/modules/markdown/libs/markdown-it-task.js',
+                './app/scripts/modules/markdown/libs/markdown-it.js',
+                './app/scripts/modules/markdown/libs/markdown.js',
+                './app/scripts/modules/markdown/workers/markdown.js',
+
+                './app/scripts/helpers/db.js',
+                './app/scripts/helpers/migrate.js',
+                './app/scripts/migrate.js',
+                './app/scripts/workers/localForage.js',
+            ], {base: './app'})
+            .pipe(plugins.util.env.dev ? plugins.util.noop() : plugins.uglify({
+                preserveComments: 'license'
+            }))
+            .pipe(gulp.dest('./dist')),
+
+            // Copy and minify Bower components
+            gulp.src([
+                './app/bower_components/markdown-it*/dist/*.min.js',
+
+                './app/bower_components/prism/bundle.js',
+                './app/bower_components/requirejs/require.js',
+                './app/bower_components/modernizr/modernizr.js',
+                './app/bower_components/q/q.js',
+                './app/bower_components/underscore/underscore.js',
+                './app/bower_components/localforage/dist/localforage.js',
+                './app/bower_components/dropbox/dropbox.js',
+                './app/bower_components/sjcl/sjcl.js',
+
+                // Remotestorage
+                './app/bower_components/remotestorage.js/release/stable/remotestorage.js',
+                './app/bower_components/tv4/tv4.js',
+                './app/bower_components/bluebird/js/browser/bluebird.min.js',
+            ], options)
+            .pipe(plugins.util.env.dev ? plugins.util.noop() : plugins.uglify({
+                preserveComments: 'license'
+            }))
+            .pipe(gulp.dest('./dist/bower_components/')),
+
+            // Copy MathJax files
+            gulp.src([
+                './app/bower_components/MathJax/*.js',
+                './app/bower_components/MathJax/config/TeX-AMS-MML_HTMLorMML.js',
+                './app/bower_components/MathJax/images/**',
+                './app/bower_components/MathJax/extensions/**',
+                './app/bower_components/MathJax/fonts/HTML-CSS/TeX/woff/**',
+                './app/bower_components/MathJax/jax/element/**',
+                './app/bower_components/MathJax/jax/input/+(MathML|TeX)/**',
+                './app/bower_components/MathJax/jax/output/+(HTML-CSS|NativeMML)/**',
+                './app/bower_components/MathJax/localization/en/**'
+            ], options)
+            .pipe(gulp.dest('./dist/bower_components/')),
+        ]);
+    };
+};
diff --git a/gulps/copyDist.js b/gulps/copyDist.js
new file mode 100644
index 000000000..76fc64d80
--- /dev/null
+++ b/gulps/copyDist.js
@@ -0,0 +1,11 @@
+'use strict';
+
+module.exports = function(gulp, plugins) {
+    return function() {
+        return gulp.src('./dist')
+        .pipe(plugins.shell([
+            'mkdir -p ./release/laverna',
+            'cp -R ./dist ./release/laverna/dist',
+        ]));
+    };
+};
diff --git a/gulps/copyRelease.js b/gulps/copyRelease.js
new file mode 100644
index 000000000..97a4f6304
--- /dev/null
+++ b/gulps/copyRelease.js
@@ -0,0 +1,35 @@
+'use strict';
+
+module.exports = function(gulp) {
+    return function() {
+        return gulp.src([
+            './node_modules/connect/**',
+            './node_modules/buffer-crc32/**',
+            './node_modules/fresh/**',
+            './node_modules/bytes/**',
+            './node_modules/cookie/**',
+            './node_modules/cookie-signature/**',
+            './node_modules/mime/**',
+            './node_modules/debug/**',
+            './node_modules/depd/**',
+            './node_modules/finalhandler/**',
+            './node_modules/on-headers/**',
+            './node_modules/parseurl/**',
+            './node_modules/range-parser/**',
+            './node_modules/serve-static/**',
+            './node_modules/type-is/**',
+            './node_modules/send/**',
+
+            './node_modules/colors/**',
+            './node_modules/optimist/**',
+            './node_modules/electron-window-state/**',
+            './node_modules/open/**',
+            './node_modules/jsonfile/**',
+            './node_modules/mkdirp/**',
+            './node_modules/wordwrap/**',
+            './server.js',
+            './package.json'
+        ], {base: './'})
+        .pipe(gulp.dest('./release/laverna'));
+    };
+};
diff --git a/gulps/cssmin.js b/gulps/cssmin.js
new file mode 100644
index 000000000..93c1d82a0
--- /dev/null
+++ b/gulps/cssmin.js
@@ -0,0 +1,14 @@
+'use strict';
+
+/**
+ * Minify CSS files.
+ */
+module.exports = function(gulp, plugins) {
+    return function() {
+        return gulp.src('./app/styles/*.css')
+        .pipe(plugins.minifyCss({
+            compatibility: 'ie8'
+        }))
+        .pipe(gulp.dest('./dist/styles'));
+    };
+};
diff --git a/gulps/electron.js b/gulps/electron.js
new file mode 100644
index 000000000..9db95fede
--- /dev/null
+++ b/gulps/electron.js
@@ -0,0 +1,47 @@
+'use strict';
+
+module.exports = function(gulp, plugins, pkg) {
+    return function() {
+        var platforms = [
+            'darwin-x64',
+            // 'linux-arm',
+            'linux-ia32',
+            'linux-x64',
+            'win32-ia32',
+            'win32-x64'
+        ];
+
+        if (plugins.util.env.platform) {
+            platforms = [plugins.util.env.platform];
+        }
+
+        return gulp.src('./electron.js')
+        // .pipe(replace('__dirname + \'/dist\'', '__dirname'))
+        .pipe(gulp.dest('./release/laverna'))
+        .pipe(plugins.electron({
+            src         : './release/laverna',
+            packageJson : pkg,
+            release     : './release',
+            cache       : './.tmp',
+            version     : 'v0.35.2',
+            packaging   : true,
+            // rebuild     : true,
+            platforms   : platforms,
+            platformResources: {
+                darwin: {
+                    CFBundleDisplayName : pkg.name,
+                    CFBundleIdentifier  : pkg.name,
+                    CFBundleName        : pkg.name,
+                    CFBundleVersion     : pkg.version,
+                    icon                : './app/images/icon/icon-512x512.icns'
+                },
+                win: {
+                    'version-string'    : pkg.version,
+                    'file-version'      : pkg.version,
+                    'product-version'   : pkg.version,
+                    'icon'              : './resources/app/images/icon/icon-120x120.png'
+                }
+            }
+        }));
+    };
+};
diff --git a/gulps/htmlManifest.js b/gulps/htmlManifest.js
new file mode 100644
index 000000000..fabaac19b
--- /dev/null
+++ b/gulps/htmlManifest.js
@@ -0,0 +1,27 @@
+'use strict';
+
+/**
+ * Generate HTML5 cache manifest file.
+ */
+module.exports = function(gulp, plugins) {
+    return function() {
+        return gulp.src([
+            'dist/**',
+            '!dist/bower_components/MathJax/**'
+        ], {base: './dist'})
+        .pipe(plugins.manifest({
+            hash         : true,
+            preferOnline : true,
+            network      : ['*'],
+            filename     : 'app.appcache',
+            exclude      : [
+                'app.appcache',
+                'dropbox.html'
+            ],
+            timestamp    : true,
+            master       : ['index.html'],
+            fallback     : ['/ 404.html']
+        }))
+        .pipe(gulp.dest('dist'));
+    };
+};
diff --git a/gulps/htmlmin.js b/gulps/htmlmin.js
new file mode 100644
index 000000000..02dd7f0a8
--- /dev/null
+++ b/gulps/htmlmin.js
@@ -0,0 +1,16 @@
+'use strict';
+
+/**
+ * Minify HTML files.
+ */
+module.exports = function(gulp, plugins) {
+    return function() {
+        return gulp.src('./app/*.html')
+        .pipe(plugins.replace('<html class="no-js">', '<html manifest="app.appcache" class="no-js">'))
+        .pipe(plugins.minifyHtml({
+            conditionals: true,
+            spare       : true
+        }))
+        .pipe(gulp.dest('./dist'));
+    };
+};
diff --git a/gulps/jshint.js b/gulps/jshint.js
new file mode 100644
index 000000000..7255ded95
--- /dev/null
+++ b/gulps/jshint.js
@@ -0,0 +1,13 @@
+'use strict';
+
+module.exports = function(gulp, plugins) {
+    return function() {
+        return gulp.src([
+            './app/scripts/**/*.js',
+            './app/scripts/*.js'
+        ])
+        .pipe(plugins.jshint())
+        .pipe(plugins.jshint.reporter('jshint-stylish'))
+        .pipe(plugins.jshint.reporter('fail'));
+    };
+};
diff --git a/gulps/jsonlint.js b/gulps/jsonlint.js
new file mode 100644
index 000000000..fc2d36b6b
--- /dev/null
+++ b/gulps/jsonlint.js
@@ -0,0 +1,15 @@
+'use strict';
+
+module.exports = function(gulp, plugins) {
+    return function() {
+        return gulp.src([
+            'app/manifest.webapp',
+            'bower.json',
+            'package.json',
+            'app/**/*.json'
+        ])
+        .pipe(plugins.jsonlint())
+        .pipe(plugins.jsonlint.failAfterError())
+        .pipe(plugins.jsonlint.reporter());
+    };
+};
diff --git a/gulps/less.js b/gulps/less.js
new file mode 100644
index 000000000..833df2b9d
--- /dev/null
+++ b/gulps/less.js
@@ -0,0 +1,28 @@
+'use strict';
+var path = require('path');
+
+module.exports = function(gulp, plugins) {
+    return function() {
+        return gulp.src('./app/styles/*/main.less')
+        .pipe(plugins.less({
+            paths: [
+                path.join(__dirname, 'less', 'includes'),
+                './app/bower_components/'
+            ]
+        }))
+        // Unique names for theme files
+        .pipe(plugins.rename(function(path) {
+            path.basename = path.dirname;
+            path.dirname  = '';
+            return path;
+        }))
+        // Autoprefixer
+        .pipe(plugins.autoprefixer({
+            browsers : ['> 5%'],
+            cascade  : false,
+            remove   : false,
+            add      : true
+        }))
+        .pipe(gulp.dest('./app/styles/'));
+    };
+};
diff --git a/gulps/mocha.js b/gulps/mocha.js
new file mode 100644
index 000000000..e17a2bdfa
--- /dev/null
+++ b/gulps/mocha.js
@@ -0,0 +1,12 @@
+'use strict';
+
+module.exports = function(gulp, plugins) {
+    return function() {
+        return gulp.src('./test/index.html')
+        .pipe(plugins.mochaPhantomjs())
+        .once('error', function(err) {
+            console.log('Error', err.toString());
+            process.exit(1);
+        });
+    };
+};
diff --git a/gulps/nightwatch.js b/gulps/nightwatch.js
new file mode 100644
index 000000000..ae526c65d
--- /dev/null
+++ b/gulps/nightwatch.js
@@ -0,0 +1,25 @@
+'use strict';
+
+/**
+ * Run UI tests.
+ * Example of running tests:
+ * gulp nightwatch --env [test_settings profile]
+ */
+module.exports = function(gulp, plugins) {
+    return function() {
+        gulp.task('nightwatch', function() {
+            return gulp.src('./test/spec-ui/test.js', {read: false})
+            .pipe(plugins.nightwatch({
+                configFile : './test/nightwatch.json',
+                cliArgs    : [
+                    // '--test ' + 'test/spec-ui/test.js',
+                    '--env ' + (plugins.util.env.env || 'default')
+                ]
+            }))
+            .once('error', function(err) {
+                console.log('Error', err.toString());
+                process.exit(1);
+            });
+        });
+    };
+};
diff --git a/gulps/prism.js b/gulps/prism.js
new file mode 100644
index 000000000..d4c834bfe
--- /dev/null
+++ b/gulps/prism.js
@@ -0,0 +1,25 @@
+'use strict';
+
+/**
+ * Concatenate all Prism.js dependencies/languages into one file.
+ */
+module.exports = function(gulp, plugins) {
+    return function() {
+        /* http://prismjs.com/download.html?themes=prism&languages=markup+css+clike+javascript+abap+actionscript+apacheconf+apl+applescript+aspnet+autoit+autohotkey+bash+basic+batch+c+brainfuck+bison+csharp+cpp+coffeescript+ruby+css-extras+d+dart+diff+docker+eiffel+elixir+erlang+fsharp+fortran+gherkin+git+glsl+go+groovy+handlebars+haskell+haxe+http+icon+inform7+ini+j+jade+java+julia+keyman+kotlin+latex+less+lolcode+lua+makefile+markdown+matlab+mel+mizar+monkey+nasm+nginx+nim+nix+nsis+objectivec+ocaml+oz+parigp+parser+pascal+perl+php+php-extras+powershell+processing+prolog+puppet+pure+python+q+qore+r+jsx+rest+rip+roboconf+crystal+rust+sas+sass+scss+scala+scheme+smalltalk+smarty+sql+stylus+swift+tcl+textile+twig+typescript+verilog+vhdl+vim+wiki+yaml */
+        var components = 'markup+css+clike+javascript+abap+actionscript+apacheconf+apl+applescript+aspnet+autoit+autohotkey+bash+basic+batch+c+brainfuck+bison+csharp+cpp+coffeescript+ruby+css-extras+d+dart+diff+docker+eiffel+elixir+erlang+fsharp+fortran+gherkin+git+glsl+go+groovy+handlebars+haskell+haxe+http+icon+inform7+ini+j+jade+java+julia+keyman+kotlin+latex+less+lolcode+lua+makefile+markdown+matlab+mel+mizar+monkey+nasm+nginx+nim+nix+nsis+objectivec+ocaml+oz+parigp+parser+pascal+perl+php+php-extras+powershell+processing+prolog+puppet+pure+python+q+qore+r+jsx+rest+rip+roboconf+crystal+rust+sas+sass+scss+scala+scheme+smalltalk+smarty+sql+stylus+swift+tcl+textile+twig+typescript+verilog+vhdl+vim+wiki+yaml',
+            files      = [];
+
+        components = components.split('+');
+        components.unshift('core');
+
+        components.forEach(function(item) {
+            files.push(
+                './app/bower_components/prism/components/prism-' + item + '.js'
+            );
+        });
+
+        return gulp.src(files)
+        .pipe(plugins.concat('bundle.js'))
+        .pipe(gulp.dest('./app/bower_components/prism'));
+    };
+};
diff --git a/gulps/reload.js b/gulps/reload.js
new file mode 100644
index 000000000..7c293e513
--- /dev/null
+++ b/gulps/reload.js
@@ -0,0 +1,41 @@
+'use strict';
+
+/**
+ * Live reload server.
+ */
+module.exports = function(gulp, plugins) {
+    return {
+        html: function() {
+            return gulp.task('reload:html', function() {
+                return gulp.src('./app/*.html')
+                .pipe(plugins.connect.reload());
+            });
+        },
+
+        less: function() {
+            return gulp.task('reload:less', ['less'], function() {
+                return gulp.src('./app/styles/**/*.css')
+                .pipe(plugins.connect.reload());
+            });
+        },
+
+        js: function() {
+            return gulp.task('reload:js', function() {
+                return gulp.src('./app/**/*.js')
+                .pipe(plugins.connect.reload());
+            });
+        },
+
+        server: function() {
+            plugins.connect.server({
+                port       : (plugins.util.env.port || 9000),
+                root       : (plugins.util.env.root || 'app'),
+                livereload : true
+            });
+
+            gulp.watch('app/**/*.html', ['reload:html']);
+            gulp.watch('app/**/*.js', ['reload:js']);
+            gulp.watch(['app/styles/**/*.less'], ['reload:less']);
+        },
+    };
+};
diff --git a/gulps/require.js b/gulps/require.js
new file mode 100644
index 000000000..c168288b7
--- /dev/null
+++ b/gulps/require.js
@@ -0,0 +1,71 @@
+'use strict';
+
+/**
+ * Minify JS files.
+ * Require.js config example:
+ * https://github.com/jrburke/r.js/blob/master/build/example.build.js
+ */
+module.exports = function(gulp, plugins) {
+    return function() {
+        return gulp.src('./app/scripts/main.js')
+        // Require.js optimizer
+        .pipe(plugins.requirejsOptimize({
+            name           : 'main',
+            baseUrl        : './app/scripts',
+            mainConfigFile : './app/scripts/main.js',
+            optimize       : 'none',
+            paths: {
+                'workers': 'empty:'
+            },
+            exclude        : [
+                'markdown-it',
+                'markdown-it-san',
+                'markdown-it-hash',
+                'markdown-it-math',
+                'modules/markdown/libs/markdown-it-file',
+                'modules/markdown/libs/markdown-it-task',
+                'modules/markdown/libs/markdown-it',
+                'modules/markdown/libs/markdown',
+
+                'migrate',
+                'helpers/db',
+                'helpers/migrate',
+
+                'prism',
+                'q',
+                'underscore',
+                'localforage',
+                'dropbox',
+                'sjcl',
+                'remotestorage',
+                'tv4',
+                'bluebird',
+                'mathjax',
+            ],
+            include        : [
+                // Because settings views are loaded dynamically
+                'apps/settings/show/views/encryption',
+                'apps/settings/show/views/general',
+                'apps/settings/show/views/importExport',
+                'apps/settings/show/views/keybindings',
+                'apps/settings/show/views/profiles',
+                'apps/settings/show/views/showView',
+                'apps/settings/show/views/sync',
+                'backbone.sync',
+                'backbone.noworker.sync',
+                'modules/remotestorage/module',
+                'modules/dropbox/module'
+            ],
+            findNestedDependencies : true,
+            generateSourceMaps     : true,
+            useStrict              : true,
+            wrapShim               : true,
+            preserveLicenseComments: true,
+            wrap                   : true
+        }))
+        .pipe(plugins.util.env.dev ? plugins.util.noop() : plugins.uglify({
+            preserveComments: 'license'
+        }))
+        .pipe(gulp.dest('./dist/scripts'));
+    };
+};
diff --git a/package.json b/package.json
index cce9d8346..ccb81770e 100644
--- a/package.json
+++ b/package.json
@@ -25,6 +25,7 @@
     "gulp-jshint": "^1.11.2",
     "gulp-jsonlint": "^1.1.1",
     "gulp-less": "^3.0.3",
+    "gulp-load-plugins": "^1.2.0",
     "gulp-manifest": "^0.1.0",
     "gulp-minify-css": "^1.2.1",
     "gulp-minify-html": "^1.0.4",
@@ -34,8 +35,10 @@
     "gulp-rename": "^1.2.2",
     "gulp-replace": "^0.5.4",
     "gulp-requirejs-optimize": "^0.3.0",
+    "gulp-sequence": "^0.4.4",
     "gulp-shell": "^0.5.1",
     "gulp-uglify": "^1.4.1",
+    "gulp-util": "^3.0.7",
     "jshint-stylish": "^2.1.0",
     "merge-stream": "^1.0.0",
     "nightwatch": "^0.8.9",

From da7ba7d1fc32802bc92c0a821bf0287bb2ff7f5a Mon Sep 17 00:00:00 2001
From: wwebfor <wwebfor@users.noreply.github.com>
Date: Fri, 8 Jan 2016 14:13:18 +0600
Subject: [PATCH 21/25] :fire: Remove pagedown.less and code-prettify.less

---
 app/styles/core/main.less                   |   1 -
 app/styles/core/pagedown.less               | 119 ----------------
 app/styles/theme-default/code-prettify.less | 149 --------------------
 app/styles/theme-default/main.less          |   4 -
 app/styles/theme-default/pagedown.less      |  18 ---
 5 files changed, 291 deletions(-)
 delete mode 100644 app/styles/core/pagedown.less
 delete mode 100644 app/styles/theme-default/code-prettify.less
 delete mode 100644 app/styles/theme-default/pagedown.less

diff --git a/app/styles/core/main.less b/app/styles/core/main.less
index 05c0f5b8e..6825479ef 100644
--- a/app/styles/core/main.less
+++ b/app/styles/core/main.less
@@ -19,7 +19,6 @@
 
 // Editor
 @import 'codemirror.less';
-// @import 'pagedown.less';
 @import 'editor.less';
 
 // Core
diff --git a/app/styles/core/pagedown.less b/app/styles/core/pagedown.less
deleted file mode 100644
index 601efe4af..000000000
--- a/app/styles/core/pagedown.less
+++ /dev/null
@@ -1,119 +0,0 @@
-/**
- * Pagedown module
- */
-
-
-/**
- * Pagedown editor
- */
-
-// Textarea version of Pagedown
-.pagedown--input.-textarea {
-    height  : 100%;
-    border  : none;
-    padding : 15px 15px 80px;
-
-    &:active, &:focus, &:hover {
-        border  : none;
-        outline : none;
-    }
-}
-
-/**
- * WYSIWYG bar
- */
-.wmd-button-row {
-    margin: 0;
-    text-align: center;
-    padding: 0;
-
-    // Prevent buttons from taking too much space
-    max-height: @navbar-height - 16px;
-    overflow: hidden;
-}
-
-/**
- * WYSIWYG button styles
- */
-.wmd-button,
-.wmd-spacer {
-    left: 0;
-    &:extend(.btn);
-}
-.wmd-button {
-    &:hover {
-        background-color: #DDDDDD;
-        border-color: rgba(0, 0, 0, 0);
-        color: #545454;
-    }
-}
-
-/**
- * Pagedown in fullscreen mode.
- */
-.editor--fullscreen {
-
-}
-
-
-.-pagedown--text {
-    .pagedown--input {
-        overflow: auto;
-        height  : 100%;
-    }
-
-    .pagedown--row,
-    .pagedown--layout.-left.-show {
-        height: 100%;
-    }
-}
-
-/**
- * Headings
- */
-.ace_heading {
-    text-shadow: 0px 0.25px 0.25px #000;
-}
-
-/**
- * Style the buttons
- */
-.wmd-button {
-    font-family: 'fontello';
-}
-#wmd-bold-button:before {
-    &:extend(.icon-bold:before);
-}
-#wmd-italic-button:before {
-    &:extend(.icon-italic:before);
-}
-#wmd-link-button:before {
-    &:extend(.icon-globe:before);
-}
-#wmd-quote-button:before {
-    &:extend(.icon-indent:before);
-}
-#wmd-code-button:before {
-    &:extend(.icon-code:before);
-}
-#wmd-image-button:before {
-    &:extend(.icon-picture:before);
-}
-#wmd-olist-button:before {
-    &:extend(.icon-list-numbered:before);
-}
-#wmd-ulist-button:before {
-    &:extend(.icon-list-bullet:before);
-}
-#wmd-heading-button:before {
-    &:extend(.icon-font:before);
-}
-#wmd-hr-button:before {
-    &:extend(.icon-minus:before);
-}
-#wmd-undo-button:before {
-    &:extend(.icon-reply:before);
-}
-#wmd-redo-button:before {
-    &:extend(.icon-share:before);
-}
diff --git a/app/styles/theme-default/code-prettify.less b/app/styles/theme-default/code-prettify.less
deleted file mode 100644
index dc6de05d7..000000000
--- a/app/styles/theme-default/code-prettify.less
+++ /dev/null
@@ -1,149 +0,0 @@
-/**
- * Google code prettify styles
- */
-/* Tomorrow Theme */
-/* Original theme - https://github.com/chriskempson/tomorrow-theme */
-.prettyprint {
-    background  : white;
-    font-family : Menlo, 'Bitstream Vera Sans Mono', 'DejaVu Sans Mono', Monaco, Consolas, monospace;
-    font-size   : 12px;
-    line-height : 1.5;
-    background  : darken(#fff, 3);
-
-    // Fonts and padding
-    padding       : 15px 15px;
-    font-size     : 90%;
-    border        : none;
-    border-radius : 0;
-}
-
-.pln {
-    color: #4d4d4c;
-}
-
-@media screen {
-    .str {
-        color: #718c00;
-    }
-
-    .kwd {
-        color: #8959a8;
-    }
-
-    .com {
-        color: #8e908c;
-    }
-
-    .typ {
-        color: #4271ae;
-    }
-
-    .lit {
-        color: #f5871f;
-    }
-
-    .pun {
-        color: #4d4d4c;
-    }
-
-    .opn {
-        color: #4d4d4c;
-    }
-
-    .clo {
-        color: #4d4d4c;
-    }
-
-    .tag {
-        color: #c82829;
-    }
-
-    .atn {
-        color: #f5871f;
-    }
-
-    .atv {
-        color: #3e999f;
-    }
-
-    .dec {
-        color: #f5871f;
-    }
-
-    .var {
-        color: #c82829;
-    }
-
-    .fun {
-        color: #4271ae;
-    }
-}
-@media print, projection {
-    .str {
-        color: #006600;
-    }
-
-    .kwd {
-        color: #006;
-        font-weight: bold;
-    }
-
-    .com {
-        color: #600;
-        font-style: italic;
-    }
-
-    .typ {
-        color: #404;
-        font-weight: bold;
-    }
-
-    .lit {
-        color: #004444;
-    }
-
-    .pun, .opn, .clo {
-        color: #444400;
-    }
-
-    .tag {
-        color: #006;
-        font-weight: bold;
-    }
-
-    .atn {
-        color: #440044;
-    }
-
-    .atv {
-        color: #006600;
-    }
-}
-/* Specify class=linenums on a pre to get line numbering */
-ol.linenums {
-    margin-top: 0;
-    margin-bottom: 0;
-}
-
-/* IE indents via margin-left */
-li.L0,
-li.L1,
-li.L2,
-li.L3,
-li.L4,
-li.L5,
-li.L6,
-li.L7,
-li.L8,
-li.L9 {
-    /* */
-}
-
-/* Alternate shading for lines */
-li.L1,
-li.L3,
-li.L5,
-li.L7,
-li.L9 {
-    /* */
-}
diff --git a/app/styles/theme-default/main.less b/app/styles/theme-default/main.less
index 33e6304f0..b3691059e 100644
--- a/app/styles/theme-default/main.less
+++ b/app/styles/theme-default/main.less
@@ -28,7 +28,3 @@
 // Pagedown editor
 @import 'editor.less';
 @import 'codemirror.less';
-// @import 'pagedown.less';
-
-// Google code prettify
-@import 'code-prettify.less';
diff --git a/app/styles/theme-default/pagedown.less b/app/styles/theme-default/pagedown.less
deleted file mode 100644
index a55ba163b..000000000
--- a/app/styles/theme-default/pagedown.less
+++ /dev/null
@@ -1,18 +0,0 @@
-/**
- * Pagedown module
- */
-
-// Buttons
-.wmd-button {
-    box-shadow    : none;
-    border        : none;
-    border-radius : 0;
-    &:hover {
-        background : @pagedown--btn--hover--bg;
-        color      : @pagedown--btn--hover--color;
-    }
-}
-
-// Preview
-.pagedown--preview {
-}

From dbf8c56ef28409d63ecd52eb0e622d2ef7b06a5c Mon Sep 17 00:00:00 2001
From: wwwredfish <wwwredfish@gmail.com>
Date: Fri, 8 Jan 2016 14:53:08 +0600
Subject: [PATCH 22/25] Add CSS styles for Prism.js

---
 app/index.html                      |   2 -
 app/styles/core/bootstrap.less      |   2 +-
 app/styles/theme-default/main.less  |   2 +
 app/styles/theme-default/prism.less | 234 ++++++++++++++++++++++++++++
 4 files changed, 237 insertions(+), 3 deletions(-)
 create mode 100644 app/styles/theme-default/prism.less

diff --git a/app/index.html b/app/index.html
index cf4bacefb..58a842e7a 100644
--- a/app/index.html
+++ b/app/index.html
@@ -31,8 +31,6 @@
         <link rel="stylesheet" href="styles/core.css">
         <link rel="stylesheet" href="styles/theme-default.css">
 
-        <link rel="stylesheet" href="bower_components/prism/themes/prism.css">
-
         <script src="bower_components/modernizr/modernizr.js"></script>
     </head>
     <body class="-noscroll">
diff --git a/app/styles/core/bootstrap.less b/app/styles/core/bootstrap.less
index ffe032fbf..a14ea2335 100644
--- a/app/styles/core/bootstrap.less
+++ b/app/styles/core/bootstrap.less
@@ -16,7 +16,7 @@
 // Core CSS
 @import "bootstrap/less/scaffolding.less";
 @import "bootstrap/less/type.less";
-@import "bootstrap/less/code.less";
+// @import "bootstrap/less/code.less";
 @import "bootstrap/less/grid.less";
 @import "bootstrap/less/tables.less";
 @import "bootstrap/less/forms.less";
diff --git a/app/styles/theme-default/main.less b/app/styles/theme-default/main.less
index b3691059e..5dc74c142 100644
--- a/app/styles/theme-default/main.less
+++ b/app/styles/theme-default/main.less
@@ -28,3 +28,5 @@
 // Pagedown editor
 @import 'editor.less';
 @import 'codemirror.less';
+
+@import 'prism.less';
diff --git a/app/styles/theme-default/prism.less b/app/styles/theme-default/prism.less
new file mode 100644
index 000000000..dc5752bae
--- /dev/null
+++ b/app/styles/theme-default/prism.less
@@ -0,0 +1,234 @@
+/**
+ * prism.js Coy theme for JavaScript, CoffeeScript, CSS and HTML
+ * Based on https://github.com/tshedor/workshop-wp-theme (Example: http://workshop.kansan.com/category/sessions/basics or http://workshop.timshedor.com/category/sessions/basics);
+ * @author Tim  Shedor
+ */
+
+code,
+pre[class*="language-"] {
+    color: black;
+    font-family: Consolas, Monaco, 'Andale Mono', 'Ubuntu Mono', monospace;
+    direction: ltr;
+    text-align: left;
+    white-space: pre;
+    word-spacing: normal;
+    word-break: normal;
+    word-wrap: normal;
+    line-height: 1.5;
+
+    -moz-tab-size: 4;
+    -o-tab-size: 4;
+    tab-size: 4;
+
+    -webkit-hyphens: none;
+    -moz-hyphens: none;
+    -ms-hyphens: none;
+    hyphens: none;
+}
+
+/* Code blocks */
+code {
+    position: relative;
+    margin: .5em 0;
+    -webkit-box-shadow: -1px 0px 0px 0px #358ccb, 0px 0px 0px 1px #dfdfdf;
+    -moz-box-shadow: -1px 0px 0px 0px #358ccb, 0px 0px 0px 1px #dfdfdf;
+    box-shadow: -1px 0px 0px 0px #358ccb, 0px 0px 0px 1px #dfdfdf;
+    border-left: 10px solid lighten(@color--info, 4%);
+    background-color: #fdfdfd;
+    background-image: -webkit-linear-gradient(transparent 50%, rgba(69, 142, 209, 0.04) 50%);
+    background-image: -moz-linear-gradient(transparent 50%, rgba(69, 142, 209, 0.04) 50%);
+    background-image: -ms-linear-gradient(transparent 50%, rgba(69, 142, 209, 0.04) 50%);
+    background-image: -o-linear-gradient(transparent 50%, rgba(69, 142, 209, 0.04) 50%);
+    background-image: linear-gradient(transparent 50%, rgba(69, 142, 209, 0.04) 50%);
+    background-size: 3em 3em;
+    background-origin: content-box;
+    overflow: visible;
+    max-height: 30em;
+    padding: 0;
+}
+
+code {
+    max-height: inherit;
+    height: 100%;
+    padding: 0 1em;
+    display: block;
+    overflow: auto;
+}
+
+/* Margin bottom to accomodate shadow */
+:not(pre) > code[class*="language-"],
+code {
+    background-color: #fdfdfd;
+    -webkit-box-sizing: border-box;
+    -moz-box-sizing: border-box;
+    box-sizing: border-box;
+    margin-bottom: 1em;
+}
+
+/* Inline code */
+:not(pre) > code[class*="language-"] {
+    position: relative;
+    padding: .2em;
+    -webkit-border-radius: 0.3em;
+    -moz-border-radius: 0.3em;
+    -ms-border-radius: 0.3em;
+    -o-border-radius: 0.3em;
+    border-radius: 0.3em;
+    color: #c92c2c;
+    border: 1px solid rgba(0, 0, 0, 0.1);
+    display: inline;
+}
+
+[class*="language-"]:before,
+[class*="language-"]:after {
+    content: '';
+    z-index: -2;
+    display: block;
+    position: absolute;
+    bottom: 0.75em;
+    left: 0.18em;
+    width: 40%;
+    height: 20%;
+    -webkit-box-shadow: 0px 13px 8px #979797;
+    -moz-box-shadow: 0px 13px 8px #979797;
+    box-shadow: 0px 13px 8px #979797;
+    -webkit-transform: rotate(-2deg);
+    -moz-transform: rotate(-2deg);
+    -ms-transform: rotate(-2deg);
+    -o-transform: rotate(-2deg);
+    transform: rotate(-2deg);
+}
+
+:not(pre) > code[class*="language-"]:after,
+[class*="language-"]:after {
+    right: 0.75em;
+    left: auto;
+    -webkit-transform: rotate(2deg);
+    -moz-transform: rotate(2deg);
+    -ms-transform: rotate(2deg);
+    -o-transform: rotate(2deg);
+    transform: rotate(2deg);
+}
+
+.token.comment,
+.token.block-comment,
+.token.prolog,
+.token.doctype,
+.token.cdata {
+    color: #7D8B99;
+}
+
+.token.punctuation {
+    color: #5F6364;
+}
+
+.token.property,
+.token.tag,
+.token.boolean,
+.token.number,
+.token.function-name,
+.token.constant,
+.token.symbol,
+.token.deleted {
+    color: #c92c2c;
+}
+
+.token.selector,
+.token.attr-name,
+.token.string,
+.token.char,
+.token.function,
+.token.builtin,
+.token.inserted {
+    color: #2f9c0a;
+}
+
+.token.operator,
+.token.entity,
+.token.url,
+.token.variable {
+    color: #a67f59;
+    background: rgba(255, 255, 255, 0.5);
+}
+
+.token.atrule,
+.token.attr-value,
+.token.keyword,
+.token.class-name {
+    color: #1990b8;
+}
+
+.token.regex,
+.token.important {
+    color: #e90;
+}
+
+.language-css .token.string,
+.style .token.string {
+    color: #a67f59;
+    background: rgba(255, 255, 255, 0.5);
+}
+
+.token.important {
+    font-weight: normal;
+}
+
+.token.bold {
+    font-weight: bold;
+}
+.token.italic {
+    font-style: italic;
+}
+
+.token.entity {
+    cursor: help;
+}
+
+.namespace {
+    opacity: .7;
+}
+
+@media screen and (max-width: 767px) {
+    [class*="language-"]:before,
+    [class*="language-"]:after {
+        bottom: 14px;
+        -webkit-box-shadow: none;
+        -moz-box-shadow: none;
+        box-shadow: none;
+    }
+
+}
+
+/* Plugin styles */
+.token.tab:not(:empty):before,
+.token.cr:before,
+.token.lf:before {
+    color: #e0d7d1;
+}
+
+/* Plugin styles: Line Numbers */
+[class*="language-"].line-numbers {
+    padding-left: 0;
+}
+
+[class*="language-"].line-numbers code {
+    padding-left: 3.8em;
+}
+
+[class*="language-"].line-numbers .line-numbers-rows {
+    left: 0;
+}
+
+/* Plugin styles: Line Highlight */
+[class*="language-"][data-line] {
+    padding-top: 0;
+    padding-bottom: 0;
+    padding-left: 0;
+}
+[data-line] code {
+    position: relative;
+    padding-left: 4em;
+}
+pre .line-highlight {
+    margin-top: 0;
+}

From 93ba2d30e596ca5e87c443e8b2bcda660e456d94 Mon Sep 17 00:00:00 2001
From: wwebfor <wwebfor@users.noreply.github.com>
Date: Fri, 8 Jan 2016 15:02:47 +0600
Subject: [PATCH 23/25] Fix the default Gulp task

---
 gulpfile.js | 7 +++++--
 1 file changed, 5 insertions(+), 2 deletions(-)

diff --git a/gulpfile.js b/gulpfile.js
index 03f894913..b8c33e0a1 100644
--- a/gulpfile.js
+++ b/gulpfile.js
@@ -65,6 +65,9 @@ gulp.task('release', plugins.sequence(
 
 /**
  * Gulp server.
- * ``gulp --root dist`` to server dist folder.
+ * ``gulp --root dist`` to serve dist folder.
  */
-gulp.task('default', ['reload:less', 'prism', 'reload:server']);
+gulp.task('default', plugins.sequence(
+    ['reload:less', 'prism'],
+    'reload:server'
+));

From 49ef8a0d34f770a6f4ca42e896aad1747ae62496 Mon Sep 17 00:00:00 2001
From: wwwredfish <wwwredfish@gmail.com>
Date: Fri, 8 Jan 2016 17:23:12 +0600
Subject: [PATCH 24/25] :white_check_mark: Fix tests

---
 gulps/nightwatch.js                           |  2 +-
 test/spec-ui/commands/addNote.js              |  2 +-
 test/spec-ui/commands/closeWelcome.js         |  2 +-
 test/spec-ui/tests/apps/encryption/encrypt.js |  7 +--
 test/spec-ui/tests/apps/notebooks/remove.js   | 13 ++++--
 test/spec-ui/tests/apps/notes/form.js         |  4 +-
 test/spec-ui/tests/apps/notes/show.js         | 22 ++-------
 .../modules/fuzzySearch/fuzzySearch.js        | 46 +++++++++----------
 8 files changed, 46 insertions(+), 52 deletions(-)
 rename test/spec-ui/{ => tests}/modules/fuzzySearch/fuzzySearch.js (84%)

diff --git a/gulps/nightwatch.js b/gulps/nightwatch.js
index ae526c65d..a2e49a9f1 100644
--- a/gulps/nightwatch.js
+++ b/gulps/nightwatch.js
@@ -12,7 +12,7 @@ module.exports = function(gulp, plugins) {
             .pipe(plugins.nightwatch({
                 configFile : './test/nightwatch.json',
                 cliArgs    : [
-                    // '--test ' + 'test/spec-ui/test.js',
+                    // '--test ' + './test/spec-ui/tests/apps/notes/show.js',
                     '--env ' + (plugins.util.env.env || 'default')
                 ]
             }))
diff --git a/test/spec-ui/commands/addNote.js b/test/spec-ui/commands/addNote.js
index 2702e8e27..1e8a8a414 100644
--- a/test/spec-ui/commands/addNote.js
+++ b/test/spec-ui/commands/addNote.js
@@ -9,7 +9,7 @@ exports.command = function(item) {
     .expect.element('#editor--input--title').value.to.contain(item.title).before(2000);
 
     this
-    .click('.ace_content')
+    .click('.CodeMirror-lines')
     .keys(item.content);
 
     if (item.notebook) {
diff --git a/test/spec-ui/commands/closeWelcome.js b/test/spec-ui/commands/closeWelcome.js
index 732b2021f..77a5f555a 100644
--- a/test/spec-ui/commands/closeWelcome.js
+++ b/test/spec-ui/commands/closeWelcome.js
@@ -11,7 +11,7 @@ exports.command = function() {
     this
     .click('.modal-header .close')
     .keys(this.Keys.ESCAPE)
-    .expect.element('#welcome--page').not.to.be.present.before(8000);
+    .expect.element('#welcome--page').not.to.be.present.before(10000);
 
     return this;
 };
diff --git a/test/spec-ui/tests/apps/encryption/encrypt.js b/test/spec-ui/tests/apps/encryption/encrypt.js
index ff5cbc50b..3aacd3c2c 100644
--- a/test/spec-ui/tests/apps/encryption/encrypt.js
+++ b/test/spec-ui/tests/apps/encryption/encrypt.js
@@ -32,10 +32,11 @@ module.exports = {
     },
 
     'asks for a new password': function(client) {
-        client.expect.element('input[name=password]').to.be.present.before(5000);
+        client.expect.element('input[name="password"]').to.be.present.before(5000);
 
         client
-        .setValue('input[name=password]', '1')
+        .pause(100)
+        .setValue('input[name="password"]', '1')
         .click('[type="submit"]');
     },
 
@@ -57,6 +58,7 @@ module.exports = {
     },
 
     'shows notes in unencrypted format': function(client) {
+        client.pause(100);
         notes.forEach(function(note) {
             client.expect.element('.list').text.to.contain(note.title).before(5000);
             client.expect.element('.list').text.to.contain(note.content).before(5000);
@@ -131,5 +133,4 @@ module.exports = {
             client.expect.element('.list').text.to.contain(note.content).before(5000);
         });
     },
-
 };
diff --git a/test/spec-ui/tests/apps/notebooks/remove.js b/test/spec-ui/tests/apps/notebooks/remove.js
index b7a4036cb..a0933e676 100644
--- a/test/spec-ui/tests/apps/notebooks/remove.js
+++ b/test/spec-ui/tests/apps/notebooks/remove.js
@@ -93,10 +93,15 @@ module.exports = {
         .pause(100)
         .urlHash('notebooks');
 
-        for (var i = 0, len = 2; i < len; i++) {
+        for (var i = 0, len = 2; i <= len; i++) {
+            if (i === 2) {
+                return;
+            }
+
             client
-            .click('#notebooks .list--buttons .drop-edit')
-            .click('#notebooks .list--buttons .remove-link');
+            .keys('j')
+            .pause(100)
+            .keys([client.Keys.SHIFT, '3', client.Keys.SHIFT]);
 
             client.expect.element('#modal .modal-title').to.be.present.before(5000);
             client.expect.element('#modal .modal-title').to.be.visible.before(5000);
@@ -104,7 +109,9 @@ module.exports = {
             client.click('#modal .btn[data-event="confirm"]');
             client.pause(500);
         }
+    },
 
+    'shows notebooks in the navbar menu': function(client) {
         client
         .urlHash('notes')
         .pause(100)
diff --git a/test/spec-ui/tests/apps/notes/form.js b/test/spec-ui/tests/apps/notes/form.js
index 36f3c8dff..09a201eb7 100644
--- a/test/spec-ui/tests/apps/notes/form.js
+++ b/test/spec-ui/tests/apps/notes/form.js
@@ -133,7 +133,7 @@ module.exports = {
         .expect.element('#editor--input--title').value.to.contain('Nightwatch').before(1000);
 
         client
-        .click('.ace_content')
+        .click('.CodeMirror-lines')
         .keys(['Nightwatch test content.']);
 
         client
@@ -165,7 +165,7 @@ module.exports = {
         .expect.element('#editor--input--title').value.to.contain('Night Watch').before(1000);
 
         client
-        .click('.ace_content')
+        .click('.CodeMirror-lines')
         .keys(['Added a new content.']);
 
         client
diff --git a/test/spec-ui/tests/apps/notes/show.js b/test/spec-ui/tests/apps/notes/show.js
index 368557710..28d00a298 100644
--- a/test/spec-ui/tests/apps/notes/show.js
+++ b/test/spec-ui/tests/apps/notes/show.js
@@ -59,8 +59,8 @@ module.exports = {
 
     'changes a task\'s status when a checkbox is clicked': function(client) {
         client
-        .click('.layout--body.-note .checkbox')
-        .expect.element('.layout--body.-note .checkbox input:checked').to.be.present.before(5000);
+        .click('.layout--body.-note .task--checkbox')
+        .expect.element('.layout--body.-note .task--checkbox input:checked').to.be.present.before(5000);
 
         client.pause(500);
     },
@@ -91,22 +91,8 @@ module.exports = {
 
     'changes favourite status if the button is clicked': function(client) {
         client
-        .perform(function(client, done) {
-            client.getAttribute('.btn--favourite--icon', 'class', function(res) {
-                var isFavourite = res.value.search('icon-favorite') > -1;
-
-                client
-                .click('.btn--favourite');
-
-                if (isFavourite) {
-                    client.expect.element('.btn--favourite--icon').to.have.attribute('class').which.contains('icon-favorite');
-                    return done();
-                }
-
-                client.expect.element('.btn--favourite--icon').to.have.attribute('class').which.does.not.contain('icon-favorite');
-                return done();
-            });
-        });
+        .click('.btn--favourite')
+        .expect.element('.btn--favourite--icon').to.have.attribute('class').which.contains('icon-favorite');
     },
 
     'opens edit page if "e" is pressed': function(client) {
diff --git a/test/spec-ui/modules/fuzzySearch/fuzzySearch.js b/test/spec-ui/tests/modules/fuzzySearch/fuzzySearch.js
similarity index 84%
rename from test/spec-ui/modules/fuzzySearch/fuzzySearch.js
rename to test/spec-ui/tests/modules/fuzzySearch/fuzzySearch.js
index b89fe226e..5e301ba8a 100644
--- a/test/spec-ui/modules/fuzzySearch/fuzzySearch.js
+++ b/test/spec-ui/tests/modules/fuzzySearch/fuzzySearch.js
@@ -1,13 +1,18 @@
-/* global describe, before, after, it */
 'use strict';
 
 /**
  * Test fuzzy search module
  */
-describe('FuzzySearch', function() {
+module.exports = {
+    before: function(client) {
+        client.closeWelcome();
+    },
 
-    before(function(client, done) {
-        this.timeout(100000);
+    after: function(client) {
+        client.end();
+    },
+
+    'wait': function(client) {
         client.urlHash('notes');
         client.expect.element('#header--add').to.be.visible.before(50000);
 
@@ -15,22 +20,17 @@ describe('FuzzySearch', function() {
         client.addNote({title: 'note2', content: 'content2'});
         client.addNote({title: 'note3', content: 'content3'});
         client.addNote({title: 'Nightwatch', content: 'Nightwatch'});
-        client.perform(() => {done();});
-    });
-
-    after(function(client, done) {
-        done();
-    });
+    },
 
-    it('can show search form', function(client) {
+    'can show search form': function(client) {
         client.expect.element('#header--sbtn').to.be.present.before(5000);
         client.click('#header--sbtn');
 
         client.expect.element('#header--search--input').to.be.present.before(5000);
         client.expect.element('#header--search--input').to.be.visible.before(5000);
-    });
+    },
 
-    it('can search by note\'s name', function(client) {
+    'can search by note\'s name': function(client) {
         client.clearValue('#header--search--input');
         client.expect.element('#sidebar--fuzzy').text.to.be.equal('');
 
@@ -42,15 +42,15 @@ describe('FuzzySearch', function() {
         client.expect.element('#sidebar--fuzzy').text.to.contain('note2');
         client.expect.element('#sidebar--fuzzy').text.to.contain('note3');
         client.expect.element('#sidebar--fuzzy').text.to.not.contain('Nightwatch');
-    });
+    },
 
-    it('can close fuzzySearch module on Escape', function(client) {
+    'can close fuzzySearch module on Escape': function(client) {
         client
         .setValue('#header--search--input', client.Keys.ESCAPE)
         .expect.element('#sidebar--fuzzy').text.to.be.equal('').before(5000);
-    });
+    },
 
-    it('can search by note\'s content', function(client) {
+    'can search by note\'s content': function(client) {
         client.click('#header--sbtn');
         client.expect.element('#header--search--input').to.be.present.before(5000);
         client.expect.element('#header--search--input').to.be.visible.before(5000);
@@ -61,9 +61,9 @@ describe('FuzzySearch', function() {
         client.expect.element('#sidebar--fuzzy').text.to.contain('note2');
         client.expect.element('#sidebar--fuzzy').text.to.contain('note3');
         client.expect.element('#sidebar--fuzzy').text.to.not.contain('Nightwatch');
-    });
+    },
 
-    it('after hitting ESCAPE notes are normally rendered', function(client) {
+    'after hitting ESCAPE notes are normally rendered': function(client) {
         client
         .clearValue('#header--search--input')
         .pause(1000)
@@ -77,9 +77,9 @@ describe('FuzzySearch', function() {
         client.expect.element('#sidebar--content').text.to.contain('note2').before(5000);
         client.expect.element('#sidebar--content').text.to.contain('note3').before(5000);
         client.expect.element('#sidebar--content').text.to.contain('Nightwatch').before(5000);
-    });
+    },
 
-    it('redirects to notes search page on `enter`', function(client) {
+    'redirects to notes search page on `enter`': function(client) {
         client.expect.element('#header--sbtn').to.be.visible.before(5000);
         client.click('#header--sbtn');
 
@@ -99,5 +99,5 @@ describe('FuzzySearch', function() {
         client
         .setValue('#header--search--input', client.Keys.ENTER)
         .assert.urlContains('notes/f/search/q/note');
-    });
-});
+    }
+};

From df5d63aaa3ca19f4c160cac0331877238260307d Mon Sep 17 00:00:00 2001
From: wwebfor <wwebfor@users.noreply.github.com>
Date: Fri, 8 Jan 2016 18:16:33 +0600
Subject: [PATCH 25/25] Install NPM dependencies in a Gulp task

---
 app/scripts/constants.js |  2 +-
 bower.json               |  2 +-
 gulpfile.js              |  3 ++-
 gulps/copyRelease.js     | 24 ------------------------
 gulps/npm.js             | 14 ++++++++++++++
 package.json             | 11 ++++++-----
 server.js                | 20 +++++++++++++++-----
 7 files changed, 39 insertions(+), 37 deletions(-)
 create mode 100644 gulps/npm.js

diff --git a/app/scripts/constants.js b/app/scripts/constants.js
index 8e36bf996..990e9345b 100644
--- a/app/scripts/constants.js
+++ b/app/scripts/constants.js
@@ -11,7 +11,7 @@ define(['underscore'], function (_) {
 
     var constants = {};
 
-    constants.VERSION = '0.7.1';
+    constants.VERSION = '0.7.2-RC';
     constants.URL = location.origin + location.pathname.replace('index.html', '');
 
     // List of hosts and urls where default dropbox API will work
diff --git a/bower.json b/bower.json
index 612b3d756..38b82086b 100644
--- a/bower.json
+++ b/bower.json
@@ -1,6 +1,6 @@
 {
   "name": "laverna",
-  "version": "0.7.1",
+  "version": "0.7.2-RC",
   "license": "MPL-2.0",
   "dependencies": {
     "backbone": "~1.2.3",
diff --git a/gulpfile.js b/gulpfile.js
index b8c33e0a1..77f6cdde2 100644
--- a/gulpfile.js
+++ b/gulpfile.js
@@ -13,7 +13,7 @@ function getTask(task) {
     'less'   , 'prism'      , 'require'     , 'electron'  ,
     'htmlmin', 'cssmin'     , 'htmlManifest',
     'copy'   , 'copyRelease', 'copyDist'    ,
-    'reload' , 'clean'
+    'reload' , 'clean'      , 'npm'
 ]
 .forEach(function(task) {
     var taskFun = getTask(task);
@@ -59,6 +59,7 @@ gulp.task('release', plugins.sequence(
     'build',
     'clean:release',
     ['copyDist', 'copyRelease'],
+    'npm:install',
     'electron',
     'release:after'
 ));
diff --git a/gulps/copyRelease.js b/gulps/copyRelease.js
index 97a4f6304..92e796f5c 100644
--- a/gulps/copyRelease.js
+++ b/gulps/copyRelease.js
@@ -3,30 +3,6 @@
 module.exports = function(gulp) {
     return function() {
         return gulp.src([
-            './node_modules/connect/**',
-            './node_modules/buffer-crc32/**',
-            './node_modules/fresh/**',
-            './node_modules/bytes/**',
-            './node_modules/cookie/**',
-            './node_modules/cookie-signature/**',
-            './node_modules/mime/**',
-            './node_modules/debug/**',
-            './node_modules/depd/**',
-            './node_modules/finalhandler/**',
-            './node_modules/on-headers/**',
-            './node_modules/parseurl/**',
-            './node_modules/range-parser/**',
-            './node_modules/serve-static/**',
-            './node_modules/type-is/**',
-            './node_modules/send/**',
-
-            './node_modules/colors/**',
-            './node_modules/optimist/**',
-            './node_modules/electron-window-state/**',
-            './node_modules/open/**',
-            './node_modules/jsonfile/**',
-            './node_modules/mkdirp/**',
-            './node_modules/wordwrap/**',
             './server.js',
             './package.json'
         ], {base: './'})
diff --git a/gulps/npm.js b/gulps/npm.js
new file mode 100644
index 000000000..0461e57f9
--- /dev/null
+++ b/gulps/npm.js
@@ -0,0 +1,14 @@
+'use strict';
+
+module.exports = function(gulp, plugins) {
+    return {
+        install: function() {
+            return gulp.src('./release/laverna/package.json')
+            .pipe(
+                plugins.shell(
+                    'cd ./release/laverna && npm install --production && cd ../../'
+                )
+            );
+        },
+    };
+};
diff --git a/package.json b/package.json
index ccb81770e..8953c72b4 100644
--- a/package.json
+++ b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "laverna",
-  "version": "0.7.1",
+  "version": "0.7.2-RC",
   "license": "MPL-2.0",
   "repository": {
     "type": "git",
@@ -11,11 +11,13 @@
   },
   "main": "electron.js",
   "dependencies": {
-    "node-static": "^0.7.7"
+    "electron-window-state": "^1.1.0",
+    "finalhandler": "^0.4.1",
+    "open": "0.0.5",
+    "serve-static": "^1.10.0"
   },
   "devDependencies": {
     "chai": "^3.4.0",
-    "electron-window-state": "^1.1.0",
     "gulp": "^3.9.0",
     "gulp-autoprefixer": "^3.0.2",
     "gulp-clean": "^0.3.1",
@@ -41,8 +43,7 @@
     "gulp-util": "^3.0.7",
     "jshint-stylish": "^2.1.0",
     "merge-stream": "^1.0.0",
-    "nightwatch": "^0.8.9",
-    "open": "0.0.5"
+    "nightwatch": "^0.8.9"
   },
   "engines": {
     "node": ">=0.8.0"
diff --git a/server.js b/server.js
index 5d7c6a6a4..c51ed5632 100644
--- a/server.js
+++ b/server.js
@@ -1,9 +1,19 @@
 'use strict';
-const PORT  = 9100;
-var connect = require('connect');
+const PORT = 9100;
 
-connect()
-.use(connect.static(__dirname + '/dist'))
-.listen(PORT);
+var finalhandler = require('finalhandler'),
+    http         = require('http'),
+    serveStatic  = require('serve-static'),
+    serve,
+    server;
+
+serve  = serveStatic(__dirname + '/dist', {index: ['index.html']});
+
+server = http.createServer(function(req, res) {
+    var done = finalhandler(req, res);
+    serve(req, res, done);
+});
+
+server.listen(PORT);
 
 console.log('Server is running on port: ' + PORT);