Merge branch 'MDL-76447-401' of https://github.com/meirzamoodle/moodle into MOODLE_401_STABLE

lib/editor/tiny/amd/build/options.min.js

@@ -1,3 +1,3 @@
-define("editor_tiny/options",["exports"],(function(_exports){Object.defineProperty(_exports,"__esModule",{value:!0}),_exports.registerPlaceholderSelectors=_exports.register=_exports.getPluginOptionName=_exports.getPlaceholderSelectors=_exports.getMoodleLang=_exports.getInitialPluginConfiguration=_exports.getFilepickers=_exports.getFilePicker=_exports.getDraftItemId=_exports.getCurrentLanguage=_exports.getContextId=void 0;_exports.register=(editor,options)=>{const registerOption=editor.options.register,setOption=editor.options.set;registerOption("moodle:contextid",{processor:"number",default:0}),setOption("moodle:contextid",options.context),registerOption("moodle:filepickers",{processor:"object",default:{}}),setOption("moodle:filepickers",options.filepicker),registerOption("moodle:draftitemid",{processor:"number",default:0}),setOption("moodle:draftitemid",options.draftitemid),registerOption("moodle:currentLanguage",{processor:"string",default:"en"}),setOption("moodle:currentLanguage",options.currentLanguage),registerOption("moodle:language",{processor:"object",default:{}}),setOption("moodle:language",options.language),registerOption("moodle:placeholderSelectors",{processor:"array",default:[]}),setOption("moodle:placeholderSelectors",options.placeholderSelectors)};_exports.getContextId=editor=>editor.options.get("moodle:contextid");_exports.getDraftItemId=editor=>editor.options.get("moodle:draftitemid");const getFilepickers=editor=>editor.options.get("moodle:filepickers");_exports.getFilepickers=getFilepickers;_exports.getFilePicker=(editor,type)=>getFilepickers(editor)[type];_exports.getMoodleLang=editor=>editor.options.get("moodle:language");_exports.getCurrentLanguage=editor=>editor.options.get("moodle:currentLanguage");_exports.getInitialPluginConfiguration=options=>{const config={};return Object.entries(options.plugins).forEach((_ref=>{var _pluginConfig$config;let[pluginName,pluginConfig]=_ref;Object.entries(null!==(_pluginConfig$config=pluginConfig.config)&&void 0!==_pluginConfig$config?_pluginConfig$config:{}).forEach((_ref2=>{let[optionName,value]=_ref2;config[getPluginOptionName(pluginName,optionName)]=value}))})),config};const getPluginOptionName=(pluginName,optionName)=>"".concat(pluginName,":").concat(optionName);_exports.getPluginOptionName=getPluginOptionName;const getPlaceholderSelectors=editor=>editor.options.get("moodle:placeholderSelectors");_exports.getPlaceholderSelectors=getPlaceholderSelectors;_exports.registerPlaceholderSelectors=(editor,selectors)=>{if(selectors.length){let existingData=getPlaceholderSelectors(editor);existingData=existingData.concat(selectors),editor.options.set("moodle:placeholderSelectors",existingData)}}}));
+define("editor_tiny/options",["exports"],(function(_exports){Object.defineProperty(_exports,"__esModule",{value:!0}),_exports.registerPlaceholderSelectors=_exports.register=_exports.getPluginOptionName=_exports.getPlaceholderSelectors=_exports.getNestedMenu=_exports.getMoodleLang=_exports.getInitialPluginConfiguration=_exports.getFilepickers=_exports.getFilePicker=_exports.getDraftItemId=_exports.getCurrentLanguage=_exports.getContextId=void 0;_exports.register=(editor,options)=>{const registerOption=editor.options.register,setOption=editor.options.set;registerOption("moodle:contextid",{processor:"number",default:0}),setOption("moodle:contextid",options.context),registerOption("moodle:filepickers",{processor:"object",default:{}}),setOption("moodle:filepickers",options.filepicker),registerOption("moodle:draftitemid",{processor:"number",default:0}),setOption("moodle:draftitemid",options.draftitemid),registerOption("moodle:currentLanguage",{processor:"string",default:"en"}),setOption("moodle:currentLanguage",options.currentLanguage),registerOption("moodle:language",{processor:"object",default:{}}),setOption("moodle:language",options.language),registerOption("moodle:placeholderSelectors",{processor:"array",default:[]}),setOption("moodle:placeholderSelectors",options.placeholderSelectors),registerOption("moodle:nestedmenu",{processor:"boolean",default:!1}),setOption("moodle:nestedmenu",options.nestedmenu)};_exports.getContextId=editor=>editor.options.get("moodle:contextid");_exports.getDraftItemId=editor=>editor.options.get("moodle:draftitemid");const getFilepickers=editor=>editor.options.get("moodle:filepickers");_exports.getFilepickers=getFilepickers;_exports.getFilePicker=(editor,type)=>getFilepickers(editor)[type];_exports.getMoodleLang=editor=>editor.options.get("moodle:language");_exports.getCurrentLanguage=editor=>editor.options.get("moodle:currentLanguage");_exports.getNestedMenu=editor=>editor.options.get("moodle:nestedmenu");_exports.getInitialPluginConfiguration=options=>{const config={};return Object.entries(options.plugins).forEach((_ref=>{var _pluginConfig$config;let[pluginName,pluginConfig]=_ref;Object.entries(null!==(_pluginConfig$config=pluginConfig.config)&&void 0!==_pluginConfig$config?_pluginConfig$config:{}).forEach((_ref2=>{let[optionName,value]=_ref2;config[getPluginOptionName(pluginName,optionName)]=value}))})),config};const getPluginOptionName=(pluginName,optionName)=>"".concat(pluginName,":").concat(optionName);_exports.getPluginOptionName=getPluginOptionName;const getPlaceholderSelectors=editor=>editor.options.get("moodle:placeholderSelectors");_exports.getPlaceholderSelectors=getPlaceholderSelectors;_exports.registerPlaceholderSelectors=(editor,selectors)=>{if(selectors.length){let existingData=getPlaceholderSelectors(editor);existingData=existingData.concat(selectors),editor.options.set("moodle:placeholderSelectors",existingData)}}}));
 
 //# sourceMappingURL=options.min.js.map

lib/editor/tiny/amd/src/editor.js

@@ -174,6 +174,21 @@ const getPlugins = ({plugins = null} = {}) => {
     return {};
 };
 
+/**
+ * Nest the dropdown menu inside the parent DOM.
+ *
+ * The TinyMCE menu has a significant issue with the Overflow style,
+ * and the Boost theme heavily uses Overflow for drawer navigation.
+ * Moving the menu container into the parent editor container makes it work correctly.
+ *
+ * @param {object} editor
+ */
+ const nestMenu = (editor) => {
+    const container = editor.getContainer();
+    const menuContainer = document.querySelector('body > .tox.tox-tinymce-aux');
+    container.parentNode.appendChild(menuContainer);
+};
+
 /**
  * Get the standard configuration for the specified options.
  *
@@ -251,6 +266,13 @@ const getStandardConfig = (target, tinyMCE, options, plugins) => {
                 // Hide justify alignment sub-menu.
                 removeSubmenuItem(editor, 'align', 'tiny:justify');
             });
+
+            editor.on('PostRender', function() {
+                // Nest menu if set.
+                if (options.nestedmenu) {
+                    nestMenu(editor);
+                }
+            });
         },
     });
 

lib/editor/tiny/amd/src/options.js

@@ -27,6 +27,7 @@ const filePickers = 'moodle:filepickers';
 const optionsMoodleLang = 'moodle:language';
 const currentLanguage = 'moodle:currentLanguage';
 const optionPlaceholderSelectors = 'moodle:placeholderSelectors';
+const nestedMenu = 'moodle:nestedmenu';
 
 export const register = (editor, options) => {
     const registerOption = editor.options.register;
@@ -68,6 +69,12 @@ export const register = (editor, options) => {
         "default": [],
     });
     setOption(optionPlaceholderSelectors, options.placeholderSelectors);
+
+    registerOption(nestedMenu, {
+        processor: 'boolean',
+        "default": false,
+    });
+    setOption(nestedMenu, options.nestedmenu);
 };
 
 export const getContextId = (editor) => editor.options.get(optionContextId);
@@ -76,6 +83,7 @@ export const getFilepickers = (editor) => editor.options.get(filePickers);
 export const getFilePicker = (editor, type) => getFilepickers(editor)[type];
 export const getMoodleLang = (editor) => editor.options.get(optionsMoodleLang);
 export const getCurrentLanguage = (editor) => editor.options.get(currentLanguage);
+export const getNestedMenu = (editor) => editor.options.get(nestedMenu);
 
 /**
  * Get a set of namespaced options for all defined plugins.

lib/editor/tiny/classes/editor.php

@@ -194,6 +194,9 @@ class editor extends \texteditor {
 
             // Plugin configuration.
             'plugins' => $this->manager->get_plugin_configuration($context, $options, $fpoptions, $this),
+
+            // Nest menu inside parent DOM.
+            'nestedmenu' => true,
         ];
 
         if (defined('BEHAT_SITE_RUNNING') && BEHAT_SITE_RUNNING) {

lib/editor/tiny/styles.css

@@ -1,5 +1,5 @@
 .jsenabled .tox-tinymce-aux {
-    z-index: 1070;
+    z-index: 1000;
 }
 
 .jsenabled .tox-shadowhost.tox-fullscreen,