testing/mochitest/MochiKit/Style.js

changeset 0
6474c204b198
equal deleted inserted replaced
-1:000000000000 0:9c03376ff3b6
1 /***
2
3 MochiKit.Style 1.4
4
5 See <http://mochikit.com/> for documentation, downloads, license, etc.
6
7 (c) 2005-2006 Bob Ippolito, Beau Hartshorne. All rights Reserved.
8
9 ***/
10
11 if (typeof(dojo) != 'undefined') {
12 dojo.provide('MochiKit.Style');
13 dojo.require('MochiKit.Base');
14 dojo.require('MochiKit.DOM');
15 }
16 if (typeof(JSAN) != 'undefined') {
17 JSAN.use('MochiKit.Base', []);
18 }
19
20 try {
21 if (typeof(MochiKit.Base) == 'undefined') {
22 throw '';
23 }
24 } catch (e) {
25 throw 'MochiKit.Style depends on MochiKit.Base!';
26 }
27
28 try {
29 if (typeof(MochiKit.DOM) == 'undefined') {
30 throw '';
31 }
32 } catch (e) {
33 throw 'MochiKit.Style depends on MochiKit.DOM!';
34 }
35
36
37 if (typeof(MochiKit.Style) == 'undefined') {
38 MochiKit.Style = {};
39 }
40
41 MochiKit.Style.NAME = 'MochiKit.Style';
42 MochiKit.Style.VERSION = '1.4';
43 MochiKit.Style.__repr__ = function () {
44 return '[' + this.NAME + ' ' + this.VERSION + ']';
45 };
46 MochiKit.Style.toString = function () {
47 return this.__repr__();
48 };
49
50 MochiKit.Style.EXPORT_OK = [];
51
52 MochiKit.Style.EXPORT = [
53 'setOpacity',
54 'getOpacity',
55 'setStyle',
56 'getStyle', // temporary
57 'computedStyle',
58 'getElementDimensions',
59 'elementDimensions', // deprecated
60 'setElementDimensions',
61 'getElementPosition',
62 'elementPosition', // deprecated
63 'setElementPosition',
64 'setDisplayForElement',
65 'hideElement',
66 'showElement',
67 'getViewportDimensions',
68 'getViewportPosition',
69 'Dimensions',
70 'Coordinates'
71 ];
72
73
74 /*
75
76 Dimensions
77
78 */
79 /** @id MochiKit.Style.Dimensions */
80 MochiKit.Style.Dimensions = function (w, h) {
81 this.w = w;
82 this.h = h;
83 };
84
85 MochiKit.Style.Dimensions.prototype.__repr__ = function () {
86 var repr = MochiKit.Base.repr;
87 return '{w: ' + repr(this.w) + ', h: ' + repr(this.h) + '}';
88 };
89
90 MochiKit.Style.Dimensions.prototype.toString = function () {
91 return this.__repr__();
92 };
93
94
95 /*
96
97 Coordinates
98
99 */
100 /** @id MochiKit.Style.Coordinates */
101 MochiKit.Style.Coordinates = function (x, y) {
102 this.x = x;
103 this.y = y;
104 };
105
106 MochiKit.Style.Coordinates.prototype.__repr__ = function () {
107 var repr = MochiKit.Base.repr;
108 return '{x: ' + repr(this.x) + ', y: ' + repr(this.y) + '}';
109 };
110
111 MochiKit.Style.Coordinates.prototype.toString = function () {
112 return this.__repr__();
113 };
114
115
116 MochiKit.Base.update(MochiKit.Style, {
117
118 /** @id MochiKit.Style.computedStyle */
119 computedStyle: function (elem, cssProperty) {
120 var dom = MochiKit.DOM;
121 var d = dom._document;
122
123 elem = dom.getElement(elem);
124 cssProperty = MochiKit.Base.camelize(cssProperty);
125
126 if (!elem || elem == d) {
127 return undefined;
128 }
129
130 /* from YUI 0.10.0 */
131 if (cssProperty == 'opacity' && elem.filters) { // IE opacity
132 try {
133 return elem.filters.item('DXImageTransform.Microsoft.Alpha'
134 ).opacity / 100;
135 } catch(e) {
136 try {
137 return elem.filters.item('alpha').opacity / 100;
138 } catch(e) {}
139 }
140 }
141
142 if (elem.currentStyle) {
143 return elem.currentStyle[cssProperty];
144 }
145 if (typeof(d.defaultView) == 'undefined') {
146 return undefined;
147 }
148 if (d.defaultView === null) {
149 return undefined;
150 }
151 var style = d.defaultView.getComputedStyle(elem, null);
152 if (typeof(style) == 'undefined' || style === null) {
153 return undefined;
154 }
155
156 var selectorCase = cssProperty.replace(/([A-Z])/g, '-$1'
157 ).toLowerCase(); // from dojo.style.toSelectorCase
158
159 return style.getPropertyValue(selectorCase);
160 },
161
162 /** @id MochiKit.Style.getStyle */
163 getStyle: function (elem, style) {
164 elem = MochiKit.DOM.getElement(elem);
165 var value = elem.style[MochiKit.Base.camelize(style)];
166 if (!value) {
167 if (document.defaultView && document.defaultView.getComputedStyle) {
168 var css = document.defaultView.getComputedStyle(elem, null);
169 value = css ? css.getPropertyValue(style) : null;
170 } else if (elem.currentStyle) {
171 value = elem.currentStyle[MochiKit.Base.camelize(style)];
172 }
173 }
174
175 if (/Opera/.test(navigator.userAgent) && (MochiKit.Base.find(['left', 'top', 'right', 'bottom'], style) != -1)) {
176 if (MochiKit.Style.getStyle(elem, 'position') == 'static') {
177 value = 'auto';
178 }
179 }
180
181 return value == 'auto' ? null : value;
182 },
183
184 /** @id MochiKit.Style.setStyle */
185 setStyle: function (elem, style) {
186 elem = MochiKit.DOM.getElement(elem);
187 for (name in style) {
188 elem.style[MochiKit.Base.camelize(name)] = style[name];
189 }
190 },
191
192 /** @id MochiKit.Style.getOpacity */
193 getOpacity: function (elem) {
194 var opacity;
195 if (opacity = MochiKit.Style.getStyle(elem, 'opacity')) {
196 return parseFloat(opacity);
197 }
198 if (opacity = (MochiKit.Style.getStyle(elem, 'filter') || '').match(/alpha\(opacity=(.*)\)/)) {
199 if (opacity[1]) {
200 return parseFloat(opacity[1]) / 100;
201 }
202 }
203 return 1.0;
204 },
205 /** @id MochiKit.Style.setOpacity */
206 setOpacity: function(elem, o) {
207 elem = MochiKit.DOM.getElement(elem);
208 var self = MochiKit.Style;
209 if (o == 1) {
210 var toSet = /Gecko/.test(navigator.userAgent) && !(/Konqueror|Safari|KHTML/.test(navigator.userAgent));
211 self.setStyle(elem, {opacity: toSet ? 0.999999 : 1.0});
212 if (/MSIE/.test(navigator.userAgent)) {
213 self.setStyle(elem, {filter:
214 self.getStyle(elem, 'filter').replace(/alpha\([^\)]*\)/gi, '')});
215 }
216 } else {
217 if (o < 0.00001) {
218 o = 0;
219 }
220 self.setStyle(elem, {opacity: o});
221 if (/MSIE/.test(navigator.userAgent)) {
222 self.setStyle(elem,
223 {filter: self.getStyle(elem, 'filter').replace(/alpha\([^\)]*\)/gi, '') + 'alpha(opacity=' + o * 100 + ')' });
224 }
225 }
226 },
227
228 /*
229
230 getElementPosition is adapted from YAHOO.util.Dom.getXY v0.9.0.
231 Copyright: Copyright (c) 2006, Yahoo! Inc. All rights reserved.
232 License: BSD, http://developer.yahoo.net/yui/license.txt
233
234 */
235
236 /** @id MochiKit.Style.getElementPosition */
237 getElementPosition: function (elem, /* optional */relativeTo) {
238 var self = MochiKit.Style;
239 var dom = MochiKit.DOM;
240 elem = dom.getElement(elem);
241
242 if (!elem ||
243 (!(elem.x && elem.y) &&
244 (!elem.parentNode == null ||
245 self.computedStyle(elem, 'display') == 'none'))) {
246 return undefined;
247 }
248
249 var c = new self.Coordinates(0, 0);
250 var box = null;
251 var parent = null;
252
253 var d = MochiKit.DOM._document;
254 var de = d.documentElement;
255 var b = d.body;
256
257 if (!elem.parentNode && elem.x && elem.y) {
258 /* it's just a MochiKit.Style.Coordinates object */
259 c.x += elem.x || 0;
260 c.y += elem.y || 0;
261 } else if (elem.getBoundingClientRect) { // IE shortcut
262 /*
263
264 The IE shortcut can be off by two. We fix it. See:
265 http://msdn.microsoft.com/workshop/author/dhtml/reference/methods/getboundingclientrect.asp
266
267 This is similar to the method used in
268 MochiKit.Signal.Event.mouse().
269
270 */
271 box = elem.getBoundingClientRect();
272
273 c.x += box.left +
274 (de.scrollLeft || b.scrollLeft) -
275 (de.clientLeft || 0);
276
277 c.y += box.top +
278 (de.scrollTop || b.scrollTop) -
279 (de.clientTop || 0);
280
281 } else if (elem.offsetParent) {
282 c.x += elem.offsetLeft;
283 c.y += elem.offsetTop;
284 parent = elem.offsetParent;
285
286 if (parent != elem) {
287 while (parent) {
288 c.x += parent.offsetLeft;
289 c.y += parent.offsetTop;
290 parent = parent.offsetParent;
291 }
292 }
293
294 /*
295
296 Opera < 9 and old Safari (absolute) incorrectly account for
297 body offsetTop and offsetLeft.
298
299 */
300 var ua = navigator.userAgent.toLowerCase();
301 if ((typeof(opera) != 'undefined' &&
302 parseFloat(opera.version()) < 9) ||
303 (ua.indexOf('safari') != -1 &&
304 self.computedStyle(elem, 'position') == 'absolute')) {
305
306 c.x -= b.offsetLeft;
307 c.y -= b.offsetTop;
308
309 }
310 }
311
312 if (typeof(relativeTo) != 'undefined') {
313 relativeTo = arguments.callee(relativeTo);
314 if (relativeTo) {
315 c.x -= (relativeTo.x || 0);
316 c.y -= (relativeTo.y || 0);
317 }
318 }
319
320 if (elem.parentNode) {
321 parent = elem.parentNode;
322 } else {
323 parent = null;
324 }
325
326 while (parent) {
327 var tagName = parent.tagName.toUpperCase();
328 if (tagName === 'BODY' || tagName === 'HTML') {
329 break;
330 }
331 c.x -= parent.scrollLeft;
332 c.y -= parent.scrollTop;
333 if (parent.parentNode) {
334 parent = parent.parentNode;
335 } else {
336 parent = null;
337 }
338 }
339
340 return c;
341 },
342
343 /** @id MochiKit.Style.setElementPosition */
344 setElementPosition: function (elem, newPos/* optional */, units) {
345 elem = MochiKit.DOM.getElement(elem);
346 if (typeof(units) == 'undefined') {
347 units = 'px';
348 }
349 var newStyle = {};
350 var isUndefNull = MochiKit.Base.isUndefinedOrNull;
351 if (!isUndefNull(newPos.x)) {
352 newStyle['left'] = newPos.x + units;
353 }
354 if (!isUndefNull(newPos.y)) {
355 newStyle['top'] = newPos.y + units;
356 }
357 MochiKit.DOM.updateNodeAttributes(elem, {'style': newStyle});
358 },
359
360 /** @id MochiKit.Style.getElementDimensions */
361 getElementDimensions: function (elem) {
362 var self = MochiKit.Style;
363 var dom = MochiKit.DOM;
364 if (typeof(elem.w) == 'number' || typeof(elem.h) == 'number') {
365 return new self.Dimensions(elem.w || 0, elem.h || 0);
366 }
367 elem = dom.getElement(elem);
368 if (!elem) {
369 return undefined;
370 }
371 var disp = self.computedStyle(elem, 'display');
372 // display can be empty/undefined on WebKit/KHTML
373 if (disp != 'none' && disp != '' && typeof(disp) != 'undefined') {
374 return new self.Dimensions(elem.offsetWidth || 0,
375 elem.offsetHeight || 0);
376 }
377 var s = elem.style;
378 var originalVisibility = s.visibility;
379 var originalPosition = s.position;
380 s.visibility = 'hidden';
381 s.position = 'absolute';
382 s.display = '';
383 var originalWidth = elem.offsetWidth;
384 var originalHeight = elem.offsetHeight;
385 s.display = 'none';
386 s.position = originalPosition;
387 s.visibility = originalVisibility;
388 return new self.Dimensions(originalWidth, originalHeight);
389 },
390
391 /** @id MochiKit.Style.setElementDimensions */
392 setElementDimensions: function (elem, newSize/* optional */, units) {
393 elem = MochiKit.DOM.getElement(elem);
394 if (typeof(units) == 'undefined') {
395 units = 'px';
396 }
397 var newStyle = {};
398 var isUndefNull = MochiKit.Base.isUndefinedOrNull;
399 if (!isUndefNull(newSize.w)) {
400 newStyle['width'] = newSize.w + units;
401 }
402 if (!isUndefNull(newSize.h)) {
403 newStyle['height'] = newSize.h + units;
404 }
405 MochiKit.DOM.updateNodeAttributes(elem, {'style': newStyle});
406 },
407
408 /** @id MochiKit.Style.setDisplayForElement */
409 setDisplayForElement: function (display, element/*, ...*/) {
410 var elements = MochiKit.Base.extend(null, arguments, 1);
411 var getElement = MochiKit.DOM.getElement;
412 for (var i = 0; i < elements.length; i++) {
413 var element = getElement(elements[i]);
414 if (element) {
415 element.style.display = display;
416 }
417 }
418 },
419
420 /** @id MochiKit.Style.getViewportDimensions */
421 getViewportDimensions: function () {
422 var d = new MochiKit.Style.Dimensions();
423
424 var w = MochiKit.DOM._window;
425 var b = MochiKit.DOM._document.body;
426
427 if (w.innerWidth) {
428 d.w = w.innerWidth;
429 d.h = w.innerHeight;
430 } else if (b.parentElement.clientWidth) {
431 d.w = b.parentElement.clientWidth;
432 d.h = b.parentElement.clientHeight;
433 } else if (b && b.clientWidth) {
434 d.w = b.clientWidth;
435 d.h = b.clientHeight;
436 }
437 return d;
438 },
439
440 /** @id MochiKit.Style.getViewportPosition */
441 getViewportPosition: function () {
442 var c = new MochiKit.Style.Coordinates(0, 0);
443 var d = MochiKit.DOM._document;
444 var de = d.documentElement;
445 var db = d.body;
446 if (de && (de.scrollTop || de.scrollLeft)) {
447 c.x = de.scrollLeft;
448 c.y = de.scrollTop;
449 } else if (db) {
450 c.x = db.scrollLeft;
451 c.y = db.scrollTop;
452 }
453 return c;
454 },
455
456 __new__: function () {
457 var m = MochiKit.Base;
458
459 this.elementPosition = this.getElementPosition;
460 this.elementDimensions = this.getElementDimensions;
461
462 this.hideElement = m.partial(this.setDisplayForElement, 'none');
463 this.showElement = m.partial(this.setDisplayForElement, 'block');
464
465 this.EXPORT_TAGS = {
466 ':common': this.EXPORT,
467 ':all': m.concat(this.EXPORT, this.EXPORT_OK)
468 };
469
470 m.nameFunctions(this);
471 }
472 });
473
474 MochiKit.Style.__new__();
475 MochiKit.Base._exportSymbols(this, MochiKit.Style);

mercurial