From 7351e2b237dcc4119b5452bdf886c4362854eec0 Mon Sep 17 00:00:00 2001 From: Situphen Date: Mon, 27 Jan 2020 22:34:26 +0100 Subject: [PATCH] Allow to specify which Font Awesome version to use --- CHANGELOG.md | 1 + README.md | 2 ++ src/js/easymde.js | 81 +++++++++++++++++++++++++++++++--------------- types/easymde.d.ts | 1 + 4 files changed, 59 insertions(+), 26 deletions(-) diff --git a/CHANGELOG.md b/CHANGELOG.md index 8bad0b0..23f3eb3 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -7,6 +7,7 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0 ## [Unreleased] ### Added - `inputStyle` and `nativeSpellcheck` options to manage the native language of the browser (Thanks to [@firm1], [#143]). +- `fontAwesomeVersion` option to specify which Font Awesome version to use (Thanks to [@Situphen], [#145]). ### Changed - Delay before assuming that submit of the form as failed is `autosave.submit_delay` instead of `autosave.delay` (Thanks to [@Situphen], [#139]). diff --git a/README.md b/README.md index b68caba..a094089 100644 --- a/README.md +++ b/README.md @@ -127,6 +127,7 @@ easyMDE.value('New input for **EasyMDE**'); - **code**: Can be set to ```` ``` ```` or `~~~`. Defaults to ```` ``` ````. - **italic**: Can be set to `*` or `_`. Defaults to `*`. - **element**: The DOM element for the TextArea to use. Defaults to the first TextArea on the page. +- **fontAwesomeVersion**: Allow to specify which Font Awesome version to use (for instance, `v5.12.0`). Defaults to Font Awesome 4.7.0 (`v4`). - **forceSync**: If set to `true`, force text changes made in EasyMDE to be immediately stored in original text area. Defaults to `false`. - **hideIcons**: An array of icon names to hide. Can be used to hide specific icons shown by default without completely customizing the toolbar. - **indentWithTabs**: If set to `false`, indent using spaces instead of tabs. Defaults to `true`. @@ -211,6 +212,7 @@ var editor = new EasyMDE({ italic: "_", }, element: document.getElementById("MyID"), + fontAwesomeVersion: 'v5.12.0', forceSync: true, hideIcons: ["guide", "heading"], indentWithTabs: false, diff --git a/src/js/easymde.js b/src/js/easymde.js index 4e0a2f6..d582f73 100644 --- a/src/js/easymde.js +++ b/src/js/easymde.js @@ -1472,6 +1472,60 @@ var errorMessages = { importError: 'Something went wrong when uploading the image #image_name#.', }; +/** + * Download Font Awesome + */ + +function downloadFontAwesome(options) { + if (options.autoDownloadFontAwesome === false) { + return; + } + + var version = options.fontAwesomeVersion; + if (!version.startsWith('v5')) { + version = 'v4'; + } + + if (options.autoDownloadFontAwesome !== true) { + if (version === 'v4') { + var styleSheets = document.styleSheets; + for (var sheet in styleSheets) { + if (!sheet.href) + continue; + + if (sheet.href.indexOf('//maxcdn.bootstrapcdn.com/font-awesome/') > -1) { + return; + } + } + } else { + var scripts = document.scripts; + for (var script in scripts) { + if (!script.src) + continue; + + if (script.src.indexOf('//use.fontawesome.com/releases/' + version) > -1) { + return; + } + } + } + } + + if (version === 'v4') { + var link = document.createElement('link'); + link.rel = 'stylesheet'; + link.href = 'https://maxcdn.bootstrapcdn.com/font-awesome/latest/css/font-awesome.min.css'; + document.getElementsByTagName('head')[0].appendChild(link); + } else { + var script_ = document.createElement('script'); + script_.src = 'https://use.fontawesome.com/releases/' + version + '/js/all.js'; + document.getElementsByTagName('head')[0].appendChild(script_); + + script_ = document.createElement('script'); + script_.src = 'https://use.fontawesome.com/releases/' + version + '/js/v4-shims.js'; + document.getElementsByTagName('head')[0].appendChild(script_); + } +} + /** * Interface of EasyMDE. */ @@ -1482,32 +1536,7 @@ function EasyMDE(options) { // Used later to refer to it"s parent options.parent = this; - // Check if Font Awesome needs to be auto downloaded - var autoDownloadFA = true; - - if (options.autoDownloadFontAwesome === false) { - autoDownloadFA = false; - } - - if (options.autoDownloadFontAwesome !== true) { - var styleSheets = document.styleSheets; - for (var i = 0; i < styleSheets.length; i++) { - if (!styleSheets[i].href) - continue; - - if (styleSheets[i].href.indexOf('//maxcdn.bootstrapcdn.com/font-awesome/') > -1) { - autoDownloadFA = false; - } - } - } - - if (autoDownloadFA) { - var link = document.createElement('link'); - link.rel = 'stylesheet'; - link.href = 'https://maxcdn.bootstrapcdn.com/font-awesome/latest/css/font-awesome.min.css'; - document.getElementsByTagName('head')[0].appendChild(link); - } - + downloadFontAwesome(options); // Find the textarea to use if (options.element) { diff --git a/types/easymde.d.ts b/types/easymde.d.ts index 8fef851..ae14d17 100644 --- a/types/easymde.d.ts +++ b/types/easymde.d.ts @@ -117,6 +117,7 @@ declare namespace EasyMDE { autosave?: AutoSaveOptions; blockStyles?: BlockStyleOptions; element?: HTMLElement; + fontAwesomeVersion?: string; forceSync?: boolean; hideIcons?: ReadonlyArray; indentWithTabs?: boolean;