aboutsummaryrefslogtreecommitdiff
path: root/js/panels/Timeline
diff options
context:
space:
mode:
authorJon Reid2012-07-03 14:42:03 -0700
committerJon Reid2012-07-03 14:42:03 -0700
commit539f430f95812e726ad14012965ece942a010bca (patch)
treeb8b48c2048a5a3fe7ae7bbf156205dd2a4620a9d /js/panels/Timeline
parentb05173c892ebbdb5a7568d3904011ab1bfa695a3 (diff)
downloadninja-539f430f95812e726ad14012965ece942a010bca.tar.gz
Timeline: Refactor style and layer to use pointers to parent components.
Diffstat (limited to 'js/panels/Timeline')
-rw-r--r--js/panels/Timeline/Layer.reel/Layer.js31
-rw-r--r--js/panels/Timeline/Style.reel/Style.js11
2 files changed, 29 insertions, 13 deletions
diff --git a/js/panels/Timeline/Layer.reel/Layer.js b/js/panels/Timeline/Layer.reel/Layer.js
index f7b66a39..f53d54aa 100644
--- a/js/panels/Timeline/Layer.reel/Layer.js
+++ b/js/panels/Timeline/Layer.reel/Layer.js
@@ -13,7 +13,10 @@ var ElementsMediator = require("js/mediators/element-mediator").ElementMediator;
13var Layer = exports.Layer = Montage.create(Component, { 13var Layer = exports.Layer = Montage.create(Component, {
14 14
15 /* Begin: Models */ 15 /* Begin: Models */
16 16 _timelinePanel: {
17 value: null
18 },
19
17 _dynamicLayerTag: { 20 _dynamicLayerTag: {
18 value: null 21 value: null
19 }, 22 },
@@ -664,6 +667,14 @@ var Layer = exports.Layer = Montage.create(Component, {
664 this.dtextScaleX= parseFloat(ElementsMediator.getProperty(el, "width")); 667 this.dtextScaleX= parseFloat(ElementsMediator.getProperty(el, "width"));
665 } 668 }
666 }, 669 },
670
671 willDraw: {
672 value: function() {
673 if (this._timelinePanel === null) {
674 this._timelinePanel = this.parentComponent.parentComponent;
675 }
676 }
677 },
667 678
668 draw: { 679 draw: {
669 value: function() { 680 value: function() {
@@ -770,11 +781,11 @@ var Layer = exports.Layer = Montage.create(Component, {
770 // Dispatch the event to the TimelineTrack component associated with this Layer. 781 // Dispatch the event to the TimelineTrack component associated with this Layer.
771 var myIndex = false, 782 var myIndex = false,
772 i = 0, 783 i = 0,
773 arrLayersLength = this.parentComponent.parentComponent.arrLayers.length, 784 arrLayersLength = this._timelinePanel.arrLayers.length,
774 arrTracks = document.querySelectorAll('[data-montage-id="track"]'); 785 arrTracks = document.querySelectorAll('[data-montage-id="track"]');
775 786
776 for (i = 0; i < arrLayersLength; i++) { 787 for (i = 0; i < arrLayersLength; i++) {
777 if (this.stageElement == this.parentComponent.parentComponent.arrLayers[i].layerData.stageElement) { 788 if (this.stageElement == this._timelinePanel.arrLayers[i].layerData.stageElement) {
778 myIndex = i; 789 myIndex = i;
779 } 790 }
780 } 791 }
@@ -1005,7 +1016,7 @@ var Layer = exports.Layer = Montage.create(Component, {
1005 }, 1016 },
1006 handleDragleave: { 1017 handleDragleave: {
1007 value: function(event) { 1018 value: function(event) {
1008 if (this.parentComponent.parentComponent.draggingType !== "layer") { 1019 if (this._timelinePanel.draggingType !== "layer") {
1009 return; 1020 return;
1010 } 1021 }
1011 this.element.classList.remove("dragOver"); 1022 this.element.classList.remove("dragOver");
@@ -1013,14 +1024,14 @@ var Layer = exports.Layer = Montage.create(Component, {
1013 }, 1024 },
1014 handleDragstart: { 1025 handleDragstart: {
1015 value: function(event) { 1026 value: function(event) {
1016 //this.parentComponent.parentComponent.dragLayerID = this.layerID; 1027 //this._timelinePanel.dragLayerID = this.layerID;
1017 event.dataTransfer.setData('Text', 'Layer'); 1028 event.dataTransfer.setData('Text', 'Layer');
1018 this.parentComponent.parentComponent.draggingType = "layer"; 1029 this._timelinePanel.draggingType = "layer";
1019 } 1030 }
1020 }, 1031 },
1021 handleDragover: { 1032 handleDragover: {
1022 value: function(event) { 1033 value: function(event) {
1023 if (this.parentComponent.parentComponent.draggingType !== "layer") { 1034 if (this._timelinePanel.draggingType !== "layer") {
1024 return; 1035 return;
1025 } 1036 }
1026 event.preventDefault(); 1037 event.preventDefault();
@@ -1032,13 +1043,13 @@ var Layer = exports.Layer = Montage.create(Component, {
1032 1043
1033 handleDrop : { 1044 handleDrop : {
1034 value: function(event) { 1045 value: function(event) {
1035 if (this.parentComponent.parentComponent.draggingType !== "layer") { 1046 if (this._timelinePanel.draggingType !== "layer") {
1036 return; 1047 return;
1037 } 1048 }
1038 event.stopPropagation(); 1049 event.stopPropagation();
1039 this.element.classList.remove("dragOver"); 1050 this.element.classList.remove("dragOver");
1040 if (this.parentComponent.parentComponent.dragLayerID !== this.layerID) { 1051 if (this._timelinePanel.dragLayerID !== this.layerID) {
1041 this.parentComponent.parentComponent.dropLayerID = this.layerID; 1052 this._timelinePanel.dropLayerID = this.layerID;
1042 } 1053 }
1043 return false; 1054 return false;
1044 } 1055 }
diff --git a/js/panels/Timeline/Style.reel/Style.js b/js/panels/Timeline/Style.reel/Style.js
index 78bc2db3..802c6311 100644
--- a/js/panels/Timeline/Style.reel/Style.js
+++ b/js/panels/Timeline/Style.reel/Style.js
@@ -284,6 +284,13 @@ var LayerStyle = exports.LayerStyle = Montage.create(Component, {
284 this.init(); 284 this.init();
285 } 285 }
286 }, 286 },
287 willDraw: {
288 value: function() {
289 if (this._parentLayerComponent === null) {
290 this._parentLayerComponent = this.parentComponent.parentComponent.parentComponent.parentComponent;
291 }
292 }
293 },
287 draw: { 294 draw: {
288 value: function() { 295 value: function() {
289 // Show the right view 296 // Show the right view
@@ -372,9 +379,7 @@ var LayerStyle = exports.LayerStyle = Montage.create(Component, {
372 379
373 var arrHints = [], 380 var arrHints = [],
374 i = 0; 381 i = 0;
375 382
376 this._parentLayerComponent = this.parentComponent.parentComponent.parentComponent.parentComponent;
377
378 // Get the array of hints from _myTweenables: 383 // Get the array of hints from _myTweenables:
379 for (i = 0; i < this._myTweenables.length; i++) { 384 for (i = 0; i < this._myTweenables.length; i++) {
380 arrHints.push(this._myTweenables[i].property) 385 arrHints.push(this._myTweenables[i].property)