aboutsummaryrefslogtreecommitdiff
path: root/js/panels/Timeline/Layer.reel/Layer.js
diff options
context:
space:
mode:
Diffstat (limited to 'js/panels/Timeline/Layer.reel/Layer.js')
-rw-r--r--js/panels/Timeline/Layer.reel/Layer.js65
1 files changed, 25 insertions, 40 deletions
diff --git a/js/panels/Timeline/Layer.reel/Layer.js b/js/panels/Timeline/Layer.reel/Layer.js
index b0f6d220..4fb3e43c 100644
--- a/js/panels/Timeline/Layer.reel/Layer.js
+++ b/js/panels/Timeline/Layer.reel/Layer.js
@@ -133,6 +133,20 @@ var Layer = exports.Layer = Montage.create(Component, {
133 } 133 }
134 }, 134 },
135 135
136 _stageElement: {
137 value: null
138 },
139
140 stageElement: {
141 get: function() {
142 return this._stageElement;
143 },
144 set: function(newVal) {
145 this._stageElement = newVal;
146 this.layerData.stageElement = newVal;
147 }
148 },
149
136 150
137 _elementsList : { 151 _elementsList : {
138 value: [] 152 value: []
@@ -398,6 +412,7 @@ var Layer = exports.Layer = Montage.create(Component, {
398 412
399 this.layerName = this.layerData.layerName; 413 this.layerName = this.layerData.layerName;
400 this.layerID = this.layerData.layerID; 414 this.layerID = this.layerData.layerID;
415 this.stageElement = this.layerData.stageElement
401 this.arrLayerStyles = this.layerData.arrLayerStyles; 416 this.arrLayerStyles = this.layerData.arrLayerStyles;
402 this.isMainCollapsed = this.layerData.isMainCollapsed; 417 this.isMainCollapsed = this.layerData.isMainCollapsed;
403 this.isPositionCollapsed = this.layerData.isPositionCollapsed; 418 this.isPositionCollapsed = this.layerData.isPositionCollapsed;
@@ -485,19 +500,18 @@ var Layer = exports.Layer = Montage.create(Component, {
485 this.element.addEventListener("dragleave", this.handleDragleave.bind(this), false); 500 this.element.addEventListener("dragleave", this.handleDragleave.bind(this), false);
486 this.element.addEventListener("dragstart", this.handleDragstart.bind(this), false); 501 this.element.addEventListener("dragstart", this.handleDragstart.bind(this), false);
487 this.element.addEventListener("drop", this.handleDrop.bind(this), false); 502 this.element.addEventListener("drop", this.handleDrop.bind(this), false);
488
489 this.eventManager.addEventListener("updatedID", this, false);
490
491
492
493 } 503 }
494 }, 504 },
495 draw: { 505 draw: {
496 value: function() { 506 value: function() {
497 if (this.isSelected) { 507 var boolHasClass = this.element.classList.contains("layerSelected");
498 this.element.classList.add("selected"); 508 if (this.isSelected && !boolHasClass) {
499 } else { 509 //console.log('Layer.draw, adding selection for layer ', this.layerName)
500 this.element.classList.remove("selected"); 510 this.element.classList.add("layerSelected");
511 }
512 if (!this.isSelected && boolHasClass) {
513 //console.log('Layer.draw, removing selection for layer ', this.layerName)
514 this.element.classList.remove("layerSelected");
501 } 515 }
502 } 516 }
503 }, 517 },
@@ -505,14 +519,6 @@ var Layer = exports.Layer = Montage.create(Component, {
505 value: function() { 519 value: function() {
506 // console.log("Layer.didDraw: Layer "+ this.layerID ); 520 // console.log("Layer.didDraw: Layer "+ this.layerID );
507 if (this._isFirstDraw === true) { 521 if (this._isFirstDraw === true) {
508 if (this.isSelected === true) {
509 if (this.application.ninja.currentDocument._uuid === this._docUUID) {
510 // Once we're done drawing the first time we need to tell the TimelinePanel if
511 // this layer is supposed to be selected.
512 //console.log('layerName ' + this.layerName);
513 this.parentComponent.parentComponent.selectedLayerID = this.layerID;
514 }
515 }
516 this._isFirstDraw = false; 522 this._isFirstDraw = false;
517 this.layerData._isFirstDraw = false; 523 this.layerData._isFirstDraw = false;
518 524
@@ -520,7 +526,6 @@ var Layer = exports.Layer = Montage.create(Component, {
520 this.mainCollapser.myContent.style.height = "auto"; 526 this.mainCollapser.myContent.style.height = "auto";
521 this.mainCollapser.myContent.classList.remove(this.mainCollapser.collapsedClass); 527 this.mainCollapser.myContent.classList.remove(this.mainCollapser.collapsedClass);
522 this.mainCollapser.clicker.classList.remove(this.mainCollapser.collapsedClass); 528 this.mainCollapser.clicker.classList.remove(this.mainCollapser.collapsedClass);
523
524 } 529 }
525 if (this.isPositionCollapsed === false) { 530 if (this.isPositionCollapsed === false) {
526 this.positionCollapser.myContent.style.height = "auto"; 531 this.positionCollapser.myContent.style.height = "auto";
@@ -534,9 +539,6 @@ var Layer = exports.Layer = Montage.create(Component, {
534 } 539 }
535 540
536 } 541 }
537
538
539
540 } 542 }
541 }, 543 },
542 /* End: Draw cycle */ 544 /* End: Draw cycle */
@@ -674,7 +676,7 @@ var Layer = exports.Layer = Montage.create(Component, {
674 this.dynamicLayerName.value = this._layerEditable.value; 676 this.dynamicLayerName.value = this._layerEditable.value;
675 this.needsDraw = true; 677 this.needsDraw = true;
676 this.application.ninja.documentController.activeDocument.needsSave = true; 678 this.application.ninja.documentController.activeDocument.needsSave = true;
677 this.layerData.elementsList[0].setAttribute("id",this.dynamicLayerName.value); 679 this.layerData.stageElement.setAttribute("id",this.dynamicLayerName.value);
678 } 680 }
679 }, 681 },
680 handleAddStyleClick: { 682 handleAddStyleClick: {
@@ -786,7 +788,7 @@ var Layer = exports.Layer = Montage.create(Component, {
786 }, 788 },
787 handleDragstart: { 789 handleDragstart: {
788 value: function(event) { 790 value: function(event) {
789 this.parentComponent.parentComponent.dragLayerID = this.layerID; 791 //this.parentComponent.parentComponent.dragLayerID = this.layerID;
790 event.dataTransfer.setData('Text', 'Layer'); 792 event.dataTransfer.setData('Text', 'Layer');
791 this.parentComponent.parentComponent.draggingType = "layer"; 793 this.parentComponent.parentComponent.draggingType = "layer";
792 } 794 }
@@ -847,23 +849,6 @@ var Layer = exports.Layer = Montage.create(Component, {
847 } 849 }
848 } 850 }
849 }, 851 },
850
851 handleUpdatedID:{
852 value:function(event){
853 var i= this.application.ninja.timeline.arrLayers.length;
854 if(event.detail.id){
855 for(var k=0;k<i;k++){
856 if(this.application.ninja.timeline.arrLayers[k].layerData.layerID=== this.application.ninja.timeline.currentLayerSelected.layerData.layerID){
857 this.application.ninja.timeline.currentLayerSelected.layerData.layerName = event.detail.id;
858 this.application.ninja.timeline.triggerLayerBinding(k);
859 this.needsDraw=true;
860 }
861 }
862
863 }
864 }
865 }
866
867 /* End: Logging routines */ 852 /* End: Logging routines */
868 853
869}); 854});