From c5b4ff7b27004120f8fbb0d9f214502253cfc3fe Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=E9=9D=92=E7=9F=B3?= Date: Fri, 20 Sep 2024 16:40:23 +0800 Subject: [PATCH] feat(emoji): allow the user to set the cdn address (#3908) --- extensions/emoji/extend.php | 7 +++++++ extensions/emoji/js/admin.js | 1 + extensions/emoji/js/src/admin/index.js | 13 ++++++++++++ extensions/emoji/js/src/common/cdn.js | 7 +++++++ .../js/src/forum/addComposerAutocomplete.js | 5 +++-- extensions/emoji/js/src/forum/cdn.js | 5 ----- extensions/emoji/js/src/forum/renderEmoji.js | 20 ++++++++++--------- extensions/emoji/locale/en.yml | 8 ++++++++ 8 files changed, 50 insertions(+), 16 deletions(-) create mode 100644 extensions/emoji/js/admin.js create mode 100644 extensions/emoji/js/src/admin/index.js create mode 100644 extensions/emoji/js/src/common/cdn.js delete mode 100644 extensions/emoji/js/src/forum/cdn.js diff --git a/extensions/emoji/extend.php b/extensions/emoji/extend.php index 00d190b91..66598208c 100644 --- a/extensions/emoji/extend.php +++ b/extensions/emoji/extend.php @@ -11,6 +11,9 @@ use Flarum\Extend; use s9e\TextFormatter\Configurator; return [ + (new Extend\Frontend('admin')) + ->js(__DIR__.'/js/dist/admin.js'), + (new Extend\Frontend('forum')) ->js(__DIR__.'/js/dist/forum.js') ->css(__DIR__.'/less/forum.less') @@ -30,4 +33,8 @@ return [ }), new Extend\Locales(__DIR__.'/locale'), + + (new Extend\Settings) + ->serializeToForum('flarum-emoji.cdn', 'flarum-emoji.cdn') + ->default('flarum-emoji.cdn', 'https://cdn.jsdelivr.net/gh/twitter/twemoji@[version]/assets/'), ]; diff --git a/extensions/emoji/js/admin.js b/extensions/emoji/js/admin.js new file mode 100644 index 000000000..3e69ff3b9 --- /dev/null +++ b/extensions/emoji/js/admin.js @@ -0,0 +1 @@ +export * from './src/admin'; diff --git a/extensions/emoji/js/src/admin/index.js b/extensions/emoji/js/src/admin/index.js new file mode 100644 index 000000000..efbfbfeb4 --- /dev/null +++ b/extensions/emoji/js/src/admin/index.js @@ -0,0 +1,13 @@ +import app from 'flarum/admin/app'; +import { version } from '../common/cdn'; + +app.initializers.add('flarum-emoji', () => { + app.extensionData.for('flarum-emoji').registerSetting({ + setting: 'flarum-emoji.cdn', + type: 'text', + label: app.translator.trans('flarum-emoji.admin.settings.cdn_label'), + help: app.translator.trans('flarum-emoji.admin.settings.cdn_help', { + version: version, + }), + }); +}); diff --git a/extensions/emoji/js/src/common/cdn.js b/extensions/emoji/js/src/common/cdn.js new file mode 100644 index 000000000..e8b2ec0cf --- /dev/null +++ b/extensions/emoji/js/src/common/cdn.js @@ -0,0 +1,7 @@ +import twemoji from 'twemoji'; + +export const version = /([0-9]+).[0-9]+.[0-9]+/g.exec(twemoji.base)[1]; + +export default function () { + return app.forum.attribute('flarum-emoji.cdn').replace('[version]', version); +} diff --git a/extensions/emoji/js/src/forum/addComposerAutocomplete.js b/extensions/emoji/js/src/forum/addComposerAutocomplete.js index a0e43e415..7d6df9390 100644 --- a/extensions/emoji/js/src/forum/addComposerAutocomplete.js +++ b/extensions/emoji/js/src/forum/addComposerAutocomplete.js @@ -6,7 +6,7 @@ import AutocompleteReader from 'flarum/common/utils/AutocompleteReader'; import AutocompleteDropdown from './fragments/AutocompleteDropdown'; import getEmojiIconCode from './helpers/getEmojiIconCode'; -import cdn from './cdn'; +import cdn from '../common/cdn'; export default function addComposerAutocomplete() { let emojiMap = null; @@ -40,6 +40,7 @@ export default function addComposerAutocomplete() { extend('flarum/common/components/TextEditor', 'buildEditorParams', function (params) { const emojiKeys = Object.keys(emojiMap); + const resolvedCdn = cdn(); const autocompleteReader = new AutocompleteReader(':'); @@ -75,7 +76,7 @@ export default function addComposerAutocomplete() { emojiDropdown.setIndex($(this).parent().index() - 1); }} > - {emoji} + {emoji} ); diff --git a/extensions/emoji/js/src/forum/cdn.js b/extensions/emoji/js/src/forum/cdn.js deleted file mode 100644 index bba87b58a..000000000 --- a/extensions/emoji/js/src/forum/cdn.js +++ /dev/null @@ -1,5 +0,0 @@ -import twemoji from 'twemoji'; - -export const version = /([0-9]+).[0-9]+.[0-9]+/g.exec(twemoji.base)[1]; - -export default `https://cdn.jsdelivr.net/gh/twitter/twemoji@${version}/assets/`; diff --git a/extensions/emoji/js/src/forum/renderEmoji.js b/extensions/emoji/js/src/forum/renderEmoji.js index 340f32f4c..2250edeb8 100644 --- a/extensions/emoji/js/src/forum/renderEmoji.js +++ b/extensions/emoji/js/src/forum/renderEmoji.js @@ -3,14 +3,16 @@ import twemoji from 'twemoji'; import { override } from 'flarum/common/extend'; import Post from 'flarum/common/models/Post'; -import base from './cdn'; +import cdn from '../common/cdn'; -const options = { - base, - attributes: () => ({ - loading: 'lazy', - }), -}; +function options() { + return { + base: cdn(), + attributes: () => ({ + loading: 'lazy', + }), + }; +} /** * Parses an HTML string into a `` node containing the HTML content. @@ -40,7 +42,7 @@ export default function renderEmoji() { // element. This gets stripped below. // // See https://github.com/flarum/core/issues/2958 - const emojifiedDom = twemoji.parse(parseHTML(contentHtml), options); + const emojifiedDom = twemoji.parse(parseHTML(contentHtml), options()); // Steal the HTML string inside the emojified DOM `` tag. this.emojifiedContentHtml = emojifiedDom.innerHTML; @@ -54,6 +56,6 @@ export default function renderEmoji() { override(s9e.TextFormatter, 'preview', (original, text, element) => { original(text, element); - twemoji.parse(element, options); + twemoji.parse(element, options()); }); } diff --git a/extensions/emoji/locale/en.yml b/extensions/emoji/locale/en.yml index a7d29de51..9929051e1 100644 --- a/extensions/emoji/locale/en.yml +++ b/extensions/emoji/locale/en.yml @@ -4,6 +4,14 @@ flarum-emoji: # UNIQUE KEYS - The following keys are used in only one location each. ## + # Translations in this namespace are used by the admin interface. + admin: + + # These translations are used in the Settings page of the admin interface. + settings: + cdn_label: CDN mirror address + cdn_help: "e.g. https://cdn.jsdelivr.net/gh/twitter/twemoji@[version]/assets/, The current version is: {version}" + # Translations in this namespace are used by the forum user interface. forum: