tinymce updates

melisplatform · Apr 1, 2024 · a7d8194 · a7d8194
1 parent 3bd11ca
commit a7d8194
Show file tree

Hide file tree

Showing 5 changed files with 31 additions and 34 deletions.
diff --git a/public/plugins/js/plugin.melisGdprBanner.init.js b/public/plugins/js/plugin.melisGdprBanner.init.js
@@ -1,4 +1,4 @@
-window.MelisGdprBanner = (function () {
+var MelisGdprBanner = (function () {
     /**
      * To make a "persistent cookie" (a cookie that "never expires"),
      * we need to set a date/time in a distant future (one that possibly exceeds the user's

diff --git a/public/plugins/js/plugin.melistagHTML.init.js b/public/plugins/js/plugin.melistagHTML.init.js
@@ -5,9 +5,11 @@ function melistagHTML_init(idPlugin) {
 	var tinyMceOption = {
 		mini_templates_url: "/melis/MelisCms/PageEdition/getTinyTemplates?idPage=" + melisActivePageId
 	};
-
+
+	// added melisTinyMCE.tinyMceActionEvent as tinymce don't work after dragging a plugin into dragndropzone
 	if ( idPlugin != null ) {
-		tinyMceOption.setup = "melistagHTML_savePlugin";
+		tinyMceOption.setup = "melistagHTML_savePlugin, melisTinyMCE.tinyMceActionEvent";
+		//tinyMceOption.setup = "melistagHTML_savePlugin";
 	}
 
 	var idPlugin = idPlugin !== null ? "#" + idPlugin : "div.html-editable";
@@ -26,14 +28,16 @@ function melistagHTML_savePlugin(editor) {
 $("body").on("blur", "div.html-editable", function() {
 	// get all data-attributes from the clicked
 	var currentdata = $(this).data();
-	// var currentdata = $(this).closest(".html-editable").data();
+	//var currentdata = $(this).closest(".html-editable").data();
 
-	var pluginDivId = $(this).closest('.html-editable').attr('id');
+	//var pluginDivId = $(this).closest('.html-editable').attr('id');
+	var pluginDivId = $(this).attr('id');
 
-	var content = tinyMCE.get(pluginDivId).getContent({ format: "html" });
+	// get the content of the active tinyMCE editor. good for only one editor on the page.
+	//var content = tinyMCE.activeEditor.getContent({ format: "html" });
 
-	// get the content of the active tinyMCE editor.
-	// var content = tinyMCE.activeEditor.getContent({ format: "html" });
+	// good for multiple editor on the page
+	var content = tinyMCE.get(pluginDivId).getContent({ format: "html" });
 
 	var data = {
 		melisPluginName: currentdata.plugin,

diff --git a/public/plugins/js/plugin.melistagMEDIA.init.js b/public/plugins/js/plugin.melistagMEDIA.init.js
@@ -8,8 +8,9 @@ function melistagMEDIA_init(idPlugin) {
 			melisActivePageId,
 	};
 
+	// added melisTinyMCE.tinyMceActionEvent as tinymce don't work after dragging a plugin into dragndropzone
 	if (idPlugin != null) {
-		tinyMceOption.setup = "melistagMEDIA_savePlugin";
+		tinyMceOption.setup = "melistagMEDIA_savePlugin, melisTinyMCE.tinyMceActionEvent";
 	}
 
 	var idPlugin = idPlugin !== null ? "#" + idPlugin : "div.media-editable";
@@ -28,14 +29,16 @@ function melistagMEDIA_savePlugin(editor) {
 $("body").on("blur", "div.media-editable", function() {
 	// get all data-attributes from the clicked
 	var currentdata = $(this).data();
-	// var currentdata = $(this).closest(".html-editable").data();
+	// var currentdata = $(this).closest(".media-editable").data();
 
-	var pluginDivId = $(this).closest('.media-editable').attr('id');
+	//var pluginDivId = $(this).closest('.media-editable').attr('id');
+	//var pluginDivId = $(this).attr("id");
 
-	var content = tinyMCE.get(pluginDivId).getContent({ format: "html" });
+	// get the content of the active tinyMCE editor, used this as the other generates a console error
+	var content = tinyMCE.activeEditor.getContent({ format: "html" });
 
-	// get the content of the active tinyMCE editor.
-	// var content = tinyMCE.activeEditor.getContent({ format: "html" });
+	// good for multiple editor on the page
+	//var content = tinyMCE.get(pluginDivId).getContent({ format: "html" });
 
 	var data = {
 		melisPluginName: currentdata.plugin,

diff --git a/public/plugins/js/plugin.melistagTEXTAREA.init.js b/public/plugins/js/plugin.melistagTEXTAREA.init.js
@@ -8,8 +8,9 @@ function melistagTEXTAREA_init(idPlugin) {
 			melisActivePageId,
 	};
 
+	// added melisTinyMCE.tinyMceActionEvent as tinymce don't work after dragging a plugin into dragndropzone
 	if (idPlugin != null) {
-		tinyMceOption.setup = "melistagTEXTAREA_savePlugin";
+		tinyMceOption.setup = "melistagTEXTAREA_savePlugin, melisTinyMCE.tinyMceActionEvent";
 	}
 
 	var idPlugin = idPlugin !== null ? "#" + idPlugin : "div.textarea-editable";
@@ -27,16 +28,18 @@ function melistagTEXTAREA_savePlugin(editor) {
 // run this function when you click out of the tinymce
 $("body").on("blur", "div.textarea-editable", function() {
 	// get all data-attributes from the clicked
+	// var currentdata = $(this).closest(".textarea-editable").data();
 	var currentdata = $(this).data();
-	// var currentdata = $(this).closest(".html-editable").data();
 
-	var pluginDivId = $(this).closest('.textarea-editable').attr('id');
+	//var pluginDivId = $(this).closest('.textarea-editable').attr('id');
+	var pluginDivId = $(this).attr('id');
 
-	var content = tinyMCE.get(pluginDivId).getContent({ format: "html" });
-
 	// get the content of the active tinyMCE editor.
 	// var content = tinyMCE.activeEditor.getContent({ format: "html" });
 
+	// good for multiple editor on the page
+	var content = tinyMCE.get(pluginDivId).getContent({ format: "html" });
+
 	var data = {
 		melisPluginName: currentdata.plugin,
 		melisPluginTag: currentdata.melisTag,

diff --git a/public/plugins/js/plugin.related.data.js b/public/plugins/js/plugin.related.data.js
@@ -12,13 +12,8 @@ var pluginRelatedData = (function($, window) {
                 melisUIWidth        = $melisUI.outerWidth(), // totalWidth
                 dragDropZoneWidth   = $(melisDndZone).outerWidth(); // parentWidth
 
-                percentTotalWidth = ( 100 * dragDropZoneWidth / melisUIWidth );
+            var percentTotalWidth = ( 100 * dragDropZoneWidth / melisUIWidth );
                 percentTotalWidth = percentTotalWidth.toFixed(2);
-
-                /* console.log("melisDndZone: ", melisDndZone);
-                console.log("melisDndZone length: ", melisDndZone.length);
-                console.log("setPercentTotalWidth $toolBox: ", $toolBox);
-                console.log("setPercentTotalWidth $toolBox length: ", $toolBox.length); */
 
                 //if ( $toolBox.length > 0 ) {
                     processPluginData( $toolBox, percentTotalWidth );
@@ -34,12 +29,6 @@ var pluginRelatedData = (function($, window) {
             classes         = parentOutlined.attr("class").split(" "),
             editable        = parentOutlined.find(".melis-editable");
 
-            /* console.log("processPluginData toolBox: ", toolBox);
-            console.log("processPluginData parentOutlined: ", parentOutlined);
-            console.log("parentOutlined: ", parentOutlined + " classes: ", + classes); */
-
-            //console.log("toolBox length: ", toolBox.length);
-
             if ( toolBox.length ) {
                 var pluginList = new Object();
                     // get data first load
@@ -56,7 +45,7 @@ var pluginRelatedData = (function($, window) {
                             desktopWidth                    = $this.attr("data-plugin-width-desktop");
                     });
 
-                    // custom action check if plugin tags
+                    // custom action check if plugin tags, uncommented for checking, 03262024
                     /* if( $(editable).length ) {
                         // trigger focus to saveSession
                         var data = $(editable).data();
@@ -76,8 +65,6 @@ var pluginRelatedData = (function($, window) {
                             });
                     } */
 
-                    console.log("mobileWidth: ", + mobileWidth + " tabletWidth: ", + tabletWidth + " desktopWidth: ", desktopWidth);
-
                     // check if resize in mobile
                     if(iframe.width() <= 480) {
                         mobileWidth  = percentTotalWidth;