From e33a4e58c271a9507082694a5268b840fdd05968 Mon Sep 17 00:00:00 2001 From: Jon Reid Date: Tue, 15 May 2012 11:14:16 -0700 Subject: Timeline: Code cleanup. Improve efficiency for track scrolling. --- .../Timeline/TimelinePanel.reel/TimelinePanel.js | 72 +++++++++++----------- 1 file changed, 36 insertions(+), 36 deletions(-) (limited to 'js/panels/Timeline') diff --git a/js/panels/Timeline/TimelinePanel.reel/TimelinePanel.js b/js/panels/Timeline/TimelinePanel.reel/TimelinePanel.js index 7f4fee89..d85259cb 100644 --- a/js/panels/Timeline/TimelinePanel.reel/TimelinePanel.js +++ b/js/panels/Timeline/TimelinePanel.reel/TimelinePanel.js @@ -57,6 +57,10 @@ var TimelinePanel = exports.TimelinePanel = Montage.create(Component, { this._layerRepetition = newVal; } }, + + _areTracksScrolling: { + value: false + }, // Set to false to skip array caching array sets in current document _boolCacheArrays:{ @@ -240,10 +244,6 @@ var TimelinePanel = exports.TimelinePanel = Montage.create(Component, { } }, - _isLayer:{ - value:false - }, - _firstTimeLoaded:{ value:true }, @@ -370,35 +370,6 @@ var TimelinePanel = exports.TimelinePanel = Montage.create(Component, { prepareForDraw:{ value:function () { this.initTimeline(); - // Bind the event handler for the document change events - //this.eventManager.addEventListener("onOpenDocument", this.handleDocumentChange.bind(this), false); - this.eventManager.addEventListener("closeDocument", this.handleDocumentChange.bind(this), false); - //this.eventManager.addEventListener("switchDocument", this.handleDocumentChange.bind(this), false); - //this.eventManager.addEventListener("breadCrumbBinding",this,false); - - // Bind drag and drop event handlers - this.container_layers.addEventListener("dragstart", this.handleLayerDragStart.bind(this), false); - this.container_layers.addEventListener("dragend", this.handleLayerDragEnd.bind(this), false); - this.container_layers.addEventListener("dragover", this.handleLayerDragover.bind(this), false); - this.container_layers.addEventListener("drop", this.handleLayerDrop.bind(this), false); - this.container_tracks.addEventListener("dragover", this.handleKeyframeDragover.bind(this), false); - this.container_tracks.addEventListener("drop", this.handleKeyframeDrop.bind(this), false); - - // Bind the handlers for the config menu - this.checkable_animated.addEventListener("click", this.handleAnimatedClick.bind(this), false); - this.checkable_relative.addEventListener("click", this.handleRelativeClick.bind(this), false); - this.checkable_absolute.addEventListener("click", this.handleAbsoluteClick.bind(this), false); - this.tl_configbutton.addEventListener("click", this.handleConfigButtonClick.bind(this), false); - document.addEventListener("click", this.handleDocumentClick.bind(this), false); - - } - }, - - willDraw:{ - value:function () { - if (this._isLayer) { - this._isLayer = false; - } } }, @@ -453,6 +424,14 @@ var TimelinePanel = exports.TimelinePanel = Montage.create(Component, { this._scrollTracks = false; } } + + // Do we need to scroll the layers? + if (this._areTracksScrolling) { + this._areTracksScrolling = false; + this.user_layers.scrollTop = this.layout_tracks.scrollTop; + this.layout_markers.scrollLeft = this.layout_tracks.scrollLeft; + this.playheadmarker.style.top = this.layout_tracks.scrollTop + "px"; + } } }, @@ -597,6 +576,28 @@ var TimelinePanel = exports.TimelinePanel = Montage.create(Component, { this.layout_tracks = this.element.querySelector(".layout-tracks"); this.layout_markers = this.element.querySelector(".layout_markers"); + + // Bind the event handler for the document change events + //this.eventManager.addEventListener("onOpenDocument", this.handleDocumentChange.bind(this), false); + this.eventManager.addEventListener("closeDocument", this.handleDocumentChange.bind(this), false); + //this.eventManager.addEventListener("switchDocument", this.handleDocumentChange.bind(this), false); + //this.eventManager.addEventListener("breadCrumbBinding",this,false); + + // Bind drag and drop event handlers + this.container_layers.addEventListener("dragstart", this.handleLayerDragStart.bind(this), false); + this.container_layers.addEventListener("dragend", this.handleLayerDragEnd.bind(this), false); + this.container_layers.addEventListener("dragover", this.handleLayerDragover.bind(this), false); + this.container_layers.addEventListener("drop", this.handleLayerDrop.bind(this), false); + this.container_tracks.addEventListener("dragover", this.handleKeyframeDragover.bind(this), false); + this.container_tracks.addEventListener("drop", this.handleKeyframeDrop.bind(this), false); + + // Bind the handlers for the config menu + this.checkable_animated.addEventListener("click", this.handleAnimatedClick.bind(this), false); + this.checkable_relative.addEventListener("click", this.handleRelativeClick.bind(this), false); + this.checkable_absolute.addEventListener("click", this.handleAbsoluteClick.bind(this), false); + this.tl_configbutton.addEventListener("click", this.handleConfigButtonClick.bind(this), false); + document.addEventListener("click", this.handleDocumentClick.bind(this), false); + // Add some event handlers this.timeline_leftpane.addEventListener("mousedown", this.timelineLeftPaneMousedown.bind(this), false); this.timeline_leftpane.addEventListener("mouseup", this.timelineLeftPaneMouseup.bind(this), false); @@ -824,9 +825,8 @@ var TimelinePanel = exports.TimelinePanel = Montage.create(Component, { updateLayerScroll:{ value:function () { - this.user_layers.scrollTop = this.layout_tracks.scrollTop; - this.layout_markers.scrollLeft = this.layout_tracks.scrollLeft; - this.playheadmarker.style.top = this.layout_tracks.scrollTop + "px"; + this._areTracksScrolling = true; + this.needsDraw = true; } }, -- cgit v1.2.3