Gives users the ability to change editor's keyboard shortcuts

pull/222/head
Igor Kalat 8 years ago
parent 2bac0bbcec
commit 16042564a1

File diff suppressed because one or more lines are too long

@ -16,18 +16,39 @@ var marked = require("marked");
// Some variables
var isMac = /Mac/.test(navigator.platform);
// Mapping of actions that can be bound to keyboard shortcuts
var bindings = {
"toggleBold": toggleBold,
"toggleItalic": toggleItalic,
"drawLink": drawLink,
"toggleHeadingSmaller": toggleHeadingSmaller,
"toggleHeadingBigger": toggleHeadingBigger,
"drawImage": drawImage,
"toggleBlockquote": toggleBlockquote,
"toggleOrderedList": toggleOrderedList,
"toggleUnorderedList": toggleUnorderedList,
"toggleCodeBlock": toggleCodeBlock,
"togglePreview": togglePreview,
// the two below are handled manually during SimpleMDE's initialization
// phase and the null value tells the bootstrapper to skip them
"toggleSideBySide": null,
"toggleFullScreen": null
};
var shortcuts = {
"Cmd-B": toggleBold,
"Cmd-I": toggleItalic,
"Cmd-K": drawLink,
"Cmd-H": toggleHeadingSmaller,
"Shift-Cmd-H": toggleHeadingBigger,
"Cmd-Alt-I": drawImage,
"Cmd-'": toggleBlockquote,
"Cmd-Alt-L": toggleOrderedList,
"Cmd-L": toggleUnorderedList,
"Cmd-Alt-C": toggleCodeBlock,
"Cmd-P": togglePreview
"toggleBold": "Cmd-B",
"toggleItalic": "Cmd-I",
"drawLink": "Cmd-K",
"toggleHeadingSmaller": "Cmd-H",
"toggleHeadingBigger": "Shift-Cmd-H",
"drawImage": "Cmd-Alt-I",
"toggleBlockquote": "Cmd-'",
"toggleOrderedList": "Cmd-Alt-L",
"toggleUnorderedList": "Cmd-L",
"toggleCodeBlock": "Cmd-Alt-C",
"togglePreview": "Cmd-P",
"toggleSideBySide": "F9",
"toggleFullScreen": "F11"
};
var isMobile = function() {
@ -55,13 +76,17 @@ function fixShortcut(name) {
/**
* Create icon element for toolbar.
*/
function createIcon(options, enableTooltips) {
function createIcon(options, enableTooltips, shortcuts) {
options = options || {};
var el = document.createElement("a");
enableTooltips = (enableTooltips == undefined) ? true : enableTooltips;
if(options.title && enableTooltips) {
el.title = options.title;
el.title = options.title[0];
if(shortcuts[options.title[1]]) {
el.title = options.title[0] + " (" + fixShortcut(shortcuts[options.title[1]]) + ")";
}
if(isMac) {
el.title = el.title.replace("Ctrl", "⌘");
@ -680,58 +705,58 @@ var toolbarBuiltInButtons = {
name: "bold",
action: toggleBold,
className: "fa fa-bold",
title: "Bold (Ctrl+B)",
title: ["Bold", "toggleBold"],
default: true
},
"italic": {
name: "italic",
action: toggleItalic,
className: "fa fa-italic",
title: "Italic (Ctrl+I)",
title: ["Italic", "toggleItalic"],
default: true
},
"strikethrough": {
name: "strikethrough",
action: toggleStrikethrough,
className: "fa fa-strikethrough",
title: "Strikethrough"
title: ["Strikethrough", "toggleStrikethrough"]
},
"heading": {
name: "heading",
action: toggleHeadingSmaller,
className: "fa fa-header",
title: "Heading (Ctrl+H)",
title: ["Heading", "toggleHeadingSmaller"],
default: true
},
"heading-smaller": {
name: "heading-smaller",
action: toggleHeadingSmaller,
className: "fa fa-header fa-header-x fa-header-smaller",
title: "Smaller Heading (Ctrl+H)"
title: ["Smaller Heading", "toggleHeadingSmaller"]
},
"heading-bigger": {
name: "heading-bigger",
action: toggleHeadingBigger,
className: "fa fa-header fa-header-x fa-header-bigger",
title: "Bigger Heading (Shift+Ctrl+H)"
title: ["Bigger Heading", "toggleHeadingBigger"]
},
"heading-1": {
name: "heading-1",
action: toggleHeading1,
className: "fa fa-header fa-header-x fa-header-1",
title: "Big Heading"
title: ["Big Heading", "toggleHeading1"]
},
"heading-2": {
name: "heading-2",
action: toggleHeading2,
className: "fa fa-header fa-header-x fa-header-2",
title: "Medium Heading"
title: ["Medium Heading", "toggleHeading2"]
},
"heading-3": {
name: "heading-3",
action: toggleHeading3,
className: "fa fa-header fa-header-x fa-header-3",
title: "Small Heading"
title: ["Small Heading", "toggleHeading3"]
},
"separator-1": {
name: "separator-1"
@ -740,27 +765,27 @@ var toolbarBuiltInButtons = {
name: "code",
action: toggleCodeBlock,
className: "fa fa-code",
title: "Code (Ctrl+Alt+C)"
title: ["Code", "toggleCodeBlock"]
},
"quote": {
name: "quote",
action: toggleBlockquote,
className: "fa fa-quote-left",
title: "Quote (Ctrl+')",
title: ["Quote", "toggleBlockquote"],
default: true
},
"unordered-list": {
name: "unordered-list",
action: toggleUnorderedList,
className: "fa fa-list-ul",
title: "Generic List (Ctrl+L)",
title: ["Generic List", "toggleUnorderedList"],
default: true
},
"ordered-list": {
name: "ordered-list",
action: toggleOrderedList,
className: "fa fa-list-ol",
title: "Numbered List (Ctrl+Alt+L)",
title: ["Numbered List", "toggleOrderedList"],
default: true
},
"separator-2": {
@ -770,27 +795,27 @@ var toolbarBuiltInButtons = {
name: "link",
action: drawLink,
className: "fa fa-link",
title: "Create Link (Ctrl+K)",
title: ["Create Link", "drawLink"],
default: true
},
"image": {
name: "image",
action: drawImage,
className: "fa fa-picture-o",
title: "Insert Image (Ctrl+Alt+I)",
title: ["Insert Image", "drawImage"],
default: true
},
"table": {
name: "table",
action: drawTable,
className: "fa fa-table",
title: "Insert Table"
title: ["Insert Table", "drawTable"]
},
"horizontal-rule": {
name: "horizontal-rule",
action: drawHorizontalRule,
className: "fa fa-minus",
title: "Insert Horizontal Line"
title: ["Insert Horizontal Line", "drawHorizontalRule"]
},
"separator-3": {
name: "separator-3"
@ -799,28 +824,28 @@ var toolbarBuiltInButtons = {
name: "preview",
action: togglePreview,
className: "fa fa-eye no-disable",
title: "Toggle Preview (Ctrl+P)",
title: ["Toggle Preview", "togglePreview"],
default: true
},
"side-by-side": {
name: "side-by-side",
action: toggleSideBySide,
className: "fa fa-columns no-disable no-mobile",
title: "Toggle Side by Side (F9)",
title: ["Toggle Side by Side", "toggleSideBySide"],
default: true
},
"fullscreen": {
name: "fullscreen",
action: toggleFullScreen,
className: "fa fa-arrows-alt no-disable no-mobile",
title: "Toggle Fullscreen (F11)",
title: ["Toggle Fullscreen", "toggleFullScreen"],
default: true
},
"guide": {
name: "guide",
action: "http://nextstepwebs.github.io/simplemde-markdown-editor/markdown-guide",
className: "fa fa-question-circle",
title: "Markdown Guide",
title: ["Markdown Guide", null],
default: true
},
"separator-4": {
@ -830,13 +855,13 @@ var toolbarBuiltInButtons = {
name: "undo",
action: undo,
className: "fa fa-undo no-disable",
title: "Undo"
title: ["Undo", "undo"]
},
"redo": {
name: "redo",
action: redo,
className: "fa fa-repeat no-disable",
title: "Redo"
title: ["Redo", "redo"]
}
};
@ -949,6 +974,10 @@ function SimpleMDE(options) {
options.blockStyles = extend({}, blockStyles, options.blockStyles || {});
// Merging the shortcuts, with the given options
options.shortcuts = extend({}, shortcuts, options.shortcuts || {});
// Change unique_id to uniqueId for backwards compatibility
if(options.autosave != undefined && options.autosave.unique_id != undefined && options.autosave.unique_id != "")
options.autosave.uniqueId = options.autosave.unique_id;
@ -1019,14 +1048,18 @@ SimpleMDE.prototype.render = function(el) {
var self = this;
var keyMaps = {};
for(var key in shortcuts) {
(function(key) {
keyMaps[fixShortcut(key)] = function() {
shortcuts[key](self);
};
})(key);
for(var key in options.shortcuts) {
// null stands for "do not bind this command"
if(options.shortcuts[key] !== null && bindings[key] !== null) {
(function(key) {
keyMaps[fixShortcut(options.shortcuts[key])] = function() {
bindings[key](self);
};
})(key);
}
}
keyMaps["Enter"] = "newlineAndIndentContinueMarkdownList";
keyMaps["Tab"] = "tabAndIndentMarkdownList";
keyMaps["Shift-Tab"] = "shiftTabAndUnindentMarkdownList";
@ -1235,7 +1268,7 @@ SimpleMDE.prototype.createToolbar = function(items) {
if(item === "|") {
el = createSep();
} else {
el = createIcon(item, self.options.toolbarTips);
el = createIcon(item, self.options.toolbarTips, self.options.shortcuts);
}
// bind events, special for info

Loading…
Cancel
Save