diff --git a/static-assets/js/tinymce-plugins/craftercms_paste/plugin.js b/static-assets/js/tinymce-plugins/craftercms_paste/plugin.js index 351bcebf7e..0f18f8b0fe 100644 --- a/static-assets/js/tinymce-plugins/craftercms_paste/plugin.js +++ b/static-assets/js/tinymce-plugins/craftercms_paste/plugin.js @@ -1739,18 +1739,16 @@ }; var setup$1 = function (editor) { - var plugin = editor.plugins.paste; - var preProcess = getPreProcess(editor); - if (preProcess) { - editor.on('PastePreProcess', function (e) { - preProcess.call(plugin, plugin, e); - }); + const processEvent = (f) => (e) => { + f(editor, e); + }; + const preProcess = getPreProcess(editor); + if (isFunction(preProcess)) { + editor.on('PastePreProcess', processEvent(preProcess)); } - var postProcess = getPostProcess(editor); - if (postProcess) { - editor.on('PastePostProcess', function (e) { - postProcess.call(plugin, plugin, e); - }); + const postProcess = getPostProcess(editor); + if (isFunction(postProcess)) { + editor.on('PastePostProcess', processEvent(postProcess)); } }; diff --git a/ui/guest/src/controls/rte.ts b/ui/guest/src/controls/rte.ts index 03b5cd089b..f5ee6386b4 100644 --- a/ui/guest/src/controls/rte.ts +++ b/ui/guest/src/controls/rte.ts @@ -112,6 +112,7 @@ export function initTinyMCE( record.element.classList.remove(emptyFieldClass); + const maxLength = validations?.maxLength ? parseInt(validations.maxLength.value) : null; window.tinymce.init({ license_key: 'gpl', target: rteEl, @@ -125,8 +126,24 @@ export function initTinyMCE( plugins: ['craftercms_paste editform', rteSetup?.tinymceOptions?.plugins].filter(Boolean).join(' '), // 'editform' plugin will always be loaded paste_as_text: type !== 'html', paste_data_images: type === 'html', - paste_preprocess(plugin, args) { - window.tinymce.activeEditor.plugins.craftercms_paste_extension?.paste_preprocess(plugin, args); + paste_preprocess(editor, args) { + const currentContent = editor.getContent({ format: 'text' }); + const fullContent = currentContent + args.content; + const maxLengthExceeded = maxLength && fullContent.length > maxLength; + if (maxLengthExceeded) { + post( + snackGuestMessage({ + id: 'maxLength', + level: 'required', + values: { + maxLength: args.content.length === maxLength ? fullContent.length : `${fullContent.length}/${maxLength}` + } + }) + ); + args.content = args.content.substring(0, maxLength - currentContent.length); + } + + window.tinymce.activeEditor.plugins.craftercms_paste_extension?.paste_preprocess(editor, args); }, paste_postprocess(plugin, args) { window.tinymce.activeEditor.plugins.craftercms_paste_extension?.paste_postprocess(plugin, args); @@ -329,21 +346,6 @@ export function initTinyMCE( }); editor.on('paste', (e) => { - const maxLength = validations?.maxLength ? parseInt(validations.maxLength.value) : null; - const text = ( - e.clipboardData || - // @ts-ignore - window.clipboardData - ).getData('text'); - if (maxLength && text.length > maxLength) { - post( - snackGuestMessage({ - id: 'maxLength', - level: 'required', - values: { maxLength: text.length === maxLength ? text.length : `${text.length}/${maxLength}` } - }) - ); - } if (type === 'textarea') { // Doing this immediately (without the timeout) causes the content to be duplicated. // TinyMCE seems to be doing something internally that causes this. @@ -356,7 +358,6 @@ export function initTinyMCE( } }, 10); } - // TODO: It'd be great to be able to select the piece of the pasted content that falls out of the max-length. }); editor.on('keyup', (e) => {