From 724f43d1a2975332a9312240c04c56b50ebeff0c Mon Sep 17 00:00:00 2001 From: David Bogner Date: Wed, 17 Apr 2024 13:45:53 +0200 Subject: [PATCH] Make editor buttons work --- amd/build/editor.min.js | 4 +-- amd/build/editor.min.js.map | 2 +- amd/src/editor.js | 56 +++++++++++++++++++++++++++---------- classes/newsletter.php | 2 +- 4 files changed, 45 insertions(+), 19 deletions(-) diff --git a/amd/build/editor.min.js b/amd/build/editor.min.js index 34ff86b..8b79863 100644 --- a/amd/build/editor.min.js +++ b/amd/build/editor.min.js @@ -1,4 +1,4 @@ -define("mod_newsletter/editor",["exports","editor_tiny/loader"],(function(_exports,_loader){Object.defineProperty(_exports,"__esModule",{value:!0}),_exports.loadCss=void 0; +define("mod_newsletter/editor",["exports"],(function(_exports){Object.defineProperty(_exports,"__esModule",{value:!0}),_exports.loadCss=void 0; /** * Loads CSS for Editor * @@ -6,6 +6,6 @@ define("mod_newsletter/editor",["exports","editor_tiny/loader"],(function(_expor * @copyright Wunderbyte GmbH * @license http://www.gnu.org/copyleft/gpl.html GNU GPL v3 or later */ -var M={mod_newsletter:{}},tinymce=null;M.mod_newsletter.collapse_subscribe_form=function(){var fieldset=document.querySelector("form #id_subscribe");fieldset&&fieldset.classList.add("collapsed")};_exports.loadCss=async function(stylesheets,selected){tinymce=await(0,_loader.getTinyMCE)();var select=document.querySelector("#id_stylesheetid");function change_stylesheet(e){var selectedIndex=e.target.value;tinymce.remove(),tinymce.init({selector:"textarea",content_css:stylesheets[selectedIndex]})}change_stylesheet({target:select}),select?select.addEventListener("change",change_stylesheet):setTimeout((function(){M.mod_newsletter.init_editor(stylesheets,selected)}),100)}})); +var newsletter={mod_newsletter:{}};newsletter.mod_newsletter.collapse_subscribe_form=function(){var fieldset=document.querySelector("form #id_subscribe");fieldset&&fieldset.classList.add("collapsed")};_exports.loadCss=async function(stylesheets,selected){var select=document.querySelector("#id_stylesheetid");function change_stylesheet(e){let selectedIndex=e.target.value;tinyMCE.remove(),tinyMCE.init({selector:"textarea",content_css:stylesheets[selectedIndex]})}new Promise((resolve=>{!function checkIfLoaded(){window.tinyMCE?resolve(window.tinyMCE):setTimeout(checkIfLoaded,100)}()})).then((tinyMCE=>{console.log("tinyMCE is loaded:",tinyMCE),change_stylesheet({target:select}),tinyMCE.init({content_css:stylesheets[selected]})})),select?select.addEventListener("change",change_stylesheet):setTimeout((function(){newsletter.mod_newsletter.init_editor(stylesheets,selected)}),100)}})); //# sourceMappingURL=editor.min.js.map \ No newline at end of file diff --git a/amd/build/editor.min.js.map b/amd/build/editor.min.js.map index a8b4686..60fce34 100644 --- a/amd/build/editor.min.js.map +++ b/amd/build/editor.min.js.map @@ -1 +1 @@ -{"version":3,"file":"editor.min.js","sources":["../src/editor.js"],"sourcesContent":["/* eslint-disable no-console */\n// This file is part of Moodle - http://moodle.org/\n//\n// Moodle is free software: you can redistribute it and/or modify\n// it under the terms of the GNU General Public License as published by\n// the Free Software Foundation, either version 3 of the License, or\n// (at your option) any later version.\n//\n// Moodle is distributed in the hope that it will be useful,\n// but WITHOUT ANY WARRANTY; without even the implied warranty of\n// MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the\n// GNU General Public License for more details.\n//\n// You should have received a copy of the GNU General Public License\n// along with Moodle. If not, see .\n\n/**\n * Loads CSS for Editor\n *\n * @module mod_newsletter/load_CSS\n * @copyright Wunderbyte GmbH \n * @license http://www.gnu.org/copyleft/gpl.html GNU GPL v3 or later\n */\n\nimport {getTinyMCE} from 'editor_tiny/loader';\n\nvar M = {\n mod_newsletter: {}\n};\n\nvar tinymce = null;\n\nM.mod_newsletter.collapse_subscribe_form = function() {\n var fieldset = document.querySelector('form #id_subscribe');\n if (fieldset) {\n fieldset.classList.add('collapsed');\n }\n};\n\nexport const loadCss = async function(stylesheets, selected) {\n tinymce = await getTinyMCE();\n var select = document.querySelector('#id_stylesheetid');\n\n /**\n * Changes the stylesheet based on the selected option.\n * @param {Object} e Event object containing information about the target element.\n */\n function change_stylesheet(e) {\n var select = e.target;\n var selectedIndex = select.value;\n tinymce.remove();\n tinymce.init({\n selector: 'textarea',\n content_css: stylesheets[selectedIndex]\n });\n }\n\n // Execute change_stylesheet function initially\n change_stylesheet({target: select});\n\n if (select) {\n select.addEventListener('change', change_stylesheet);\n } else {\n setTimeout(function() {\n M.mod_newsletter.init_editor(stylesheets, selected);\n }, 100);\n }\n};\n"],"names":["M","mod_newsletter","tinymce","collapse_subscribe_form","fieldset","document","querySelector","classList","add","async","stylesheets","selected","select","change_stylesheet","e","selectedIndex","target","value","remove","init","selector","content_css","addEventListener","setTimeout","init_editor"],"mappings":";;;;;;;;IA0BIA,EAAI,CACJC,eAAgB,IAGhBC,QAAU,KAEdF,EAAEC,eAAeE,wBAA0B,eACnCC,SAAWC,SAASC,cAAc,sBAClCF,UACAA,SAASG,UAAUC,IAAI,+BAIRC,eAAeC,YAAaC,UAC/CT,cAAgB,4BACZU,OAASP,SAASC,cAAc,6BAM3BO,kBAAkBC,OAEnBC,cADSD,EAAEE,OACYC,MAC3Bf,QAAQgB,SACRhB,QAAQiB,KAAK,CACTC,SAAU,WACVC,YAAaX,YAAYK,iBAKjCF,kBAAkB,CAACG,OAAQJ,SAEvBA,OACAA,OAAOU,iBAAiB,SAAUT,mBAElCU,YAAW,WACPvB,EAAEC,eAAeuB,YAAYd,YAAaC,YAC3C"} \ No newline at end of file +{"version":3,"file":"editor.min.js","sources":["../src/editor.js"],"sourcesContent":["/* eslint-disable no-console */\n// This file is part of Moodle - http://moodle.org/\n//\n// Moodle is free software: you can redistribute it and/or modify\n// it under the terms of the GNU General Public License as published by\n// the Free Software Foundation, either version 3 of the License, or\n// (at your option) any later version.\n//\n// Moodle is distributed in the hope that it will be useful,\n// but WITHOUT ANY WARRANTY; without even the implied warranty of\n// MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the\n// GNU General Public License for more details.\n//\n// You should have received a copy of the GNU General Public License\n// along with Moodle. If not, see .\n\n/**\n * Loads CSS for Editor\n *\n * @module mod_newsletter/load_CSS\n * @copyright Wunderbyte GmbH \n * @license http://www.gnu.org/copyleft/gpl.html GNU GPL v3 or later\n */\n\nvar newsletter = {\n mod_newsletter: {}\n};\n\nnewsletter.mod_newsletter.collapse_subscribe_form = function() {\n var fieldset = document.querySelector('form #id_subscribe');\n if (fieldset) {\n fieldset.classList.add('collapsed');\n }\n};\n\nexport const loadCss = async function(stylesheets, selected) {\n var select = document.querySelector('#id_stylesheetid');\n\n /**\n * Wait for tinyMCE to be loaded.\n * @returns {Promise}\n */\n function waitUntilTinyMCELoaded() {\n return new Promise((resolve) => {\n /**\n * Check if tinyMCE object is available\n */\n function checkIfLoaded() {\n if (window.tinyMCE) {\n // If tinyMCE is available, resolve the promise\n resolve(window.tinyMCE);\n } else {\n // If not, wait and check again\n setTimeout(checkIfLoaded, 100); // Check every 100 milliseconds\n }\n }\n\n // Start checking if loaded\n checkIfLoaded();\n });\n }\n waitUntilTinyMCELoaded()\n .then((tinyMCE) => {\n console.log('tinyMCE is loaded:', tinyMCE);\n change_stylesheet({target: select});\n tinyMCE.init({\n content_css: stylesheets[selected]\n });\n // Proceed with further operations using tinyMCE\n });\n\n\n /**\n * Changes the stylesheet based on the selected option.\n * @param {Object} e Event object containing information about the target element.\n */\n function change_stylesheet(e) {\n let selectedTarget = e.target;\n let selectedIndex = selectedTarget.value;\n tinyMCE.remove();\n tinyMCE.init({\n selector: 'textarea',\n content_css: stylesheets[selectedIndex]\n });\n }\n\n if (select) {\n select.addEventListener('change', change_stylesheet);\n } else {\n setTimeout(function() {\n newsletter.mod_newsletter.init_editor(stylesheets, selected);\n }, 100);\n }\n};\n"],"names":["newsletter","mod_newsletter","collapse_subscribe_form","fieldset","document","querySelector","classList","add","async","stylesheets","selected","select","change_stylesheet","e","selectedIndex","target","value","tinyMCE","remove","init","selector","content_css","Promise","resolve","checkIfLoaded","window","setTimeout","then","console","log","addEventListener","init_editor"],"mappings":";;;;;;;;IAwBIA,WAAa,CACbC,eAAgB,IAGpBD,WAAWC,eAAeC,wBAA0B,eAC5CC,SAAWC,SAASC,cAAc,sBAClCF,UACAA,SAASG,UAAUC,IAAI,+BAIRC,eAAeC,YAAaC,cAC3CC,OAASP,SAASC,cAAc,6BAwC3BO,kBAAkBC,OAEnBC,cADiBD,EAAEE,OACYC,MACnCC,QAAQC,SACRD,QAAQE,KAAK,CACTC,SAAU,WACVC,YAAaZ,YAAYK,iBAvCtB,IAAIQ,SAASC,oBAIPC,gBACDC,OAAOR,QAEPM,QAAQE,OAAOR,SAGfS,WAAWF,cAAe,KAKlCA,MAIHG,MAAMV,UACHW,QAAQC,IAAI,qBAAsBZ,SAClCL,kBAAkB,CAACG,OAAQJ,SAC3BM,QAAQE,KAAK,CACTE,YAAaZ,YAAYC,eAoBjCC,OACAA,OAAOmB,iBAAiB,SAAUlB,mBAElCc,YAAW,WACP1B,WAAWC,eAAe8B,YAAYtB,YAAaC,YACpD"} \ No newline at end of file diff --git a/amd/src/editor.js b/amd/src/editor.js index dd8ee58..d831b1e 100755 --- a/amd/src/editor.js +++ b/amd/src/editor.js @@ -22,15 +22,11 @@ * @license http://www.gnu.org/copyleft/gpl.html GNU GPL v3 or later */ -import {getTinyMCE} from 'editor_tiny/loader'; - -var M = { +var newsletter = { mod_newsletter: {} }; -var tinymce = null; - -M.mod_newsletter.collapse_subscribe_form = function() { +newsletter.mod_newsletter.collapse_subscribe_form = function() { var fieldset = document.querySelector('form #id_subscribe'); if (fieldset) { fieldset.classList.add('collapsed'); @@ -38,31 +34,61 @@ M.mod_newsletter.collapse_subscribe_form = function() { }; export const loadCss = async function(stylesheets, selected) { - tinymce = await getTinyMCE(); var select = document.querySelector('#id_stylesheetid'); + /** + * Wait for tinyMCE to be loaded. + * @returns {Promise} + */ + function waitUntilTinyMCELoaded() { + return new Promise((resolve) => { + /** + * Check if tinyMCE object is available + */ + function checkIfLoaded() { + if (window.tinyMCE) { + // If tinyMCE is available, resolve the promise + resolve(window.tinyMCE); + } else { + // If not, wait and check again + setTimeout(checkIfLoaded, 100); // Check every 100 milliseconds + } + } + + // Start checking if loaded + checkIfLoaded(); + }); + } + waitUntilTinyMCELoaded() + .then((tinyMCE) => { + console.log('tinyMCE is loaded:', tinyMCE); + change_stylesheet({target: select}); + tinyMCE.init({ + content_css: stylesheets[selected] + }); + // Proceed with further operations using tinyMCE + }); + + /** * Changes the stylesheet based on the selected option. * @param {Object} e Event object containing information about the target element. */ function change_stylesheet(e) { - var select = e.target; - var selectedIndex = select.value; - tinymce.remove(); - tinymce.init({ + let selectedTarget = e.target; + let selectedIndex = selectedTarget.value; + tinyMCE.remove(); + tinyMCE.init({ selector: 'textarea', content_css: stylesheets[selectedIndex] }); } - // Execute change_stylesheet function initially - change_stylesheet({target: select}); - if (select) { select.addEventListener('change', change_stylesheet); } else { setTimeout(function() { - M.mod_newsletter.init_editor(stylesheets, selected); + newsletter.mod_newsletter.init_editor(stylesheets, selected); }, 100); } }; diff --git a/classes/newsletter.php b/classes/newsletter.php index 8d4b1a8..78a9c8b 100644 --- a/classes/newsletter.php +++ b/classes/newsletter.php @@ -830,7 +830,7 @@ private function view_edit_issue_page(array $params) { 'filename', false ); - $options = array(); + $options = []; $options[NEWSLETTER_DEFAULT_STYLESHEET] = "{$CFG->wwwroot}/mod/newsletter/reset.css"; foreach ($files as $file) { $url = "{$CFG->wwwroot}/pluginfile.php/{$file->get_contextid()}/mod_newsletter/" . NEWSLETTER_FILE_AREA_STYLESHEET;