From 9d74ea296c72e96c2805264e5d50ac6299d35dba Mon Sep 17 00:00:00 2001 From: Jonathan Date: Wed, 18 May 2022 19:39:39 +0200 Subject: [PATCH 1/5] Refactor into using a map for icon classes --- src/js/easymde.js | 78 ++++++++++++++++++++++++++++++++--------------- 1 file changed, 53 insertions(+), 25 deletions(-) diff --git a/src/js/easymde.js b/src/js/easymde.js index b380f90..204b198 100644 --- a/src/js/easymde.js +++ b/src/js/easymde.js @@ -1439,62 +1439,90 @@ function wordCount(data) { return count; } +var iconClassMap = { + toggleBold: 'fa fa-bold', + toggleItalic: 'fa fa-italic', + toggleStrikethrough: 'fa fa-strikethrough', + toggleHeading: 'fa fa-header fa-heading', + toggleHeadingSmaller: 'fa fa-header fa-heading header-smaller', + toggleHeadingBigger: 'fa fa-header fa-heading header-bigger', + toggleHeading1: 'fa fa-header fa-heading header-1', + toggleHeading2: 'fa fa-header fa-heading header-2', + toggleHeading3: 'fa fa-header fa-heading header-3', + toggleCodeBlock: 'fa fa-code', + toggleBlockquote: 'fa fa-quote-left', + toggleOrderedList: 'fa fa-list-ol', + toggleUnorderedList: 'fa fa-list-ul', + cleanBlock: 'fa fa-eraser', + drawLink: 'fa fa-link', + drawImage: 'fa fa-image', + drawUploadedImage: 'fa fa-image', + drawTable: 'fa fa-table', + drawHorizontalRule: 'fa fa-minus', + togglePreview: 'fa fa-eye', + toggleSideBySide: 'fa fa-columns', + toggleFullScreen: 'fa fa-arrows-alt', + guide: 'fa fa-question-circle', + undo: 'fa fa-undo', + redo: 'fa fa-repeat fa-redo' +}; + var toolbarBuiltInButtons = { 'bold': { name: 'bold', action: toggleBold, - className: 'fa fa-bold', + className: iconClassMap.toggleBold, title: 'Bold', default: true, }, 'italic': { name: 'italic', action: toggleItalic, - className: 'fa fa-italic', + className: iconClassMap.toggleItalic, title: 'Italic', default: true, }, 'strikethrough': { name: 'strikethrough', action: toggleStrikethrough, - className: 'fa fa-strikethrough', + className: iconClassMap.toggleStrikethrough, title: 'Strikethrough', }, 'heading': { name: 'heading', action: toggleHeadingSmaller, - className: 'fa fa-header fa-heading', + className: iconClassMap.toggleHeading, title: 'Heading', default: true, }, 'heading-smaller': { name: 'heading-smaller', action: toggleHeadingSmaller, - className: 'fa fa-header fa-heading header-smaller', + className: iconClassMap.toggleHeadingSmaller, title: 'Smaller Heading', }, 'heading-bigger': { name: 'heading-bigger', action: toggleHeadingBigger, - className: 'fa fa-header fa-heading header-bigger', + className: iconClassMap.toggleHeadingBigger, title: 'Bigger Heading', }, 'heading-1': { name: 'heading-1', action: toggleHeading1, - className: 'fa fa-header fa-heading header-1', + className: iconClassMap.toggleHeading1, title: 'Big Heading', }, 'heading-2': { name: 'heading-2', action: toggleHeading2, - className: 'fa fa-header fa-heading header-2', + className: iconClassMap.toggleHeading2, title: 'Medium Heading', }, 'heading-3': { name: 'heading-3', action: toggleHeading3, - className: 'fa fa-header fa-heading header-3', + className: iconClassMap.toggleHeading3, title: 'Small Heading', }, 'separator-1': { @@ -1503,34 +1531,34 @@ var toolbarBuiltInButtons = { 'code': { name: 'code', action: toggleCodeBlock, - className: 'fa fa-code', + className: iconClassMap.toggleCodeBlock, title: 'Code', }, 'quote': { name: 'quote', action: toggleBlockquote, - className: 'fa fa-quote-left', + className: iconClassMap.toggleBlockquote, title: 'Quote', default: true, }, 'unordered-list': { name: 'unordered-list', action: toggleUnorderedList, - className: 'fa fa-list-ul', + className: iconClassMap.toggleUnorderedList, title: 'Generic List', default: true, }, 'ordered-list': { name: 'ordered-list', action: toggleOrderedList, - className: 'fa fa-list-ol', + className: iconClassMap.toggleOrderedList, title: 'Numbered List', default: true, }, 'clean-block': { name: 'clean-block', action: cleanBlock, - className: 'fa fa-eraser', + className: iconClassMap.cleanBlock, title: 'Clean block', }, 'separator-2': { @@ -1539,33 +1567,33 @@ var toolbarBuiltInButtons = { 'link': { name: 'link', action: drawLink, - className: 'fa fa-link', + className: iconClassMap.drawLink, title: 'Create Link', default: true, }, 'image': { name: 'image', action: drawImage, - className: 'fa fa-image', + className: iconClassMap.drawImage, title: 'Insert Image', default: true, }, 'upload-image': { name: 'upload-image', action: drawUploadedImage, - className: 'fa fa-image', + className: iconClassMap.drawUploadedImage, title: 'Import an image', }, 'table': { name: 'table', action: drawTable, - className: 'fa fa-table', + className: iconClassMap.drawTable, title: 'Insert Table', }, 'horizontal-rule': { name: 'horizontal-rule', action: drawHorizontalRule, - className: 'fa fa-minus', + className: iconClassMap.drawHorizontalRule, title: 'Insert Horizontal Line', }, 'separator-3': { @@ -1574,7 +1602,7 @@ var toolbarBuiltInButtons = { 'preview': { name: 'preview', action: togglePreview, - className: 'fa fa-eye', + className: iconClassMap.togglePreview, noDisable: true, title: 'Toggle Preview', default: true, @@ -1582,7 +1610,7 @@ var toolbarBuiltInButtons = { 'side-by-side': { name: 'side-by-side', action: toggleSideBySide, - className: 'fa fa-columns', + className: iconClassMap.toggleSideBySide, noDisable: true, noMobile: true, title: 'Toggle Side by Side', @@ -1591,7 +1619,7 @@ var toolbarBuiltInButtons = { 'fullscreen': { name: 'fullscreen', action: toggleFullScreen, - className: 'fa fa-arrows-alt', + className: iconClassMap.toggleFullScreen, noDisable: true, noMobile: true, title: 'Toggle Fullscreen', @@ -1603,7 +1631,7 @@ var toolbarBuiltInButtons = { 'guide': { name: 'guide', action: 'https://www.markdownguide.org/basic-syntax/', - className: 'fa fa-question-circle', + className: iconClassMap.guide, noDisable: true, title: 'Markdown Guide', default: true, @@ -1614,14 +1642,14 @@ var toolbarBuiltInButtons = { 'undo': { name: 'undo', action: undo, - className: 'fa fa-undo', + className: iconClassMap.undo, noDisable: true, title: 'Undo', }, 'redo': { name: 'redo', action: redo, - className: 'fa fa-repeat fa-redo', + className: iconClassMap.redo, noDisable: true, title: 'Redo', }, From 21fda66d3d3b7ead7d439b899ffa8846e5a146fe Mon Sep 17 00:00:00 2001 From: Jonathan Date: Wed, 18 May 2022 19:45:35 +0200 Subject: [PATCH 2/5] Update easymde.js --- src/js/easymde.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/js/easymde.js b/src/js/easymde.js index 204b198..1f4ff7e 100644 --- a/src/js/easymde.js +++ b/src/js/easymde.js @@ -1464,7 +1464,7 @@ var iconClassMap = { toggleFullScreen: 'fa fa-arrows-alt', guide: 'fa fa-question-circle', undo: 'fa fa-undo', - redo: 'fa fa-repeat fa-redo' + redo: 'fa fa-repeat fa-redo', }; var toolbarBuiltInButtons = { From 0eab3e11e8d2f70da1276e11a6b716340141ffc1 Mon Sep 17 00:00:00 2001 From: Jonathan Date: Sun, 22 May 2022 20:43:55 +0200 Subject: [PATCH 3/5] Update easymde.js --- src/js/easymde.js | 1 + 1 file changed, 1 insertion(+) diff --git a/src/js/easymde.js b/src/js/easymde.js index 1f4ff7e..d4e1d18 100644 --- a/src/js/easymde.js +++ b/src/js/easymde.js @@ -1822,6 +1822,7 @@ function EasyMDE(options) { options.autosave.timeFormat = extend({}, timeFormat, options.autosave.timeFormat || {}); } + options.iconClassMap = extend({}, iconClassMap, options.iconClassMap || {}); // Merging the shortcuts, with the given options options.shortcuts = extend({}, shortcuts, options.shortcuts || {}); From fc839e8dc80583f3f02147ba04573d60c16ae936 Mon Sep 17 00:00:00 2001 From: Jonathan Date: Sun, 22 May 2022 21:17:59 +0200 Subject: [PATCH 4/5] Update README.md --- README.md | 1 + 1 file changed, 1 insertion(+) diff --git a/README.md b/README.md index e50c377..a43c5ef 100644 --- a/README.md +++ b/README.md @@ -159,6 +159,7 @@ easyMDE.value('New input for **EasyMDE**'); - **promptTexts**: Customize the text used to prompt for URLs. - **image**: The text to use when prompting for an image's URL. Defaults to `URL of the image:`. - **link**: The text to use when prompting for a link's URL. Defaults to `URL for the link:`. +- **iconClassMap**: Used to specify the icon class names for the various toolbar buttons. - **uploadImage**: If set to `true`, enables the image upload functionality, which can be triggered by drag and drop, copy-paste and through the browse-file window (opened when the user click on the *upload-image* icon). Defaults to `false`. - **imageMaxSize**: Maximum image size in bytes, checked before upload (note: never trust client, always check the image size at server-side). Defaults to `1024 * 1024 * 2` (2 MB). - **imageAccept**: A comma-separated list of mime-types used to check image type before upload (note: never trust client, always check file types at server-side). Defaults to `image/png, image/jpeg`. From 78fcda535d9f59caddb6fdcf6f3a17f0a111f90c Mon Sep 17 00:00:00 2001 From: Jonathan Date: Thu, 16 Jun 2022 14:09:13 +0200 Subject: [PATCH 5/5] Update easymde.js --- src/js/easymde.js | 100 +++++++++++++++++++++++----------------------- 1 file changed, 50 insertions(+), 50 deletions(-) diff --git a/src/js/easymde.js b/src/js/easymde.js index d4e1d18..8dfc083 100644 --- a/src/js/easymde.js +++ b/src/js/easymde.js @@ -1440,89 +1440,89 @@ function wordCount(data) { } var iconClassMap = { - toggleBold: 'fa fa-bold', - toggleItalic: 'fa fa-italic', - toggleStrikethrough: 'fa fa-strikethrough', - toggleHeading: 'fa fa-header fa-heading', - toggleHeadingSmaller: 'fa fa-header fa-heading header-smaller', - toggleHeadingBigger: 'fa fa-header fa-heading header-bigger', - toggleHeading1: 'fa fa-header fa-heading header-1', - toggleHeading2: 'fa fa-header fa-heading header-2', - toggleHeading3: 'fa fa-header fa-heading header-3', - toggleCodeBlock: 'fa fa-code', - toggleBlockquote: 'fa fa-quote-left', - toggleOrderedList: 'fa fa-list-ol', - toggleUnorderedList: 'fa fa-list-ul', - cleanBlock: 'fa fa-eraser', - drawLink: 'fa fa-link', - drawImage: 'fa fa-image', - drawUploadedImage: 'fa fa-image', - drawTable: 'fa fa-table', - drawHorizontalRule: 'fa fa-minus', - togglePreview: 'fa fa-eye', - toggleSideBySide: 'fa fa-columns', - toggleFullScreen: 'fa fa-arrows-alt', - guide: 'fa fa-question-circle', - undo: 'fa fa-undo', - redo: 'fa fa-repeat fa-redo', + 'bold': 'fa fa-bold', + 'italic': 'fa fa-italic', + 'strikethrough': 'fa fa-strikethrough', + 'heading': 'fa fa-header fa-heading', + 'heading-smaller': 'fa fa-header fa-heading header-smaller', + 'heading-bigger': 'fa fa-header fa-heading header-bigger', + 'heading-1': 'fa fa-header fa-heading header-1', + 'heading-2': 'fa fa-header fa-heading header-2', + 'heading-3': 'fa fa-header fa-heading header-3', + 'code': 'fa fa-code', + 'quote': 'fa fa-quote-left', + 'ordered-list': 'fa fa-list-ol', + 'unordered-list': 'fa fa-list-ul', + 'clean-block': 'fa fa-eraser', + 'link': 'fa fa-link', + 'image': 'fa fa-image', + 'upload-image': 'fa fa-image', + 'table': 'fa fa-table', + 'horizontal-rule': 'fa fa-minus', + 'preview': 'fa fa-eye', + 'side-by-side': 'fa fa-columns', + 'fullscreen': 'fa fa-arrows-alt', + 'guide': 'fa fa-question-circle', + 'undo': 'fa fa-undo', + 'redo': 'fa fa-repeat fa-redo', }; var toolbarBuiltInButtons = { 'bold': { name: 'bold', action: toggleBold, - className: iconClassMap.toggleBold, + className: iconClassMap['bold'], title: 'Bold', default: true, }, 'italic': { name: 'italic', action: toggleItalic, - className: iconClassMap.toggleItalic, + className: iconClassMap['italic'], title: 'Italic', default: true, }, 'strikethrough': { name: 'strikethrough', action: toggleStrikethrough, - className: iconClassMap.toggleStrikethrough, + className: iconClassMap['strikethrough'], title: 'Strikethrough', }, 'heading': { name: 'heading', action: toggleHeadingSmaller, - className: iconClassMap.toggleHeading, + className: iconClassMap['heading'], title: 'Heading', default: true, }, 'heading-smaller': { name: 'heading-smaller', action: toggleHeadingSmaller, - className: iconClassMap.toggleHeadingSmaller, + className: iconClassMap['heading-smaller'], title: 'Smaller Heading', }, 'heading-bigger': { name: 'heading-bigger', action: toggleHeadingBigger, - className: iconClassMap.toggleHeadingBigger, + className: iconClassMap['heading-bigger'], title: 'Bigger Heading', }, 'heading-1': { name: 'heading-1', action: toggleHeading1, - className: iconClassMap.toggleHeading1, + className: iconClassMap['heading-1'], title: 'Big Heading', }, 'heading-2': { name: 'heading-2', action: toggleHeading2, - className: iconClassMap.toggleHeading2, + className: iconClassMap['heading-2'], title: 'Medium Heading', }, 'heading-3': { name: 'heading-3', action: toggleHeading3, - className: iconClassMap.toggleHeading3, + className: iconClassMap['heading-3'], title: 'Small Heading', }, 'separator-1': { @@ -1531,34 +1531,34 @@ var toolbarBuiltInButtons = { 'code': { name: 'code', action: toggleCodeBlock, - className: iconClassMap.toggleCodeBlock, + className: iconClassMap['code'], title: 'Code', }, 'quote': { name: 'quote', action: toggleBlockquote, - className: iconClassMap.toggleBlockquote, + className: iconClassMap['quote'], title: 'Quote', default: true, }, 'unordered-list': { name: 'unordered-list', action: toggleUnorderedList, - className: iconClassMap.toggleUnorderedList, + className: iconClassMap['ordered-list'], title: 'Generic List', default: true, }, 'ordered-list': { name: 'ordered-list', action: toggleOrderedList, - className: iconClassMap.toggleOrderedList, + className: iconClassMap['unordered-list'], title: 'Numbered List', default: true, }, 'clean-block': { name: 'clean-block', action: cleanBlock, - className: iconClassMap.cleanBlock, + className: iconClassMap['clean-block'], title: 'Clean block', }, 'separator-2': { @@ -1567,33 +1567,33 @@ var toolbarBuiltInButtons = { 'link': { name: 'link', action: drawLink, - className: iconClassMap.drawLink, + className: iconClassMap['link'], title: 'Create Link', default: true, }, 'image': { name: 'image', action: drawImage, - className: iconClassMap.drawImage, + className: iconClassMap['image'], title: 'Insert Image', default: true, }, 'upload-image': { name: 'upload-image', action: drawUploadedImage, - className: iconClassMap.drawUploadedImage, + className: iconClassMap['upload-image'], title: 'Import an image', }, 'table': { name: 'table', action: drawTable, - className: iconClassMap.drawTable, + className: iconClassMap['table'], title: 'Insert Table', }, 'horizontal-rule': { name: 'horizontal-rule', action: drawHorizontalRule, - className: iconClassMap.drawHorizontalRule, + className: iconClassMap['horizontal-rule'], title: 'Insert Horizontal Line', }, 'separator-3': { @@ -1602,7 +1602,7 @@ var toolbarBuiltInButtons = { 'preview': { name: 'preview', action: togglePreview, - className: iconClassMap.togglePreview, + className: iconClassMap['preview'], noDisable: true, title: 'Toggle Preview', default: true, @@ -1610,7 +1610,7 @@ var toolbarBuiltInButtons = { 'side-by-side': { name: 'side-by-side', action: toggleSideBySide, - className: iconClassMap.toggleSideBySide, + className: iconClassMap['side-by-side'], noDisable: true, noMobile: true, title: 'Toggle Side by Side', @@ -1619,7 +1619,7 @@ var toolbarBuiltInButtons = { 'fullscreen': { name: 'fullscreen', action: toggleFullScreen, - className: iconClassMap.toggleFullScreen, + className: iconClassMap['fullscreen'], noDisable: true, noMobile: true, title: 'Toggle Fullscreen', @@ -1631,7 +1631,7 @@ var toolbarBuiltInButtons = { 'guide': { name: 'guide', action: 'https://www.markdownguide.org/basic-syntax/', - className: iconClassMap.guide, + className: iconClassMap['guide'], noDisable: true, title: 'Markdown Guide', default: true, @@ -1642,14 +1642,14 @@ var toolbarBuiltInButtons = { 'undo': { name: 'undo', action: undo, - className: iconClassMap.undo, + className: iconClassMap['undo'], noDisable: true, title: 'Undo', }, 'redo': { name: 'redo', action: redo, - className: iconClassMap.redo, + className: iconClassMap['redo'], noDisable: true, title: 'Redo', },