diff options
Diffstat (limited to 'js/panels/Timeline/Layer.reel')
-rw-r--r-- | js/panels/Timeline/Layer.reel/Layer.html | 3 | ||||
-rw-r--r-- | js/panels/Timeline/Layer.reel/Layer.js | 44 |
2 files changed, 33 insertions, 14 deletions
diff --git a/js/panels/Timeline/Layer.reel/Layer.html b/js/panels/Timeline/Layer.reel/Layer.html index c7e7b575..44022211 100644 --- a/js/panels/Timeline/Layer.reel/Layer.html +++ b/js/panels/Timeline/Layer.reel/Layer.html | |||
@@ -17,6 +17,7 @@ | |||
17 | "styleRepetition" : {"@":"repetition1"}, | 17 | "styleRepetition" : {"@":"repetition1"}, |
18 | "dynamicLayerName" : {"@":"dtext1"}, | 18 | "dynamicLayerName" : {"@":"dtext1"}, |
19 | "dynamicLayerTag" : {"@": "dtext2"}, | 19 | "dynamicLayerTag" : {"@": "dtext2"}, |
20 | "layer_label_text" : {"#": "layer-label-text"}, | ||
20 | "mainCollapser" : {"@" : "mainCollapser"}, | 21 | "mainCollapser" : {"@" : "mainCollapser"}, |
21 | "positionCollapser" : {"@" : "positionCollapser"}, | 22 | "positionCollapser" : {"@" : "positionCollapser"}, |
22 | "styleCollapser" : {"@" : "styleCollapser"}, | 23 | "styleCollapser" : {"@" : "styleCollapser"}, |
@@ -33,7 +34,7 @@ | |||
33 | "value" : { | 34 | "value" : { |
34 | "boundObject" : {"@": "owner"}, | 35 | "boundObject" : {"@": "owner"}, |
35 | "boundObjectPropertyPath" : "layerName", | 36 | "boundObjectPropertyPath" : "layerName", |
36 | "oneway" : false | 37 | "oneway" : true |
37 | } | 38 | } |
38 | } | 39 | } |
39 | }, | 40 | }, |
diff --git a/js/panels/Timeline/Layer.reel/Layer.js b/js/panels/Timeline/Layer.reel/Layer.js index 8df0e9ae..db99e869 100644 --- a/js/panels/Timeline/Layer.reel/Layer.js +++ b/js/panels/Timeline/Layer.reel/Layer.js | |||
@@ -74,7 +74,7 @@ var Layer = exports.Layer = Montage.create(Component, { | |||
74 | 74 | ||
75 | /* Layer models: the name, ID, and selected and animation booleans for the layer */ | 75 | /* Layer models: the name, ID, and selected and animation booleans for the layer */ |
76 | _layerName:{ | 76 | _layerName:{ |
77 | value: "Default Layer Name" | 77 | value: "" |
78 | }, | 78 | }, |
79 | 79 | ||
80 | layerName:{ | 80 | layerName:{ |
@@ -83,13 +83,22 @@ var Layer = exports.Layer = Montage.create(Component, { | |||
83 | return this._layerName; | 83 | return this._layerName; |
84 | }, | 84 | }, |
85 | set:function(newVal){ | 85 | set:function(newVal){ |
86 | this._layerEditable.value = newVal; | 86 | if (this._layerEditable.value !== newVal) { |
87 | this._layerName = newVal; | 87 | this._layerEditable.value = newVal; |
88 | this.layerData.layerName = newVal; | 88 | } |
89 | if (this._layerName !== newVal) { | ||
90 | this._layerName = newVal; | ||
91 | } | ||
92 | if (this.layerData.layerName !== newVal) { | ||
93 | this.layerData.layerName = newVal; | ||
94 | } | ||
95 | |||
89 | if (typeof(this.dynamicLayerName) !== "undefined") { | 96 | if (typeof(this.dynamicLayerName) !== "undefined") { |
90 | this.dynamicLayerName.value = newVal; | 97 | if (this.dynamicLayerName.value !== newVal) { |
98 | this.dynamicLayerName.value = newVal; | ||
99 | } | ||
91 | } | 100 | } |
92 | 101 | this.needsDraw = true; | |
93 | } | 102 | } |
94 | }, | 103 | }, |
95 | _layerID:{ | 104 | _layerID:{ |
@@ -513,6 +522,11 @@ var Layer = exports.Layer = Montage.create(Component, { | |||
513 | //console.log('Layer.draw, removing selection for layer ', this.layerName) | 522 | //console.log('Layer.draw, removing selection for layer ', this.layerName) |
514 | this.element.classList.remove("layerSelected"); | 523 | this.element.classList.remove("layerSelected"); |
515 | } | 524 | } |
525 | |||
526 | // Update layer name? | ||
527 | if (this.layerName !== this.layer_label_text.innerText) { | ||
528 | this.layer_label_text.innerText = this.layerName; | ||
529 | } | ||
516 | } | 530 | } |
517 | }, | 531 | }, |
518 | didDraw: { | 532 | didDraw: { |
@@ -678,10 +692,12 @@ var Layer = exports.Layer = Montage.create(Component, { | |||
678 | /* Begin: Event handlers */ | 692 | /* Begin: Event handlers */ |
679 | handleLayerNameChange: { | 693 | handleLayerNameChange: { |
680 | value: function(event) { | 694 | value: function(event) { |
681 | this.dynamicLayerName.value = this._layerEditable.value; | 695 | |
682 | this.needsDraw = true; | 696 | if (this._layerEditable.value !== this.layerName) { |
683 | this.application.ninja.documentController.activeDocument.needsSave = true; | 697 | this.layerName = this._layerEditable.value; |
684 | this.layerData.stageElement.setAttribute("id",this.dynamicLayerName.value); | 698 | this.application.ninja.documentController.activeDocument.needsSave = true; |
699 | this.layerData.stageElement.setAttribute("id",this._layerEditable.value); | ||
700 | } | ||
685 | } | 701 | } |
686 | }, | 702 | }, |
687 | handleAddStyleClick: { | 703 | handleAddStyleClick: { |
@@ -706,10 +722,12 @@ var Layer = exports.Layer = Montage.create(Component, { | |||
706 | if (this._layerEditable.enteredValue.length === 0) { | 722 | if (this._layerEditable.enteredValue.length === 0) { |
707 | newVal = this._layerEditable._preEditValue; | 723 | newVal = this._layerEditable._preEditValue; |
708 | } | 724 | } |
709 | this.dynamicLayerName.value = newVal; | ||
710 | this.layerName = newVal; | 725 | this.layerName = newVal; |
711 | this.application.ninja.documentController.activeDocument.needsSave = true; | 726 | if (newVal !== this.layerName) { |
712 | this.needsDraw = true; | 727 | this.layerName = newVal; |
728 | this.application.ninja.documentController.activeDocument.needsSave = true; | ||
729 | this.layerData.stageElement.setAttribute("id", newVal); | ||
730 | } | ||
713 | } | 731 | } |
714 | }, | 732 | }, |
715 | handleMousedown: { | 733 | handleMousedown: { |