From 4c000e0f4478d62038210eb91bc1a716970b1f91 Mon Sep 17 00:00:00 2001 From: Claudio-Emmolo <113107618+Claudio-Emmolo@users.noreply.github.com> Date: Thu, 4 Jul 2024 10:51:14 +0200 Subject: [PATCH] Add button for toggle preview ADV --- src/previewAdv.js | 48 ++++++++++++++++++++++++++++++----------------- 1 file changed, 31 insertions(+), 17 deletions(-) diff --git a/src/previewAdv.js b/src/previewAdv.js index 1d22c97..c756597 100644 --- a/src/previewAdv.js +++ b/src/previewAdv.js @@ -1,6 +1,36 @@ /* global tinymce */ tinymce.PluginManager.add('previewAdv', (editor, url) => { + let isEnable = true + + editor.ui.registry.addToggleButton('previewAdv', { + icon: 'preview', + tooltip: 'Enable Preview Adv', + onAction: async (_) => { + isEnable = !isEnable + togglePreviewAdv(isEnable) + } + }) + + function togglePreviewAdv (isEnable) { + const advDivs = editor.getBody().querySelectorAll('.adv-preview') + + for (let i = 0; i < advDivs.length; i++) { + advDivs[i].style.display = isEnable ? 'block' : 'none' + } + + // Update button state + setTimeout(() => { + const toolbar = editor.getContainer().querySelector('.tox-toolbar-overlord') + const btn = toolbar.querySelector('button[aria-label="Enable Preview Adv"]') + if (isEnable) { + btn.classList.add('tox-tbtn--enabled') + } else { + btn.classList.remove('tox-tbtn--enabled') + } + }, 0) + } + editor.on('init', function () { const params = editor.getParam('previewAdv') const thresholds = params.thresholds @@ -9,28 +39,13 @@ tinymce.PluginManager.add('previewAdv', (editor, url) => { let advCount = 1 // Counter for adv divs insertAdv() + togglePreviewAdv(isEnable) // === TIMER === let typingTimer const typingDebounce = 1000 // 1 second // === EDITOR ACTIONS === - // editor.on('change', function () { - // const bookmark = editor.selection.getBookmark(2, true) - // - // pCount = 0 - // advCount = 1 - // if (typing) { - // return - // } - // insertAdv() - // - // setTimeout(function () { - // editor.selection.moveToBookmark(bookmark) - // editor.focus() - // }, 0) - // }) - editor.on('SaveContent', function (e) { const tempDiv = document.createElement('div') tempDiv.innerHTML = e.content @@ -84,7 +99,6 @@ tinymce.PluginManager.add('previewAdv', (editor, url) => { } function addAdvInEditor () { - pCount = 0 advCount = 1