diff options
Diffstat (limited to 'js/panels/Timeline')
42 files changed, 902 insertions, 860 deletions
diff --git a/js/panels/Timeline/Collapser.js b/js/panels/Timeline/Collapser.js index 41aa8f39..8db1b17f 100644 --- a/js/panels/Timeline/Collapser.js +++ b/js/panels/Timeline/Collapser.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 |
@@ -38,16 +39,16 @@ POSSIBILITY OF SUCH DAMAGE. | |||
38 | * Can be manually set as well. | 39 | * Can be manually set as well. |
39 | * collapsibleClass: The CSS class to apply to the content and the clicker when collapsed. Defaults to "collapsible-collapsed". | 40 | * collapsibleClass: The CSS class to apply to the content and the clicker when collapsed. Defaults to "collapsible-collapsed". |
40 | * isAnimated: Set to true to apply a transition to expand/collapse (defaults to false). | 41 | * isAnimated: Set to true to apply a transition to expand/collapse (defaults to false). |
41 | * transitionClass: If isAnimated is set to true, the component will apply transitionClass to the content during the | 42 | * transitionClass: If isAnimated is set to true, the component will apply transitionClass to the content during the |
42 | * collapse process. You can then define transitionClass in your style sheet with the desired CSS transitions. | 43 | * collapse process. You can then define transitionClass in your style sheet with the desired CSS transitions. |
43 | * Defaults to "collapsible-transition". | 44 | * Defaults to "collapsible-transition". |
44 | * contentHeight: If both isAnimated and isCollapsedAtStart are set to true, set contentHeight to the height of the content | 45 | * contentHeight: If both isAnimated and isCollapsedAtStart are set to true, set contentHeight to the height of the content |
45 | * (in pixels, but without the "px") when not collapsed. If this value is not set, the first time the content is expanded | 46 | * (in pixels, but without the "px") when not collapsed. If this value is not set, the first time the content is expanded |
46 | * the transition will not work. Subsequent collapses (and expansions) will transition as expected. | 47 | * the transition will not work. Subsequent collapses (and expansions) will transition as expected. |
47 | * isLabelClickable: Boolean that indicates whether or not the clicker should have listener events. Defaults to true; set to | 48 | * isLabelClickable: Boolean that indicates whether or not the clicker should have listener events. Defaults to true; set to |
48 | * false for collapsers that will only be operated remotely. | 49 | * false for collapsers that will only be operated remotely. |
49 | * isToggling: Set this anually toggle the expand/collapse of the content. | 50 | * isToggling: Set this anually toggle the expand/collapse of the content. |
50 | * | 51 | * |
51 | */ | 52 | */ |
52 | var Montage = require("montage/core/core").Montage, | 53 | var Montage = require("montage/core/core").Montage, |
53 | Component = require("montage/ui/component").Component, | 54 | Component = require("montage/ui/component").Component, |
@@ -57,9 +58,9 @@ var Montage = require("montage/core/core").Montage, | |||
57 | hasTemplate:{ | 58 | hasTemplate:{ |
58 | value: false | 59 | value: false |
59 | }, | 60 | }, |
60 | 61 | ||
61 | /* === BEGIN: Models === */ | 62 | /* === BEGIN: Models === */ |
62 | 63 | ||
63 | // contentHeight: Stores the height of the content just before collapse. | 64 | // contentHeight: Stores the height of the content just before collapse. |
64 | _contentHeight: { | 65 | _contentHeight: { |
65 | value: 0 | 66 | value: 0 |
@@ -73,13 +74,13 @@ var Montage = require("montage/core/core").Montage, | |||
73 | this._contentHeight = newVal; | 74 | this._contentHeight = newVal; |
74 | } | 75 | } |
75 | }, | 76 | }, |
76 | 77 | ||
77 | // isCollapsing: true if the collapser is collapsing (or expanding); used in the draw cycle. | 78 | // isCollapsing: true if the collapser is collapsing (or expanding); used in the draw cycle. |
78 | _isCollapsing: { | 79 | _isCollapsing: { |
79 | value: false | 80 | value: false |
80 | }, | 81 | }, |
81 | 82 | ||
82 | // isAnimated: boolean to apply transition to expand/collapse | 83 | // isAnimated: boolean to apply transition to expand/collapse |
83 | _isAnimated : { | 84 | _isAnimated : { |
84 | value: false | 85 | value: false |
85 | }, | 86 | }, |
@@ -92,7 +93,7 @@ var Montage = require("montage/core/core").Montage, | |||
92 | this._isAnimated = newVal; | 93 | this._isAnimated = newVal; |
93 | } | 94 | } |
94 | }, | 95 | }, |
95 | 96 | ||
96 | _bypassAnimation : { | 97 | _bypassAnimation : { |
97 | value: true | 98 | value: true |
98 | }, | 99 | }, |
@@ -109,7 +110,7 @@ var Montage = require("montage/core/core").Montage, | |||
109 | _oldAnimated : { | 110 | _oldAnimated : { |
110 | value: false | 111 | value: false |
111 | }, | 112 | }, |
112 | 113 | ||
113 | // transitionClass: The CSS class to apply to the content during collapse to provide CSS transition. | 114 | // transitionClass: The CSS class to apply to the content during collapse to provide CSS transition. |
114 | // Note that this CSS class must be defined in your style sheet with the desired transitions. | 115 | // Note that this CSS class must be defined in your style sheet with the desired transitions. |
115 | _transitionClass : { | 116 | _transitionClass : { |
@@ -123,7 +124,7 @@ var Montage = require("montage/core/core").Montage, | |||
123 | this._transitionClass = newVal; | 124 | this._transitionClass = newVal; |
124 | } | 125 | } |
125 | }, | 126 | }, |
126 | 127 | ||
127 | // isCollapsed: is the content actually collapsed at this moment | 128 | // isCollapsed: is the content actually collapsed at this moment |
128 | _isCollapsed: { | 129 | _isCollapsed: { |
129 | value: "" | 130 | value: "" |
@@ -140,7 +141,7 @@ var Montage = require("montage/core/core").Montage, | |||
140 | } | 141 | } |
141 | } | 142 | } |
142 | }, | 143 | }, |
143 | 144 | ||
144 | // collapsedClass: the class to apply to the clicker and content when the content is collapsed. | 145 | // collapsedClass: the class to apply to the clicker and content when the content is collapsed. |
145 | _collapsedClass : { | 146 | _collapsedClass : { |
146 | value: "collapsible-collapsed" | 147 | value: "collapsible-collapsed" |
@@ -153,14 +154,14 @@ var Montage = require("montage/core/core").Montage, | |||
153 | this._collapsedClass = newVal; | 154 | this._collapsedClass = newVal; |
154 | } | 155 | } |
155 | }, | 156 | }, |
156 | 157 | ||
157 | // _origOverflowValue: Stores the original overflow value of the collapsible element. | 158 | // _origOverflowValue: Stores the original overflow value of the collapsible element. |
158 | // Why store the value? While the collapsible element is collapsed, obviously we will need overflow: hidden. | 159 | // Why store the value? While the collapsible element is collapsed, obviously we will need overflow: hidden. |
< |