[BUGFIX] Streamline backend module menu and viewport initialization 26/57526/2
authorOliver Hader <oliver@typo3.org>
Tue, 10 Jul 2018 10:42:47 +0000 (12:42 +0200)
committerFrank Naegler <frank.naegler@typo3.org>
Wed, 18 Jul 2018 17:35:41 +0000 (19:35 +0200)
ModuleMenu and Viewport initialization need to be defered to ensure
that DOM is available in order to apply further behavior in mentioned
client implementation.

Resolves: #80312
Releases: master, 8.7
Change-Id: I9581a7f2164050f73683928b8f2ebe1d69a6d5e7
Reviewed-on: https://review.typo3.org/57526
Tested-by: TYPO3com <no-reply@typo3.com>
Reviewed-by: Andreas Fernandez <a.fernandez@scripting-base.de>
Tested-by: Andreas Fernandez <a.fernandez@scripting-base.de>
Reviewed-by: Jigal van Hemert <jigal.van.hemert@typo3.org>
Reviewed-by: Frank Naegler <frank.naegler@typo3.org>
Tested-by: Frank Naegler <frank.naegler@typo3.org>
typo3/sysext/backend/Resources/Private/TypeScript/ModuleMenu.ts
typo3/sysext/backend/Resources/Private/TypeScript/Viewport.ts
typo3/sysext/backend/Resources/Public/JavaScript/ModuleMenu.js
typo3/sysext/backend/Resources/Public/JavaScript/Viewport.js

index d5ff2f4..8a6636e 100644 (file)
@@ -151,7 +151,7 @@ class ModuleMenu {
   }
 
   constructor() {
-    this.initialize();
+    $((): void => this.initialize());
   }
 
   /**
index ab261aa..f94c4a9 100644 (file)
@@ -27,9 +27,7 @@ class Viewport {
   public readonly consumerScope: any = ConsumerScope;
 
   constructor() {
-    $((): void => {
-      this.initialize();
-    });
+    $((): void => this.initialize());
     this.NavigationContainer = new NavigationContainer(this.consumerScope);
     this.ContentContainer = new ContentContainer(this.consumerScope);
   }
index 96d0b78..6674413 100644 (file)
@@ -10,4 +10,4 @@
  *
  * The TYPO3 project - inspiring people to share!
  */
-define(["require","exports","./Enum/Viewport/ScaffoldIdentifier","jquery","./Storage/Persistent","./Viewport","./Event/ClientRequest","./Event/TriggerRequest"],function(e,n,t,o,a,i,r,d){"use strict";var l=function(){function n(){this.loadedModule=null,this.loadedNavigationComponentId="",this.initialize()}return n.getCollapsedMainMenuItems=function(){return a.isset("modulemenu")?JSON.parse(a.get("modulemenu")):{}},n.addCollapsedMainMenuItem=function(e){var t=n.getCollapsedMainMenuItems();t[e]=!0,a.set("modulemenu",JSON.stringify(t))},n.removeCollapseMainMenuItem=function(e){var n=this.getCollapsedMainMenuItems();delete n[e],a.set("modulemenu",JSON.stringify(n))},n.includeId=function(e,n){if(!e.navigationComponentId&&!e.navigationFrameScript)return n;var t="";return t="TYPO3/CMS/Backend/PageTree/PageTreeElement"===e.navigationComponentId?"web":e.name.split("_")[0],top.fsMod.recentIds[t]&&(n="id="+top.fsMod.recentIds[t]+"&"+n),n},n.toggleMenu=function(e){i.NavigationContainer.cleanup();var n=o(t.ScaffoldIdentifierEnum.scaffold),r="scaffold-modulemenu-expanded";void 0===e&&(e=n.hasClass(r)),n.toggleClass(r,!e),e||o(".scaffold").removeClass("scaffold-search-expanded").removeClass("scaffold-toolbar-expanded"),a.set("BackendComponents.States.typo3-module-menu",{collapsed:e}),i.doLayout()},n.getRecordFromName=function(e){var n=o("#"+e);return{name:e,navigationComponentId:n.data("navigationcomponentid"),navigationFrameScript:n.data("navigationframescript"),navigationFrameScriptParam:n.data("navigationframescriptparameters"),link:n.find("a").data("link")}},n.highlightModuleMenuItem=function(e){o(".modulemenu-item.active").removeClass("active"),o("#"+e).addClass("active")},n.prototype.refreshMenu=function(){o.ajax(TYPO3.settings.ajaxUrls.modulemenu).done(function(e){o("#menu").replaceWith(e.menu),top.currentModuleLoaded&&n.highlightModuleMenuItem(top.currentModuleLoaded),i.doLayout()})},n.prototype.reloadFrames=function(){i.NavigationContainer.refresh(),i.ContentContainer.refresh()},n.prototype.showModule=function(e,t,o){t=t||"";var a=n.getRecordFromName(e);return this.loadModuleComponents(a,t,new r("typo3.showModule",o))},n.prototype.initialize=function(){var e=this,t=o.Deferred();if(t.resolve(),top.startInModule&&top.startInModule[0]&&o("#"+top.startInModule[0]).length>0)t=this.showModule(top.startInModule[0],top.startInModule[1]);else{var r=o(".t3js-mainmodule:first");r.attr("id")&&(t=this.showModule(r.attr("id")))}t.then(function(){var t=a.get("BackendComponents.States.typo3-module-menu");t&&t.collapsed&&n.toggleMenu("true"===t.collapsed);var r=n.getCollapsedMainMenuItems();o.each(r,function(e,n){if(!0===n){var t=o("#"+e);if(t.length>0){var a=t.find(".modulemenu-group-container");t.addClass("collapsed").removeClass("expanded"),i.NavigationContainer.cleanup(),a.hide().promise().done(function(){i.doLayout()})}}}),e.initializeEvents()})},n.prototype.initializeEvents=function(){var e=this;o(document).on("click",".modulemenu-group .modulemenu-group-header",function(e){var t=o(e.currentTarget).parent(".modulemenu-group"),a=t.find(".modulemenu-group-container");i.NavigationContainer.cleanup(),t.hasClass("expanded")?(n.addCollapsedMainMenuItem(t.attr("id")),t.addClass("collapsed").removeClass("expanded"),a.stop().slideUp().promise().done(function(){i.doLayout()})):(n.removeCollapseMainMenuItem(t.attr("id")),t.addClass("expanded").removeClass("collapsed"),a.stop().slideDown().promise().done(function(){i.doLayout()}))}),o(document).on("click",".modulemenu-item,.t3-menuitem-submodule",function(n){n.preventDefault(),e.showModule(o(n.currentTarget).attr("id"),"",n)}),o(document).on("click",".t3js-topbar-button-modulemenu",function(e){e.preventDefault(),n.toggleMenu()}),o(document).on("click",".t3js-scaffold-content-overlay",function(e){e.preventDefault(),n.toggleMenu(!0)}),o(document).on("click",".t3js-topbar-button-navigationcomponent",function(e){e.preventDefault(),i.NavigationContainer.toggle()})},n.prototype.loadModuleComponents=function(e,t,a){var r=this,l=e.name,u=i.ContentContainer.beforeSetUrl(a);return u.then(o.proxy(function(){e.navigationComponentId?r.loadNavigationComponent(e.navigationComponentId):e.navigationFrameScript?(i.NavigationContainer.show("typo3-navigationIframe"),r.openInNavFrame(e.navigationFrameScript,e.navigationFrameScriptParam,new d("typo3.loadModuleComponents",a))):i.NavigationContainer.hide(),n.highlightModuleMenuItem(l),r.loadedModule=l,t=n.includeId(e,t),r.openInContentFrame(e.link,t,new d("typo3.loadModuleComponents",a)),top.currentSubScript=e.link,top.currentModuleLoaded=l,i.doLayout()},this)),u},n.prototype.loadNavigationComponent=function(n){var t=this;if(i.NavigationContainer.show(n),n!==this.loadedNavigationComponentId){var a=n.replace(/[/]/g,"_");""!==this.loadedNavigationComponentId&&o("#navigationComponent-"+this.loadedNavigationComponentId.replace(/[/]/g,"_")).hide(),o('.t3js-scaffold-content-navigation [data-component="'+n+'"]').length<1&&o(".t3js-scaffold-content-navigation").append(o("<div />",{class:"scaffold-content-navigation-component","data-component":n,id:"navigationComponent-"+a})),e([n],function(e){e.initialize("#navigationComponent-"+a),i.NavigationContainer.show(n),t.loadedNavigationComponentId=n})}},n.prototype.openInNavFrame=function(e,n,t){var o=e+(n?(-1!==e.indexOf("?")?"&":"?")+n:""),a=i.NavigationContainer.getUrl(),r=i.NavigationContainer.setUrl(e,new d("typo3.openInNavFrame",t));return a!==o&&("resolved"===r.state()?i.NavigationContainer.refresh():r.then(i.NavigationContainer.refresh)),r},n.prototype.openInContentFrame=function(e,n,t){var o;if(top.nextLoadModuleUrl)o=i.ContentContainer.setUrl(top.nextLoadModuleUrl,new d("typo3.openInContentFrame",t)),top.nextLoadModuleUrl="";else{var a=e+(n?(-1!==e.indexOf("?")?"&":"?")+n:"");o=i.ContentContainer.setUrl(a,new d("typo3.openInContentFrame",t))}return o},n}();return top.TYPO3.ModuleMenu||(top.TYPO3.ModuleMenu={App:new l}),top.TYPO3.ModuleMenu});
\ No newline at end of file
+define(["require","exports","./Enum/Viewport/ScaffoldIdentifier","jquery","./Storage/Persistent","./Viewport","./Event/ClientRequest","./Event/TriggerRequest"],function(e,n,t,o,a,i,r,d){"use strict";var l=function(){function n(){var e=this;this.loadedModule=null,this.loadedNavigationComponentId="",o(function(){return e.initialize()})}return n.getCollapsedMainMenuItems=function(){return a.isset("modulemenu")?JSON.parse(a.get("modulemenu")):{}},n.addCollapsedMainMenuItem=function(e){var t=n.getCollapsedMainMenuItems();t[e]=!0,a.set("modulemenu",JSON.stringify(t))},n.removeCollapseMainMenuItem=function(e){var n=this.getCollapsedMainMenuItems();delete n[e],a.set("modulemenu",JSON.stringify(n))},n.includeId=function(e,n){if(!e.navigationComponentId&&!e.navigationFrameScript)return n;var t="";return t="TYPO3/CMS/Backend/PageTree/PageTreeElement"===e.navigationComponentId?"web":e.name.split("_")[0],top.fsMod.recentIds[t]&&(n="id="+top.fsMod.recentIds[t]+"&"+n),n},n.toggleMenu=function(e){i.NavigationContainer.cleanup();var n=o(t.ScaffoldIdentifierEnum.scaffold),r="scaffold-modulemenu-expanded";void 0===e&&(e=n.hasClass(r)),n.toggleClass(r,!e),e||o(".scaffold").removeClass("scaffold-search-expanded").removeClass("scaffold-toolbar-expanded"),a.set("BackendComponents.States.typo3-module-menu",{collapsed:e}),i.doLayout()},n.getRecordFromName=function(e){var n=o("#"+e);return{name:e,navigationComponentId:n.data("navigationcomponentid"),navigationFrameScript:n.data("navigationframescript"),navigationFrameScriptParam:n.data("navigationframescriptparameters"),link:n.find("a").data("link")}},n.highlightModuleMenuItem=function(e){o(".modulemenu-item.active").removeClass("active"),o("#"+e).addClass("active")},n.prototype.refreshMenu=function(){o.ajax(TYPO3.settings.ajaxUrls.modulemenu).done(function(e){o("#menu").replaceWith(e.menu),top.currentModuleLoaded&&n.highlightModuleMenuItem(top.currentModuleLoaded),i.doLayout()})},n.prototype.reloadFrames=function(){i.NavigationContainer.refresh(),i.ContentContainer.refresh()},n.prototype.showModule=function(e,t,o){t=t||"";var a=n.getRecordFromName(e);return this.loadModuleComponents(a,t,new r("typo3.showModule",o))},n.prototype.initialize=function(){var e=this,t=o.Deferred();if(t.resolve(),top.startInModule&&top.startInModule[0]&&o("#"+top.startInModule[0]).length>0)t=this.showModule(top.startInModule[0],top.startInModule[1]);else{var r=o(".t3js-mainmodule:first");r.attr("id")&&(t=this.showModule(r.attr("id")))}t.then(function(){var t=a.get("BackendComponents.States.typo3-module-menu");t&&t.collapsed&&n.toggleMenu("true"===t.collapsed);var r=n.getCollapsedMainMenuItems();o.each(r,function(e,n){if(!0===n){var t=o("#"+e);if(t.length>0){var a=t.find(".modulemenu-group-container");t.addClass("collapsed").removeClass("expanded"),i.NavigationContainer.cleanup(),a.hide().promise().done(function(){i.doLayout()})}}}),e.initializeEvents()})},n.prototype.initializeEvents=function(){var e=this;o(document).on("click",".modulemenu-group .modulemenu-group-header",function(e){var t=o(e.currentTarget).parent(".modulemenu-group"),a=t.find(".modulemenu-group-container");i.NavigationContainer.cleanup(),t.hasClass("expanded")?(n.addCollapsedMainMenuItem(t.attr("id")),t.addClass("collapsed").removeClass("expanded"),a.stop().slideUp().promise().done(function(){i.doLayout()})):(n.removeCollapseMainMenuItem(t.attr("id")),t.addClass("expanded").removeClass("collapsed"),a.stop().slideDown().promise().done(function(){i.doLayout()}))}),o(document).on("click",".modulemenu-item,.t3-menuitem-submodule",function(n){n.preventDefault(),e.showModule(o(n.currentTarget).attr("id"),"",n)}),o(document).on("click",".t3js-topbar-button-modulemenu",function(e){e.preventDefault(),n.toggleMenu()}),o(document).on("click",".t3js-scaffold-content-overlay",function(e){e.preventDefault(),n.toggleMenu(!0)}),o(document).on("click",".t3js-topbar-button-navigationcomponent",function(e){e.preventDefault(),i.NavigationContainer.toggle()})},n.prototype.loadModuleComponents=function(e,t,a){var r=this,l=e.name,u=i.ContentContainer.beforeSetUrl(a);return u.then(o.proxy(function(){e.navigationComponentId?r.loadNavigationComponent(e.navigationComponentId):e.navigationFrameScript?(i.NavigationContainer.show("typo3-navigationIframe"),r.openInNavFrame(e.navigationFrameScript,e.navigationFrameScriptParam,new d("typo3.loadModuleComponents",a))):i.NavigationContainer.hide(),n.highlightModuleMenuItem(l),r.loadedModule=l,t=n.includeId(e,t),r.openInContentFrame(e.link,t,new d("typo3.loadModuleComponents",a)),top.currentSubScript=e.link,top.currentModuleLoaded=l,i.doLayout()},this)),u},n.prototype.loadNavigationComponent=function(n){var t=this;if(i.NavigationContainer.show(n),n!==this.loadedNavigationComponentId){var a=n.replace(/[/]/g,"_");""!==this.loadedNavigationComponentId&&o("#navigationComponent-"+this.loadedNavigationComponentId.replace(/[/]/g,"_")).hide(),o('.t3js-scaffold-content-navigation [data-component="'+n+'"]').length<1&&o(".t3js-scaffold-content-navigation").append(o("<div />",{class:"scaffold-content-navigation-component","data-component":n,id:"navigationComponent-"+a})),e([n],function(e){e.initialize("#navigationComponent-"+a),i.NavigationContainer.show(n),t.loadedNavigationComponentId=n})}},n.prototype.openInNavFrame=function(e,n,t){var o=e+(n?(-1!==e.indexOf("?")?"&":"?")+n:""),a=i.NavigationContainer.getUrl(),r=i.NavigationContainer.setUrl(e,new d("typo3.openInNavFrame",t));return a!==o&&("resolved"===r.state()?i.NavigationContainer.refresh():r.then(i.NavigationContainer.refresh)),r},n.prototype.openInContentFrame=function(e,n,t){var o;if(top.nextLoadModuleUrl)o=i.ContentContainer.setUrl(top.nextLoadModuleUrl,new d("typo3.openInContentFrame",t)),top.nextLoadModuleUrl="";else{var a=e+(n?(-1!==e.indexOf("?")?"&":"?")+n:"");o=i.ContentContainer.setUrl(a,new d("typo3.openInContentFrame",t))}return o},n}();return top.TYPO3.ModuleMenu||(top.TYPO3.ModuleMenu={App:new l}),top.TYPO3.ModuleMenu});
\ No newline at end of file
index 979a0b2..7dd12fb 100644 (file)
@@ -10,4 +10,4 @@
  *
  * The TYPO3 project - inspiring people to share!
  */
-define(["require","exports","jquery","./Viewport/ContentContainer","./Event/ConsumerScope","./Viewport/Loader","./Viewport/NavigationContainer","./Viewport/Topbar"],function(t,n,o,i,e,a,r,s){"use strict";var c,u=function(){function t(){var t=this;this.Loader=a,this.Topbar=s,this.NavigationContainer=null,this.ContentContainer=null,this.consumerScope=e,o(function(){t.initialize()}),this.NavigationContainer=new r(this.consumerScope),this.ContentContainer=new i(this.consumerScope)}return t.prototype.initialize=function(){var t=this;this.doLayout(),o(window).on("resize",function(){t.doLayout()})},t.prototype.doLayout=function(){this.NavigationContainer.cleanup(),this.NavigationContainer.calculateScrollbar(),o(".t3js-topbar-header").css("padding-right",o(".t3js-scaffold-toolbar").outerWidth())},t}();return top.TYPO3.Backend?c=top.TYPO3.Backend:(c=new u,top.TYPO3.Backend=c),c});
\ No newline at end of file
+define(["require","exports","jquery","./Viewport/ContentContainer","./Event/ConsumerScope","./Viewport/Loader","./Viewport/NavigationContainer","./Viewport/Topbar"],function(t,n,o,i,e,r,a,s){"use strict";var u,c=function(){function t(){var t=this;this.Loader=r,this.Topbar=s,this.NavigationContainer=null,this.ContentContainer=null,this.consumerScope=e,o(function(){return t.initialize()}),this.NavigationContainer=new a(this.consumerScope),this.ContentContainer=new i(this.consumerScope)}return t.prototype.initialize=function(){var t=this;this.doLayout(),o(window).on("resize",function(){t.doLayout()})},t.prototype.doLayout=function(){this.NavigationContainer.cleanup(),this.NavigationContainer.calculateScrollbar(),o(".t3js-topbar-header").css("padding-right",o(".t3js-scaffold-toolbar").outerWidth())},t}();return top.TYPO3.Backend?u=top.TYPO3.Backend:(u=new c,top.TYPO3.Backend=u),u});
\ No newline at end of file