Diffstat (limited to 'frontend/beta/js/YUI-extensions/CSS.js') (more/less context) (ignore whitespace changes)
-rw-r--r-- | frontend/beta/js/YUI-extensions/CSS.js | 208 |
1 files changed, 208 insertions, 0 deletions
diff --git a/frontend/beta/js/YUI-extensions/CSS.js b/frontend/beta/js/YUI-extensions/CSS.js new file mode 100644 index 0000000..4fba37c --- a/dev/null +++ b/frontend/beta/js/YUI-extensions/CSS.js | |||
@@ -0,0 +1,208 @@ | |||
1 | /** | ||
2 | * @class YAHOO.ext.util.CSS | ||
3 | * Class for manipulating CSS Rules | ||
4 | * @singleton | ||
5 | */ | ||
6 | YAHOO.ext.util.CSS = new function(){ | ||
7 | var rules = null; | ||
8 | |||
9 | var toCamel = function(property) { | ||
10 | var convert = function(prop) { | ||
11 | var test = /(-[a-z])/i.exec(prop); | ||
12 | return prop.replace(RegExp.$1, RegExp.$1.substr(1).toUpperCase()); | ||
13 | }; | ||
14 | while(property.indexOf('-') > -1) { | ||
15 | property = convert(property); | ||
16 | } | ||
17 | return property; | ||
18 | }; | ||
19 | |||
20 | /** | ||
21 | * Very simple dynamic creation of stylesheets from a text blob of rules. | ||
22 | * @param {String} cssText The text containing the css rules | ||
23 | * @return {StyleSheet} | ||
24 | */ | ||
25 | this.createStyleSheet = function(cssText){ | ||
26 | var ss; | ||
27 | if(YAHOO.ext.util.Browser.isIE){ | ||
28 | ss = document.createStyleSheet(); | ||
29 | ss.cssText = cssText; | ||
30 | }else{ | ||
31 | var head = document.getElementsByTagName("head")[0]; | ||
32 | var rules = document.createElement('style'); | ||
33 | rules.setAttribute('type', 'text/css'); | ||
34 | try{ | ||
35 | rules.appendChild(document.createTextNode(cssText)); | ||
36 | }catch(e){ | ||
37 | rules.cssText = cssText; | ||
38 | } | ||
39 | head.appendChild(rules); | ||
40 | ss = document.styleSheets[document.styleSheets.length-1]; | ||
41 | } | ||
42 | this.cacheStyleSheet(ss); | ||
43 | return ss; | ||
44 | }; | ||
45 | |||
46 | this.removeStyleSheet = function(id){ | ||
47 | var existing = document.getElementById(id); | ||
48 | if(existing){ | ||
49 | existing.parentNode.removeChild(existing); | ||
50 | } | ||
51 | }; | ||
52 | |||
53 | this.swapStyleSheet = function(id, url){ | ||
54 | this.removeStyleSheet(id); | ||
55 | var ss = document.createElement('link'); | ||
56 | ss.setAttribute('rel', 'stylesheet'); | ||
57 | ss.setAttribute('type', 'text/css'); | ||
58 | ss.setAttribute('id', id); | ||
59 | ss.setAttribute('href', url); | ||
60 | document.getElementsByTagName("head")[0].appendChild(ss); | ||
61 | }; | ||
62 | |||
63 | /** | ||
64 | * Refresh the rule cache if you have dynamically added stylesheets | ||
65 | * @return {Object} An object (hash) of rules indexed by selector | ||
66 | */ | ||
67 | this.refreshCache = function(){ | ||
68 | return this.getRules(true); | ||
69 | }; | ||
70 | |||
71 | this.cacheStyleSheet = function(ss){ | ||
72 | try{// try catch for cross domain access issue | ||
73 | var ssRules = ss.cssRules || ss.rules; | ||
74 | for(var j = ssRules.length-1; j >= 0; --j){ | ||
75 | rules[ssRules[j].selectorText] = ssRules[j]; | ||
76 | } | ||
77 | }catch(e){} | ||
78 | }; | ||
79 | |||
80 | /** | ||
81 | * Gets all css rules for the document | ||
82 | * @param {Boolean} refreshCache true to refresh the internal cache | ||
83 | * @return {Object} An object (hash) of rules indexed by selector | ||
84 | */ | ||
85 | this.getRules = function(refreshCache){ | ||
86 | if(rules == null || refreshCache){ | ||
87 | rules = {}; | ||
88 | var ds = document.styleSheets; | ||
89 | for(var i =0, len = ds.length; i < len; i++){ | ||
90 | try{ | ||
91 | this.cacheStyleSheet(ds[i]); | ||
92 | }catch(e){} | ||
93 | } | ||
94 | } | ||
95 | return rules; | ||
96 | }; | ||
97 | |||
98 | /** | ||
99 | * Gets an an individual CSS rule by selector(s) | ||
100 | * @param {String/Array} selector The CSS selector or an array of selectors to try. The first selector that is found is returned. | ||
101 | * @param {Boolean} refreshCache true to refresh the internal cache | ||
102 | * @return {CSSRule} The CSS rule or null if one is not found | ||
103 | */ | ||
104 | this.getRule = function(selector, refreshCache){ | ||
105 | var rs = this.getRules(refreshCache); | ||
106 | if(!(selector instanceof Array)){ | ||
107 | return rs[selector]; | ||
108 | } | ||
109 | for(var i = 0; i < selector.length; i++){ | ||
110 | if(rs[selector[i]]){ | ||
111 | return rs[selector[i]]; | ||
112 | } | ||
113 | } | ||
114 | return null; | ||
115 | }; | ||
116 | |||
117 | |||
118 | /** | ||
119 | * Updates a rule property | ||
120 | * @param {String/Array} selector If it's an array it tries each selector until it finds one. Stops immediately once one is found. | ||
121 | * @param {String} property The css property | ||
122 | * @param {String} value The new value for the property | ||
123 | * @return {Boolean} true if a rule was found and updated | ||
124 | */ | ||
125 | this.updateRule = function(selector, property, value){ | ||
126 | if(!(selector instanceof Array)){ | ||
127 | var rule = this.getRule(selector); | ||
128 | if(rule){ | ||
129 | rule.style[toCamel(property)] = value; | ||
130 | return true; | ||
131 | } | ||
132 | }else{ | ||
133 | for(var i = 0; i < selector.length; i++){ | ||
134 | if(this.updateRule(selector[i], property, value)){ | ||
135 | return true; | ||
136 | } | ||
137 | } | ||
138 | } | ||
139 | return false; | ||
140 | }; | ||
141 | |||
142 | /** | ||
143 | * Applies a rule to an element without adding the class | ||
144 | * @param {HTMLElement} el The element | ||
145 | * @param {String/Array} selector If it's an array it tries each selector until it finds one. Stops immediately once one is found. | ||
146 | * @return {Boolean} true if a rule was found and applied | ||
147 | */ | ||
148 | this.apply = function(el, selector){ | ||
149 | if(!(selector instanceof Array)){ | ||
150 | var rule = this.getRule(selector); | ||
151 | if(rule){ | ||
152 | var s = rule.style; | ||
153 | for(var key in s){ | ||
154 | if(typeof s[key] != 'function'){ | ||
155 | if(s[key] && String(s[key]).indexOf(':') < 0 && s[key] != 'false'){ | ||
156 | try{el.style[key] = s[key];}catch(e){} | ||
157 | } | ||
158 | } | ||
159 | } | ||
160 | return true; | ||
161 | } | ||
162 | }else{ | ||
163 | for(var i = 0; i < selector.length; i++){ | ||
164 | if(this.apply(el, selector[i])){ | ||
165 | return true; | ||
166 | } | ||
167 | } | ||
168 | } | ||
169 | return false; | ||
170 | }; | ||
171 | |||
172 | this.applyFirst = function(el, id, selector){ | ||
173 | var selectors = [ | ||
174 | '#' + id + ' ' + selector, | ||
175 | selector | ||
176 | ]; | ||
177 | return this.apply(el, selectors); | ||
178 | }; | ||
179 | |||
180 | this.revert = function(el, selector){ | ||
181 | if(!(selector instanceof Array)){ | ||
182 | var rule = this.getRule(selector); | ||
183 | if(rule){ | ||
184 | for(key in rule.style){ | ||
185 | if(rule.style[key] && String(rule.style[key]).indexOf(':') < 0 && rule.style[key] != 'false'){ | ||
186 | try{el.style[key] = '';}catch(e){} | ||
187 | } | ||
188 | } | ||
189 | return true; | ||
190 | } | ||
191 | }else{ | ||
192 | for(var i = 0; i < selector.length; i++){ | ||
193 | if(this.revert(el, selector[i])){ | ||
194 | return true; | ||
195 | } | ||
196 | } | ||
197 | } | ||
198 | return false; | ||
199 | }; | ||
200 | |||
201 | this.revertFirst = function(el, id, selector){ | ||
202 | var selectors = [ | ||
203 | '#' + id + ' ' + selector, | ||
204 | selector | ||
205 | ]; | ||
206 | return this.revert(el, selectors); | ||
207 | }; | ||
208 | }(); | ||