Netsyms
/
simplemde-markdown-editor
mirror of https://github.com/sparksuite/simplemde-markdown-editor.git
2
0
Fork 0
Code Issues Releases Wiki Activity

Add option to specify icons set, font-awesome or material (others can be added)

Browse Source
pull/743/head
Nathanaël Jourdane 5 years ago
parent e32fe3f91c
commit 55dfe2faf8
1 changed files with 177 additions and 30 deletions
Show Stats Download Patch File Download Diff File

207
src/js/simplemde.js
Unescape Escape View File

@ -94,7 +94,7 @@ function fixShortcut(name) {
/**
* Create icon element for toolbar.
*/
function createIcon(options, enableTooltips, shortcuts) {
function createIcon(options, enableTooltips, shortcuts, iconsSet) {
options = options || {};
var el = document.createElement("button");
enableTooltips = (enableTooltips == undefined) ? true : enableTooltips;
@ -109,7 +109,10 @@ function createIcon(options, enableTooltips, shortcuts) {
}
el.tabIndex = -1;
el.className = options.className;
el.className = options.className[iconsSet || "fa"];
if(options.textContent) {
el.textContent = options.textContent[iconsSet || "fa"];
}
return el;
}
@ -211,7 +214,7 @@ function toggleFullScreen(editor) {
// Update toolbar button
if (editor.toolbarElements.fullscreen) {
if(editor.toolbarElements.fullscreen) {
var toolbarButton = editor.toolbarElements.fullscreen;
if(!/active/.test(toolbarButton.className)) {
@ -1105,58 +1108,112 @@ var toolbarBuiltInButtons = {
"bold": {
name: "bold",
action: toggleBold,
className: "fa fa-bold",
className: {
fa: "fa fa-bold",
material: "material-icons"
},
textContent: {
material: "format_bold"
},
title: "Bold",
default: true
},
"italic": {
name: "italic",
action: toggleItalic,
className: "fa fa-italic",
className: {
fa: "fa fa-italic",
material: "material-icons"
},
textContent: {
material: "format_italic"
},
title: "Italic",
default: true
},
"strikethrough": {
name: "strikethrough",
action: toggleStrikethrough,
className: "fa fa-strikethrough",
className: {
fa: "fa fa-strikethrough",
material: "material-icons"
},
textContent: {
material: "format_strikethrough"
},
title: "Strikethrough"
},
"heading": {
name: "heading",
action: toggleHeadingSmaller,
className: "fa fa-header",
className: {
fa: "fa fa-header",
material: "material-icons"
},
textContent: {
material: "title"
},
title: "Heading",
default: true
},
"heading-smaller": {
name: "heading-smaller",
action: toggleHeadingSmaller,
className: "fa fa-header fa-header-x fa-header-smaller",
className: {
fa: "fa fa-header fa-header-x fa-header-smaller",
material: "material-icons md-18"
},
textContent: {
material: "title"
},
title: "Smaller Heading"
},
"heading-bigger": {
name: "heading-bigger",
action: toggleHeadingBigger,
className: "fa fa-header fa-header-x fa-header-bigger",
className: {
fa: "fa fa-header fa-header-x fa-header-bigger",
material: "material-icons md-36"
},
textContent: {
material: "title"
},
title: "Bigger Heading"
},
"heading-1": {
name: "heading-1",
action: toggleHeading1,
className: "fa fa-header fa-header-x fa-header-1",
className: {
fa: "fa fa-header fa-header-x fa-header-1",
material: "material-icons md-18"
},
textContent: {
material: "title"
},
title: "Big Heading"
},
"heading-2": {
name: "heading-2",
action: toggleHeading2,
className: "fa fa-header fa-header-x fa-header-2",
className: {
fa: "fa fa-header fa-header-x fa-header-2",
material: "material-icons md-24"
},
textContent: {
material: "title"
},
title: "Medium Heading"
},
"heading-3": {
name: "heading-3",
action: toggleHeading3,
className: "fa fa-header fa-header-x fa-header-3",
className: {
fa: "fa fa-header fa-header-x fa-header-3",
material: "material-icons md-36"
},
textContent: {
material: "title"
},
title: "Small Heading"
},
"separator-1": {
@ -1165,34 +1222,64 @@ var toolbarBuiltInButtons = {
"code": {
name: "code",
action: toggleCodeBlock,
className: "fa fa-code",
className: {
fa: "fa fa-code",
material: "material-icons"
},
textContent: {
material: "code"
},
title: "Code"
},
"quote": {
name: "quote",
action: toggleBlockquote,
className: "fa fa-quote-left",
className: {
fa: "fa fa-quote-left",
material: "material-icons"
},
textContent: {
material: "format_quote"
},
title: "Quote",
default: true
},
"unordered-list": {
name: "unordered-list",
action: toggleUnorderedList,
className: "fa fa-list-ul",
className: {
fa: "fa fa-list-ul",
material: "material-icons"
},
textContent: {
material: "format_list_bulleted"
},
title: "Generic List",
default: true
},
"ordered-list": {
name: "ordered-list",
action: toggleOrderedList,
className: "fa fa-list-ol",
className: {
fa: "fa fa-list-ol",
material: "material-icons"
},
textContent: {
material: "format_list_numbered"
},
title: "Numbered List",
default: true
},
"clean-block": {
name: "clean-block",
action: cleanBlock,
className: "fa fa-eraser fa-clean-block",
className: {
fa: "fa fa-eraser fa-clean-block",
material: "material-icons"
},
textContent: {
material: "backspace"
},
title: "Clean block"
},
"separator-2": {
@ -1201,27 +1288,51 @@ var toolbarBuiltInButtons = {
"link": {
name: "link",
action: drawLink,
className: "fa fa-link",
className: {
fa: "fa fa-link",
material: "material-icons"
},
textContent: {
material: "insert_link"
},
title: "Create Link",
default: true
},
"image": {
name: "image",
action: drawImage,
className: "fa fa-picture-o",
className: {
fa: "fa fa-picture-o",
material: "material-icons"
},
textContent: {
material: "insert_photo"
},
title: "Insert Image",
default: true
},
"table": {
name: "table",
action: drawTable,
className: "fa fa-table",
className: {
fa: "fa fa-table",
material: "material-icons"
},
textContent: {
material: "table_chart"
},
title: "Insert Table"
},
"horizontal-rule": {
name: "horizontal-rule",
action: drawHorizontalRule,
className: "fa fa-minus",
className: {
fa: "fa fa-minus",
material: "material-icons"
},
textContent: {
material: "power_input"
},
title: "Insert Horizontal Line"
},
"separator-3": {
@ -1230,21 +1341,39 @@ var toolbarBuiltInButtons = {
"preview": {
name: "preview",
action: togglePreview,
className: "fa fa-eye no-disable",
className: {
fa: "fa fa-eye no-disable",
material: "material-icons"
},
textContent: {
material: "remove_red_eye"
},
title: "Toggle Preview",
default: true
},
"side-by-side": {
name: "side-by-side",
action: toggleSideBySide,
className: "fa fa-columns no-disable no-mobile",
className: {
fa: "fa fa-columns no-disable no-mobile",
material: "material-icons no-disable no-mobile"
},
textContent: {
material: "vertical_split"
},
title: "Toggle Side by Side",
default: true
},
"fullscreen": {
name: "fullscreen",
action: toggleFullScreen,
className: "fa fa-arrows-alt no-disable no-mobile",
className: {
fa: "fa fa-arrows-alt no-disable no-mobile",
material: "material-icons no-disable no-mobile"
},
textContent: {
material: "fullscreen"
},
title: "Toggle Fullscreen",
default: true
},
@ -1254,7 +1383,13 @@ var toolbarBuiltInButtons = {
"guide": {
name: "guide",
action: "https://simplemde.com/markdown-guide",
className: "fa fa-question-circle",
className: {
fa: "fa fa-question-circle",
material: "material-icons"
},
textContent: {
material: "help"
},
title: "Markdown Guide",
default: true
},
@ -1264,13 +1399,25 @@ var toolbarBuiltInButtons = {
"undo": {
name: "undo",
action: undo,
className: "fa fa-undo no-disable",
className: {
fa: "fa fa-undo no-disable",
material: "material-icons no-disable"
},
textContent: {
material: "undo"
},
title: "Undo"
},
"redo": {
name: "redo",
action: redo,
className: "fa fa-repeat no-disable",
className: {
fa: "fa fa-repeat no-disable",
material: "material-icons no-disable"
},
textContent: {
material: "redo"
},
title: "Redo"
}
};
@ -1582,7 +1729,7 @@ function isLocalStorageAvailable() {
try {
localStorage.setItem("smde_localStorage", 1);
localStorage.removeItem("smde_localStorage");
} catch(e) {
} catch (e) {
return false;
}
} else {
@ -1755,7 +1902,7 @@ SimpleMDE.prototype.createToolbar = function(items) {
if(item === "|") {
el = createSep();
} else {
el = createIcon(item, self.options.toolbarTips, self.options.shortcuts);
el = createIcon(item, self.options.toolbarTips, self.options.shortcuts, self.options.iconsSet);
}
// bind events, special for info
@ -2082,4 +2229,4 @@ SimpleMDE.prototype.toTextArea = function() {
}
};
module.exports = SimpleMDE;
module.exports = SimpleMDE;
Write Preview
Loading…
Cancel
Save