From c3cb71e8acc6a2ace68b625cd24d5b87dbf7ed9f Mon Sep 17 00:00:00 2001
From: Andreas Fernandez <a.fernandez@scripting-base.de>
Date: Sun, 22 Mar 2020 16:32:35 +0100
Subject: [PATCH] [BUGFIX] Debounce or throttle scroll/resize events
This patch debounced or throttles some `scroll` or `resize` events to
improve the client performance a bit, as the event listeners aren't
executed anymore everytime the event is triggered.
Resolves: #90810
Releases: master
Change-Id: Id5262eebd004ee4d10d87a83cc17e3f517aca1a8
Reviewed-on: https://review.typo3.org/c/Packages/TYPO3.CMS/+/63844
Tested-by: TYPO3com <noreply@typo3.com>
Tested-by: Susanne Moog <look@susi.dev>
Tested-by: Daniel Goerz <daniel.goerz@posteo.de>
Reviewed-by: Susanne Moog <look@susi.dev>
Reviewed-by: Daniel Goerz <daniel.goerz@posteo.de>
---
.../backend/Resources/Public/TypeScript/DocumentHeader.ts | 8 +++++---
.../backend/Resources/Public/TypeScript/Viewport.ts | 5 +++--
.../workspaces/Resources/Public/TypeScript/Preview.ts | 4 ++--
.../backend/Resources/Public/JavaScript/DocumentHeader.js | 2 +-
.../backend/Resources/Public/JavaScript/Viewport.js | 2 +-
.../workspaces/Resources/Public/JavaScript/Preview.js | 2 +-
6 files changed, 13 insertions(+), 10 deletions(-)
diff --git a/Build/Sources/TypeScript/backend/Resources/Public/TypeScript/DocumentHeader.ts b/Build/Sources/TypeScript/backend/Resources/Public/TypeScript/DocumentHeader.ts
index 28425b3848fb..4c9a0e5305a3 100644
--- a/Build/Sources/TypeScript/backend/Resources/Public/TypeScript/DocumentHeader.ts
+++ b/Build/Sources/TypeScript/backend/Resources/Public/TypeScript/DocumentHeader.ts
@@ -12,6 +12,8 @@
*/
import * as $ from 'jquery';
+import DebounceEvent = require('TYPO3/CMS/Core/Event/DebounceEvent');
+import ThrottleEvent = require('TYPO3/CMS/Core/Event/ThrottleEvent');
/**
* Module: TYPO3/CMS/Backend/DocumentHeader
@@ -79,8 +81,8 @@ class DocumentHeader {
*/
private start(): void {
this.reposition();
- $(window).on('resize', this.reposition);
- $('.t3js-module-docheader + .t3js-module-body').on('scroll', this.scroll);
+ new DebounceEvent('resize', this.reposition).bindTo(window);
+ new ThrottleEvent('scroll', this.scroll, 100).bindTo(document.querySelector('.t3js-module-docheader + .t3js-module-body'));
}
/**
@@ -89,7 +91,7 @@ class DocumentHeader {
* @param {Event} e
*/
private scroll = (e: Event): void => {
- this.currentPosition = $(e.currentTarget).scrollTop();
+ this.currentPosition = $(e.target).scrollTop();
if (this.currentPosition > this.lastPosition) {
if (this.direction !== 'down') {
this.direction = 'down';
diff --git a/Build/Sources/TypeScript/backend/Resources/Public/TypeScript/Viewport.ts b/Build/Sources/TypeScript/backend/Resources/Public/TypeScript/Viewport.ts
index 675ccf11d072..0320dd45a8f4 100644
--- a/Build/Sources/TypeScript/backend/Resources/Public/TypeScript/Viewport.ts
+++ b/Build/Sources/TypeScript/backend/Resources/Public/TypeScript/Viewport.ts
@@ -17,6 +17,7 @@ import ConsumerScope = require('./Event/ConsumerScope');
import Loader = require('./Viewport/Loader');
import NavigationContainer = require('./Viewport/NavigationContainer');
import Topbar = require('./Viewport/Topbar');
+import ThrottleEvent = require('TYPO3/CMS/Core/Event/ThrottleEvent');
class Viewport {
// The attributes are uppercase for compatibility reasons
@@ -41,9 +42,9 @@ class Viewport {
private initialize(): void {
this.doLayout();
- $(window).on('resize', () => {
+ new ThrottleEvent('resize', () => {
this.doLayout();
- });
+ }, 100).bindTo(window);
}
}
diff --git a/Build/Sources/TypeScript/workspaces/Resources/Public/TypeScript/Preview.ts b/Build/Sources/TypeScript/workspaces/Resources/Public/TypeScript/Preview.ts
index 64584c77c672..a047d4c310b0 100644
--- a/Build/Sources/TypeScript/workspaces/Resources/Public/TypeScript/Preview.ts
+++ b/Build/Sources/TypeScript/workspaces/Resources/Public/TypeScript/Preview.ts
@@ -84,9 +84,9 @@ class Preview extends Workspaces {
* Registers the events
*/
private registerEvents(): void {
- $(window).on('resize', (): void => {
+ new ThrottleEvent('resize', (): void => {
this.resizeViews();
- });
+ }, 50).bindTo(window);
$(document)
.on('click', Identifiers.discardAction, this.renderDiscardWindow)
.on('click', Identifiers.sendToStageAction, this.renderSendPageToStageWindow)
diff --git a/typo3/sysext/backend/Resources/Public/JavaScript/DocumentHeader.js b/typo3/sysext/backend/Resources/Public/JavaScript/DocumentHeader.js
index dd3c8274b86c..0e5ce11afef5 100644
--- a/typo3/sysext/backend/Resources/Public/JavaScript/DocumentHeader.js
+++ b/typo3/sysext/backend/Resources/Public/JavaScript/DocumentHeader.js
@@ -10,4 +10,4 @@
*
* The TYPO3 project - inspiring people to share!
*/
-define(["require","exports","jquery"],(function(t,e,i){"use strict";return new class{constructor(){this.$documentHeader=null,this.$documentHeaderBars=null,this.$documentHeaderNavigationBar=null,this.$documentHeaderSearchBar=null,this.$moduleBody=null,this.direction="down",this.reactionRange=300,this.lastPosition=0,this.currentPosition=0,this.changedPosition=0,this.settings={margin:24,offset:100,selectors:{moduleDocumentHeader:".t3js-module-docheader",moduleDocheaderBar:".t3js-module-docheader-bar",moduleNavigationBar:".t3js-module-docheader-bar-navigation",moduleButtonBar:".t3js-module-docheader-bar-buttons",moduleSearchBar:".t3js-module-docheader-bar-search",moduleBody:".t3js-module-body"}},this.reposition=()=>{this.$documentHeader.css("height","auto"),this.$documentHeaderBars.css("height","auto"),this.$moduleBody.css("padding-top",this.$documentHeader.outerHeight()+this.settings.margin)},this.scroll=t=>{this.currentPosition=i(t.currentTarget).scrollTop(),this.currentPosition>this.lastPosition?"down"!==this.direction&&(this.direction="down",this.changedPosition=this.currentPosition):this.currentPosition<this.lastPosition&&"up"!==this.direction&&(this.direction="up",this.changedPosition=this.currentPosition),"up"===this.direction&&this.changedPosition-this.reactionRange<this.currentPosition&&this.$documentHeader.css("margin-top",0),"down"===this.direction&&this.changedPosition+this.reactionRange<this.currentPosition&&this.$documentHeader.css("margin-top",-1*(this.$documentHeaderNavigationBar.outerHeight()+4)),this.lastPosition=this.currentPosition},i(()=>{this.initialize()})}initialize(){this.$documentHeader=i(this.settings.selectors.moduleDocumentHeader),this.$documentHeader.length>0&&(this.$documentHeaderBars=i(this.settings.selectors.moduleDocheaderBar),this.$documentHeaderNavigationBar=i(this.settings.selectors.moduleNavigationBar),this.$documentHeaderSearchBar=i(this.settings.selectors.moduleSearchBar).remove(),this.$documentHeaderSearchBar.length>0&&this.$documentHeader.append(this.$documentHeaderSearchBar),this.$moduleBody=i(this.settings.selectors.moduleBody),this.start())}start(){this.reposition(),i(window).on("resize",this.reposition),i(".t3js-module-docheader + .t3js-module-body").on("scroll",this.scroll)}}}));
\ No newline at end of file
+define(["require","exports","jquery","TYPO3/CMS/Core/Event/DebounceEvent","TYPO3/CMS/Core/Event/ThrottleEvent"],(function(t,e,i,o,s){"use strict";return new class{constructor(){this.$documentHeader=null,this.$documentHeaderBars=null,this.$documentHeaderNavigationBar=null,this.$documentHeaderSearchBar=null,this.$moduleBody=null,this.direction="down",this.reactionRange=300,this.lastPosition=0,this.currentPosition=0,this.changedPosition=0,this.settings={margin:24,offset:100,selectors:{moduleDocumentHeader:".t3js-module-docheader",moduleDocheaderBar:".t3js-module-docheader-bar",moduleNavigationBar:".t3js-module-docheader-bar-navigation",moduleButtonBar:".t3js-module-docheader-bar-buttons",moduleSearchBar:".t3js-module-docheader-bar-search",moduleBody:".t3js-module-body"}},this.reposition=()=>{this.$documentHeader.css("height","auto"),this.$documentHeaderBars.css("height","auto"),this.$moduleBody.css("padding-top",this.$documentHeader.outerHeight()+this.settings.margin)},this.scroll=t=>{this.currentPosition=i(t.target).scrollTop(),this.currentPosition>this.lastPosition?"down"!==this.direction&&(this.direction="down",this.changedPosition=this.currentPosition):this.currentPosition<this.lastPosition&&"up"!==this.direction&&(this.direction="up",this.changedPosition=this.currentPosition),"up"===this.direction&&this.changedPosition-this.reactionRange<this.currentPosition&&this.$documentHeader.css("margin-top",0),"down"===this.direction&&this.changedPosition+this.reactionRange<this.currentPosition&&this.$documentHeader.css("margin-top",-1*(this.$documentHeaderNavigationBar.outerHeight()+4)),this.lastPosition=this.currentPosition},i(()=>{this.initialize()})}initialize(){this.$documentHeader=i(this.settings.selectors.moduleDocumentHeader),this.$documentHeader.length>0&&(this.$documentHeaderBars=i(this.settings.selectors.moduleDocheaderBar),this.$documentHeaderNavigationBar=i(this.settings.selectors.moduleNavigationBar),this.$documentHeaderSearchBar=i(this.settings.selectors.moduleSearchBar).remove(),this.$documentHeaderSearchBar.length>0&&this.$documentHeader.append(this.$documentHeaderSearchBar),this.$moduleBody=i(this.settings.selectors.moduleBody),this.start())}start(){this.reposition(),new o("resize",this.reposition).bindTo(window),new s("scroll",this.scroll,100).bindTo(document.querySelector(".t3js-module-docheader + .t3js-module-body"))}}}));
\ No newline at end of file
diff --git a/typo3/sysext/backend/Resources/Public/JavaScript/Viewport.js b/typo3/sysext/backend/Resources/Public/JavaScript/Viewport.js
index 04686c897e5d..984012ed6ee2 100644
--- a/typo3/sysext/backend/Resources/Public/JavaScript/Viewport.js
+++ b/typo3/sysext/backend/Resources/Public/JavaScript/Viewport.js
@@ -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,i,o,n,e,a,r,s){"use strict";class c{constructor(){this.Loader=a,this.NavigationContainer=null,this.ContentContainer=null,this.consumerScope=e,o(()=>this.initialize()),this.Topbar=new s,this.NavigationContainer=new r(this.consumerScope),this.ContentContainer=new n(this.consumerScope)}doLayout(){this.NavigationContainer.cleanup(),this.NavigationContainer.calculateScrollbar(),o(".t3js-topbar-header").css("padding-right",o(".t3js-scaffold-toolbar").outerWidth())}initialize(){this.doLayout(),o(window).on("resize",()=>{this.doLayout()})}}let u;return top.TYPO3.Backend?u=top.TYPO3.Backend:(u=new c,top.TYPO3.Backend=u),u}));
\ No newline at end of file
+define(["require","exports","jquery","./Viewport/ContentContainer","./Event/ConsumerScope","./Viewport/Loader","./Viewport/NavigationContainer","./Viewport/Topbar","TYPO3/CMS/Core/Event/ThrottleEvent"],(function(t,e,n,o,i,a,r,s,c){"use strict";class h{constructor(){this.Loader=a,this.NavigationContainer=null,this.ContentContainer=null,this.consumerScope=i,n(()=>this.initialize()),this.Topbar=new s,this.NavigationContainer=new r(this.consumerScope),this.ContentContainer=new o(this.consumerScope)}doLayout(){this.NavigationContainer.cleanup(),this.NavigationContainer.calculateScrollbar(),n(".t3js-topbar-header").css("padding-right",n(".t3js-scaffold-toolbar").outerWidth())}initialize(){this.doLayout(),new c("resize",()=>{this.doLayout()},100).bindTo(window)}}let u;return top.TYPO3.Backend?u=top.TYPO3.Backend:(u=new h,top.TYPO3.Backend=u),u}));
\ No newline at end of file
diff --git a/typo3/sysext/workspaces/Resources/Public/JavaScript/Preview.js b/typo3/sysext/workspaces/Resources/Public/JavaScript/Preview.js
index 709ae196528b..3d21258bcc54 100644
--- a/typo3/sysext/workspaces/Resources/Public/JavaScript/Preview.js
+++ b/typo3/sysext/workspaces/Resources/Public/JavaScript/Preview.js
@@ -10,4 +10,4 @@
*
* The TYPO3 project - inspiring people to share!
*/
-define(["require","exports","TYPO3/CMS/Backend/Enum/Severity","jquery","TYPO3/CMS/Backend/Modal","TYPO3/CMS/Backend/Utility","./Workspaces","TYPO3/CMS/Core/Event/ThrottleEvent"],(function(e,t,s,i,a,n,r,o){"use strict";var d;!function(e){e.topbar="#typo3-topbar",e.workspacePanel=".workspace-panel",e.liveView="#live-view",e.workspaceTabs='.t3js-workspace-tabs [data-toggle="tab"]',e.workspaceActions=".t3js-workspace-actions",e.stageSlider="#workspace-stage-slider",e.workspaceView="#workspace-view",e.workspaceList="#workspace-list",e.sendToStageAction='[data-action="send-to-stage"]',e.discardAction='[data-action="discard"]',e.stageButtonsContainer=".t3js-stage-buttons",e.previewModeContainer=".t3js-preview-mode",e.activePreviewMode=".t3js-active-preview-mode",e.workspacePreview=".t3js-workspace-preview"}(d||(d={}));class c extends r.default{constructor(){super(),this.currentSlidePosition=100,this.elements={},this.updateSlidePosition=e=>{this.currentSlidePosition=parseInt(e.target.value,10),this.resizeViews()},this.renderDiscardWindow=()=>{const e=a.confirm(TYPO3.lang["window.discardAll.title"],TYPO3.lang["window.discardAll.message"],s.SeverityEnum.warning,[{text:TYPO3.lang.cancel,active:!0,btnClass:"btn-default",name:"cancel",trigger:()=>{e.modal("hide")}},{text:TYPO3.lang.ok,btnClass:"btn-warning",name:"ok"}]);e.on("button.clicked",t=>{"ok"===t.target.name&&this.sendRemoteRequest([this.generateRemoteActionsPayload("discardStagesFromPage",[TYPO3.settings.Workspaces.id]),this.generateRemoteActionsPayload("updateStageChangeButtons",[TYPO3.settings.Workspaces.id])]).then(async t=>{e.modal("hide"),this.renderStageButtons((await t.resolve())[1].result),this.elements.$workspaceView.attr("src",this.elements.$workspaceView.attr("src")),this.elements.$workspaceList.attr("src",this.elements.$workspaceList.attr("src"))})})},this.renderSendPageToStageWindow=e=>{const t=e.currentTarget,s=t.dataset.direction;let i;if("prev"===s)i="sendPageToPreviousStage";else{if("next"!==s)throw"Invalid direction "+s+" requested.";i="sendPageToNextStage"}this.sendRemoteRequest(this.generateRemoteActionsPayload(i,[TYPO3.settings.Workspaces.id])).then(async e=>{const s=await e.resolve(),i=this.renderSendToStageWindow(s);i.on("button.clicked",e=>{if("ok"===e.target.name){const a=n.convertFormToObject(e.currentTarget.querySelector("form"));a.affects=s[0].result.affects,a.stageId=t.dataset.stageId,this.sendRemoteRequest([this.generateRemoteActionsPayload("sentCollectionToStage",[a]),this.generateRemoteActionsPayload("updateStageChangeButtons",[TYPO3.settings.Workspaces.id])]).then(async e=>{i.modal("hide"),this.renderStageButtons((await e.resolve())[1].result)})}})})},this.changePreviewMode=e=>{e.preventDefault();const t=i(e.currentTarget),s=this.elements.$activePreviewMode.data("activePreviewMode"),a=t.data("previewMode");this.elements.$activePreviewMode.text(t.text()).data("activePreviewMode",a),this.elements.$workspacePreview.parent().removeClass("preview-mode-"+s).addClass("preview-mode-"+a),"slider"===a?(this.elements.$stageSlider.parent().toggle(!0),this.resizeViews()):(this.elements.$stageSlider.parent().toggle(!1),"vbox"===a?this.elements.$liveView.height("100%"):this.elements.$liveView.height("50%"))},i(()=>{this.getElements(),this.resizeViews(),this.adjustPreviewModeSelectorWidth(),this.registerEvents()})}static getAvailableSpace(){return i(window).height()-i(d.topbar).outerHeight()}getElements(){this.elements.$liveView=i(d.liveView),this.elements.$workspacePanel=i(d.workspacePanel),this.elements.$workspaceTabs=i(d.workspaceTabs),this.elements.$workspaceActions=i(d.workspaceActions),this.elements.$stageSlider=i(d.stageSlider),this.elements.$workspaceView=i(d.workspaceView),this.elements.$workspaceList=i(d.workspaceList),this.elements.$stageButtonsContainer=i(d.stageButtonsContainer),this.elements.$previewModeContainer=i(d.previewModeContainer),this.elements.$activePreviewMode=i(d.activePreviewMode),this.elements.$workspacePreview=i(d.workspacePreview)}registerEvents(){i(window).on("resize",()=>{this.resizeViews()}),i(document).on("click",d.discardAction,this.renderDiscardWindow).on("click",d.sendToStageAction,this.renderSendPageToStageWindow),this.elements.$workspaceTabs.on("show.bs.tab",e=>{this.elements.$workspaceActions.toggle(e.currentTarget.dataset.actions)}),new o("input",this.updateSlidePosition,25).bindTo(document.querySelector(d.stageSlider)),this.elements.$previewModeContainer.find("[data-preview-mode]").on("click",this.changePreviewMode)}renderStageButtons(e){this.elements.$stageButtonsContainer.html(e)}resizeViews(){const e=c.getAvailableSpace(),t=-1*(this.currentSlidePosition-100),s=Math.round(Math.abs(e*t/100)),i=this.elements.$liveView.outerHeight()-this.elements.$liveView.height();this.elements.$workspacePreview.height(e),"slider"===this.elements.$activePreviewMode.data("activePreviewMode")&&this.elements.$liveView.height(s-i),this.elements.$workspaceList.height(e)}adjustPreviewModeSelectorWidth(){const e=this.elements.$previewModeContainer.find(".btn-group");let t=0;e.addClass("open"),this.elements.$previewModeContainer.find("li > a > span").each((e,s)=>{const a=i(s).width();t<a&&(t=a)}),e.removeClass("open"),this.elements.$activePreviewMode.width(t)}}return new c}));
\ No newline at end of file
+define(["require","exports","TYPO3/CMS/Backend/Enum/Severity","jquery","TYPO3/CMS/Backend/Modal","TYPO3/CMS/Backend/Utility","./Workspaces","TYPO3/CMS/Core/Event/ThrottleEvent"],(function(e,t,s,i,a,n,r,o){"use strict";var d;!function(e){e.topbar="#typo3-topbar",e.workspacePanel=".workspace-panel",e.liveView="#live-view",e.workspaceTabs='.t3js-workspace-tabs [data-toggle="tab"]',e.workspaceActions=".t3js-workspace-actions",e.stageSlider="#workspace-stage-slider",e.workspaceView="#workspace-view",e.workspaceList="#workspace-list",e.sendToStageAction='[data-action="send-to-stage"]',e.discardAction='[data-action="discard"]',e.stageButtonsContainer=".t3js-stage-buttons",e.previewModeContainer=".t3js-preview-mode",e.activePreviewMode=".t3js-active-preview-mode",e.workspacePreview=".t3js-workspace-preview"}(d||(d={}));class c extends r.default{constructor(){super(),this.currentSlidePosition=100,this.elements={},this.updateSlidePosition=e=>{this.currentSlidePosition=parseInt(e.target.value,10),this.resizeViews()},this.renderDiscardWindow=()=>{const e=a.confirm(TYPO3.lang["window.discardAll.title"],TYPO3.lang["window.discardAll.message"],s.SeverityEnum.warning,[{text:TYPO3.lang.cancel,active:!0,btnClass:"btn-default",name:"cancel",trigger:()=>{e.modal("hide")}},{text:TYPO3.lang.ok,btnClass:"btn-warning",name:"ok"}]);e.on("button.clicked",t=>{"ok"===t.target.name&&this.sendRemoteRequest([this.generateRemoteActionsPayload("discardStagesFromPage",[TYPO3.settings.Workspaces.id]),this.generateRemoteActionsPayload("updateStageChangeButtons",[TYPO3.settings.Workspaces.id])]).then(async t=>{e.modal("hide"),this.renderStageButtons((await t.resolve())[1].result),this.elements.$workspaceView.attr("src",this.elements.$workspaceView.attr("src")),this.elements.$workspaceList.attr("src",this.elements.$workspaceList.attr("src"))})})},this.renderSendPageToStageWindow=e=>{const t=e.currentTarget,s=t.dataset.direction;let i;if("prev"===s)i="sendPageToPreviousStage";else{if("next"!==s)throw"Invalid direction "+s+" requested.";i="sendPageToNextStage"}this.sendRemoteRequest(this.generateRemoteActionsPayload(i,[TYPO3.settings.Workspaces.id])).then(async e=>{const s=await e.resolve(),i=this.renderSendToStageWindow(s);i.on("button.clicked",e=>{if("ok"===e.target.name){const a=n.convertFormToObject(e.currentTarget.querySelector("form"));a.affects=s[0].result.affects,a.stageId=t.dataset.stageId,this.sendRemoteRequest([this.generateRemoteActionsPayload("sentCollectionToStage",[a]),this.generateRemoteActionsPayload("updateStageChangeButtons",[TYPO3.settings.Workspaces.id])]).then(async e=>{i.modal("hide"),this.renderStageButtons((await e.resolve())[1].result)})}})})},this.changePreviewMode=e=>{e.preventDefault();const t=i(e.currentTarget),s=this.elements.$activePreviewMode.data("activePreviewMode"),a=t.data("previewMode");this.elements.$activePreviewMode.text(t.text()).data("activePreviewMode",a),this.elements.$workspacePreview.parent().removeClass("preview-mode-"+s).addClass("preview-mode-"+a),"slider"===a?(this.elements.$stageSlider.parent().toggle(!0),this.resizeViews()):(this.elements.$stageSlider.parent().toggle(!1),"vbox"===a?this.elements.$liveView.height("100%"):this.elements.$liveView.height("50%"))},i(()=>{this.getElements(),this.resizeViews(),this.adjustPreviewModeSelectorWidth(),this.registerEvents()})}static getAvailableSpace(){return i(window).height()-i(d.topbar).outerHeight()}getElements(){this.elements.$liveView=i(d.liveView),this.elements.$workspacePanel=i(d.workspacePanel),this.elements.$workspaceTabs=i(d.workspaceTabs),this.elements.$workspaceActions=i(d.workspaceActions),this.elements.$stageSlider=i(d.stageSlider),this.elements.$workspaceView=i(d.workspaceView),this.elements.$workspaceList=i(d.workspaceList),this.elements.$stageButtonsContainer=i(d.stageButtonsContainer),this.elements.$previewModeContainer=i(d.previewModeContainer),this.elements.$activePreviewMode=i(d.activePreviewMode),this.elements.$workspacePreview=i(d.workspacePreview)}registerEvents(){new o("resize",()=>{this.resizeViews()},50).bindTo(window),i(document).on("click",d.discardAction,this.renderDiscardWindow).on("click",d.sendToStageAction,this.renderSendPageToStageWindow),this.elements.$workspaceTabs.on("show.bs.tab",e=>{this.elements.$workspaceActions.toggle(e.currentTarget.dataset.actions)}),new o("input",this.updateSlidePosition,25).bindTo(document.querySelector(d.stageSlider)),this.elements.$previewModeContainer.find("[data-preview-mode]").on("click",this.changePreviewMode)}renderStageButtons(e){this.elements.$stageButtonsContainer.html(e)}resizeViews(){const e=c.getAvailableSpace(),t=-1*(this.currentSlidePosition-100),s=Math.round(Math.abs(e*t/100)),i=this.elements.$liveView.outerHeight()-this.elements.$liveView.height();this.elements.$workspacePreview.height(e),"slider"===this.elements.$activePreviewMode.data("activePreviewMode")&&this.elements.$liveView.height(s-i),this.elements.$workspaceList.height(e)}adjustPreviewModeSelectorWidth(){const e=this.elements.$previewModeContainer.find(".btn-group");let t=0;e.addClass("open"),this.elements.$previewModeContainer.find("li > a > span").each((e,s)=>{const a=i(s).width();t<a&&(t=a)}),e.removeClass("open"),this.elements.$activePreviewMode.width(t)}}return new c}));
\ No newline at end of file
--
GitLab