aboutsummaryrefslogtreecommitdiff
path: root/js/panels
diff options
context:
space:
mode:
Diffstat (limited to 'js/panels')
-rw-r--r--js/panels/Timeline/Layer.reel/Layer.html3
-rw-r--r--js/panels/Timeline/Layer.reel/Layer.js52
-rw-r--r--js/panels/Timeline/Style.reel/css/Style.css79
-rw-r--r--js/panels/Timeline/Style.reel/scss/Style.scss3
-rw-r--r--js/panels/Timeline/TimelineTrack.reel/TimelineTrack.js3
5 files changed, 59 insertions, 81 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..45d6f0a3 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: {
@@ -565,10 +579,11 @@ var Layer = exports.Layer = Montage.create(Component, {
565 // newStyle = LayerStyle.create(), 579 // newStyle = LayerStyle.create(),
566 newStyle = {}, 580 newStyle = {},
567 newEvent = document.createEvent("CustomEvent"); 581 newEvent = document.createEvent("CustomEvent");
568 582 /*
569 this.isStyleCollapsed = false; 583 this.isStyleCollapsed = false;
570 this.layerData.isStyleCollapsed = false; 584 this.layerData.isStyleCollapsed = false;
571 this.triggerOutgoingBinding(); 585 this.triggerOutgoingBinding();
586 */
572 587
573 newEvent.initCustomEvent("layerEvent", false, true); 588 newEvent.initCustomEvent("layerEvent", false, true);
574 newEvent.layerEventLocale = "styles"; 589 newEvent.layerEventLocale = "styles";
@@ -678,14 +693,21 @@ var Layer = exports.Layer = Montage.create(Component, {
678 /* Begin: Event handlers */ 693 /* Begin: Event handlers */
679 handleLayerNameChange: { 694 handleLayerNameChange: {
680 value: function(event) { 695 value: function(event) {
681 this.dynamicLayerName.value = this._layerEditable.value; 696
682 this.needsDraw = true; 697 if (this._layerEditable.value !== this.layerName) {
683 this.application.ninja.documentController.activeDocument.needsSave = true; 698 this.layerName = this._layerEditable.value;
684 this.layerData.stageElement.setAttribute("id",this.dynamicLayerName.value); 699 this.application.ninja.documentController.activeDocument.needsSave = true;
700 this.layerData.stageElement.setAttribute("id",this._layerEditable.value);
701 }
685 } 702 }
686 }, 703 },
687 handleAddStyleClick: { 704 handleAddStyleClick: {
688 value: function(event) { 705 value: function(event) {
706
707 this.isStyleCollapsed = false;
708 this.layerData.isStyleCollapsed = false;
709 this.triggerOutgoingBinding();
710
689 this.addStyle(); 711 this.addStyle();
690 } 712 }
691 }, 713 },
@@ -706,10 +728,12 @@ var Layer = exports.Layer = Montage.create(Component, {
706 if (this._layerEditable.enteredValue.length === 0) { 728 if (this._layerEditable.enteredValue.length === 0) {
707 newVal = this._layerEditable._preEditValue; 729 newVal = this._layerEditable._preEditValue;
708 } 730 }
709 this.dynamicLayerName.value = newVal;
710 this.layerName = newVal; 731 this.layerName = newVal;
711 this.application.ninja.documentController.activeDocument.needsSave = true; 732 if (newVal !== this.layerName) {
712 this.needsDraw = true; 733 this.layerName = newVal;
734 this.application.ninja.documentController.activeDocument.needsSave = true;
735 this.layerData.stageElement.setAttribute("id", newVal);
736 }
713 } 737 }
714 }, 738 },
715 handleMousedown: { 739 handleMousedown: {
diff --git a/js/panels/Timeline/Style.reel/css/Style.css b/js/panels/Timeline/Style.reel/css/Style.css
index 6c7542cb..0cc8a1f8 100644
--- a/js/panels/Timeline/Style.reel/css/Style.css
+++ b/js/panels/Timeline/Style.reel/css/Style.css
@@ -1,88 +1,36 @@
1/* Layer.scss
2 * Main SCSS file for Layer component, compiled by SASS into the file css/Layer.css.
3 */
4/* <copyright> 1/* <copyright>
5 This file contains proprietary software owned by Motorola Mobility, Inc.<br/> 2 This file contains proprietary software owned by Motorola Mobility, Inc.<br/>
6 No rights, expressed or implied, whatsoever to this software are provided by Motorola Mobility, Inc. hereunder.<br/> 3 No rights, expressed or implied, whatsoever to this software are provided by Motorola Mobility, Inc. hereunder.<br/>
7 (c) Copyright 2011 Motorola Mobility, Inc. All Rights Reserved. 4 (c) Copyright 2011 Motorola Mobility, Inc. All Rights Reserved.
8 </copyright> */ 5 </copyright> */
9/* 6/* Layer.scss
10 * _colors.scss 7 * Main SCSS file for Layer component, compiled by SASS into the file css/Layer.css.
11 * Defines the colors for the UI of the application.
12 * To create a new theme, copy this file and change the values as desired.
13 * Note: Some colors are defined as both rgb and rgba; some of the rgba versions have multiple a values.
14 */
15/* Colors for radio buttons and other form elements */
16/* Base colors for dividers
17 *
18 * Dividers consist of a div with a background color and either
19 * a top & bottom border (in the case of horizontal dividers)
20 * or a left & right border (in the case of vertical dividers),
21 * for a total of three different colors.
22 *
23 */
24/* top and left */
25/* Middle */
26/* Bottom and right */
27/* Main background color of entire app */
28/* Main app background color. */
29/* rgba version */
30/* Main app border color */
31/* color of drop shadows */
32/* Stage color */
33/* body border color */
34/* Body background color */
35/* Colors for main dropdown menus: background & text for both regular and highlighted states, dividers */
36/* Colors for tools: background, text, how they interact with the UI */
37/* Colors for panels: background & text, both regular and highlighted states, dividers, borders, shadows, etc. */
38/* used for editable items in their non-edit state, etc. */
39/* Border for panel and for block elements */
40/* Shadow for text and block elements */
41/* Colors for scroll bars */
42/* <copyright>
43 This file contains proprietary software owned by Motorola Mobility, Inc.<br/>
44 No rights, expressed or implied, whatsoever to this software are provided by Motorola Mobility, Inc. hereunder.<br/>
45 (c) Copyright 2011 Motorola Mobility, Inc. All Rights Reserved.
46 </copyright> */
47/*
48 * themes/themename/mixins.scss
49 * Mixins that are theme-dependent (e.g. sprite mixins, etc)
50 */
51/* <copyright>
52 This file contains proprietary software owned by Motorola Mobility, Inc.<br/>
53 No rights, expressed or implied, whatsoever to this software are provided by Motorola Mobility, Inc. hereunder.<br/>
54 (c) Copyright 2011 Motorola Mobility, Inc. All Rights Reserved.
55 </copyright> */
56/*
57 * mixins.scss
58 * Generic mixins. Theme-specific mixins (e.g. for sprites)
59 * should go in the theme/themename/mixins.scss file.