Added HTML code button

css/default.css

@@ -100,12 +100,18 @@ input::-webkit-input-placeholder,textarea::-webkit-input-placeholder {
 		rgba(255, 134, 97, 0.6) !important;
 }
 
-.navbar-inner .btn {
+.navbar-inner .btn,
+#extension-preview-buttons .btn {
 	background-color: #ddd;
 }
 
-.navbar-inner .btn:hover,.navbar-inner .btn:focus,.navbar-inner .btn:active,.navbar-inner .btn.active,.btn-group.open .btn.dropdown-toggle
+.navbar-inner .btn:hover,
-	{
+.navbar-inner .btn:focus,
+.navbar-inner .btn:active,
+.navbar-inner .btn.active,
+.btn-group.open .btn.dropdown-toggle,
+#extension-preview-buttons .btn-group:hover .btn,
+#extension-preview-buttons .btn-group.open .btn {
 	color: #333333;
 	background-color: #eee;
 }
@@ -161,6 +167,25 @@ input[readonly],select[readonly],textarea[readonly] {
 	margin-right: 10px;
 }
 
+#extension-preview-buttons .btn-group .btn {
+    opacity: 0.3;
+    filter: alpha(opacity =   30);
+}
+
+#extension-preview-buttons,
+#extension-preview-buttons .dropdown-menu {
+    position: fixed;
+    right: 30px;
+    top: inherit;
+    z-index: 1;
+}
+
+#extension-preview-buttons .btn-group:hover .btn,
+#extension-preview-buttons .btn-group.open .btn {
+    opacity: 1;
+    filter: none;
+}
+
 #extension-buttons {
 	margin-right: 15px;
 }
@@ -169,22 +194,35 @@ input[readonly],select[readonly],textarea[readonly] {
 	margin: 5px 0 0;
 }
 
-#extension-buttons>.btn-group>.btn {
+#extension-preview-buttons>.btn-group {
+	margin: 0;
+}
+
+#extension-buttons>.btn-group>.btn,
+#extension-preview-buttons>.btn-group>.btn {
 	-webkit-border-radius: 0;
 	-moz-border-radius: 0;
 	border-radius: 0;
 }
 
-#extension-buttons>.btn-group:first-child>.btn {
+#extension-buttons>.btn-group:first-child>.btn,
-	-webkit-border-radius: 4px 0 0 4px;
+#extension-preview-buttons>.btn-group:first-child>.btn {
-	-moz-border-radius: 4px 0 0 4px;
+	-webkit-top-left-border-radius: 4px;
-	border-radius: 4px 0 0 4px;
+	-webkit-bottom-left-border-radius: 4px;
+	-moz-top-left-border-radius: 4px;
+	-moz-bottom-left-border-radius: 4px;
+	border-top-left-radius: 4px;
+	border-bottom-left-radius: 4px;
 }
 
-#extension-buttons>.btn-group:last-child>.btn {
+#extension-buttons>.btn-group:last-child>.btn,
-	-webkit-border-radius: 0 4px 4px 0;
+#extension-preview-buttons>.btn-group:last-child>.btn {
-	-moz-border-radius: 0 4px 4px 0;
+    -webkit-top-right-border-radius: 4px;
-	border-radius: 0 4px 4px 0;
+    -webkit-bottom-right-border-radius: 4px;
+    -moz-top-right-border-radius: 4px;
+    -moz-bottom-right-border-radius: 4px;
+    border-top-right-radius: 4px;
+    border-bottom-right-radius: 4px;
 }
 
 .btn-group>.btn+.dropdown-toggle {
@@ -329,6 +367,12 @@ div.dropdown-menu i {
 	margin-right: 0;
 }
 
+div.dropdown-menu textarea {
+	width: 250px;
+	max-width: 250px;
+	height: 150px;
+}
+
 #link-container {
 	min-width: 210px;
 	white-space: normal;
@@ -601,23 +645,22 @@ table tbody+tbody {
 	border-top: 2px solid #dddddd;
 }
 
+#wmd-preview blockquote {
+  border-color: #ddd;
+  border-color: rgba(0, 0, 0, 0.15);
+}
+
 blockquote p {
-	margin-bottom: 0;
+    margin-bottom: 20px;
-	font-size: 17.5px;
+    font-size: 14px;
 	font-weight: 300;
-	line-height: 1.25;
+    line-height: 20px;
 }
 
 ul,ol {
 	margin-bottom: 20px;
 }
 
-blockquote p {
-	margin-bottom: 20px;
-	font-size: 14px;
-	line-height: 20px;
-}
-
 input[type="file"] {
 	line-height: inherit;
 	height: inherit;

js/classes/AsyncTask.js

@@ -163,7 +163,7 @@ define([
     }
     
     // Call runTask function periodically
-    core.addPeriodicCallback(runTask);
+    core.runPeriodically(runTask);
 
     function runSafe(task, callbacks, param) {
         try {

js/classes/FileDescriptor.js

@@ -2,7 +2,7 @@ define(["utils"], function(utils) {
 
     function FileDescriptor(fileIndex, title, syncLocations, publishLocations) {
         this.fileIndex = fileIndex;
-        this._title = title;
+        this._title = title || localStorage[fileIndex + ".title"];
         this._editorScrollTop = parseInt(localStorage[fileIndex + ".editorScrollTop"]) || 0;
         this._editorStart = parseInt(localStorage[fileIndex + ".editorStart"]) || 0;
         this._editorEnd = parseInt(localStorage[fileIndex + ".editorEnd"]) || 0;

js/core.js

@@ -18,7 +18,7 @@ define([
     // Used for periodic tasks
     var intervalId = undefined;
     var periodicCallbacks = [extensionMgr.onPeriodicRun];
-    core.addPeriodicCallback = function(callback) {
+    core.runPeriodically = function(callback) {
         periodicCallbacks.push(callback);
     };
 
@@ -153,7 +153,7 @@ define([
 
     // Create the layout
     var layout = undefined;
-    core.createLayout = function() {
+    function createLayout() {
         if(viewerMode === true) {
             return;
         }
@@ -174,7 +174,7 @@ define([
         extensionMgr.onLayoutConfigure(layoutGlobalConfig);
         if(settings.layoutOrientation == "horizontal") {
             $(".ui-layout-south").remove();
-            $(".preview-container").html('<div id="wmd-preview"></div>');
+            $(".preview-container").html('<div id="extension-preview-buttons"></div><div id="wmd-preview"></div>');
             layout = $('body').layout($.extend(layoutGlobalConfig, {
                 east__resizable: true,
                 east__size: .5,
@@ -183,19 +183,19 @@ define([
         }
         else if(settings.layoutOrientation == "vertical") {
             $(".ui-layout-east").remove();
-            $(".preview-container").html('<div id="wmd-preview"></div>');
+            $(".preview-container").html('<div id="extension-preview-buttons"></div><div id="wmd-preview"></div>');
             layout = $('body').layout($.extend(layoutGlobalConfig, {
                 south__resizable: true,
                 south__size: .5,
                 south__minSize: 200
             }));
         }
-        $(".ui-layout-toggler-north").addClass("btn").append($("<b>").addClass("caret"));
-        $(".ui-layout-toggler-south").addClass("btn").append($("<b>").addClass("caret"));
-        $(".ui-layout-toggler-east").addClass("btn").append($("<b>").addClass("caret"));
         $("#navbar").click(function() {
             layout.allowOverflow('north');
         });
+        $(".ui-layout-toggler-north").addClass("btn").append($("<b>").addClass("caret"));
+        $(".ui-layout-toggler-south").addClass("btn").append($("<b>").addClass("caret"));
+        $(".ui-layout-toggler-east").addClass("btn").append($("<b>").addClass("caret"));
 
         extensionMgr.onLayoutCreated(layout);
     };
@@ -205,7 +205,7 @@ define([
     var fileDesc = undefined;
     var documentContent = undefined;
     var undoManager = undefined;
-    core.createEditor = function(fileDescParam) {
+    core.initEditor = function(fileDescParam) {
         fileDesc = fileDescParam;
         documentContent = undefined;
         var initDocumentContent = fileDesc.content;
@@ -336,7 +336,6 @@ define([
         }
     }
 
-    core.onReady(extensionMgr.onReady);
     core.onReady(function() {
 
         // Load theme list
@@ -437,7 +436,7 @@ define([
 
         // UI layout
         $("#menu-bar, .ui-layout-center, .ui-layout-east, .ui-layout-south").removeClass("hide");
-        core.createLayout();
+        createLayout();
 
         // Editor's textarea
         $("#wmd-input, #md-section-helper").css({
@@ -508,6 +507,7 @@ define([
             }
         }, 1000);
     });
+    core.onReady(extensionMgr.onReady);
 
     return core;
 });

js/extensionMgr.js

@@ -9,6 +9,7 @@ define([
     "extensions/buttonPublish",
     "extensions/buttonShare",
     "extensions/buttonStat",
+    "extensions/buttonHtmlCode",
     "extensions/dialogAbout",
     "extensions/dialogManagePublication",
     "extensions/dialogManageSynchronization",
@@ -86,7 +87,6 @@ define([
         });
     };
 
-    addHook("onReady");
     addHook("onMessage");
     addHook("onError");
     addHook("onOfflineChanged");
@@ -155,7 +155,7 @@ define([
         })));
     }
 
-    $(function() {
+    extensionMgr["onReady"] = function() {
         // Create accordion in settings dialog
         _.chain(extensionList).sortBy(function(extension) {
             return extension.extensionName.toLowerCase();
@@ -167,8 +167,18 @@ define([
         _.each(onCreateButtonCallbackList, function(callback) {
             $("#extension-buttons").append($('<div class="btn-group">').append(callback()));
         });
-
+        
-    });
+        // Create extension preview buttons
+        logger.log("onCreatePreviewButton");
+        var onCreatePreviewButtonCallbackList = getExtensionCallbackList("onCreatePreviewButton");
+        _.each(onCreatePreviewButtonCallbackList, function(callback) {
+            $("#extension-preview-buttons").append($('<div class="btn-group">').append(callback()));
+        });
+        
+        // Call extensions onReady callbacks
+        var onReady = createHook("onReady");
+        onReady();
+    };
 
     // For extensions that need to call other extensions
     extensionMgr.onExtensionMgrCreated(extensionMgr);

js/extensions/buttonHtmlCode.js

@@ -0,0 +1,39 @@
+define([
+    "jquery",
+    "text!html/buttonHtmlCode.html",
+], function($, buttonHtmlCodeHTML) {
+
+    var buttonHtmlCode = {
+        extensionId: "buttonHtmlCode",
+        extensionName: 'Button "HTML code"',
+        optional: true,
+        settingsBloc: '<p>Adds a "HTML code" button over the preview.</p>'
+    };
+
+    buttonHtmlCode.onCreatePreviewButton = function() {
+        return $(buttonHtmlCodeHTML);
+    };
+
+    buttonHtmlCode.onPreviewFinished = function() {
+        $("#input-html-code").val($("#wmd-preview").html());
+    };
+
+    buttonHtmlCode.onReady = function() {
+        $("#input-html-code").click(function(event) {
+            event.stopPropagation();
+        });
+        
+        $(".action-html-code").click(function() {
+            _.defer(function() {
+                $("#input-html-code").each(function() {
+                    if($(this).is(":hidden"))
+                        return;
+                    $(this).get(0).select();
+                });
+            });
+        });
+    };
+
+    return buttonHtmlCode;
+
+});

js/extensions/buttonStat.js

@@ -43,7 +43,7 @@ define([
         });
     };
 
-    buttonStat.onCreateButton = function() {
+    buttonStat.onCreatePreviewButton = function() {
         return $(_.template(buttonStatHTML, buttonStat.config));
     };
 

js/extensions/dialogAbout.js

@@ -21,6 +21,7 @@ define([
         "jGrowl": "https://github.com/stanlemon/jGrowl/",
         "jQuery": "http://jquery.com/",
         "jQuery Mouse Wheel Plugin": "https://github.com/brandonaaron/jquery-mousewheel",
+        "MathJax": "http://www.mathjax.org/",
         "Mousetrap": "http://craig.is/killing/mice",
         "PageDown": "https://code.google.com/p/pagedown/",
         "Pagedown-extra": "https://github.com/jmcmanus/pagedown-extra/",

js/extensions/notifications.js

@@ -23,16 +23,21 @@ define([
         newConfig.timeout = utils.getInputIntValue("#input-notifications-timeout", event, 1, 60000);
     };
 
-    notifications.onReady = function() {
+    var isInit = false;
-        // jGrowl configuration
+    function init() {
-        jGrowl.defaults.life = notifications.config.timeout;
+        if(isInit === false) {
-        jGrowl.defaults.closer = false;
+            // jGrowl configuration
-        jGrowl.defaults.closeTemplate = '';
+            jGrowl.defaults.life = notifications.config.timeout;
-        jGrowl.defaults.position = 'bottom-right';
+            jGrowl.defaults.closer = false;
-    };
+            jGrowl.defaults.closeTemplate = '';
+            jGrowl.defaults.position = 'bottom-right';
+            isInit = true;
+        }
+    }
 
     function showMessage(message, iconClass, options) {
         logger.info(message);
+        init();
         if(!message) {
             return;
         }

js/fileMgr.js

@@ -13,19 +13,10 @@ define([
     var fileMgr = {};
 
     // Defines the current file
-    var currentFile = undefined;
+    fileMgr.currentFile = undefined;
-    fileMgr.getCurrentFile = function() {
-        return currentFile;
-    };
-    fileMgr.isCurrentFile = function(fileDesc) {
-        return fileDesc === currentFile;
-    };
-    fileMgr.setCurrentFile = function(fileDesc) {
-        currentFile = fileDesc;
-    };
 
     fileMgr.selectFile = function(fileDesc) {
-        fileDesc = fileDesc || fileMgr.getCurrentFile();
+        fileDesc = fileDesc || fileMgr.currentFile;
 
         if(fileDesc === undefined) {
             var fileSystemSize = _.size(fileSystem);
@@ -41,8 +32,8 @@ define([
             }
         }
 
-        if(fileMgr.isCurrentFile(fileDesc) === false) {
+        if(fileMgr.currentFile !== fileDesc) {
-            fileMgr.setCurrentFile(fileDesc);
+            fileMgr.currentFile = fileDesc;
             fileDesc.selectTime = new Date().getTime();
 
             // Notify extensions
@@ -58,7 +49,7 @@ define([
         }
 
         // Refresh the editor
-        core.createEditor(fileDesc);
+        core.initEditor(fileDesc);
     };
 
     fileMgr.createFile = function(title, content, syncLocations, isTemporary) {
@@ -107,15 +98,15 @@ define([
     };
 
     fileMgr.deleteFile = function(fileDesc) {
-        fileDesc = fileDesc || fileMgr.getCurrentFile();
+        fileDesc = fileDesc || fileMgr.currentFile;
 
         // Remove the index from the file list
         utils.removeIndexFromArray("file.list", fileDesc.fileIndex);
         delete fileSystem[fileDesc.fileIndex];
 
-        if(fileMgr.isCurrentFile(fileDesc) === true) {
+        if(fileMgr.currentFile === fileDesc) {
             // Unset the current fileDesc
-            fileMgr.setCurrentFile();
+            fileMgr.currentFile = undefined;
             // Refresh the editor with another file
             fileMgr.selectFile();
         }
@@ -197,7 +188,7 @@ define([
             input.hide();
             $("#file-title").show();
             var title = $.trim(input.val());
-            var fileDesc = fileMgr.getCurrentFile();
+            var fileDesc = fileMgr.currentFile;
             if(title && title != fileDesc.title) {
                 fileDesc.title = title;
                 extensionMgr.onTitleChanged(fileDesc);
@@ -221,7 +212,7 @@ define([
         });
         $(".action-edit-document").click(function() {
             var content = $("#wmd-input").val();
-            var title = fileMgr.getCurrentFile().title;
+            var title = fileMgr.currentFile.title;
             var fileDesc = fileMgr.createFile(title, content);
             fileMgr.selectFile(fileDesc);
             window.location.href = ".";

js/fileSystem.js

@@ -1,15 +1,16 @@
 // The fileSystem module is empty when created. It's filled by fileMgr when loading.
 // syncLocations and publishLocations are respectively loaded by synchronizer and publisher. 
 define([
+    "underscore",
     "utils",
     "classes/FileDescriptor",
     "storage",
-], function(utils, FileDescriptor) {
+], function(_, utils, FileDescriptor) {
     var fileSystem = {};
 
-    // Retrieve file descriptors from localStorage and populate fileSystem
+    // Retrieve file descriptors from localStorage
     _.each(utils.retrieveIndexArray("file.list"), function(fileIndex) {
-        fileSystem[fileIndex] = new FileDescriptor(fileIndex, localStorage[fileIndex + ".title"]);
+        fileSystem[fileIndex] = new FileDescriptor(fileIndex);
     });
 
     return fileSystem;

js/html/buttonHtmlCode.html

@@ -0,0 +1,8 @@
+<button class="btn dropdown-toggle action-html-code" data-toggle="dropdown"
+	title="HTML code">
+	<i class="icon-code"></i>
+</button>
+<div class="dropdown-menu pull-right">
+	<h3 class="muted">HTML code</h3>
+	<textarea id="input-html-code"></textarea>
+</div>

js/html/buttonStat.html

@@ -1,8 +1,8 @@
 <button class="btn dropdown-toggle" data-toggle="dropdown"
-	title="Document's statistics">
+	title="Document statistics">
 	<i class="icon-stat"></i>
 </button>
-<div id="statistics-container" class="dropdown-menu pull-right">
+<div class="dropdown-menu pull-right">
 	<h3 class="muted">Statistics</h3>
 	<div class="stat">
 		<div>

js/html/buttonStatSettingsBloc.html

@@ -1,4 +1,4 @@
-<p>Adds a "Document's statistics" button in the navigation bar.</p>
+<p>Adds a "Document statistics" button over the preview.</p>
 <div class="form-horizontal">
 	<div class="control-group form-inline">
 		<label class="label-text" for="input-stat-name1">Title</label> <input

js/providers/dropboxProvider.js

@@ -203,7 +203,7 @@ define([
                         fileDesc.content = file.content;
                         extensionMgr.onContentChanged(fileDesc);
                         extensionMgr.onMessage('"' + localTitle + '" has been updated from Dropbox.');
-                        if(fileMgr.isCurrentFile(fileDesc)) {
+                        if(fileMgr.currentFile === fileDesc) {
                             fileMgr.selectFile(); // Refresh editor
                         }
                     }

js/providers/gdriveProvider.js

@@ -208,7 +208,7 @@ define([
                         fileDesc.content = file.content;
                         extensionMgr.onContentChanged(fileDesc);
                         extensionMgr.onMessage('"' + file.title + '" has been updated from Google Drive.');
-                        if(fileMgr.isCurrentFile(fileDesc)) {
+                        if(fileMgr.currentFile === fileDesc) {
                             fileMgr.selectFile(); // Refresh editor
                         }
                     }

js/publisher.js

@@ -129,7 +129,7 @@ define([
 
         publishRunning = true;
         extensionMgr.onPublishRunning(true);
-        publishFileDesc = fileMgr.getCurrentFile();
+        publishFileDesc = fileMgr.currentFile;
         publishHTML = $("#wmd-preview").html();
         publishAttributesList = _.values(publishFileDesc.publishLocations);
         publishLocation(function(errorFlag) {
@@ -188,7 +188,7 @@ define([
         }
 
         // Perform provider's publishing
-        var fileDesc = fileMgr.getCurrentFile();
+        var fileDesc = fileMgr.currentFile;
         var html = $("#wmd-preview").html();
         var content = getPublishContent(fileDesc, publishAttributes, html);
         provider.publish(publishAttributes, fileDesc.title, content, function(error) {
@@ -229,16 +229,16 @@ define([
         // Save As menu items
         $(".action-download-md").click(function() {
             var content = $("#wmd-input").val();
-            var title = fileMgr.getCurrentFile().title;
+            var title = fileMgr.currentFile.title;
             utils.saveAs(content, title + ".md");
         });
         $(".action-download-html").click(function() {
             var content = $("#wmd-preview").html();
-            var title = fileMgr.getCurrentFile().title;
+            var title = fileMgr.currentFile.title;
             utils.saveAs(content, title + ".html");
         });
         $(".action-download-template").click(function() {
-            var fileDesc = fileMgr.getCurrentFile();
+            var fileDesc = fileMgr.currentFile;
             var html = $("#wmd-preview").html();
             var content = publisher.applyTemplate(fileDesc, undefined, html);
             utils.saveAs(content, fileDesc.title + (settings.template.indexOf("documentHTML") === -1 ? ".md" : ".html"));

js/synchronizer.js

@@ -220,7 +220,7 @@ define([
             $(".action-sync-export-" + provider.providerId).click(function(event) {
 
                 // Perform the provider's export
-                var fileDesc = fileMgr.getCurrentFile();
+                var fileDesc = fileMgr.currentFile;
                 provider.exportFile(event, fileDesc.title, fileDesc.content, function(error, syncAttributes) {
                     if(error) {
                         return;
@@ -239,7 +239,7 @@ define([
             });
             // Provider's manual export button
             $(".action-sync-manual-" + provider.providerId).click(function(event) {
-                var fileDesc = fileMgr.getCurrentFile();
+                var fileDesc = fileMgr.currentFile;
                 provider.exportManual(event, fileDesc.title, fileDesc.content, function(error, syncAttributes) {
                     if(error) {
                         return;

themes/blue-gray/blue-gray.css

@@ -14,7 +14,8 @@ textarea[disabled],
     background-color: #ced5de !important;
 }
 
-.navbar-inner .btn {
+.navbar-inner .btn,
+#extension-preview-buttons .btn {
     background-color: #ced5de;
 }
 
@@ -23,7 +24,9 @@ textarea[disabled],
 .navbar-inner .btn:focus,
 .navbar-inner .btn:active,
 .navbar-inner .btn.active,
-.btn-group.open .btn.dropdown-toggle {
+.btn-group.open .btn.dropdown-toggle,
+#extension-preview-buttons .btn-group:hover .btn,
+#extension-preview-buttons .btn-group.open .btn {
     background-color: #e1e6ed;
 }
 

themes/night/night.css

@@ -74,7 +74,8 @@ blockquote {
     background-color: #444 !important;
 }
 
-.navbar-inner .btn {
+.navbar-inner .btn,
+#extension-preview-buttons .btn {
     background-color: #444;
 }
 
@@ -82,7 +83,9 @@ blockquote {
 .navbar-inner .btn:focus,
 .navbar-inner .btn:active,
 .navbar-inner .btn.active,
-.btn-group.open .btn.dropdown-toggle {
+.btn-group.open .btn.dropdown-toggle,
+#extension-preview-buttons .btn-group:hover .btn,
+#extension-preview-buttons .btn-group.open .btn {
     background-color: #555;
 }