Fixed bug #17179: No possibility to refresh the positioning of the toolbar items...
authorSusanne Moog <typo3@susannemoog.de>
Fri, 21 Jan 2011 09:26:38 +0000 (09:26 +0000)
committerSusanne Moog <typo3@susannemoog.de>
Fri, 21 Jan 2011 09:26:38 +0000 (09:26 +0000)
git-svn-id: https://svn.typo3.org/TYPO3v4/Core/trunk@10193 709f56b5-9817-0410-a4d7-c38de5d9e867

ChangeLog
typo3/js/backendsearch.js
typo3/js/clearcachemenu.js
typo3/js/shortcutmenu.js
typo3/js/toolbarmanager.js
typo3/js/workspacemenu.js
typo3/sysext/opendocs/opendocs.js
typo3/sysext/sys_action/toolbarmenu/tx_sysactions.js

index ebdcd31..740e62d 100755 (executable)
--- a/ChangeLog
+++ b/ChangeLog
@@ -19,6 +19,7 @@
 2011-01-21  Susanne Moog  <typo3@susanne-moog.de>
 
        * Fixed bug #17169: Bug: Wrong color gradients for filter and new button in new page tree
+       * Fixed bug #17179: No possibility to refresh the positioning of the toolbar items with a common function
 
 2011-01-21  Tobias Liebig  <mail_typo3@etobi.de>
 
index 7bfb682..a505591 100644 (file)
@@ -35,10 +35,9 @@ var BackendSearch = Class.create({
         * registers for resize event listener and executes on DOM ready
         */
        initialize: function() {
-               Event.observe(window, 'resize', this.positionMenu);
-
                Ext.onReady(function() {
-                       this.positionMenu();
+                       Event.observe(window, 'resize', TYPO3BackendToolbarManager.positionMenu('backend-search-menu'));
+                       TYPO3BackendToolbarManager.positionMenu('backend-search-menu');
                        this.toolbarItemIcon = $$('#backend-search-menu .toolbar-item span.t3-icon')[0];
 
                        $('search-query').observe('keypress', function(event) {
@@ -63,37 +62,6 @@ var BackendSearch = Class.create({
                }.bindAsEventListener(this));
        },
 
-       /**
-        * positions the menu below the toolbar icon, let's do some math!
-        */
-       positionMenu: function() {
-               var calculatedOffset = 0;
-               var parentWidth      = $('backend-search-menu').getWidth();
-               var currentToolbarItemLayer = $$('#backend-search-menu div')[0];
-               var ownWidth         = currentToolbarItemLayer.getWidth();
-
-               var parentSiblings   = $('backend-search-menu').previousSiblings();
-
-               parentSiblings.each(function(toolbarItem) {
-                       calculatedOffset += toolbarItem.getWidth() - 1;
-                       // -1 to compensate for the margin-right -1px of the list items,
-                       // which itself is necessary for overlaying the separator with the active state background
-
-                       if (toolbarItem.down().hasClassName('no-separator')) {
-                               calculatedOffset -= 1;
-                       }
-               });
-               calculatedOffset = calculatedOffset - ownWidth + parentWidth;
-
-               // border correction
-       if (currentToolbarItemLayer.getStyle('display') !== 'none') {
-               calculatedOffset += 2;
-       }
-
-               $$('#backend-search-menu div')[0].setStyle({
-                       left: calculatedOffset + 'px'
-               });
-       },
 
        /**
         * toggles the visibility of the menu and places it under the toolbar icon
index 8a71b08..a89085c 100644 (file)
@@ -35,10 +35,10 @@ var ClearCacheMenu = Class.create({
         * registers for resize event listener and executes on DOM ready
         */
        initialize: function() {
-               Event.observe(window, 'resize', this.positionMenu);
 
                Ext.onReady(function() {
-                       this.positionMenu();
+                       Event.observe(window, 'resize', TYPO3BackendToolbarManager.positionMenu('clear-cache-actions-menu'));
+                       TYPO3BackendToolbarManager.positionMenu('clear-cache-actions-menu');
                        this.toolbarItemIcon = $$('#clear-cache-actions-menu .toolbar-item span.t3-icon')[0];
 
                        Event.observe('clear-cache-actions-menu', 'click', this.toggleMenu)
@@ -51,38 +51,6 @@ var ClearCacheMenu = Class.create({
        },
 
        /**
-        * positions the menu below the toolbar icon, let's do some math!
-        */
-       positionMenu: function() {
-               var calculatedOffset = 0;
-               var parentWidth      = $('clear-cache-actions-menu').getWidth();
-               var currentToolbarItemLayer = $$('#clear-cache-actions-menu ul')[0];
-               var ownWidth         = currentToolbarItemLayer.getWidth();
-               var parentSiblings   = $('clear-cache-actions-menu').previousSiblings();
-
-               parentSiblings.each(function(toolbarItem) {
-                       calculatedOffset += toolbarItem.getWidth() - 1;
-                       // -1 to compensate for the margin-right -1px of the list items,
-                       // which itself is necessary for overlaying the separator with the active state background
-
-                       if (toolbarItem.down().hasClassName('no-separator')) {
-                               calculatedOffset -= 1;
-                       }
-               });
-               calculatedOffset = calculatedOffset - ownWidth + parentWidth;
-
-                       // border correction
-               if (currentToolbarItemLayer.getStyle('display') !== 'none') {
-                       calculatedOffset += 2;
-               }
-
-
-               $$('#clear-cache-actions-menu ul')[0].setStyle({
-                       left: calculatedOffset + 'px'
-               });
-       },
-
-       /**
         * toggles the visibility of the menu and places it under the toolbar icon
         */
        toggleMenu: function(event) {
index 668cb17..d065ec2 100644 (file)
@@ -36,10 +36,10 @@ var ShortcutMenu = Class.create({
         * registers for resize event listener and executes on DOM ready
         */
        initialize: function() {
-               Event.observe(window, 'resize', this.positionMenu);
-
                Ext.onReady(function() {
-                       this.positionMenu();
+                       Event.observe(window, 'resize', TYPO3BackendToolbarManager.positionMenu('shortcut-menu'));
+                       TYPO3BackendToolbarManager.positionMenu('shortcut-menu');
+                       
                        this.toolbarItemIcon = $$('#shortcut-menu .toolbar-item span.t3-icon')[0];
 
                        Event.observe($$('#shortcut-menu .toolbar-item')[0], 'click', this.toggleMenu);
@@ -101,37 +101,6 @@ var ShortcutMenu = Class.create({
        },
 
        /**
-        * positions the menu below the toolbar icon, let's do some math!
-        */
-       positionMenu: function() {
-               var calculatedOffset = 0;
-               var parentWidth      = $('shortcut-menu').getWidth();
-               var currentToolbarItemLayer = $$('#shortcut-menu .toolbar-item-menu')[0];
-               var ownWidth         = currentToolbarItemLayer.getWidth();
-               var parentSiblings   = $('shortcut-menu').previousSiblings();
-
-               parentSiblings.each(function(toolbarItem) {
-                       calculatedOffset += toolbarItem.getWidth() - 1;
-                       // -1 to compensate for the margin-right -1px of the list items,
-                       // which itself is necessary for overlaying the separator with the active state background
-
-                       if (toolbarItem.down().hasClassName('no-separator')) {
-                               calculatedOffset -= 1;
-                       }
-               });
-               calculatedOffset = calculatedOffset - ownWidth + parentWidth;
-
-                       // border correction
-               if (currentToolbarItemLayer.getStyle('display') !== 'none') {
-                       calculatedOffset += 2;
-               }
-
-               $$('#shortcut-menu .toolbar-item-menu')[0].setStyle({
-                       left: calculatedOffset + 'px'
-               });
-       },
-
-       /**
         * toggles the visibility of the menu and places it under the toolbar icon
         */
        toggleMenu: function(event) {
index 87903c2..a1b345c 100644 (file)
@@ -44,6 +44,48 @@ var ToolbarManager = Class.create({
                                // show toolbarItem
                        toolbarItem.addClassName('toolbar-item-active');
                }
+       },
+
+       /**
+        * refreshs positioning of all submenus
+        */
+       refreshAll: function() {
+               $$('.toolbar-item-menu').each(function(element) {
+                       menuParent = Ext.get(element);
+                       TYPO3BackendToolbarManager.positionMenu(menuParent.findParentNode('[id$="-menu"]').id);
+               });
+       },
+
+       /**
+        * positions a toolbar item (has to have .toolbar-item-menu)
+        * @param elementId The parent element ofthe menu to be positioned
+        */
+       positionMenu: function(elementId) {
+               var calculatedOffset = 0;
+               var parentWidth = $(elementId).getWidth();
+               var currentToolbarItemLayer = $$('#' + elementId + ' .toolbar-item-menu')[0];
+               var ownWidth = currentToolbarItemLayer.getWidth();
+               var parentSiblings = $(elementId).previousSiblings();
+
+               parentSiblings.each(function(toolbarItem) {
+                       calculatedOffset += toolbarItem.getWidth() - 1;
+                       // -1 to compensate for the margin-right -1px of the list items,
+                       // which itself is necessary for overlaying the separator with the active state background
+
+                       if (toolbarItem.down().hasClassName('no-separator')) {
+                               calculatedOffset -= 1;
+                       }
+               });
+               calculatedOffset = calculatedOffset - ownWidth + parentWidth;
+
+               // border correction
+               if (currentToolbarItemLayer.getStyle('display') !== 'none') {
+                       calculatedOffset += 2;
+               }
+
+               $$('#' + elementId + ' .toolbar-item-menu')[0].setStyle({
+                       left: calculatedOffset + 'px'
+               });
        }
 
 });
index e4c4d60..908757e 100644 (file)
@@ -36,10 +36,10 @@ var WorkspaceMenu = Class.create({
         * registers for resize event listener and executes on DOM ready
         */
        initialize: function() {
-               Event.observe(window, 'resize', this.positionMenu);
 
                Ext.onReady(function() {
-                       this.positionMenu();
+                       Event.observe(window, 'resize', TYPO3BackendToolbarManager.positionMenu('workspace-selector-menu'));
+                       TYPO3BackendToolbarManager.positionMenu('workspace-selector-menu');
 
                        Event.observe('workspace-selector-menu', 'click', this.toggleMenu);
                        Event.observe('frontendPreviewToggle', 'click', this.toggleFrontendPreview.bind(this));
@@ -54,37 +54,6 @@ var WorkspaceMenu = Class.create({
        },
 
        /**
-        * positions the menu below the toolbar icon, let's do some math!
-        */
-       positionMenu: function() {
-               var calculatedOffset = 0;
-               var parentWidth      = $('workspace-selector-menu').getWidth();
-               var currentToolbarItemLayer = $$('#workspace-selector-menu ul')[0];
-               var ownWidth         = currentToolbarItemLayer.getWidth();
-               var parentSiblings   = $('workspace-selector-menu').previousSiblings();
-
-               parentSiblings.each(function(toolbarItem) {
-                       calculatedOffset += toolbarItem.getWidth() - 1;
-                       // -1 to compensate for the margin-right -1px of the list items,
-                       // which itself is necessary for overlaying the separator with the active state background
-
-                       if (toolbarItem.down().hasClassName('no-separator')) {
-                               calculatedOffset -= 1;
-                       }
-               });
-               calculatedOffset = calculatedOffset - ownWidth + parentWidth;
-
-                       // border correction
-               if (currentToolbarItemLayer.getStyle('display') !== 'none') {
-                       calculatedOffset += 2;
-               }
-
-               $$('#workspace-selector-menu ul')[0].setStyle({
-                       left: calculatedOffset + 'px'
-               });
-       },
-
-       /**
         * toggles the visibility of the menu and places it under the toolbar icon
         */
        toggleMenu: function(event) {
index 056f5b0..514a0fa 100644 (file)
@@ -37,10 +37,10 @@ var OpenDocs = Class.create({
         * registers for resize event listener and executes on DOM ready
         */
        initialize: function() {
-               Event.observe(window, 'resize', this.positionMenu);
 
                Ext.onReady(function() {
-                       this.positionMenu();
+                       Event.observe(window, 'resize', TYPO3BackendToolbarManager.positionMenu('tx-opendocs-menu'));
+                       TYPO3BackendToolbarManager.positionMenu('tx-opendocs-menu');
                        this.toolbarItemIcon = $$('#tx-opendocs-menu .toolbar-item span.t3-icon')[0];
                        this.ajaxScript      = top.TS.PATH_typo3 + this.ajaxScript; // can't be initialized earlier
 
@@ -50,37 +50,6 @@ var OpenDocs = Class.create({
        },
 
        /**
-        * positions the menu below the toolbar icon, let's do some math!
-        */
-       positionMenu: function() {
-               var calculatedOffset = 0;
-               var parentWidth      = $('tx-opendocs-menu').getWidth();
-               var currentToolbarItemLayer = $$('#tx-opendocs-menu .toolbar-item-menu')[0];
-               var ownWidth         = currentToolbarItemLayer.getWidth();
-               var parentSiblings   = $('tx-opendocs-menu').previousSiblings();
-
-               parentSiblings.each(function(toolbarItem) {
-                       calculatedOffset += toolbarItem.getWidth() - 1;
-                       // -1 to compensate for the margin-right -1px of the list items,
-                       // which itself is necessary for overlaying the separator with the active state background
-
-                       if(toolbarItem.down().hasClassName('no-separator')) {
-                               calculatedOffset -= 1;
-                       }
-               });
-               calculatedOffset = calculatedOffset - ownWidth + parentWidth;
-
-                       // border correction
-               if (currentToolbarItemLayer.getStyle('display') !== 'none') {
-                       calculatedOffset += 2;
-               }
-
-               $$('#tx-opendocs-menu .toolbar-item-menu')[0].setStyle({
-                       left: calculatedOffset + 'px'
-               });
-       },
-
-       /**
         * toggles the visibility of the menu and places it under the toolbar icon
         */
        toggleMenu: function(event) {
index 4dd6b4a..edceca2 100644 (file)
@@ -35,10 +35,10 @@ var SysActionMenu = Class.create({
         * registers for resize event listener and executes on DOM ready
         */
        initialize: function() {
-               Event.observe(window, 'resize', this.positionMenu);
 
                Ext.onReady(function() {
-                       this.positionMenu();
+                       Event.observe(window, 'resize', TYPO3BackendToolbarManager.positionMenu('tx-sys-action-menu'));
+                       TYPO3BackendToolbarManager.positionMenu('tx-sys-action-menu');
                        this.toolbarItemIcon = $$('#tx-sys-action-menu .toolbar-item span')[0].src;
 
                        Event.observe('tx-sys-action-menu', 'click', this.toggleMenu);
@@ -47,37 +47,6 @@ var SysActionMenu = Class.create({
        },
 
        /**
-        * positions the menu below the toolbar icon, let's do some math!
-        */
-       positionMenu: function() {
-               var calculatedOffset = 0;
-               var parentWidth      = $('tx-sys-action-menu').getWidth();
-               var currentToolbarItemLayer = $$('#tx-sys-action-menu ul')[0];
-               var ownWidth         = currentToolbarItemLayer.getWidth();
-               var parentSiblings   = $('tx-sys-action-menu').previousSiblings();
-
-               parentSiblings.each(function(toolbarItem) {
-                       calculatedOffset += toolbarItem.getWidth() - 1;
-                       // -1 to compensate for the margin-right -1px of the list items,
-                       // which itself is necessary for overlaying the separator with the active state background
-
-                       if(toolbarItem.down().hasClassName('no-separator')) {
-                               calculatedOffset -= 1;
-                       }
-               });
-               calculatedOffset = calculatedOffset - ownWidth + parentWidth;
-
-                       // border correction
-               if (currentToolbarItemLayer.getStyle('display') !== 'none') {
-                       calculatedOffset += 2;
-               }
-
-               $$('#tx-sys-action-menu ul')[0].setStyle({
-                       left: calculatedOffset + 'px'
-               });
-       },
-
-       /**
         * toggles the visibility of the menu and places it under the toolbar icon
         */
        toggleMenu: function(event) {