ENHANCEMENT: Use new HtmlEditorConfig API to specify options for CMS HtmlEditorField

git-svn-id: svn://svn.silverstripe.com/silverstripe/open/modules/cms/branches/2.3@76845 467b73ca-7a2a-4603-9d3b-597d59a354a9

_config.php

@@ -17,4 +17,37 @@ Director::addRules(50, array(
 ));
 
 CMSMenu::populate_menu();
+
+HtmlEditorConfig::get('cms')->setOptions(array(
+	'mode' => 'none',
+	'language' => i18n::get_tinymce_lang(),
+	'content_css' => 'cms/css/editor.css, '.(SSViewer::current_theme() ? THEMES_DIR . "/" . SSViewer::current_theme() : project()) . "/css/editor.css",
+
+	'body_class' => 'typography',
+	'document_base_url' => Director::absoluteBaseURL(),
+
+	'urlconverter_callback' => "nullConverter",
+	'setupcontent_callback' => "sapphiremce_setupcontent",
+	'cleanup_callback' => "sapphiremce_cleanup",
+
+	'template_templates' => array(
+    	array( 'title' => "Three column", 'src' => "assets/snippet.html", 'description' => "A simple 3 column layout" )
+	),
+
+	'use_native_selects' => true, // fancy selects are bug as of SS 2.3.0
+	'valid_elements' => "+a[id|rel|rev|dir|tabindex|accesskey|type|name|href|target|title|class],-strong/-b[class],-em/-i[class],-strike[class],-u[class],#p[id|dir|class|align],-ol[class],-ul[class],-li[class],br,img[id|dir|longdesc|usemap|class|src|border|alt=|title|width|height|align],-sub[class],-sup[class],-blockquote[dir|class],-table[border=0|cellspacing|cellpadding|width|height|class|align|summary|dir|id|style],-tr[id|dir|class|rowspan|width|height|align|valign|bgcolor|background|bordercolor|style],tbody[id|class|style],thead[id|class|style],tfoot[id|class|style],-td[id|dir|class|colspan|rowspan|width|height|align|valign|scope|style],-th[id|dir|class|colspan|rowspan|width|height|align|valign|scope|style],caption[id|dir|class],-div[id|dir|class|align|style],-span[class|align],-pre[class|align],address[class|align],-h1[id|dir|class|align],-h2[id|dir|class|align],-h3[id|dir|class|align],-h4[id|dir|class|align],-h5[id|dir|class|align],-h6[id|dir|class|align],hr[class],dd[id|class|title|dir],dl[id|class|title|dir],dt[id|class|title|dir]",
+	'extended_valid_elements' => "img[class|src|alt|title|hspace|vspace|width|height|align|onmouseover|onmouseout|name|usemap],iframe[src|name|width|height|align|frameborder|marginwidth|marginheight|scrolling],object[width|height|data|type],param[name|value],map[class|name|id],area[shape|coords|href|target|alt]"
+));
+			
+
+HtmlEditorConfig::get('cms')->disablePlugins('blockquote');
+HtmlEditorConfig::get('cms')->enablePlugins('media', '../../tinymce_ssbuttons', 'fullscreen');
+			
+HtmlEditorConfig::get('cms')->insertButtonsBefore('formatselect', 'styleselect');
+HtmlEditorConfig::get('cms')->insertButtonsBefore('advcode', 'ssimage', 'ssflash', 'sslink', 'unlink', 'anchor', 'separator' );
+HtmlEditorConfig::get('cms')->insertButtonsAfter ('advcode', 'fullscreen', 'separator');
+			
+HtmlEditorConfig::get('cms')->removeButtons('tablecontrols');
+HtmlEditorConfig::get('cms')->addButtonsToLine(3, 'tablecontrols');
+
 ?>

code/CMSMain.php

@@ -79,7 +79,7 @@ class CMSMain extends LeftAndMain implements CurrentPageIdentifier, PermissionPr
 			'MetaKeywords' => _t('CMSMain.METAKEYWORDSOPT', 'Keywords', 0, "The dropdown title in CMSMain left SiteTreeFilterOptions")
 		);
 	}
-
+	
 	public function init() {
 		parent::init();
 		
@@ -108,18 +108,14 @@ class CMSMain extends LeftAndMain implements CurrentPageIdentifier, PermissionPr
 		$spellcheckSpec = array();
 		foreach($spellcheckLangs as $lang => $title) $spellcheckSpec[] = "{$title}={$lang}";
 
+		HtmlEditorConfig::get('cms')->setOption('spellchecker_languages', '+' . implode(',', $spellcheckSpec));
+		
+		// @todo Do we need this - I'm pretty sure not, since HtmlEditorField#Field() will include it on being called.
+		//       The only time you might need it is if you are creating an textarea.htmlfield yourself, in which case bad things are going to happen now we've moved configuration
 		// We don't want this showing up in every ajax-response, it should always be present in a CMS-environment
 		if(!Director::is_ajax()) {
 			Requirements::javascript(MCE_ROOT . "tiny_mce_src.js");
-			Requirements::javascriptTemplate(CMS_DIR . "/javascript/tinymce.template.js", array(
-				"ContentCSS" => (SSViewer::current_theme() ? THEMES_DIR . "/" . SSViewer::current_theme() : project()) . "/css/editor.css",
-				"BaseURL" => Director::absoluteBaseURL(),
-				"Lang" => i18n::get_tinymce_lang(),
-				'SpellcheckLangs' => '+' . implode(',', $spellcheckSpec)
-			));
 		}
-		// Always block the HtmlEditorField.js otherwise it will be sent with an ajax request
-		Requirements::block(SAPPHIRE_DIR . '/javascript/HtmlEditorField.js');
 		
 		Requirements::javascript(CMS_DIR . '/javascript/CMSMain.js');
 		Requirements::javascript(CMS_DIR . '/javascript/CMSMain_left.js');

code/LeftAndMain.php

@@ -153,6 +153,9 @@ class LeftAndMain extends Controller {
 
 		// Audit logging hook
 		if(empty($_REQUEST['executeForm']) && !Director::is_ajax()) $this->extend('accessedCMS');
+
+		// Override HtmlEditorField's config with our own
+		HtmlEditorconfig::set_active('cms');
 		
 		Requirements::css(CMS_DIR . '/css/typography.css');
 		Requirements::css(CMS_DIR . '/css/layout.css');

javascript/LeftAndMain.js

@@ -883,4 +883,28 @@ function hideIndicator(id) {
 
 setInterval(function() {
     new Ajax.Request("Security/ping");
-}, 5*60*1000);
+}, 5*60*1000);
+
+/**
+ * Find and enable TinyMCE on all htmleditor fields
+ * Pulled in from old tinymce.template.js
+ */
+
+function nullConverter(url) {
+	return url;
+}
+
+Behaviour.register({
+    'textarea.htmleditor' : {
+        initialize : function() {
+            tinyMCE.execCommand("mceAddControl", true, this.id);
+            this.isChanged = function() {
+                return tinyMCE.getInstanceById(this.id).isDirty();
+            }
+            this.resetChanged = function() {
+                inst = tinyMCE.getInstanceById(this.id);
+                inst.startContent = tinymce.trim(inst.getContent({format : 'raw', no_events : 1}));
+            }
+        }
+    }
+})

javascript/tinymce.template.js

@@ -1,63 +0,0 @@
-function nullConverter(url) {
-	return url;
-}
-
-/**
- * TinyMCE initialisation template.
- * $ variables are replaced by string search & replace.  It's pretty crude.
- */
-// Prevents "Error: 'tinyMCE' is undefined" error in IE7 on Newsletter Recipient import.
-if((typeof tinyMCE != 'undefined')) {
-	tinyMCE.init({
-		mode : "none",
-		language: "$Lang",
-		width: "100%",
-		auto_resize : false,
-		theme : "advanced",
-		content_css : "cms/css/editor.css, $ContentCSS",
-		body_class : 'typography',
-		document_base_url: "$BaseURL",
-		urlconverter_callback : "nullConverter",
-		
-		setupcontent_callback : "sapphiremce_setupcontent",
-		cleanup_callback : "sapphiremce_cleanup",
-		
-		theme_advanced_layout_manager: "SimpleLayout",
-		theme_advanced_toolbar_location : "top",
-		theme_advanced_toolbar_align : "left",
-		theme_advanced_toolbar_parent : "right",
-		plugins : "media,contextmenu,table,emotions,paste,../../tinymce_ssbuttons,../../tinymce_advcode,spellchecker,fullscreen",	
-		blockquote_clear_tag : "p",
-		table_inline_editing : true,
-		theme_advanced_buttons1 : "bold,italic,underline,strikethrough,separator,justifyleft,justifycenter,justifyright,justifyfull,styleselect,formatselect,separator,bullist,numlist,outdent,indent,blockquote,hr,charmap",
-		theme_advanced_buttons2 : "undo,redo,separator,cut,copy,paste,pastetext,pasteword,spellchecker,separator,ssimage,ssflash,sslink,unlink,anchor,separator,advcode,fullscreen,separator,search,replace,selectall,visualaid",
-		theme_advanced_buttons3 : "tablecontrols",
-		spellchecker_languages : "$SpellcheckLangs",
-		
-		template_templates : [
-		    { title : "Three column", src : "assets/snippet.html", description : "A simple 3 column layout"},
-		],
-
-		safari_warning : false,
-		relative_urls : true,
-		verify_html : true,
-		use_native_selects : true, // fancy selects are bug as of SS 2.3.0
-		valid_elements : "+a[id|rel|rev|dir|tabindex|accesskey|type|name|href|target|title|class],-strong/-b[class],-em/-i[class],-strike[class],-u[class],#p[id|dir|class|align],-ol[class],-ul[class],-li[class],br,img[id|dir|longdesc|usemap|class|src|border|alt=|title|width|height|align],-sub[class],-sup[class],-blockquote[dir|class],-table[border=0|cellspacing|cellpadding|width|height|class|align|summary|dir|id|style],-tr[id|dir|class|rowspan|width|height|align|valign|bgcolor|background|bordercolor|style],tbody[id|class|style],thead[id|class|style],tfoot[id|class|style],-td[id|dir|class|colspan|rowspan|width|height|align|valign|scope|style],-th[id|dir|class|colspan|rowspan|width|height|align|valign|scope|style],caption[id|dir|class],-div[id|dir|class|align|style],-span[class|align],-pre[class|align],address[class|align],-h1[id|dir|class|align],-h2[id|dir|class|align],-h3[id|dir|class|align],-h4[id|dir|class|align],-h5[id|dir|class|align],-h6[id|dir|class|align],hr[class],dd[id|class|title|dir],dl[id|class|title|dir],dt[id|class|title|dir]",
-		extended_valid_elements : "img[class|src|alt|title|hspace|vspace|width|height|align|onmouseover|onmouseout|name|usemap],iframe[src|name|width|height|align|frameborder|marginwidth|marginheight|scrolling],object[width|height|data|type],param[name|value],map[class|name|id],area[shape|coords|href|target|alt]"
-	});
-}
-
-Behaviour.register({
-    'textarea.htmleditor' : {
-        initialize : function() {
-            tinyMCE.execCommand("mceAddControl", true, this.id);
-            this.isChanged = function() {
-                return tinyMCE.getInstanceById(this.id).isDirty();
-            }
-            this.resetChanged = function() {
-                inst = tinyMCE.getInstanceById(this.id);
-                inst.startContent = tinymce.trim(inst.getContent({format : 'raw', no_events : 1}));
-            }
-        }
-    }
-})