diff --git a/.jshintrc b/.jshintrc new file mode 100644 index 00000000..f0b50c4c --- /dev/null +++ b/.jshintrc @@ -0,0 +1,14 @@ +{ + "curly": true, + "browser": true, + "devel": true, + "indent": 4, + "latedef": true, + "undef": true, + "unused": true, + "expr": true, + "globals": { + "define": false, + "require": false + } +} \ No newline at end of file diff --git a/Gruntfile.js b/Gruntfile.js index c83a2471..cae1fd7a 100644 --- a/Gruntfile.js +++ b/Gruntfile.js @@ -15,18 +15,7 @@ module.exports = function(grunt) { pkg: grunt.file.readJSON('package.json'), jshint: { options: { - curly: true, - browser: true, - devel: true, - indent: 4, - latedef: true, - undef: true, - unused: true, - expr: true, - globals: { - "define": false, - "require": false, - }, + jshintrc: true, ignores: [ 'node_modules/**/*.js', 'public/libs/**/*.js', diff --git a/bower.json b/bower.json index 2819482f..b20300f9 100644 --- a/bower.json +++ b/bower.json @@ -17,7 +17,7 @@ "stacktrace": "~0.5.3", "requirejs-text": "~2.0.10", "bootstrap-tour": "~0.7.1", - "ace": "4bbe5346f2ae5ad35c0c47defa244ab27aedd451", + "ace": "https://github.com/benweet/ace.git#798a03b2f8b1315fa8ba2d867cee242b90960557", "pagedown-ace": "https://github.com/benweet/pagedown-ace.git#84d5e1b7ff233a1c8cafa9716e825228d275120c", "pagedown-extra": "https://github.com/jmcmanus/pagedown-extra.git#bd0870e3e871e15bde1fa5a427e3e10028a09789", "crel": "https://github.com/KoryNunn/crel.git#8dbda04b129fc0aec01a2a080d1cab26816e11c1", diff --git a/public/res/constants.js b/public/res/constants.js index ad487784..efcc1ead 100644 --- a/public/res/constants.js +++ b/public/res/constants.js @@ -65,6 +65,7 @@ define([], function() { constants.THEME_LIST = { "default": "Default", "gray": "Gray", + "original": "Original", "night": "Night", "school": "School", }; diff --git a/public/res/core.js b/public/res/core.js index 40c89e5c..2295e41b 100644 --- a/public/res/core.js +++ b/public/res/core.js @@ -28,7 +28,7 @@ define([ ], function($, _, crel, ace, constants, utils, storage, settings, eventMgr, shortcutMgr, mousetrap, bodyIndexHTML, bodyViewerHTML, settingsTemplateTooltipHTML, settingsUserCustomExtensionTooltipHTML) { var core = {}; - + // Used for periodic tasks var intervalId; @@ -53,7 +53,7 @@ define([ } return userActive && windowUnique; } - + // Used to only have 1 window of the application in the same browser var windowId; function checkWindowUnique() { @@ -147,7 +147,7 @@ define([ utils.setInputValue("#input-settings-pdf-page-size", settings.pdfPageSize); // SSH proxy utils.setInputValue("#input-settings-ssh-proxy", settings.sshProxy); - + // Load shortcuts settings shortcutMgr.loadSettings(); @@ -250,8 +250,17 @@ define([ aceEditor.session.setNewLineMode("unix"); aceEditor.session.setMode("libs/ace_mode"); aceEditor.session.$selectLongWords = true; + aceEditor.setShowPrintMargin(true); + aceEditor.setHighlightActiveLine(false); + aceEditor.setHighlightGutterLine(false); + aceEditor.setHighlightSelectedWord(false); + aceEditor.setDisplayIndentGuides(false); + aceEditor.setShowFoldWidgets(false); + aceEditor.setWrapBehavioursEnabled(false); + // Hack to disable bracket highlighting + aceEditor.$highlightBrackets = function() {}; - // Make bold titles... + // Hack to make bold titles (function(self) { function checkLine(currentLine) { var line = self.lines[currentLine]; @@ -320,6 +329,19 @@ define([ // Create the layout var $editorButtonsElt; + var maxWidthMap = [ + { screenWidth: 0, maxWidth: 600 }, + { screenWidth: 1000, maxWidth: 700 }, + { screenWidth: 1200, maxWidth: 800 }, + { screenWidth: 1400, maxWidth: 900 }, + ]; + var maxWidthMapReversed = maxWidthMap.slice(0).reverse(); + function getMaxWidth() { + var actualWidth = $(window).width(); + return _.find(maxWidthMapReversed, function(value) { + return actualWidth > value.screenWidth; + }).maxWidth; + } function createLayout() { var layoutGlobalConfig = { closable: true, @@ -331,14 +353,20 @@ define([ resizeWithWindow: false, north__spacing_open: 1, north__spacing_closed: 1, - spacing_open: 35, - spacing_closed: 35, + spacing_open: 32, + spacing_closed: 32, togglerLength_open: 60, togglerLength_closed: 60, stateManagement__enabled: false, north__minSize: 49, center__minWidth: 250, center__minHeight: 180, + east__onAlert: function() { + window.location.href = 'viewer'; + }, + south__onAlert: function() { + window.location.href = 'viewer'; + }, fxSettings: { easing: "easeInOutQuad", duration: 350 @@ -362,7 +390,7 @@ define([ bottomMargin < 0 && (bottomMargin = 0); aceEditor.renderer.setScrollMargin(0, bottomMargin, 0, 0); setTimeout(function() { - var padding = (aceEditor.renderer.$size.scrollerWidth - settings.maxWidth) / 2; + var padding = (aceEditor.renderer.$size.scrollerWidth - getMaxWidth()) / 2; if(padding < constants.EDITOR_DEFAULT_PADDING) { padding = constants.EDITOR_DEFAULT_PADDING; } @@ -394,7 +422,6 @@ define([ south__minSize: 200 })); } - settings.maxWidth && $('#preview-contents').css('max-width', (settings.maxWidth + 30) + 'px'); $(".navbar").click(function() { layout.allowOverflow('north'); }); @@ -428,33 +455,33 @@ define([ var $navbarElt; var $leftBtnElts; var $rightBtnElts; - var $leftBtnDropdown; - var $rightBtnDropdown; - var marginWidth = 36 + 25 + 25; + var $btnDropdown; + var $titleContainer; + var marginWidth = 18 * 2 + 25 + 25; var titleWidth = 18 + 348; - var leftButtonsWidth = 72 + 83 + 166 + 167 + 83; - var rightButtonsWidth = 36 + 84 + 83; - var rightButtonsDropdown = 42; + var leftButtonsWidth = 18 * 4 + 80 + 160 + 160 + 80; + var rightButtonsWidth = 18 + 80; + var buttonsDropdownWidth = 40; function adjustWindow() { if(!window.viewerMode) { - var maxWidth = $navbarElt.width() - 5; + var maxWidth = $navbarElt.width(); if(marginWidth + titleWidth + leftButtonsWidth + rightButtonsWidth > maxWidth) { - $rightBtnDropdown.show().find('.dropdown-menu').append($rightBtnElts); - if(marginWidth + titleWidth + leftButtonsWidth + rightButtonsDropdown > maxWidth) { - $leftBtnDropdown.show().find('.dropdown-menu').append($leftBtnElts); + $btnDropdown.show().find('.dropdown-menu').append($leftBtnElts); + if(marginWidth + titleWidth + rightButtonsWidth + buttonsDropdownWidth > maxWidth) { + $btnDropdown.find('.dropdown-menu').append($rightBtnElts); } else { - $leftBtnDropdown.hide().after($leftBtnElts); + $titleContainer.before($rightBtnElts); } } else { - $leftBtnDropdown.hide().after($leftBtnElts); - $rightBtnDropdown.hide().after($rightBtnElts); + $btnDropdown.hide().after($leftBtnElts); + $titleContainer.before($rightBtnElts); } } layout.resizeAll(); } - + // Create the PageDown editor var editor; var $editorElt; @@ -551,7 +578,7 @@ define([ } documentContent = newDocumentContent; } - + var previewWrapper; if(window.lightMode) { editor = new Markdown.EditorLight(converter); @@ -578,7 +605,7 @@ define([ $(".modal-insert-image").modal(); return true; }); - + if(settings.lazyRendering === true) { previewWrapper = function(makePreview) { var debouncedMakePreview = _.debounce(makePreview, 500); @@ -658,7 +685,7 @@ define([ $("#wmd-undo-button").append($('')).appendTo($btnGroupElt); $("#wmd-redo-button").append($('')).appendTo($btnGroupElt); }; - + // Initialize multiple things and then fire eventMgr.onReady var isDocumentPanelShown = false; var isMenuPanelShown = false; @@ -669,19 +696,62 @@ define([ else { document.body.innerHTML = bodyIndexHTML; } + + var styleContent = ''; + + // Apply font + function applyFont(size, screenWidth) { + screenWidth = screenWidth || 0; + //var codeFontSize = settings.editorFontSize; + //var codeLineHeight = Math.round(codeFontSize * 20 / 12); + var previewFontSize = size * 13 / 12; + styleContent += [ + '@media (min-width: ' + screenWidth + 'px) {', + '#wmd-input, .textarea-helper {', + ' font-size: ' + size + 'px;', + //' font-family: ' + settings.editorFontFamily + ';', + '}', + '#preview-contents {', + ' font-size: ' + previewFontSize + 'px;', + '}', + '}', + ].join('\n'); + } + applyFont(15); + applyFont(16, 600); + applyFont(17, 1200); + + function applyMaxWidth(maxWidth, screenWidth) { + styleContent += [ + '@media (min-width: ' + screenWidth + 'px) {', + '#preview-contents {', + ' max-width: ' + (maxWidth + 30) + 'px;', + '}', + '}', + ].join('\n'); + } + _.each(maxWidthMap, function(entry) { + applyMaxWidth(entry.maxWidth, entry.screenWidth); + }); + + // Apply dynamic stylesheet + var style = document.createElement("style"); + style.innerHTML = styleContent; + document.head.appendChild(style); + $navbarElt = $('.navbar'); $leftBtnElts = $navbarElt.find('.left-buttons'); $rightBtnElts = $navbarElt.find('.right-buttons'); - $leftBtnDropdown = $navbarElt.find('.left-buttons-dropdown'); - $rightBtnDropdown = $navbarElt.find('.right-buttons-dropdown'); + $btnDropdown = $navbarElt.find('.buttons-dropdown'); + $titleContainer = $navbarElt.find('.title-container'); $(window).bind("resize", adjustWindow); - + // Initialize utils library utils.init(); - + // Populate shortcuts in settings shortcutMgr.addSettingEntries(); - + // Hide shortcuts settings if light mode if(window.lightMode) { $('.tab-settings-shortcuts').hide(); @@ -767,32 +837,30 @@ define([ }); // Editor - if(window.lightMode) { + if(window.preMode) { + // In light mode, we replace ACE with a textarea + $('#wmd-input').addClass('form-control').attr('contenteditable', true); + + // Create UI layout after textarea + createLayout(); + } + else if(window.lightMode) { // In light mode, we replace ACE with a textarea $('#wmd-input').replaceWith(function() { return $(' @@ -849,22 +826,16 @@