Switch to ACE editor

This commit is contained in:
benweet 2013-09-10 17:52:27 +01:00
parent 582337d595
commit 23dcda3cf4
6 changed files with 38 additions and 49 deletions

View File

@ -14,8 +14,6 @@
"google-code-prettify": "~1.0.0", "google-code-prettify": "~1.0.0",
"highlightjs": "~7.3.0", "highlightjs": "~7.3.0",
"jquery-ui": "~1.10.3", "jquery-ui": "~1.10.3",
"jquery-mousewheel": "~3.1.3",
"css_browser_selector": "*",
"FileSaver": "*", "FileSaver": "*",
"stacktrace": "~0.5.3", "stacktrace": "~0.5.3",
"requirejs-text": "~2.0.10", "requirejs-text": "~2.0.10",

View File

@ -527,6 +527,7 @@ define([
isMenuPanelShown = false; isMenuPanelShown = false;
menuPanelBackdropElt.parentNode.removeChild(menuPanelBackdropElt); menuPanelBackdropElt.parentNode.removeChild(menuPanelBackdropElt);
$menuPanelElt.removeClass('move-to-front'); $menuPanelElt.removeClass('move-to-front');
aceEditor.focus();
} }
}).on('hidden.bs.collapse', function(e) { }).on('hidden.bs.collapse', function(e) {
if(e.target === $menuPanelElt[0]) { if(e.target === $menuPanelElt[0]) {
@ -554,6 +555,7 @@ define([
isDocumentPanelShown = false; isDocumentPanelShown = false;
documentPanelBackdropElt.parentNode.removeChild(documentPanelBackdropElt); documentPanelBackdropElt.parentNode.removeChild(documentPanelBackdropElt);
$documentPanelElt.removeClass('move-to-front'); $documentPanelElt.removeClass('move-to-front');
aceEditor.focus();
} }
}).on('hidden.bs.collapse', function(e) { }).on('hidden.bs.collapse', function(e) {
if(e.target === $documentPanelElt[0]) { if(e.target === $documentPanelElt[0]) {

View File

@ -12,7 +12,6 @@ define([
"Bootstrap": "http://getbootstrap.com/", "Bootstrap": "http://getbootstrap.com/",
"Bootstrap Tour": "http://bootstraptour.com/", "Bootstrap Tour": "http://bootstraptour.com/",
"crel": "https://github.com/KoryNunn/crel", "crel": "https://github.com/KoryNunn/crel",
"CSS Browser Selector": "https://github.com/rafaelp/css_browser_selector/",
"Dropbox-js": "https://github.com/dropbox/dropbox-js", "Dropbox-js": "https://github.com/dropbox/dropbox-js",
"FileSaver.js": "https://github.com/eligrey/FileSaver.js/", "FileSaver.js": "https://github.com/eligrey/FileSaver.js/",
"Fontello": "http://fontello.com/", "Fontello": "http://fontello.com/",
@ -23,7 +22,6 @@ define([
"Highlight.js": "http://softwaremaniacs.org/soft/highlight/en/", "Highlight.js": "http://softwaremaniacs.org/soft/highlight/en/",
"jGrowl": "https://github.com/stanlemon/jGrowl/", "jGrowl": "https://github.com/stanlemon/jGrowl/",
"jQuery": "http://jquery.com/", "jQuery": "http://jquery.com/",
"jQuery Mouse Wheel Plugin": "https://github.com/brandonaaron/jquery-mousewheel",
"LESS": "http://lesscss.org/", "LESS": "http://lesscss.org/",
"MathJax": "http://www.mathjax.org/", "MathJax": "http://www.mathjax.org/",
"Mousetrap": "http://craig.is/killing/mice", "Mousetrap": "http://craig.is/killing/mice",

View File

@ -2,9 +2,7 @@ define([
"jquery", "jquery",
"underscore", "underscore",
"classes/Extension", "classes/Extension",
"text!html/scrollLinkSettingsBlock.html", "text!html/scrollLinkSettingsBlock.html"
"css_browser_selector",
'jquery-mousewheel',
], function($, _, Extension, scrollLinkSettingsBlockHTML) { ], function($, _, Extension, scrollLinkSettingsBlockHTML) {
var scrollLink = new Extension("scrollLink", "Scroll Link", true, true); var scrollLink = new Extension("scrollLink", "Scroll Link", true, true);
@ -79,6 +77,8 @@ define([
var isScrollEditor = false; var isScrollEditor = false;
var isScrollPreview = false; var isScrollPreview = false;
var isEditorMoving = false;
var isPreviewMoving = false;
var doScrollLink = _.debounce(function() { var doScrollLink = _.debounce(function() {
if(mdSectionList.length === 0 || mdSectionList.length !== htmlSectionList.length) { if(mdSectionList.length === 0 || mdSectionList.length !== htmlSectionList.length) {
// Delay // Delay
@ -117,10 +117,19 @@ define([
lastPreviewScrollTop = previewScrollTop; lastPreviewScrollTop = previewScrollTop;
} }
else { else {
isPreviewMoving = true;
$previewElt.animate({ $previewElt.animate({
scrollTop: destScrollTop scrollTop: destScrollTop
}, 'easeOutQuad', function() { }, {
lastPreviewScrollTop = destScrollTop; easing: 'easeOutSine',
complete: function() {
lastPreviewScrollTop = destScrollTop;
},
always: function() {
_.defer(function() {
isPreviewMoving = false;
});
}
}); });
} }
} }
@ -138,15 +147,21 @@ define([
lastEditorScrollTop = editorScrollTop; lastEditorScrollTop = editorScrollTop;
} }
else { else {
isEditorMoving = true;
$("<div>").animate({ $("<div>").animate({
value: destScrollTop - editorScrollTop value: destScrollTop - editorScrollTop
}, { }, {
easing: 'easeOutQuad', easing: 'easeOutSine',
step: function(now) { step: function(now) {
aceEditor.session.setScrollTop(editorScrollTop + now); aceEditor.session.setScrollTop(editorScrollTop + now);
}, },
complete: function() { complete: function() {
lastEditorScrollTop = destScrollTop; lastEditorScrollTop = destScrollTop;
},
always: function() {
_.defer(function() {
isEditorMoving = false;
});
} }
}); });
} }
@ -165,23 +180,22 @@ define([
scrollLink.onReady = function() { scrollLink.onReady = function() {
$previewElt = $(".preview-container"); $previewElt = $(".preview-container");
$previewElt.bind("keyup mouseup mousewheel", function() { $previewElt.scroll(function() {
isScrollPreview = true; if(isPreviewMoving === false) {
isScrollEditor = false; isScrollPreview = true;
doScrollLink(); isScrollEditor = false;
}); doScrollLink();
$('.table-of-contents').click(function() { }
isScrollPreview = true;
isScrollEditor = false;
doScrollLink();
}); });
aceEditor.session.on("changeScrollTop", function(e) { aceEditor.session.on("changeScrollTop", function(e) {
isScrollEditor = true; if(isEditorMoving === false) {
isScrollPreview = false; isScrollEditor = true;
doScrollLink(); isScrollPreview = false;
doScrollLink();
}
}); });
}; };
var $previewContentsElt = undefined; var $previewContentsElt = undefined;
scrollLink.onPagedownConfigure = function(editor) { scrollLink.onPagedownConfigure = function(editor) {
$previewContentsElt = $("#preview-contents"); $previewContentsElt = $("#preview-contents");

View File

@ -31,7 +31,6 @@ requirejs.config({
requirejs: 'bower-libs/requirejs/require', requirejs: 'bower-libs/requirejs/require',
'google-code-prettify': 'bower-libs/google-code-prettify/src/prettify', 'google-code-prettify': 'bower-libs/google-code-prettify/src/prettify',
highlightjs: 'bower-libs/highlightjs/highlight.pack', highlightjs: 'bower-libs/highlightjs/highlight.pack',
'jquery-mousewheel': 'bower-libs/jquery-mousewheel/jquery.mousewheel',
'jquery-waitforimages': 'libs/jquery.waitforimages', 'jquery-waitforimages': 'libs/jquery.waitforimages',
'jquery-ui': 'bower-libs/jquery-ui/ui/jquery-ui', 'jquery-ui': 'bower-libs/jquery-ui/ui/jquery-ui',
'jquery-ui-core': 'bower-libs/jquery-ui/ui/jquery.ui.core', 'jquery-ui-core': 'bower-libs/jquery-ui/ui/jquery.ui.core',
@ -41,7 +40,6 @@ requirejs.config({
'jquery-ui-effect': 'bower-libs/jquery-ui/ui/jquery.ui.effect', 'jquery-ui-effect': 'bower-libs/jquery-ui/ui/jquery.ui.effect',
'jquery-ui-effect-slide': 'bower-libs/jquery-ui/ui/jquery.ui.effect-slide', 'jquery-ui-effect-slide': 'bower-libs/jquery-ui/ui/jquery.ui.effect-slide',
uilayout: 'libs/layout', uilayout: 'libs/layout',
css_browser_selector: 'bower-libs/css_browser_selector/css_browser_selector',
FileSaver: 'bower-libs/FileSaver/FileSaver', FileSaver: 'bower-libs/FileSaver/FileSaver',
stacktrace: 'bower-libs/stacktrace/stacktrace', stacktrace: 'bower-libs/stacktrace/stacktrace',
'requirejs-text': 'bower-libs/requirejs-text/text', 'requirejs-text': 'bower-libs/requirejs-text/text',

View File

@ -16,7 +16,7 @@
@primary-color: #333; @primary-color: #333;
@primary-color-light: lighten(@primary-color, 13%); @primary-color-light: lighten(@primary-color, 13%);
@primary-color-lighter: lighten(@primary-color, 20%); @primary-color-lighter: lighten(@primary-color, 20%);
@primary-color-lightest: lighten(@primary-color, 33%); @primary-color-lightest: lighten(@primary-color, 35%);
@primary-color-inv: #fff; @primary-color-inv: #fff;
@bg-navbar-hover: @primary-bg-lighter; @bg-navbar-hover: @primary-bg-lighter;
@error-border: #ff8661; @error-border: #ff8661;
@ -918,7 +918,7 @@ ul,ol {
.ace-tm .ace_markup.ace_heading { .ace-tm .ace_markup.ace_heading {
color: @primary-color-light; color: @primary-color-light;
font-weight: 900; font-weight: bold;
} }
.ace-tm .ace_markup.ace_list { .ace-tm .ace_markup.ace_list {
@ -926,7 +926,7 @@ ul,ol {
} }
.ace-tm .ace_strong { .ace-tm .ace_strong {
font-weight: 600; font-weight: bold;
} }
.ace-tm .ace_emphasis { .ace-tm .ace_emphasis {
@ -945,31 +945,10 @@ ul,ol {
#wmd-input { #wmd-input {
.box-shadow(none); .box-shadow(none);
padding: 0; padding: 0;
font-weight: 300;
}
#wmd-input,#md-section-helper {
resize: none; resize: none;
border: none !important; border: none !important;
} }
#md-section-helper {
position: absolute;
top: -100px;
height: 1px;
padding: 0 6px;
overflow-y: scroll;
z-index: -1;
.gecko & {
/* Firefox doesn't show the scrollbar if height is less than 40px */
height: 40px;
}
.opera & {
/* Opera needs to have the textarea in the viewport to evaluate its size correctly */
top: 0;
}
}
.preview-container { .preview-container {
overflow: auto; overflow: auto;
} }