2.0.3; compatibility with tinyMCE module

formtools · Oct 15, 2017 · 8225d8b · 8225d8b
1 parent 14b6d01
commit 8225d8b
Show file tree

Hide file tree

Showing 6 changed files with 50 additions and 28 deletions.
diff --git a/add.php b/add.php
@@ -17,15 +17,27 @@
     "tinymce_available" => ($tinymce_available ? "yes" : "no"),
 );
 
+$editor = "codemirror";
 if ($tinymce_available) {
-    $page_vars["head_js"] = array("$root_url/modules/field_type_tinymce/tinymce/jquery.tinymce.js");
+    $page_vars["js_files"] = array("$root_url/modules/field_type_tinymce/tinymce/tinymce.min.js");
+    $editor = "tinymce";
 }
 
+$page_vars["head_css"] =<<< END
+body .mce-ico {
+    font-size: 13px;
+}
+body .mce-btn button {
+    padding: 3px 5px 3px 7px;
+}
+END;
+
 $page_vars["head_js"] =<<< EOF
 if (typeof pages_ns == undefined) {
   var pages_ns = {};
 }
-pages_ns.current_editor = "tinymce";
+
+pages_ns.current_editor = "$editor";
 var rules = [];
 rsv.onCompleteHandler = function() {
   $("#use_wysiwyg_hidden").val($("#uwe").attr("checked") ? "yes" : "no");

diff --git a/code/Module.class.php b/code/Module.class.php
@@ -20,8 +20,8 @@ class Module extends FormToolsModule
     protected $author = "Ben Keen";
     protected $authorEmail = "[email protected]";
     protected $authorLink = "https://formtools.org";
-    protected $version = "2.0.2";
-    protected $date = "2017-10-14";
+    protected $version = "2.0.3";
+    protected $date = "2017-10-15";
     protected $originLanguage = "en_us";
     protected $jsFiles = array(
         "{FTROOT}/global/codemirror/lib/codemirror.js",

diff --git a/edit.php b/edit.php
@@ -44,9 +44,18 @@
 );
 
 if ($tinymce_available) {
-  $page_vars["head_js"] = array("$root_url/modules/field_type_tinymce/tinymce/jquery.tinymce.js");
+    $page_vars["js_files"] = array("$root_url/modules/field_type_tinymce/tinymce/tinymce.min.js");
 }
 
+$page_vars["head_css"] =<<< END
+body .mce-ico {
+    font-size: 13px;
+}
+body .mce-btn button {
+    padding: 3px 5px 3px 7px;
+}
+END;
+
 $page_vars["head_js"] =<<< END
 if (typeof pages_ns == undefined) {
     var pages_ns = {};

diff --git a/scripts/pages.js b/scripts/pages.js
@@ -7,18 +7,21 @@ pages_ns.tinymce_available = false;
 
 $(function() {
   pages_ns.tinymce_available = $("#tinymce_available").val() === "yes";
+
   if ($("#wysiwyg_content").length && pages_ns.tinymce_available) {
-    $("#wysiwyg_content").tinymce({
-      script_url: g.root_url + "/modules/field_type_tinymce/tinymce/tiny_mce.js",
-      theme:      "advanced",
-      theme_advanced_toolbar_location: "top",
-      theme_advanced_toolbar_align: "left",
-      theme_advanced_buttons1: "bold,italic,underline,strikethrough,|,bullist,numlist,|,outdent,indent,|,blockquote,hr,|,undo,redo,link,unlink,|,fontselect,fontsizeselect",
-      theme_advanced_buttons2: "forecolorpicker,backcolorpicker,|,sub,sup,code",
-      theme_advanced_buttons3: "",
-      theme_advanced_resize_horizontal: false,
-      theme_advanced_path_location: "bottom"
+
+    tinymce.init({
+      selector: "#wysiwyg_content",
+      skin: "lightgray",
+      toolbar: "bold italic underline strikethrough | bullist numlist | outdent indent | blockquote hr | undo redo link unlink | fontselect fontsizeselect | forecolor backcolor | subscript superscript code",
+      plugins: "hr link textcolor lists",
+      branding: false,
+      menubar: false,
+      elementpath: false,
+      statusbar: true,
+      resize: true
     });
+
   }
 });
 
@@ -41,7 +44,7 @@ pages_ns.toggle_wysiwyg_field = function(is_checked) {
   } else {
     pages_ns.enable_editor("codemirror");
   }
-}
+};
 
 
 /**
@@ -88,15 +91,17 @@ pages_ns.enable_editor = function(editor) {
     $("#wysiwyg_div").show();
     $("#codemirror_div").hide();
     if (pages_ns.tinymce_available) {
-      $("#wysiwyg_content").tinymce().setContent(html_editor.getCode());
+      tinymce.get("wysiwyg_content").setContent(html_editor.getValue());
     }
   } else {
 	  // update the CodeMirror content
     if (pages_ns.tinymce_available) {
-      html_editor.setCode($("#wysiwyg_content").tinymce().getContent());
+      html_editor.setValue(tinymce.get("wysiwyg_content").getContent());
     }
     $("#wysiwyg_div").hide();
     $("#codemirror_div").show();
+
+    html_editor.refresh();
   }
   pages_ns.current_editor = editor;
 };

diff --git a/templates/add.tpl b/templates/add.tpl
@@ -51,17 +51,13 @@
       	</div>
 
       	<div id="codemirror_div" {if $tinymce_available == "yes"}style="display: none"{/if}>
-      	  <div style="border: 1px solid #666666; padding: 3px">
+      	  <div style="border: 1px solid #999999; padding: 3px">
       	    <textarea name="codemirror_content" id="codemirror_content" style="width:100%; height:300px"></textarea>
       	  </div>
 
-      	  <script type="text/javascript">
-      	  var html_editor = new CodeMirror.fromTextArea("codemirror_content", {literal}{{/literal}
-            parserfile: ["parsexml.js", "parsecss.js", "tokenizejavascript.js", "parsejavascript.js",
-                         "../contrib/php/js/tokenizephp.js", "../contrib/php/js/parsephp.js", "../contrib/php/js/parsephphtmlmixed.js"],
-            stylesheet: ["{$g_root_url}/global/codemirror/css/xmlcolors.css", "{$g_root_url}/global/codemirror/css/jscolors.css",
-                         "{$g_root_url}/global/codemirror/css/csscolors.css", "{$g_root_url}/global/codemirror/contrib/php/css/phpcolors.css"],
-            path:        "{$g_root_url}/global/codemirror/js/"
+      	  <script>
+      	  var html_editor = new CodeMirror.fromTextArea(document.getElementById("codemirror_content"), {literal}{{/literal}
+            mode: "xml"
       	  {literal}});{/literal}
       	  </script>
       	</div>

diff --git a/templates/edit.tpl b/templates/edit.tpl
@@ -53,13 +53,13 @@
       <td>
 
       	<div id="wysiwyg_div" {if $page_info.content_type != "html" || $page_info.use_wysiwyg == "no"}style="display:none"{/if}>
-      	  <textarea name="wysiwyg_content" id="wysiwyg_content" style="width:100%; height:300px">{$page_info.content}</textarea>
+      	  <textarea name="wysiwyg_content" id="wysiwyg_content" style="width: 100%; height:300px">{$page_info.content}</textarea>
       	</div>
 
         <!-- CodeMirror is used for everything except the WYSIWYG editor -->
       	<div id="codemirror_div" {if $page_info.use_wysiwyg == "yes" && $page_info.content_type == "html"}style="display: none"{/if}>
       	  <div style="border: 1px solid #999999; padding: 3px">
-      	    <textarea name="codemirror_content" id="codemirror_content" style="width:100%; height:300px">{$page_info.content|escape}</textarea>
+      	    <textarea name="codemirror_content" id="codemirror_content" style="width:520px; height:300px">{$page_info.content|escape}</textarea>
       	  </div>
 
       	  <script>