diff options
Diffstat (limited to 'node_modules/montage-user/ui/condition.reel')
-rwxr-xr-x | node_modules/montage-user/ui/condition.reel/condition.js | 149 |
1 files changed, 149 insertions, 0 deletions
diff --git a/node_modules/montage-user/ui/condition.reel/condition.js b/node_modules/montage-user/ui/condition.reel/condition.js new file mode 100755 index 00000000..298edb13 --- /dev/null +++ b/node_modules/montage-user/ui/condition.reel/condition.js | |||
@@ -0,0 +1,149 @@ | |||
1 | /* <copyright> | ||
2 | This file contains proprietary software owned by Motorola Mobility, Inc.<br/> | ||
3 | No rights, expressed or implied, whatsoever to this software are provided by Motorola Mobility, Inc. hereunder.<br/> | ||
4 | (c) Copyright 2011 Motorola Mobility, Inc. All Rights Reserved. | ||
5 | </copyright> */ | ||
6 | /** | ||
7 | @module montage/ui/condition.reel | ||
8 | @requires montage/core/core | ||
9 | @requires montage/ui/component | ||
10 | @requires "montage/ui/slot.reel" | ||
11 | @requires montage/core/logger | ||
12 | */ | ||
13 | var Montage = require("montage").Montage, | ||
14 | Component = require("ui/component").Component, | ||
15 | Slot = require("ui/slot.reel").Slot, | ||
16 | logger = require("core/logger").logger("condition"); | ||
17 | /** | ||
18 | @class module:"montage/ui/condition.reel".Condition | ||
19 | @extends module:montage/ui/component.Component | ||
20 | */ | ||
21 | |||
22 | exports.Condition = Montage.create(Component, /** @lends module:"montage/ui/condition.reel".Condition# */ { | ||
23 | |||
24 | /** | ||
25 | The Condition component does not have an HTML template, so this value is set to false. | ||
26 | @type {Property} | ||
27 | @default {Boolean} false | ||
28 | */ | ||
29 | hasTemplate: { | ||
30 | enumerable: false, | ||
31 | value: false | ||
32 | }, | ||
33 | /** | ||
34 | Description TODO | ||
35 | @private | ||
36 | */ | ||
37 | _condition: { | ||
38 | enumerable: false, | ||
39 | value: null | ||
40 | }, | ||
41 | /** | ||
42 | Description TODO | ||
43 | @type {Function} | ||
44 | @default null | ||
45 | */ | ||
46 | condition: { | ||
47 | enumerable: false, | ||
48 | set: function(value) { | ||
49 | |||
50 | if (value === this._condition) { | ||
51 | return; | ||
52 | } | ||
53 | |||
54 | this._condition = value; | ||
55 | this.needsDraw = true; | ||
56 | }, | ||
57 | get: function() { | ||
58 | return this._condition; | ||
59 | } | ||
60 | }, | ||
61 | /** | ||
62 | Description TODO | ||
63 | @private | ||
64 | */ | ||
65 | _content: { | ||
66 | enumerable: false, | ||
67 | value: null | ||
68 | }, | ||
69 | /** | ||
70 | Description TODO | ||
71 | @type {Function} | ||
72 | @default null | ||
73 | */ | ||
74 | content: { | ||
75 | enumerable: false, | ||
76 | get: function() { | ||
77 | return this._content; | ||
78 | }, | ||
79 | set: function(value) { | ||
80 | if (this._content === value) { | ||
81 | return; | ||
82 | } | ||
83 | |||
84 | this._content = value; | ||
85 | this.needsDraw = true; | ||
86 | } | ||
87 | }, | ||
88 | |||
89 | // TODO should this strategy be part of another class? | ||
90 | // TODO expose the options as an exported enum | ||
91 | removalStrategy: { | ||
92 | enumerable: false, | ||
93 | value: "remove" | ||
94 | }, | ||
95 | |||
96 | /** | ||
97 | Description TODO | ||
98 | @function | ||
99 | */ | ||
100 | prepareForDraw: { | ||
101 | enumerable: false, | ||
102 | value: function() { | ||
103 | |||
104 | if (!this.content) { | ||
105 | this.content = document.createElement("div"); | ||
106 | |||
107 | var conditionContentRange = document.createRange(); | ||
108 | conditionContentRange.selectNodeContents(this._element); | ||
109 | |||
110 | // TODO not wrap the range if it is a range of a single element | ||
111 | // we want to only deal with single elements when appending and removing; | ||
112 | // this keeps us from having to keep track of the range or risk losing | ||
113 | // a reference to the elements when they're extracted | ||
114 | conditionContentRange.surroundContents(this.content); | ||
115 | } | ||
116 | |||
117 | var slotRoot = document.createElement("div"); | ||
118 | this.element.appendChild(slotRoot); | ||
119 | |||
120 | this.content.parentNode.removeChild(this.content); | ||
121 | slotRoot.appendChild(this.content); | ||
122 | |||
123 | this._slot = Slot.create(); | ||
124 | this._slot.element = slotRoot; | ||
125 | } | ||
126 | }, | ||
127 | /** | ||
128 | Description TODO | ||
129 | @function | ||
130 | */ | ||
131 | draw: { | ||
132 | enumerable: false, | ||
133 | value: function() { | ||
134 | |||
135 | if (this.condition) { | ||
136 | this._slot.content = this.content; | ||
137 | this.element.classList.remove("montage-invisible"); | ||
138 | } else { | ||
139 | if ("hide" === this.removalStrategy) { | ||
140 | this.element.classList.add("montage-invisible"); | ||
141 | } else { | ||
142 | this._slot.content = null; | ||
143 | } | ||
144 | } | ||
145 | |||
146 | } | ||
147 | } | ||
148 | |||
149 | }); | ||