aboutsummaryrefslogtreecommitdiff
path: root/js/panels/Timeline/Style.reel
diff options
context:
space:
mode:
Diffstat (limited to 'js/panels/Timeline/Style.reel')
-rw-r--r--js/panels/Timeline/Style.reel/Style.html138
-rw-r--r--js/panels/Timeline/Style.reel/Style.js572
-rw-r--r--js/panels/Timeline/Style.reel/scss/Style.scss66
3 files changed, 388 insertions, 388 deletions
diff --git a/js/panels/Timeline/Style.reel/Style.html b/js/panels/Timeline/Style.reel/Style.html
index 271748ab..f9a49727 100644
--- a/js/panels/Timeline/Style.reel/Style.html
+++ b/js/panels/Timeline/Style.reel/Style.html
@@ -1,4 +1,4 @@
1<!DOCTYPE html> 1<!doctype html>
2<!-- <copyright> 2<!-- <copyright>
3Copyright (c) 2012, Motorola Mobility, Inc 3Copyright (c) 2012, Motorola Mobility, Inc
4All Rights Reserved. 4All Rights Reserved.
@@ -29,10 +29,10 @@ ARISING IN ANY WAY OUT OF THE USE OF THIS SOFTWARE, EVEN IF ADVISED OF THE
29POSSIBILITY OF SUCH DAMAGE. 29POSSIBILITY OF SUCH DAMAGE.
30</copyright> --> 30</copyright> -->
31<html lang="en"> 31<html lang="en">
32 <head> 32 <head>
33 <meta http-equiv="content-type" content="text/html; charset=utf-8" /> 33 <meta http-equiv="content-type" content="text/html; charset=utf-8" />
34 <link rel="stylesheet" type="text/css" href="css/Style.css"> 34 <link rel="stylesheet" type="text/css" href="css/Style.css">
35 <script type="text/montage-serialization"> 35 <script type="text/montage-serialization">
36 { 36 {
37 "owner": { 37 "owner": {
38 "prototype": "js/panels/Timeline/Style.reel", 38 "prototype": "js/panels/Timeline/Style.reel",
@@ -47,73 +47,73 @@ POSSIBILITY OF SUCH DAMAGE.
47 "_fillColorCtrl": {"#": "fillColorCtrl"} 47 "_fillColorCtrl": {"#": "fillColorCtrl"}
48 } 48 }
49 }, 49 },
50 "dtext1" : { 50 "dtext1" : {
51 "prototype" : "montage/ui/dynamic-text.reel", 51 "prototype" : "montage/ui/dynamic-text.reel",
52 "properties" : { 52 "properties" : {
53 "element" : {"#" : "container-property"} 53 "element" : {"#" : "container-property"}
54 }, 54 },
55 "bindings" : { 55 "bindings" : {
56 "value" : { 56 "value" : {
57 "boundObject" : {"@" : "owner"}, 57 "boundObject" : {"@" : "owner"},
58 "boundObjectPropertyPath" : "editorProperty", 58 "boundObjectPropertyPath" : "editorProperty",
59 "oneway" : false 59 "oneway" : false
60 } 60 }
61 } 61 }
62 }, 62 },
63 "hottextunit" : { 63 "hottextunit" : {
64 "prototype" : "js/components/hottextunit.reel[HotTextUnit]", 64 "prototype" : "js/components/hottextunit.reel[HotTextUnit]",
65 "properties" : { 65 "properties" : {
66 "element" : {"#":"value-editor-hottext"} 66 "element" : {"#":"value-editor-hottext"}
67 }, 67 },
68 "bindings" : { 68 "bindings" : {
69 "value" : { 69 "value" : {
70 "boundObject" : {"@" : "owner"}, 70 "boundObject" : {"@" : "owner"},
71 "boundObjectPropertyPath" : "editorValue", 71 "boundObjectPropertyPath" : "editorValue",
72 "oneway" : false 72 "oneway" : false
73 } 73 }
74 } 74 }
75 }, 75 },
76 "hintable" : { 76 "hintable" : {
77 "prototype" : "js/components/hintable.reel", 77 "prototype" : "js/components/hintable.reel",
78 "properties" : { 78 "properties" : {
79 "element" : {"#":"style-hintable"} 79 "element" : {"#":"style-hintable"}
80 }, 80 },
81 "bindings" : { 81 "bindings" : {
82 "value" : { 82 "value" : {
83 "boundObject" : {"@" : "owner"}, 83 "boundObject" : {"@" : "owner"},
84 "boundObjectPropertyPath" : "editorProperty", 84 "boundObjectPropertyPath" : "editorProperty",
85 "oneway" : true 85 "oneway" : true
86 } 86 }
87 } 87 }
88 } 88 }
89 } 89 }
90 </script> 90 </script>
91 </head> 91 </head>
92 <body> 92 <body>
93 <div data-montage-id="style-container"> 93 <div data-montage-id="style-container">
94 <div class="style-padding"> 94 <div class="style-padding">
95 <div class="row-hintable hidden"> 95 <div class="row-hintable hidden">
96 <div data-montage-id="style-hintable"></div> 96 <div data-montage-id="style-hintable"></div>
97 </div> 97 </div>
98 <div class="container-propvals hidden"> 98 <div class="container-propvals hidden">
99 <div class="cell-property"> 99 <div class="cell-property">
100 <div data-montage-id="container-property">property</div> 100 <div data-montage-id="container-property">property</div>
101 </div> 101 </div>
102 <div class="cell-value value-editor editor-hottext hidden"> 102 <div class="cell-value value-editor editor-hottext hidden">
103 <div data-montage-id="value-editor-hottext"></div> 103 <div data-montage-id="value-editor-hottext"></div>
104 </div> 104 </div>
105 <div class="cell-value value-editor editor-color hidden"> 105 <div class="cell-value value-editor editor-color hidden">
106 <div data-montage-id="value-editor-color"> 106 <div data-montage-id="value-editor-color">
107 <div data-montage-id="fillColorCtrl" class="toolColorChipCtrl color-chip-position"></div> 107 <div data-montage-id="fillColorCtrl" class="toolColorChipCtrl color-chip-position"></div>
108 </div> 108 </div>
109 </div> 109 </div>
110 <div class="cell-value value-editor editor-input hidden"> 110 <div class="cell-value value-editor editor-input hidden">
111 <!-- <div data-montage-id="value-editor-input"></div> --> 111 <!-- <div data-montage-id="value-editor-input"></div> -->
112 <input type="text" class="nj-skinned" value="" /> 112 <input type="text" class="nj-skinned" value="" />
113 </div> 113 </div>
114 </div> 114 </div>
115 115
116 </div> 116 </div>
117 </div> 117 </div>
118 </body> 118 </body>
119</html> 119</html>
diff --git a/js/panels/Timeline/Style.reel/Style.js b/js/panels/Timeline/Style.reel/Style.js
index 122c2c0a..82c2d8ab 100644
--- a/js/panels/Timeline/Style.reel/Style.js
+++ b/js/panels/Timeline/Style.reel/Style.js
@@ -31,17 +31,17 @@ POSSIBILITY OF SUCH DAMAGE.
31/* 31/*
32 * Style component: Edits and manages a single style rule for a Layer in the Timeline. 32 * Style component: Edits and manages a single style rule for a Layer in the Timeline.
33 * Public Properties: 33 * Public Properties:
34 * editorProperty: The CSS property for the style. 34 * editorProperty: The CSS property for the style.
35 * editorValue: The value for the editorProperty. 35 * editorValue: The value for the editorProperty.
36 * whichView: Which view to show, the hintable view (where a new property can be typed in) 36 * whichView: Which view to show, the hintable view (where a new property can be typed in)
37 * or the propval view (where the property's value can be set with the tweener). 37 * or the propval view (where the property's value can be set with the tweener).
38 * Valid values are "hintable" and "propval", defaults to "hintable". 38 * Valid values are "hintable" and "propval", defaults to "hintable".
39 * 39 *
40 */ 40 */
41 41
42var Montage = require("montage/core/core").Montage; 42var Montage = require("montage/core/core").Montage;
43var Component = require("montage/ui/component").Component; 43var Component = require("montage/ui/component").Component;
44var ElementsMediator = require("js/mediators/element-mediator").ElementMediator 44var ElementsMediator = require("js/mediators/element-mediator").ElementMediator
45 45
46 46
47var LayerStyle = exports.LayerStyle = Montage.create(Component, { 47var LayerStyle = exports.LayerStyle = Montage.create(Component, {
@@ -72,151 +72,151 @@ var LayerStyle = exports.LayerStyle = Montage.create(Component, {
72 }, 72 },
73 73
74 /* === BEGIN: Models === */ 74 /* === BEGIN: Models === */
75 // isSelected: whether or not the style is selected 75 // isSelected: whether or not the style is selected
76 _isSelected: { 76 _isSelected: {
77 value: false 77 value: false
78 }, 78 },
79 isSelected: { 79 isSelected: {
80 serializable: true, 80 serializable: true,
81 get: function() { 81 get: function() {
82 return this._isSelected; 82 return this._isSelected;
83 }, 83 },
84 set: function(newVal) { 84 set: function(newVal) {
85 85
86 if (newVal !== this._isSelected) { 86 if (newVal !== this._isSelected) {
87 this._isSelected = newVal; 87 this._isSelected = newVal;
88 this.needsDraw = true; 88 this.needsDraw = true;
89 } 89 }
90 } 90 }
91 }, 91 },
92 92
93 /* isActive: Whether or not the user is actively clicking within the style; used to communicate state with 93 /* isActive: Whether or not the user is actively clicking within the style; used to communicate state with
94 * parent Layer. 94 * parent Layer.
95 */ 95 */
96 _isActive: { 96 _isActive: {
97 value: false