[BUGFIX] RTE.default.buttons.blockstyle not configurable 14/33914/2
authorStanislas Rolland <typo3@sjbr.ca>
Sun, 9 Nov 2014 03:00:45 +0000 (22:00 -0500)
committerStanislas Rolland <typo3@sjbr.ca>
Sun, 9 Nov 2014 03:52:23 +0000 (04:52 +0100)
Problem: Data from the TextStyle combobox,derived from the textstyle
configuration, appears in the BlockStyle combobox.
Solution:
1. Load the global classes configuration from PageTSconfig only once.
2. Force the initialization of the parsed classes object in the
HTMLArea.CSS.Parser class constructor. (ExtJS bug?)

Releases: master, 6.2
Resolves: #58034
Change-Id: Iaf2f8b7ee8cca347f5cd08619677965fdd1a0168
Reviewed-on: http://review.typo3.org/33914
Reviewed-by: Stanislas Rolland <typo3@sjbr.ca>
Tested-by: Stanislas Rolland <typo3@sjbr.ca>
typo3/sysext/rtehtmlarea/htmlarea/htmlarea.js
typo3/sysext/rtehtmlarea/htmlarea/plugins/BlockStyle/block-style.js
typo3/sysext/rtehtmlarea/htmlarea/plugins/TextStyle/text-style.js

index 0da60be..f709803 100644 (file)
@@ -2247,6 +2247,41 @@ HTMLArea.Editor = Ext.extend(Ext.util.Observable, {
                this.getDomNode();
                        // Initiate events listening
                this.initEventsListening();
+               // Load the classes configuration
+               this.getClassesConfiguration();
+       },
+
+       /**
+        * Get the classes configuration
+        * This is required before plugins are generated
+        *
+        * @return      void
+        */
+       getClassesConfiguration: function () {
+               if (this.config.classesUrl && typeof HTMLArea.classesLabels === 'undefined') {
+                       this.ajax.getJavascriptFile(this.config.classesUrl, function (options, success, response) {
+                               if (success) {
+                                       try {
+                                               if (typeof HTMLArea.classesLabels === 'undefined') {
+                                                       eval(response.responseText);
+                                               }
+                                       } catch(e) {
+                                               this.appendToLog('HTMLArea.Editor', 'getClassesConfiguration', 'Error evaluating contents of Javascript file: ' + this.config.classesUrl, 'error');
+                                       }
+                               }
+                               this.initializeEditor();
+                       }, this);
+               } else {
+                       this.initializeEditor();
+               }
+       },
+
+       /**
+        * Complete editor initialization
+        *
+        * @return      void
+        */
+       initializeEditor: function () {
                        // Generate plugins
                this.generatePlugins();
                        // Make the editor visible
@@ -5413,7 +5448,8 @@ HTMLArea.Editor.prototype.cleanAppleStyleSpans = function(node) {
  *  HTMLArea.CSS.Parser: CSS Parser
  ***************************************************/
 HTMLArea.CSS.Parser = Ext.extend(Ext.util.Observable, {
-       /*
+
+       /**
         * HTMLArea.CSS.Parser constructor
         */
        constructor: function (config) {
@@ -5437,15 +5473,20 @@ HTMLArea.CSS.Parser = Ext.extend(Ext.util.Observable, {
                         */
                        'HTMLAreaEventCssParsingComplete'
                );
+               this.parsedClasses = {};
+               this.ready = false;
        },
-       /*
+
+       /**
         * The parsed classes
         */
        parsedClasses: {},
-       /*
+
+       /**
         * Boolean indicating whether are not parsing is complete
         */
-       isReady: false,
+       ready: false,
+
        /*
         * Boolean indicating whether or not the stylesheets were accessible
         */
@@ -5462,7 +5503,8 @@ HTMLArea.CSS.Parser = Ext.extend(Ext.util.Observable, {
         * The error that occurred on the last attempt at parsing the stylesheets
         */
        error: null,
-       /*
+
+       /**
         * This function gets the parsed css classes
         *
         * @return      object  this.parsedClasses
@@ -5470,30 +5512,17 @@ HTMLArea.CSS.Parser = Ext.extend(Ext.util.Observable, {
        getClasses: function() {
                return this.parsedClasses;
        },
-       /*
-        * This function initiates parsing of the stylesheets
+
+       /**
+        * This function gets the ready state
         *
-        * @return      void
+        * @return bool this.ready
         */
-       initiateParsing: function () {
-               if (this.editor.config.classesUrl && (typeof(HTMLArea.classesLabels) === 'undefined')) {
-                       this.editor.ajax.getJavascriptFile(this.editor.config.classesUrl, function (options, success, response) {
-                               if (success) {
-                                       try {
-                                               if (typeof(HTMLArea.classesLabels) === 'undefined') {
-                                                       eval(response.responseText);
-                                               }
-                                       } catch(e) {
-                                               this.editor.appendToLog('HTMLArea.CSS.Parser', 'initiateParsing', 'Error evaluating contents of Javascript file: ' + this.editor.config.classesUrl, 'error');
-                                       }
-                               }
-                               this.parse();
-                       }, this);
-               } else {
-                       this.parse();
-               }
+       isReady: function() {
+               return this.ready;
        },
-       /*
+
+       /**
         * This function parses the stylesheets of the iframe set in config
         *
         * @return      void    parsed css classes are accumulated in this.parsedClasses
@@ -5514,7 +5543,7 @@ HTMLArea.CSS.Parser = Ext.extend(Ext.util.Observable, {
                                }
                        } else {
                                this.attemptTimeout = null;
-                               this.isReady = true;
+                               this.ready = true;
                                this.filterAllowedClasses();
                                this.sort();
                                this.fireEvent('HTMLAreaEventCssParsingComplete');
@@ -5740,7 +5769,8 @@ HTMLArea.CSS.Parser = Ext.extend(Ext.util.Observable, {
        sort: function() {
                Ext.iterate(this.parsedClasses, function (nodeName, value) {
                        var classes = [];
-                       var sortedClasses= {};
+                       var sortedClasses = {};
+                       var x, y;
                                // Collect keys
                        Ext.iterate(value, function (cssClass) {
                                classes.push(cssClass);
index 682aac8..bc11b52 100644 (file)
@@ -158,13 +158,13 @@ HTMLArea.BlockStyle = Ext.extend(HTMLArea.Plugin, {
                }
                        // Monitor css parsing being completed
                this.editor.iframe.mon(this.blockStyles, 'HTMLAreaEventCssParsingComplete', this.onCssParsingComplete, this);
-               this.blockStyles.initiateParsing();
+               this.blockStyles.parse();
        },
        /*
         * This handler gets called when parsing of css classes is completed
         */
        onCssParsingComplete: function () {
-               if (this.blockStyles.isReady) {
+               if (this.blockStyles.isReady()) {
                        this.cssArray = this.blockStyles.getClasses();
                        if (this.getEditorMode() === 'wysiwyg' && this.editor.isEditable()) {
                                this.updateValue('BlockStyle');
@@ -175,7 +175,7 @@ HTMLArea.BlockStyle = Ext.extend(HTMLArea.Plugin, {
         * This handler gets called when the toolbar is being updated
         */
        onUpdateToolbar: function (button, mode, selectionEmpty, ancestors) {
-               if (mode === 'wysiwyg' && this.editor.isEditable() && this.blockStyles.isReady) {
+               if (mode === 'wysiwyg' && this.editor.isEditable() && this.blockStyles.isReady()) {
                        this.updateValue(button.itemId);
                }
        },
@@ -231,7 +231,7 @@ HTMLArea.BlockStyle = Ext.extend(HTMLArea.Plugin, {
        buildDropDownOptions: function (dropDown, nodeName) {
                var store = dropDown.getStore();
                this.initializeDropDown(dropDown);
-               if (this.blockStyles.isReady) {
+               if (this.blockStyles.isReady()) {
                        var allowedClasses = {};
                        if (Ext.isDefined(this.cssArray[nodeName])) {
                                allowedClasses = this.cssArray[nodeName];
index 7d210a8..088d696 100644 (file)
@@ -202,13 +202,13 @@ HTMLArea.TextStyle = Ext.extend(HTMLArea.Plugin, {
                }
                        // Monitor css parsing being completed
                this.editor.iframe.mon(this.textStyles, 'HTMLAreaEventCssParsingComplete', this.onCssParsingComplete, this);
-               this.textStyles.initiateParsing();
+               this.textStyles.parse();
        },
        /*
         * This handler gets called when parsing of css classes is completed
         */
        onCssParsingComplete: function () {
-               if (this.textStyles.isReady) {
+               if (this.textStyles.isReady()) {
                        this.cssArray = this.textStyles.getClasses();
                        if (this.getEditorMode() === 'wysiwyg' && this.editor.isEditable()) {
                                this.updateToolbar('TextStyle');
@@ -219,7 +219,7 @@ HTMLArea.TextStyle = Ext.extend(HTMLArea.Plugin, {
         * This handler gets called when the toolbar is being updated
         */
        onUpdateToolbar: function (button, mode, selectionEmpty, ancestors) {
-               if (mode === 'wysiwyg' && this.editor.isEditable() && this.textStyles.isReady) {
+               if (mode === 'wysiwyg' && this.editor.isEditable() && this.textStyles.isReady()) {
                        this.updateToolbar(button.itemId);
                }
        },
@@ -303,7 +303,7 @@ HTMLArea.TextStyle = Ext.extend(HTMLArea.Plugin, {
        buildDropDownOptions: function (dropDown, nodeName) {
                var store = dropDown.getStore();
                this.initializeDropDown(dropDown);
-               if (this.textStyles.isReady) {
+               if (this.textStyles.isReady()) {
                        var allowedClasses = {};
                        if (this.REInlineTags.test(nodeName)) {
                                if (Ext.isDefined(this.cssArray[nodeName])) {