diff options
Diffstat (limited to 'js/panels/Timeline/Span.reel/Span.js')
-rw-r--r-- | js/panels/Timeline/Span.reel/Span.js | 293 |
1 files changed, 147 insertions, 146 deletions
diff --git a/js/panels/Timeline/Span.reel/Span.js b/js/panels/Timeline/Span.reel/Span.js index 0d013fe5..53b016ec 100644 --- a/js/panels/Timeline/Span.reel/Span.js +++ b/js/panels/Timeline/Span.reel/Span.js | |||
@@ -1,24 +1,25 @@ | |||
1 | /* <copyright> | 1 | /* <copyright> |
2 | Copyright (c) 2012, Motorola Mobility, Inc | 2 | Copyright (c) 2012, Motorola Mobility LLC. |
3 | All Rights Reserved. | 3 | All Rights Reserved. |
4 | BSD License. | ||
5 | 4 | ||
6 | Redistribution and use in source and binary forms, with or without | 5 | Redistribution and use in source and binary forms, with or without |
7 | modification, are permitted provided that the following conditions are met: | 6 | modification, are permitted provided that the following conditions are met: |
8 | 7 | ||
9 | - Redistributions of source code must retain the above copyright notice, | 8 | * Redistributions of source code must retain the above copyright notice, |
10 | this list of conditions and the following disclaimer. | 9 | this list of conditions and the following disclaimer. |
11 | - Redistributions in binary form must reproduce the above copyright | 10 | |
12 | notice, this list of conditions and the following disclaimer in the | 11 | * Redistributions in binary form must reproduce the above copyright notice, |
13 | documentation and/or other materials provided with the distribution. | 12 | this list of conditions and the following disclaimer in the documentation |
14 | - Neither the name of Motorola Mobility nor the names of its contributors | 13 | and/or other materials provided with the distribution. |
15 | may be used to endorse or promote products derived from this software | 14 | |
16 | without specific prior written permission. | 15 | * Neither the name of Motorola Mobility LLC nor the names of its |
16 | contributors may be used to endorse or promote products derived from this | ||
17 | software without specific prior written permission. | ||
17 | 18 | ||
18 | THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS "AS IS" | 19 | THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS "AS IS" |
19 | AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT LIMITED TO, THE | 20 | AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT LIMITED TO, THE |
20 | IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR A PARTICULAR PURPOSE | 21 | IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR A PARTICULAR PURPOSE |
21 | ARE DISCLAIMED. IN NO EVENT SHALL THE COPYRIGHT OWNER OR CONTRIBUTORS BE | 22 | ARE DISCLAIMED. IN NO EVENT SHALL THE COPYRIGHT HOLDER OR CONTRIBUTORS BE |
22 | LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL, SPECIAL, EXEMPLARY, OR | 23 | LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL, SPECIAL, EXEMPLARY, OR |
23 | CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT LIMITED TO, PROCUREMENT OF | 24 | CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT LIMITED TO, PROCUREMENT OF |
24 | SUBSTITUTE GOODS OR SERVICES; LOSS OF USE, DATA, OR PROFITS; OR BUSINESS | 25 | SUBSTITUTE GOODS OR SERVICES; LOSS OF USE, DATA, OR PROFITS; OR BUSINESS |
@@ -29,7 +30,7 @@ POSSIBILITY OF SUCH DAMAGE. | |||
29 | </copyright> */ | 30 | </copyright> */ |
30 | 31 | ||
31 | var Montage = require("montage/core/core").Montage, | 32 | var Montage = require("montage/core/core").Montage, |
32 | Component = require("montage/ui/component").Component; | 33 | Component = require("montage/ui/component").Component; |
33 | 34 | ||
34 | var Span = exports.Span = Montage.create(Component, { | 35 | var Span = exports.Span = Montage.create(Component, { |
35 | 36 | ||
@@ -37,7 +38,7 @@ var Span = exports.Span = Montage.create(Component, { | |||
37 | value: true | 38 | value: true |
38 | }, | 39 | }, |
39 | 40 | ||
40 | // BEGIN: Models | 41 | // BEGIN: Models |
41 | _spanWidth:{ | 42 | _spanWidth:{ |
42 | value:0 | 43 | value:0 |
43 | }, | 44 | }, |
@@ -51,185 +52,185 @@ var Span = exports.Span = Montage.create(Component, { | |||
51 | this.needsDraw = true; | 52 | this.needsDraw = true; |
52 | } | 53 | } |
53 | }, | 54 | }, |
54 | 55 | ||
55 | _isHighlighted: { | 56 | _isHighlighted: { |
56 | value: false | 57 | value: false |
57 | }, | 58 | }, |
58 | isHighlighted: { | 59 | isHighlighted: { |
59 | get: function() { | 60 | get: function() { |
60 | return this._isHighlighted; | 61 | return this._isHighlighted; |
61 | }, | 62 | }, |
62 | set: function(newVal) { | 63 | set: function(newVal) { |
63 | if (newVal !== this._isHighlighted) { | 64 | if (newVal !== this._isHighlighted) { |
64 | this._isHighlighted = newVal; | 65 | this._isHighlighted = newVal; |
65 | this.needsDraw = true; | 66 | this.needsDraw = true; |
66 | } | 67 | } |
67 | } | 68 | } |
68 | }, | 69 | }, |
69 | 70 | ||
70 | _areChoicesVisible: { | 71 | _areChoicesVisible: { |
71 | value: false | 72 | value: false |
72 | }, | 73 | }, |
73 | areChoicesVisible: { | 74 | areChoicesVisible: { |
74 | get: function() { | 75 | get: function() { |
75 | return this._areChoicesVisible; | 76 | return this._areChoicesVisible; |
76 | }, | 77 | }, |
77 | set: function(newVal) { | 78 | set: function(newVal) { |
78 | if (newVal !== this._areChoicesVisible) { | 79 | if (newVal !== this._areChoicesVisible) { |
79 | this._areChoicesVisible = newVal; | 80 | this._areChoicesVisible = newVal; |
80 | this.needsDraw = true; | 81 | this.needsDraw = true; |
81 | } | 82 | } |
82 | } | 83 | } |
83 | }, | 84 | }, |
84 | 85 | ||
85 | _easing: { | 86 | _easing: { |
86 | value: "none" | 87 | value: "none" |
87 | }, | 88 | }, |
88 | easing: { | 89 | easing: { |
89 | get: function() { | 90 | get: function() { |
90 | return this._easing; | 91 | return this._easing; |
91 | }, | 92 | }, |
92 | set: function(newVal) { | 93 | set: function(newVal) { |
93 | if (newVal !== this._easing) { | 94 | if (newVal !== this._easing) { |
94 | if (typeof(newVal) === "undefined") { | 95 | if (typeof(newVal) === "undefined") { |
95 | newVal = "none"; | 96 | newVal = "none"; |
96 | } | 97 | } |
97 | this._easing = newVal; | 98 | this._easing = newVal; |
98 | this.parentComponent.easing = this.easing; | 99 | this.parentComponent.easing = this.easing; |
99 | this.parentComponent.tweenData.easing = this.easing; | 100 | this.parentComponent.tweenData.easing = this.easing; |
100 | this.parentComponent.setKeyframeEase(newVal); | 101 | this.parentComponent.setKeyframeEase(newVal); |
101 | this.needsDraw = true; | 102 | this.needsDraw = true; |
102 | } | 103 | } |
103 | } | 104 | } |
105 | }, | ||
106 | |||
107 | // BEGIN: draw cycle | ||
108 | prepareForDraw: { | ||
109 | value: function() { | ||
110 | this.init(); | ||
111 | } | ||
104 | }, | 112 | }, |
105 | 113 | ||
106 | // BEGIN: draw cycle | ||
107 | prepareForDraw: { | ||
108 | value: function() { | ||
109 | this.init(); | ||
110 | } | ||
111 | }, | ||
112 | |||
113 | draw:{ | 114 | draw:{ |
114 | value: function(){ | 115 | value: function(){ |
115 | this.element.style.width = this.spanWidth + "px"; | 116 | this.element.style.width = this.spanWidth + "px"; |
116 | 117 | ||
117 | if ((this.spanWidth <= 70) && (this.spanWidth >0)) { | 118 | if ((this.spanWidth <= 70) && (this.spanWidth >0)) { |
118 | var containerWidth = this.spanWidth -18, | 119 | var containerWidth = this.spanWidth -18, |
119 | choiceWidth; | 120 | choiceWidth; |
120 | if (containerWidth < 0) { | 121 | if (containerWidth < 0) { |
121 | containerWidth = 0; | 122 | containerWidth = 0; |
122 | } | 123 | } |
123 | choiceWidth = containerWidth -3; | 124 | choiceWidth = containerWidth -3; |
124 | if (choiceWidth < 0) { | 125 | if (choiceWidth < 0) { |
125 | choiceWidth = 0; | 126 | choiceWidth = 0; |
126 | } | 127 | } |
127 | this.container_easing.style.width = containerWidth + "px"; | 128 | this.container_easing.style.width = containerWidth + "px"; |
128 | this.easing_choice.style.width = choiceWidth + "px"; | 129 | this.easing_choice.style.width = choiceWidth + "px"; |
129 | this.easing_choice.style.overflow = "hidden"; | 130 | this.easing_choice.style.overflow = "hidden"; |
130 | } | 131 | } |
131 | if (this.spanWidth > 70) { | 132 | if (this.spanWidth > 70) { |
132 | this.container_easing.setAttribute("style", ""); | 133 | this.container_easing.setAttribute("style", ""); |
133 | this.easing_choice.setAttribute("style", ""); | 134 | this.easing_choice.setAttribute("style", ""); |
134 | } | 135 | } |
135 | 136 | ||
136 | // Highlight the span? | 137 | // Highlight the span? |
137 | if (this.isHighlighted === true) { | 138 | if (this.isHighlighted === true) { |
138 | this.element.classList.add("spanHighlight"); | 139 | this.element.classList.add("spanHighlight"); |
139 | } else { | 140 | } else { |
140 | this.element.classList.remove("spanHighlight"); | 141 | this.element.classList.remove("spanHighlight"); |
141 | } | 142 | } |
142 | 143 | ||
143 | /* | 144 | /* |
144 | // Hide or show the choices menu? | 145 | // Hide or show the choices menu? |
145 | if (this.areChoicesVisible === true) { | 146 | if (this.areChoicesVisible === true) { |
146 | this.easing_choices.style.display = "block"; | 147 | this.easing_choices.style.display = "block"; |
147 | } else { | 148 | } else { |
148 | this.easing_choices.style.display = "none"; | 149 | this.easing_choices.style.display = "none"; |
149 | } | 150 | } |
150 | */ | 151 | */ |
151 | 152 | ||
152 | // Change easing? | 153 | // Change easing? |
153 | if (this.easing_choice.innerText !== this.easing) { | 154 | if (this.easing_choice.innerText !== this.easing) { |
154 | this.easing_choice.innerText = this.easing; |