diff options
author | Ananya Sen | 2012-05-31 10:13:40 -0700 |
---|---|---|
committer | Ananya Sen | 2012-05-31 10:13:40 -0700 |
commit | 286457b4f23974277274ba388afd283e8aa085cb (patch) | |
tree | c21bf791e7c4f572d12f97987ea6b89e74da67fe /js/panels/css-panel/rule-components/css-style-rule.reel/css-style-rule.js | |
parent | 4d9b481c58090e8f1fc7b0e9d73a81b0f49cccc8 (diff) | |
parent | d49c909cff7f0c5e5d0b127ad84a2fefc6677dc6 (diff) | |
download | ninja-286457b4f23974277274ba388afd283e8aa085cb.tar.gz |
Merge branch 'refs/heads/ninja-internal-master' into cut-copy-paste
Conflicts:
js/controllers/styles-controller.js
Signed-off-by: Ananya Sen <Ananya.Sen@motorola.com>
Diffstat (limited to 'js/panels/css-panel/rule-components/css-style-rule.reel/css-style-rule.js')
-rw-r--r-- | js/panels/css-panel/rule-components/css-style-rule.reel/css-style-rule.js | 174 |
1 files changed, 174 insertions, 0 deletions
diff --git a/js/panels/css-panel/rule-components/css-style-rule.reel/css-style-rule.js b/js/panels/css-panel/rule-components/css-style-rule.reel/css-style-rule.js new file mode 100644 index 00000000..e0ffb1a8 --- /dev/null +++ b/js/panels/css-panel/rule-components/css-style-rule.reel/css-style-rule.js | |||
@@ -0,0 +1,174 @@ | |||
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 | var Montage = require("montage/core/core").Montage, | ||
8 | Component = require("montage/ui/component").Component; | ||
9 | |||
10 | exports.CssStyleRule = Montage.create(Component, { | ||
11 | addClassNameOnChange : { | ||
12 | value: null | ||
13 | }, | ||
14 | unappliedClass : { | ||
15 | value: 'unapplied-css-rule' | ||
16 | }, | ||
17 | cssText: { | ||
18 | value: null | ||
19 | }, | ||
20 | hasTemplate: { | ||
21 | value: true | ||
22 | }, | ||
23 | focusDelegate : { | ||
24 | value: null | ||
25 | }, | ||
26 | _applied : { | ||
27 | value: true, | ||
28 | distinct: true | ||
29 | }, | ||
30 | applied : { | ||
31 | get: function() { | ||
32 | return this._applied; | ||
33 | }, | ||
34 | set: function(value) { | ||
35 | if(this._applied === value || value === undefined || value === null) { return false; } | ||
36 | |||
37 | this._applied = value; | ||
38 | this.needsDraw = true; | ||
39 | } | ||
40 | }, | ||
41 | |||
42 | _rule : { | ||
43 | value : null | ||
44 | }, | ||
45 | rule : { | ||
46 | get: function() { | ||
47 | return this._rule; | ||
48 | }, | ||
49 | set: function(rule) { | ||
50 | this.cssText = rule.cssText; | ||
51 | |||
52 | if(rule.type === 'inline') { | ||
53 | this.sheetName = 'Inline Style'; | ||
54 | } else { | ||
55 | this.sheetName = rule.href || 'Style Tag'; | ||
56 | } | ||
57 | |||
58 | this.selector = rule.selectorText; | ||
59 | this.declaration = rule.style; | ||
60 | |||
61 | //console.log('Rule with selector "' +rule.selectorText+ '" is set on componenet.'); | ||
62 | |||
63 | this._rule = rule; | ||
64 | } | ||
65 | }, | ||
66 | declarationComponent: { | ||
67 | value: null | ||
68 | }, | ||
69 | _declaration: { | ||
70 | value: null | ||
71 | }, | ||
72 | declaration: { | ||
73 | get: function() { | ||
74 | return this._declaration; | ||
75 | }, | ||
76 | set: function(dec) { | ||
77 | this._declaration = dec; | ||
78 | } | ||
79 | }, | ||
80 | condition: { | ||
81 | value: false | ||
82 | }, | ||
83 | |||
84 | handleChange : { | ||
85 | value: function(e) { | ||
86 | if(this.focusDelegate) { | ||
87 | this.focusDelegate.handleSelectorChange(this.rule, this.selectorField.value, this); | ||
88 | } | ||
89 | } | ||
90 | }, | ||
91 | handleMouseover: { | ||
92 | value: function(e) { | ||
93 | if(this.focusDelegate) { | ||
94 | this.focusDelegate.handleSelectorHover(this.selectorField.value, 'over'); | ||
95 | } | ||
96 | } | ||
97 | }, | ||
98 | handleMouseout: { | ||
99 | value: function(e) { | ||
100 | if(this.focusDelegate) { | ||
101 | this.focusDelegate.handleSelectorHover(this.selectorField.value, 'out'); | ||
102 | } | ||
103 | } | ||
104 | }, | ||
105 | update: { | ||
106 | value: function() { | ||
107 | if(this.cssText !== this.rule.cssText) { | ||
108 | // TODO: add update for selector and stylesheet name | ||
109 | this.declarationComponent.update(); | ||
110 | } | ||
111 | } | ||
112 | }, | ||
113 | |||
114 | templateDidLoad : { | ||
115 | value: function() { | ||
116 | //console.log("css style rule : template did load"); | ||
117 | } | ||
118 | }, | ||
119 | prepareForDraw : { | ||
120 | value: function() { | ||
121 | this.selectorField.keyActions = this.keyActions; | ||
122 | |||
123 | if(this.rule.type === 'inline') { | ||
124 | this.selectorField.readOnly = true; | ||
125 | this.declarationComponent.type = 'inline'; | ||
126 | } else { | ||
127 | this.selectorField.addEventListener('change', this, false); | ||
128 | this.selectorField.element.addEventListener('mouseover', this, false); | ||
129 | this.selectorField.element.addEventListener('mouseout', this, false); | ||
130 | } | ||
131 | } | ||
132 | }, | ||
133 | |||
134 | willDraw : { | ||
135 | value: function() { | ||
136 | if(this.applied) { | ||
137 | this.element.removeAttribute('title'); | ||
138 | } else { | ||
139 | this.element.title = "Rule does not apply to selection"; | ||
140 | } | ||
141 | } | ||
142 | }, | ||
143 | draw : { | ||
144 | value: function() { | ||
145 | //console.log("css style rule : draw"); | ||
146 | if(this.applied) { | ||
147 | this.element.classList.remove(this.unappliedClass); | ||
148 | } else { | ||
149 | this.element.classList.add(this.unappliedClass); | ||
150 | } | ||
151 | } | ||
152 | }, | ||
153 | |||
154 | keyActions : { | ||
155 | value : { | ||
156 | hint : { | ||
157 | accept : [9,13], // accept hint | ||
158 | stop : [27], // stop editing | ||
159 | next : [40], // cycle to next hint | ||
160 | prev : [38], // cycle to prev hint | ||
161 | revert : [27], // revert value | ||
162 | backsp : [8] // backspace hit | ||
163 | }, | ||
164 | noHint : { | ||
165 | stop : [27,9,13], | ||
166 | next : [40], | ||
167 | prev : [38], | ||
168 | revert : [27], | ||
169 | backsp : [8] | ||
170 | } | ||
171 | }, | ||
172 | distinct: true | ||
173 | } | ||
174 | }); | ||