optimized sub class

pull/510/head
WittBulter 7 years ago
parent 12d7d93ebc
commit 2e43015094

File diff suppressed because one or more lines are too long

@ -15427,7 +15427,7 @@ var Action = function () {
*/ */
_createClass(Action, null, [{ _createClass(Action, [{
key: 'toggleBold', key: 'toggleBold',
value: function toggleBold(editor) { value: function toggleBold(editor) {
_base2.default.toggleBlock(editor, "bold", editor.options.blockStyles.bold); _base2.default.toggleBlock(editor, "bold", editor.options.blockStyles.bold);
@ -16435,42 +16435,42 @@ function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { de
})(); })();
},{"./simplemde":25}],24:[function(require,module,exports){ },{"./simplemde":25}],24:[function(require,module,exports){
"use strict"; 'use strict';
Object.defineProperty(exports, "__esModule", { Object.defineProperty(exports, "__esModule", {
value: true value: true
}); });
exports.promptTexts = exports.insertTexts = exports.blockStyles = exports.toolbarBuiltInButtons = exports.shortcuts = exports.bindings = undefined; exports.promptTexts = exports.insertTexts = exports.blockStyles = exports.toolbarBuiltInButtons = exports.shortcuts = exports.bindings = undefined;
var _action = require("./action"); var _action = require('./action');
var _action2 = _interopRequireDefault(_action); var _action2 = _interopRequireDefault(_action);
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; } function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
var bindings = exports.bindings = { var bindings = exports.bindings = {
"toggleBold": _action2.default.toggleBold, "toggleBold": 'toggleBold',
"toggleItalic": _action2.default.toggleItalic, "toggleItalic": 'toggleItalic',
"drawLink": _action2.default.drawLink, "drawLink": 'drawLink',
"toggleHeadingSmaller": _action2.default.toggleHeadingSmaller, "toggleHeadingSmaller": 'toggleHeadingSmaller',
"toggleHeadingBigger": _action2.default.toggleHeadingBigger, "toggleHeadingBigger": 'toggleHeadingBigger',
"drawImage": _action2.default.drawImage, "drawImage": 'drawImage',
"toggleBlockquote": _action2.default.toggleBlockquote, "toggleBlockquote": 'toggleBlockquote',
"toggleOrderedList": _action2.default.toggleOrderedList, "toggleOrderedList": 'toggleOrderedList',
"toggleUnorderedList": _action2.default.toggleUnorderedList, "toggleUnorderedList": 'toggleUnorderedList',
"toggleCodeBlock": _action2.default.toggleCodeBlock, "toggleCodeBlock": 'toggleCodeBlock',
"togglePreview": _action2.default.togglePreview, "togglePreview": 'togglePreview',
"toggleStrikethrough": _action2.default.toggleStrikethrough, "toggleStrikethrough": 'toggleStrikethrough',
"toggleHeading1": _action2.default.toggleHeading1, "toggleHeading1": 'toggleHeading1',
"toggleHeading2": _action2.default.toggleHeading2, "toggleHeading2": 'toggleHeading2',
"toggleHeading3": _action2.default.toggleHeading3, "toggleHeading3": 'toggleHeading3',
"cleanBlock": _action2.default.cleanBlock, "cleanBlock": 'cleanBlock',
"drawTable": _action2.default.drawTable, "drawTable": 'drawTable',
"drawHorizontalRule": _action2.default.drawHorizontalRule, "drawHorizontalRule": 'drawHorizontalRule',
"undo": _action2.default.undo, "undo": 'undo',
"redo": _action2.default.redo, "redo": 'redo',
"toggleSideBySide": _action2.default.toggleSideBySide, "toggleSideBySide": 'toggleSideBySide',
"toggleFullScreen": _action2.default.toggleFullScreen "toggleFullScreen": 'toggleFullScreen'
}; /** }; /**
* @description :: metadata, immutable * @description :: metadata, immutable
*/ */
@ -16494,58 +16494,58 @@ var shortcuts = exports.shortcuts = {
var toolbarBuiltInButtons = exports.toolbarBuiltInButtons = { var toolbarBuiltInButtons = exports.toolbarBuiltInButtons = {
"bold": { "bold": {
name: "bold", name: "bold",
action: _action2.default.toggleBold, action: 'toggleBold',
className: "fa fa-bold", className: "fa fa-bold",
title: "Bold", title: "Bold",
default: true default: true
}, },
"italic": { "italic": {
name: "italic", name: "italic",
action: _action2.default.toggleItalic, action: 'toggleItalic',
className: "fa fa-italic", className: "fa fa-italic",
title: "Italic", title: "Italic",
default: true default: true
}, },
"strikethrough": { "strikethrough": {
name: "strikethrough", name: "strikethrough",
action: _action2.default.toggleStrikethrough, action: 'toggleStrikethrough',
className: "fa fa-strikethrough", className: "fa fa-strikethrough",
title: "Strikethrough" title: "Strikethrough"
}, },
"heading": { "heading": {
name: "heading", name: "heading",
action: _action2.default.toggleHeadingSmaller, action: 'toggleHeadingSmaller',
className: "fa fa-header", className: "fa fa-header",
title: "Heading", title: "Heading",
default: true default: true
}, },
"heading-smaller": { "heading-smaller": {
name: "heading-smaller", name: "heading-smaller",
action: _action2.default.toggleHeadingSmaller, action: 'toggleHeadingSmaller',
className: "fa fa-header fa-header-x fa-header-smaller", className: "fa fa-header fa-header-x fa-header-smaller",
title: "Smaller Heading" title: "Smaller Heading"
}, },
"heading-bigger": { "heading-bigger": {
name: "heading-bigger", name: "heading-bigger",
action: _action2.default.toggleHeadingBigger, action: 'toggleHeadingBigger',
className: "fa fa-header fa-header-x fa-header-bigger", className: "fa fa-header fa-header-x fa-header-bigger",
title: "Bigger Heading" title: "Bigger Heading"
}, },
"heading-1": { "heading-1": {
name: "heading-1", name: "heading-1",
action: _action2.default.toggleHeading1, action: 'toggleHeading1',
className: "fa fa-header fa-header-x fa-header-1", className: "fa fa-header fa-header-x fa-header-1",
title: "Big Heading" title: "Big Heading"
}, },
"heading-2": { "heading-2": {
name: "heading-2", name: "heading-2",
action: _action2.default.toggleHeading2, action: 'toggleHeading2',
className: "fa fa-header fa-header-x fa-header-2", className: "fa fa-header fa-header-x fa-header-2",
title: "Medium Heading" title: "Medium Heading"
}, },
"heading-3": { "heading-3": {
name: "heading-3", name: "heading-3",
action: _action2.default.toggleHeading3, action: 'toggleHeading3',
className: "fa fa-header fa-header-x fa-header-3", className: "fa fa-header fa-header-x fa-header-3",
title: "Small Heading" title: "Small Heading"
}, },
@ -16554,34 +16554,34 @@ var toolbarBuiltInButtons = exports.toolbarBuiltInButtons = {
}, },
"code": { "code": {
name: "code", name: "code",
action: _action2.default.toggleCodeBlock, action: 'toggleCodeBlock',
className: "fa fa-code", className: "fa fa-code",
title: "Code" title: "Code"
}, },
"quote": { "quote": {
name: "quote", name: "quote",
action: _action2.default.toggleBlockquote, action: 'toggleBlockquote',
className: "fa fa-quote-left", className: "fa fa-quote-left",
title: "Quote", title: "Quote",
default: true default: true
}, },
"unordered-list": { "unordered-list": {
name: "unordered-list", name: "unordered-list",
action: _action2.default.toggleUnorderedList, action: 'toggleUnorderedList',
className: "fa fa-list-ul", className: "fa fa-list-ul",
title: "Generic List", title: "Generic List",
default: true default: true
}, },
"ordered-list": { "ordered-list": {
name: "ordered-list", name: "ordered-list",
action: _action2.default.toggleOrderedList, action: 'toggleOrderedList',
className: "fa fa-list-ol", className: "fa fa-list-ol",
title: "Numbered List", title: "Numbered List",
default: true default: true
}, },
"clean-block": { "clean-block": {
name: "clean-block", name: "clean-block",
action: _action2.default.cleanBlock, action: 'cleanBlock',
className: "fa fa-eraser fa-clean-block", className: "fa fa-eraser fa-clean-block",
title: "Clean block" title: "Clean block"
}, },
@ -16590,27 +16590,27 @@ var toolbarBuiltInButtons = exports.toolbarBuiltInButtons = {
}, },
"link": { "link": {
name: "link", name: "link",
action: _action2.default.drawLink, action: 'drawLink',
className: "fa fa-link", className: "fa fa-link",
title: "Create Link", title: "Create Link",
default: true default: true
}, },
"image": { "image": {
name: "image", name: "image",
action: _action2.default.drawImage, action: 'drawImage',
className: "fa fa-picture-o", className: "fa fa-picture-o",
title: "Insert Image", title: "Insert Image",
default: true default: true
}, },
"table": { "table": {
name: "table", name: "table",
action: _action2.default.drawTable, action: 'drawTable',
className: "fa fa-table", className: "fa fa-table",
title: "Insert Table" title: "Insert Table"
}, },
"horizontal-rule": { "horizontal-rule": {
name: "horizontal-rule", name: "horizontal-rule",
action: _action2.default.drawHorizontalRule, action: 'drawHorizontalRule',
className: "fa fa-minus", className: "fa fa-minus",
title: "Insert Horizontal Line" title: "Insert Horizontal Line"
}, },
@ -16619,21 +16619,21 @@ var toolbarBuiltInButtons = exports.toolbarBuiltInButtons = {
}, },
"preview": { "preview": {
name: "preview", name: "preview",
action: _action2.default.togglePreview, action: 'togglePreview',
className: "fa fa-eye no-disable", className: "fa fa-eye no-disable",
title: "Toggle Preview", title: "Toggle Preview",
default: true default: true
}, },
"side-by-side": { "side-by-side": {
name: "side-by-side", name: "side-by-side",
action: _action2.default.toggleSideBySide, action: 'toggleSideBySide',
className: "fa fa-columns no-disable no-mobile", className: "fa fa-columns no-disable no-mobile",
title: "Toggle Side by Side", title: "Toggle Side by Side",
default: true default: true
}, },
"fullscreen": { "fullscreen": {
name: "fullscreen", name: "fullscreen",
action: _action2.default.toggleFullScreen, action: 'toggleFullScreen',
className: "fa fa-arrows-alt no-disable no-mobile", className: "fa fa-arrows-alt no-disable no-mobile",
title: "Toggle Fullscreen", title: "Toggle Fullscreen",
default: true default: true
@ -16653,13 +16653,13 @@ var toolbarBuiltInButtons = exports.toolbarBuiltInButtons = {
}, },
"undo": { "undo": {
name: "undo", name: "undo",
action: _action2.default.undo, action: 'undo',
className: "fa fa-undo no-disable", className: "fa fa-undo no-disable",
title: "Undo" title: "Undo"
}, },
"redo": { "redo": {
name: "redo", name: "redo",
action: _action2.default.redo, action: 'redo',
className: "fa fa-repeat no-disable", className: "fa fa-repeat no-disable",
title: "Redo" title: "Redo"
} }
@ -16694,6 +16694,8 @@ var _typeof = typeof Symbol === "function" && typeof Symbol.iterator === "symbol
var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }(); var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
var _get = function get(object, property, receiver) { if (object === null) object = Function.prototype; var desc = Object.getOwnPropertyDescriptor(object, property); if (desc === undefined) { var parent = Object.getPrototypeOf(object); if (parent === null) { return undefined; } else { return get(parent, property, receiver); } } else if ("value" in desc) { return desc.value; } else { var getter = desc.get; if (getter === undefined) { return undefined; } return getter.call(receiver); } };
var _codemirror = require('codemirror'); var _codemirror = require('codemirror');
var _codemirror2 = _interopRequireDefault(_codemirror); var _codemirror2 = _interopRequireDefault(_codemirror);
@ -16931,7 +16933,7 @@ var SimpleMDE = function (_Action) {
// null stands for "do not bind this command" // null stands for "do not bind this command"
if (options.shortcuts[key] !== null && _metadata.bindings[key] !== null) { if (options.shortcuts[key] !== null && _metadata.bindings[key] !== null) {
keyMaps[_utils2.default.fixShortcut(options.shortcuts[key])] = function () { keyMaps[_utils2.default.fixShortcut(options.shortcuts[key])] = function () {
return _metadata.bindings[key](self); return _get(SimpleMDE.prototype.__proto__ || Object.getPrototypeOf(SimpleMDE.prototype), _metadata.bindings[key], _this2).call(_this2, self);
}; };
} }
}; };
@ -16944,14 +16946,14 @@ var SimpleMDE = function (_Action) {
keyMaps["Tab"] = "tabAndIndentMarkdownList"; keyMaps["Tab"] = "tabAndIndentMarkdownList";
keyMaps["Shift-Tab"] = "shiftTabAndUnindentMarkdownList"; keyMaps["Shift-Tab"] = "shiftTabAndUnindentMarkdownList";
keyMaps["Esc"] = function (cm) { keyMaps["Esc"] = function (cm) {
return cm.getOption("fullScreen") && _action2.default.toggleFullScreen(self); return cm.getOption("fullScreen") && _get(SimpleMDE.prototype.__proto__ || Object.getPrototypeOf(SimpleMDE.prototype), 'toggleFullScreen', _this2).call(_this2, self);
}; };
document.addEventListener("keydown", function () { document.addEventListener("keydown", function () {
var e = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : window.event; var e = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : window.event;
if (e.keyCode == 27) { if (e.keyCode == 27) {
if (self.codemirror.getOption("fullScreen")) _action2.default.toggleFullScreen(self); if (self.codemirror.getOption("fullScreen")) _get(SimpleMDE.prototype.__proto__ || Object.getPrototypeOf(SimpleMDE.prototype), 'toggleFullScreen', _this2).call(_this2, self);
} }
}, false); }, false);
@ -17152,43 +17154,41 @@ var SimpleMDE = function (_Action) {
return createIcon(v, _this3.options.toolbarTips, _this3.options.shortcuts); return createIcon(v, _this3.options.toolbarTips, _this3.options.shortcuts);
}; };
this.toolbar.every(function (v, i) { this.toolbar.forEach(function (v, i) {
if (nextLoop(v, i)) return false; if (nextLoop(v, i)) return;
// Create the icon and append to the toolbar // Create the icon and append to the toolbar
var el = createElement(v); var el = createElement(v);
var isCustomMethods = typeof v.action === "function";
// bind events, special for info // bind events, special for info
if (v.action) { if (v.action) {
if (typeof v.action === "function") { el.onclick = function (e) {
el.onclick = function (e) { e.preventDefault();
e.preventDefault(); isCustomMethods ? v.action(_this3) : _get(SimpleMDE.prototype.__proto__ || Object.getPrototypeOf(SimpleMDE.prototype), v.action, _this3).call(_this3, _this3);
v.action(_this3); };
};
}
if (typeof v.action === "string") {
el.href = v.action;
el.target = "_blank";
}
} }
// Link can be converted to a function
// todo
// if(typeof v.action === "string") {
// el.href = v.action;
// el.target = "_blank";
// }
toolbarData[v.name || v] = el; toolbarData[v.name || v] = el;
bar.appendChild(el); bar.appendChild(el);
return true;
}); });
this.toolbarElements = toolbarData; this.toolbarElements = toolbarData;
this.codemirror.on("cursorActivity", function () { this.codemirror.on("cursorActivity", function () {
var stat = _base2.default.getState(_this3.codemirror); var stat = _base2.default.getState(_this3.codemirror);
console.log(toolbarData, 1);
for (var key in toolbarData) { for (var key in toolbarData) {
(function (key) { var el = toolbarData[key];
var el = toolbarData[key]; if (stat[key]) {
if (stat[key]) { el.className += " active";
el.className += " active"; } else if (key != "fullscreen" && key != "side-by-side") {
} else if (key != "fullscreen" && key != "side-by-side") { el.className = el.className.replace(/\s*active\s*/g, "");
el.className = el.className.replace(/\s*active\s*/g, ""); }
}
})(key);
} }
}); });
@ -17306,122 +17306,13 @@ var SimpleMDE = function (_Action) {
return this; return this;
} }
}, { }, {
key: 'toggleBold', key: 'isPreviewActive',
/** /**
* Bind instance methods for exports. * Bind instance methods for exports.
*/ */
value: function toggleBold() {
_action2.default.toggleBold(this);
}
}, {
key: 'toggleItalic',
value: function toggleItalic() {
_action2.default.toggleItalic(this);
}
}, {
key: 'toggleStrikethrough',
value: function toggleStrikethrough() {
_action2.default.toggleStrikethrough(this);
}
}, {
key: 'toggleBlockquote',
value: function toggleBlockquote() {
_action2.default.toggleBlockquote(this);
}
}, {
key: 'toggleHeadingSmaller',
value: function toggleHeadingSmaller() {
_action2.default.toggleHeadingSmaller(this);
}
}, {
key: 'toggleHeadingBigger',
value: function toggleHeadingBigger() {
_action2.default.toggleHeadingBigger(this);
}
}, {
key: 'toggleHeading1',
value: function toggleHeading1() {
_action2.default.toggleHeading1(this);
}
}, {
key: 'toggleHeading2',
value: function toggleHeading2() {
_action2.default.toggleHeading2(this);
}
}, {
key: 'toggleHeading3',
value: function toggleHeading3() {
_action2.default.toggleHeading3(this);
}
}, {
key: 'toggleCodeBlock',
value: function toggleCodeBlock() {
_action2.default.toggleCodeBlock(this);
}
}, {
key: 'toggleUnorderedList',
value: function toggleUnorderedList() {
_action2.default.toggleUnorderedList(this);
}
}, {
key: 'toggleOrderedList',
value: function toggleOrderedList() {
_action2.default.toggleOrderedList(this);
}
}, {
key: 'cleanBlock',
value: function cleanBlock() {
_action2.default.cleanBlock(this);
}
}, {
key: 'drawLink',
value: function drawLink() {
_action2.default.drawLink(this);
}
}, {
key: 'drawImage',
value: function drawImage() {
_action2.default.drawImage(this);
}
}, {
key: 'drawTable',
value: function drawTable() {
_action2.default.drawTable(this);
}
}, {
key: 'drawHorizontalRule',
value: function drawHorizontalRule() {
_action2.default.drawHorizontalRule(this);
}
}, {
key: 'undo',
value: function undo() {
_action2.default.undo(this);
}
}, {
key: 'redo',
value: function redo() {
_action2.default.redo(this);
}
}, {
key: 'togglePreview',
value: function togglePreview() {
_action2.default.togglePreview(this);
}
}, {
key: 'toggleSideBySide',
value: function toggleSideBySide() {
_action2.default.toggleSideBySide(this);
}
}, {
key: 'toggleFullScreen',
value: function toggleFullScreen() {
_action2.default.toggleFullScreen(this);
}
}, {
key: 'isPreviewActive',
value: function isPreviewActive() { value: function isPreviewActive() {
var cm = this.codemirror; var cm = this.codemirror;
var wrapper = cm.getWrapperElement(); var wrapper = cm.getWrapperElement();

File diff suppressed because one or more lines are too long

@ -11,21 +11,21 @@ export default class Action {
/** /**
* Action for toggling bold. * Action for toggling bold.
*/ */
static toggleBold (editor){ toggleBold (editor){
base.toggleBlock(editor, "bold", editor.options.blockStyles.bold); base.toggleBlock(editor, "bold", editor.options.blockStyles.bold);
} }
/** /**
* Action for toggling italic. * Action for toggling italic.
*/ */
static toggleItalic (editor){ toggleItalic (editor){
base.toggleBlock(editor, "italic", editor.options.blockStyles.italic); base.toggleBlock(editor, "italic", editor.options.blockStyles.italic);
} }
/** /**
* Action for drawing a link. * Action for drawing a link.
*/ */
static drawLink (editor){ drawLink (editor){
const cm = editor.codemirror; const cm = editor.codemirror;
const stat = base.getState(cm); const stat = base.getState(cm);
const options = editor.options; const options = editor.options;
@ -40,7 +40,7 @@ export default class Action {
/** /**
* Action for toggling heading size: normal -> h1 -> h2 -> h3 -> h4 -> h5 -> h6 -> normal * Action for toggling heading size: normal -> h1 -> h2 -> h3 -> h4 -> h5 -> h6 -> normal
*/ */
static toggleHeadingSmaller (editor){ toggleHeadingSmaller (editor){
const cm = editor.codemirror; const cm = editor.codemirror;
base.toggleHeading(cm, "smaller"); base.toggleHeading(cm, "smaller");
} }
@ -48,7 +48,7 @@ export default class Action {
/** /**
* Action for toggling heading size: normal -> h6 -> h5 -> h4 -> h3 -> h2 -> h1 -> normal * Action for toggling heading size: normal -> h6 -> h5 -> h4 -> h3 -> h2 -> h1 -> normal
*/ */
static toggleHeadingBigger (editor){ toggleHeadingBigger (editor){
const cm = editor.codemirror; const cm = editor.codemirror;
base.toggleHeading(cm, "bigger"); base.toggleHeading(cm, "bigger");
} }
@ -56,7 +56,7 @@ export default class Action {
/** /**
* Action for drawing an img. * Action for drawing an img.
*/ */
static drawImage (editor){ drawImage (editor){
const cm = editor.codemirror; const cm = editor.codemirror;
const stat = base.getState(cm); const stat = base.getState(cm);
const options = editor.options; const options = editor.options;
@ -71,7 +71,7 @@ export default class Action {
/** /**
* Action for toggling blockquote. * Action for toggling blockquote.
*/ */
static toggleBlockquote (editor){ toggleBlockquote (editor){
const cm = editor.codemirror; const cm = editor.codemirror;
base.toggleLine(cm, "quote"); base.toggleLine(cm, "quote");
} }
@ -79,7 +79,7 @@ export default class Action {
/** /**
* Action for toggling ol. * Action for toggling ol.
*/ */
static toggleOrderedList (editor){ toggleOrderedList (editor){
const cm = editor.codemirror; const cm = editor.codemirror;
base.toggleLine(cm, "ordered-list"); base.toggleLine(cm, "ordered-list");
} }
@ -87,7 +87,7 @@ export default class Action {
/** /**
* Action for toggling ul. * Action for toggling ul.
*/ */
static toggleUnorderedList (editor){ toggleUnorderedList (editor){
const cm = editor.codemirror; const cm = editor.codemirror;
base.toggleLine(cm, "unordered-list"); base.toggleLine(cm, "unordered-list");
} }
@ -95,7 +95,7 @@ export default class Action {
/** /**
* Action for toggling code block. * Action for toggling code block.
*/ */
static toggleCodeBlock (editor){ toggleCodeBlock (editor){
let fenceCharsToInsert = editor.options.blockStyles.code; let fenceCharsToInsert = editor.options.blockStyles.code;
const fencing_line = line =>{ const fencing_line = line =>{
@ -379,7 +379,7 @@ export default class Action {
/** /**
* Toggle full screen of the editor. * Toggle full screen of the editor.
*/ */
static toggleFullScreen (editor){ toggleFullScreen (editor){
// Set fullscreen // Set fullscreen
let cm = editor.codemirror; let cm = editor.codemirror;
cm.setOption("fullScreen", !cm.getOption("fullScreen")); cm.setOption("fullScreen", !cm.getOption("fullScreen"));
@ -424,7 +424,7 @@ export default class Action {
/** /**
* Toggle side by side preview * Toggle side by side preview
*/ */
static toggleSideBySide (editor){ toggleSideBySide (editor){
let cm = editor.codemirror; let cm = editor.codemirror;
let wrapper = cm.getWrapperElement(); let wrapper = cm.getWrapperElement();
let preview = wrapper.nextSibling; let preview = wrapper.nextSibling;
@ -484,7 +484,7 @@ export default class Action {
/** /**
* Preview action. * Preview action.
*/ */
static togglePreview (editor){ togglePreview (editor){
const cm = editor.codemirror; const cm = editor.codemirror;
const wrapper = cm.getWrapperElement(); const wrapper = cm.getWrapperElement();
let toolbar_div = wrapper.previousSibling; let toolbar_div = wrapper.previousSibling;
@ -526,24 +526,24 @@ export default class Action {
/** /**
* Action for toggling strikethrough. * Action for toggling strikethrough.
*/ */
static toggleStrikethrough (editor){ toggleStrikethrough (editor){
base.toggleBlock(editor, "strikethrough", "~~"); base.toggleBlock(editor, "strikethrough", "~~");
} }
/** /**
* Action for toggling heading size 1, 2, 3 * Action for toggling heading size 1, 2, 3
*/ */
static toggleHeading1 (editor){ toggleHeading1 (editor){
const cm = editor.codemirror; const cm = editor.codemirror;
base.toggleHeading(cm, undefined, 1); base.toggleHeading(cm, undefined, 1);
} }
static toggleHeading2 (editor){ toggleHeading2 (editor){
const cm = editor.codemirror; const cm = editor.codemirror;
base.toggleHeading(cm, undefined, 2); base.toggleHeading(cm, undefined, 2);
} }
static toggleHeading3 (editor){ toggleHeading3 (editor){
const cm = editor.codemirror; const cm = editor.codemirror;
base.toggleHeading(cm, undefined, 3); base.toggleHeading(cm, undefined, 3);
} }
@ -551,7 +551,7 @@ export default class Action {
/** /**
* Action for clean block (remove headline, list, blockquote code, markers) * Action for clean block (remove headline, list, blockquote code, markers)
*/ */
static cleanBlock (editor){ cleanBlock (editor){
const cm = editor.codemirror; const cm = editor.codemirror;
base.cleanBlock(cm); base.cleanBlock(cm);
} }
@ -559,7 +559,7 @@ export default class Action {
/** /**
* Action for drawing a table. * Action for drawing a table.
*/ */
static drawTable (editor){ drawTable (editor){
const cm = editor.codemirror; const cm = editor.codemirror;
const stat = base.getState(cm); const stat = base.getState(cm);
const options = editor.options; const options = editor.options;
@ -569,7 +569,7 @@ export default class Action {
/** /**
* Action for drawing a horizontal rule. * Action for drawing a horizontal rule.
*/ */
static drawHorizontalRule (editor){ drawHorizontalRule (editor){
const cm = editor.codemirror; const cm = editor.codemirror;
const stat = base.getState(cm); const stat = base.getState(cm);
const options = editor.options; const options = editor.options;
@ -579,7 +579,7 @@ export default class Action {
/** /**
* Undo action. * Undo action.
*/ */
static undo (editor){ undo (editor){
const cm = editor.codemirror; const cm = editor.codemirror;
cm.undo(); cm.undo();
cm.focus(); cm.focus();
@ -588,7 +588,7 @@ export default class Action {
/** /**
* Redo action. * Redo action.
*/ */
static redo (editor){ redo (editor){
const cm = editor.codemirror; const cm = editor.codemirror;
cm.redo(); cm.redo();
cm.focus(); cm.focus();

@ -4,28 +4,28 @@
import Action from './action' import Action from './action'
export const bindings = { export const bindings = {
"toggleBold": Action.toggleBold, "toggleBold": 'toggleBold',
"toggleItalic": Action.toggleItalic, "toggleItalic": 'toggleItalic',
"drawLink": Action.drawLink, "drawLink": 'drawLink',
"toggleHeadingSmaller": Action.toggleHeadingSmaller, "toggleHeadingSmaller": 'toggleHeadingSmaller',
"toggleHeadingBigger": Action.toggleHeadingBigger, "toggleHeadingBigger": 'toggleHeadingBigger',
"drawImage": Action.drawImage, "drawImage": 'drawImage',
"toggleBlockquote": Action.toggleBlockquote, "toggleBlockquote": 'toggleBlockquote',
"toggleOrderedList": Action.toggleOrderedList, "toggleOrderedList": 'toggleOrderedList',
"toggleUnorderedList": Action.toggleUnorderedList, "toggleUnorderedList": 'toggleUnorderedList',
"toggleCodeBlock": Action.toggleCodeBlock, "toggleCodeBlock": 'toggleCodeBlock',
"togglePreview": Action.togglePreview, "togglePreview": 'togglePreview',
"toggleStrikethrough": Action.toggleStrikethrough, "toggleStrikethrough": 'toggleStrikethrough',
"toggleHeading1": Action.toggleHeading1, "toggleHeading1": 'toggleHeading1',
"toggleHeading2": Action.toggleHeading2, "toggleHeading2": 'toggleHeading2',
"toggleHeading3": Action.toggleHeading3, "toggleHeading3": 'toggleHeading3',
"cleanBlock": Action.cleanBlock, "cleanBlock": 'cleanBlock',
"drawTable": Action.drawTable, "drawTable": 'drawTable',
"drawHorizontalRule": Action.drawHorizontalRule, "drawHorizontalRule": 'drawHorizontalRule',
"undo": Action.undo, "undo": 'undo',
"redo": Action.redo, "redo": 'redo',
"toggleSideBySide": Action.toggleSideBySide, "toggleSideBySide": 'toggleSideBySide',
"toggleFullScreen": Action.toggleFullScreen "toggleFullScreen": 'toggleFullScreen'
}; };
export const shortcuts = { export const shortcuts = {
@ -48,58 +48,58 @@ export const shortcuts = {
export const toolbarBuiltInButtons = { export const toolbarBuiltInButtons = {
"bold": { "bold": {
name: "bold", name: "bold",
action: Action.toggleBold, action: 'toggleBold',
className: "fa fa-bold", className: "fa fa-bold",
title: "Bold", title: "Bold",
default: true default: true
}, },
"italic": { "italic": {
name: "italic", name: "italic",
action: Action.toggleItalic, action: 'toggleItalic',
className: "fa fa-italic", className: "fa fa-italic",
title: "Italic", title: "Italic",
default: true default: true
}, },
"strikethrough": { "strikethrough": {
name: "strikethrough", name: "strikethrough",
action: Action.toggleStrikethrough, action: 'toggleStrikethrough',
className: "fa fa-strikethrough", className: "fa fa-strikethrough",
title: "Strikethrough" title: "Strikethrough"
}, },
"heading": { "heading": {
name: "heading", name: "heading",
action: Action.toggleHeadingSmaller, action: 'toggleHeadingSmaller',
className: "fa fa-header", className: "fa fa-header",
title: "Heading", title: "Heading",
default: true default: true
}, },
"heading-smaller": { "heading-smaller": {
name: "heading-smaller", name: "heading-smaller",
action: Action.toggleHeadingSmaller, action: 'toggleHeadingSmaller',
className: "fa fa-header fa-header-x fa-header-smaller", className: "fa fa-header fa-header-x fa-header-smaller",
title: "Smaller Heading" title: "Smaller Heading"
}, },
"heading-bigger": { "heading-bigger": {
name: "heading-bigger", name: "heading-bigger",
action: Action.toggleHeadingBigger, action: 'toggleHeadingBigger',
className: "fa fa-header fa-header-x fa-header-bigger", className: "fa fa-header fa-header-x fa-header-bigger",
title: "Bigger Heading" title: "Bigger Heading"
}, },
"heading-1": { "heading-1": {
name: "heading-1", name: "heading-1",
action: Action.toggleHeading1, action: 'toggleHeading1',
className: "fa fa-header fa-header-x fa-header-1", className: "fa fa-header fa-header-x fa-header-1",
title: "Big Heading" title: "Big Heading"
}, },
"heading-2": { "heading-2": {
name: "heading-2", name: "heading-2",
action: Action.toggleHeading2, action: 'toggleHeading2',
className: "fa fa-header fa-header-x fa-header-2", className: "fa fa-header fa-header-x fa-header-2",
title: "Medium Heading" title: "Medium Heading"
}, },
"heading-3": { "heading-3": {
name: "heading-3", name: "heading-3",
action: Action.toggleHeading3, action: 'toggleHeading3',
className: "fa fa-header fa-header-x fa-header-3", className: "fa fa-header fa-header-x fa-header-3",
title: "Small Heading" title: "Small Heading"
}, },
@ -108,34 +108,34 @@ export const toolbarBuiltInButtons = {
}, },
"code": { "code": {
name: "code", name: "code",
action: Action.toggleCodeBlock, action: 'toggleCodeBlock',
className: "fa fa-code", className: "fa fa-code",
title: "Code" title: "Code"
}, },
"quote": { "quote": {
name: "quote", name: "quote",
action: Action.toggleBlockquote, action: 'toggleBlockquote',
className: "fa fa-quote-left", className: "fa fa-quote-left",
title: "Quote", title: "Quote",
default: true default: true
}, },
"unordered-list": { "unordered-list": {
name: "unordered-list", name: "unordered-list",
action: Action.toggleUnorderedList, action: 'toggleUnorderedList',
className: "fa fa-list-ul", className: "fa fa-list-ul",
title: "Generic List", title: "Generic List",
default: true default: true
}, },
"ordered-list": { "ordered-list": {
name: "ordered-list", name: "ordered-list",
action: Action.toggleOrderedList, action: 'toggleOrderedList',
className: "fa fa-list-ol", className: "fa fa-list-ol",
title: "Numbered List", title: "Numbered List",
default: true default: true
}, },
"clean-block": { "clean-block": {
name: "clean-block", name: "clean-block",
action: Action.cleanBlock, action: 'cleanBlock',
className: "fa fa-eraser fa-clean-block", className: "fa fa-eraser fa-clean-block",
title: "Clean block" title: "Clean block"
}, },
@ -144,27 +144,27 @@ export const toolbarBuiltInButtons = {
}, },
"link": { "link": {
name: "link", name: "link",
action: Action.drawLink, action: 'drawLink',
className: "fa fa-link", className: "fa fa-link",
title: "Create Link", title: "Create Link",
default: true default: true
}, },
"image": { "image": {
name: "image", name: "image",
action: Action.drawImage, action: 'drawImage',
className: "fa fa-picture-o", className: "fa fa-picture-o",
title: "Insert Image", title: "Insert Image",
default: true default: true
}, },
"table": { "table": {
name: "table", name: "table",
action: Action.drawTable, action: 'drawTable',
className: "fa fa-table", className: "fa fa-table",
title: "Insert Table" title: "Insert Table"
}, },
"horizontal-rule": { "horizontal-rule": {
name: "horizontal-rule", name: "horizontal-rule",
action: Action.drawHorizontalRule, action: 'drawHorizontalRule',
className: "fa fa-minus", className: "fa fa-minus",
title: "Insert Horizontal Line" title: "Insert Horizontal Line"
}, },
@ -173,21 +173,21 @@ export const toolbarBuiltInButtons = {
}, },
"preview": { "preview": {
name: "preview", name: "preview",
action: Action.togglePreview, action: 'togglePreview',
className: "fa fa-eye no-disable", className: "fa fa-eye no-disable",
title: "Toggle Preview", title: "Toggle Preview",
default: true default: true
}, },
"side-by-side": { "side-by-side": {
name: "side-by-side", name: "side-by-side",
action: Action.toggleSideBySide, action: 'toggleSideBySide',
className: "fa fa-columns no-disable no-mobile", className: "fa fa-columns no-disable no-mobile",
title: "Toggle Side by Side", title: "Toggle Side by Side",
default: true default: true
}, },
"fullscreen": { "fullscreen": {
name: "fullscreen", name: "fullscreen",
action: Action.toggleFullScreen, action: 'toggleFullScreen',
className: "fa fa-arrows-alt no-disable no-mobile", className: "fa fa-arrows-alt no-disable no-mobile",
title: "Toggle Fullscreen", title: "Toggle Fullscreen",
default: true default: true
@ -207,13 +207,13 @@ export const toolbarBuiltInButtons = {
}, },
"undo": { "undo": {
name: "undo", name: "undo",
action: Action.undo, action: 'undo',
className: "fa fa-undo no-disable", className: "fa fa-undo no-disable",
title: "Undo" title: "Undo"
}, },
"redo": { "redo": {
name: "redo", name: "redo",
action: Action.redo, action: 'redo',
className: "fa fa-repeat no-disable", className: "fa fa-repeat no-disable",
title: "Redo" title: "Redo"
} }

@ -179,18 +179,18 @@ class SimpleMDE extends Action {
for(const key in options.shortcuts) { for(const key in options.shortcuts) {
// null stands for "do not bind this command" // null stands for "do not bind this command"
if(options.shortcuts[key] !== null && bindings[key] !== null) { if(options.shortcuts[key] !== null && bindings[key] !== null) {
keyMaps[utils.fixShortcut(options.shortcuts[key])] = () => bindings[key](self); keyMaps[utils.fixShortcut(options.shortcuts[key])] = () => super[bindings[key]](self);
} }
} }
keyMaps["Enter"] = "newlineAndIndentContinueMarkdownList"; keyMaps["Enter"] = "newlineAndIndentContinueMarkdownList";
keyMaps["Tab"] = "tabAndIndentMarkdownList"; keyMaps["Tab"] = "tabAndIndentMarkdownList";
keyMaps["Shift-Tab"] = "shiftTabAndUnindentMarkdownList"; keyMaps["Shift-Tab"] = "shiftTabAndUnindentMarkdownList";
keyMaps["Esc"] = cm => cm.getOption("fullScreen") && Action.toggleFullScreen(self); keyMaps["Esc"] = cm => cm.getOption("fullScreen") && super.toggleFullScreen(self);
document.addEventListener("keydown", (e = window.event) => { document.addEventListener("keydown", (e = window.event) => {
if(e.keyCode == 27) { if(e.keyCode == 27) {
if(self.codemirror.getOption("fullScreen")) Action.toggleFullScreen(self); if(self.codemirror.getOption("fullScreen")) super.toggleFullScreen(self);
} }
}, false); }, false);
@ -377,43 +377,40 @@ class SimpleMDE extends Action {
return createIcon(v, this.options.toolbarTips, this.options.shortcuts) return createIcon(v, this.options.toolbarTips, this.options.shortcuts)
} }
this.toolbar.every((v, i) => { this.toolbar.forEach((v, i) => {
if(nextLoop(v, i)) return false; if(nextLoop(v, i)) return;
// Create the icon and append to the toolbar // Create the icon and append to the toolbar
let el = createElement(v) const el = createElement(v)
const isCustomMethods = typeof v.action === "function"
// bind events, special for info // bind events, special for info
if(v.action) { if(v.action) {
if(typeof v.action === "function") { el.onclick = e => {
el.onclick = e => { e.preventDefault();
e.preventDefault(); isCustomMethods ? v.action(this) : super[v.action](this)
v.action(this); };
};
}
if(typeof v.action === "string") {
el.href = v.action;
el.target = "_blank";
}
} }
// Link can be converted to a function
// todo
// if(typeof v.action === "string") {
// el.href = v.action;
// el.target = "_blank";
// }
toolbarData[v.name || v] = el; toolbarData[v.name || v] = el;
bar.appendChild(el); bar.appendChild(el);
return true;
}) })
this.toolbarElements = toolbarData; this.toolbarElements = toolbarData;
this.codemirror.on("cursorActivity", () => { this.codemirror.on("cursorActivity", () => {
let stat = base.getState(this.codemirror); const stat = base.getState(this.codemirror);
for(const key in toolbarData) { for(const key in toolbarData) {
(function(key) { let el = toolbarData[key];
let el = toolbarData[key]; if(stat[key]) {
if(stat[key]) { el.className += " active";
el.className += " active"; } else if(key != "fullscreen" && key != "side-by-side") {
} else if(key != "fullscreen" && key != "side-by-side") { el.className = el.className.replace(/\s*active\s*/g, "");
el.className = el.className.replace(/\s*active\s*/g, ""); }
}
})(key);
} }
}); });
@ -513,73 +510,7 @@ class SimpleMDE extends Action {
/** /**
* Bind instance methods for exports. * Bind instance methods for exports.
*/ */
toggleBold() {
Action.toggleBold(this);
};
toggleItalic() {
Action.toggleItalic(this);
};
toggleStrikethrough() {
Action.toggleStrikethrough(this);
};
toggleBlockquote() {
Action.toggleBlockquote(this);
};
toggleHeadingSmaller() {
Action.toggleHeadingSmaller(this);
};
toggleHeadingBigger() {
Action.toggleHeadingBigger(this);
};
toggleHeading1() {
Action.toggleHeading1(this);
};
toggleHeading2() {
Action.toggleHeading2(this);
};
toggleHeading3() {
Action.toggleHeading3(this);
};
toggleCodeBlock() {
Action.toggleCodeBlock(this);
};
toggleUnorderedList() {
Action.toggleUnorderedList(this);
};
toggleOrderedList() {
Action.toggleOrderedList(this);
};
cleanBlock() {
Action.cleanBlock(this);
};
drawLink() {
Action.drawLink(this);
};
drawImage() {
Action.drawImage(this);
};
drawTable() {
Action.drawTable(this);
};
drawHorizontalRule() {
Action.drawHorizontalRule(this);
};
undo() {
Action.undo(this);
};
redo() {
Action.redo(this);
};
togglePreview() {
Action.togglePreview(this);
};
toggleSideBySide() {
Action.toggleSideBySide(this);
};
toggleFullScreen() {
Action.toggleFullScreen(this);
};
isPreviewActive() { isPreviewActive() {
const cm = this.codemirror; const cm = this.codemirror;

Loading…
Cancel
Save