]> git.stg.codes - stg.git/blob - doc/xslt/slides/browser/xbStyle-css.js
Cosmetic changes.
[stg.git] / doc / xslt / slides / browser / xbStyle-css.js
1 /*
2  * xbStyle-css.js
3  * $Revision: 1.2 $ $Date: 2003/02/07 16:04:21 $
4  *
5  */
6
7 /* ***** BEGIN LICENSE BLOCK *****
8  * Version: MPL 1.1/GPL 2.0/LGPL 2.1
9  *
10  * The contents of this file are subject to the Mozilla Public License Version
11  * 1.1 (the "License"); you may not use this file except in compliance with
12  * the License. You may obtain a copy of the License at
13  * http://www.mozilla.org/MPL/
14  *
15  * Software distributed under the License is distributed on an "AS IS" basis,
16  * WITHOUT WARRANTY OF ANY KIND, either express or implied. See the License
17  * for the specific language governing rights and limitations under the
18  * License.
19  *
20  * The Original Code is Netscape code.
21  *
22  * The Initial Developer of the Original Code is
23  * Netscape Corporation.
24  * Portions created by the Initial Developer are Copyright (C) 2001
25  * the Initial Developer. All Rights Reserved.
26  *
27  * Contributor(s): Bob Clary <bclary@netscape.com>
28  *
29  * ***** END LICENSE BLOCK ***** */
30
31 // xbStyle.getClip()
32
33 function cssStyleGetClip()
34 {
35   var clip = this.getEffectiveValue('clip');
36
37   // hack opera
38   if (clip == 'rect()')
39     clip = '';
40
41   if (clip == '' || clip == 'auto')
42   {
43     clip = 'rect(0px, ' + this.getWidth() + 'px, ' + this.getHeight() + 'px, 0px)';
44   }
45   else
46   { 
47     clip = clip.replace(/px /g, 'px, ');
48   }
49
50   return clip;
51 }
52
53 // xbStyle.setClip()
54
55 function cssStyleSetClip(sClipString)
56 {
57   this.styleObj.clip = sClipString;
58 }
59
60 // xbStyle.getClipTop()
61
62 function cssStyleGetClipTop()
63 {
64   var clip = this.getClip();
65   var rect = new xbClipRect(clip);
66   return rect.top;
67 }
68
69 // xbStyle.setClipTop()
70
71 function cssStyleSetClipTop(top)
72 {
73   var clip = this.getClip();
74   var rect         = new xbClipRect(clip);
75   rect.top         = top;
76   this.styleObj.clip = rect.toString();
77 }
78
79 // xbStyle.getClipRight()
80
81 function cssStyleGetClipRight()
82 {
83   var clip = this.getClip();
84   var rect = new xbClipRect(clip);
85   return rect.right;
86 }
87
88 // xbStyle.setClipRight()
89
90 function cssStyleSetClipRight(right)
91 {
92   var clip = this.getClip();
93   var rect          = new xbClipRect(clip);
94   rect.right        = right;
95   this.styleObj.clip  = rect.toString();
96 }
97
98 // xbStyle.getClipBottom()
99
100 function cssStyleGetClipBottom()
101 {
102   var clip = this.getClip();
103   var rect = new xbClipRect(clip);
104   return rect.bottom;
105 }
106
107 // xbStyle.setClipBottom()
108
109 function cssStyleSetClipBottom(bottom)
110 {
111   var clip = this.getClip();
112   var rect           = new xbClipRect(clip);
113   rect.bottom        = bottom;
114   this.styleObj.clip   = rect.toString();
115 }
116
117 // xbStyle.getClipLeft()
118
119 function cssStyleGetClipLeft()
120 {
121   var clip = this.getClip();
122   var rect = new xbClipRect(clip);
123   return rect.left;
124 }
125
126 // xbStyle.setClipLeft()
127
128 function cssStyleSetClipLeft(left)
129 {
130   var clip = this.getClip();
131   var rect = new xbClipRect(clip);
132   rect.left = left;
133   this.styleObj.clip = rect.toString();
134 }
135
136 // xbStyle.getClipWidth()
137
138 function cssStyleGetClipWidth()
139 {
140   var clip = this.getClip();
141   var rect = new xbClipRect(clip);
142   return rect.getWidth();
143 }
144
145 // xbStyle.setClipWidth()
146
147 function cssStyleSetClipWidth(width)
148 {
149   var clip = this.getClip();
150   var rect = new xbClipRect(clip);
151   rect.setWidth(width);
152   this.styleObj.clip = rect.toString();
153 }
154
155 // xbStyle.getClipHeight()
156
157 function cssStyleGetClipHeight()
158 {
159   var clip = this.getClip();
160   var rect = new xbClipRect(clip);
161   return rect.getHeight();
162 }
163
164 // xbStyle.setClipHeight()
165
166 function cssStyleSetClipHeight(height)
167 {
168   var clip = this.getClip();
169   var rect = new xbClipRect(clip);
170   rect.setHeight(height);
171   this.styleObj.clip = rect.toString();
172 }
173
174 // the CSS attributes left,top are for absolutely positioned elements
175 // measured relative to the containing element.  for relatively positioned
176 // elements, left,top are measured from the element's normal inline position.
177 // getLeft(), setLeft() operate on this type of coordinate.
178 //
179 // to allow dynamic positioning the getOffsetXXX and setOffsetXXX methods are
180 // defined to return and set the position of either an absolutely or relatively
181 // positioned element relative to the containing element.
182 //
183 //
184
185 // xbStyle.getLeft()
186
187 function cssStyleGetLeft()
188 {
189   var left = this.getEffectiveValue('left');
190   if (typeof(left) == 'number')
191      return left;
192
193   if (left != '' && left.indexOf('px') == -1)
194   {
195     xbDEBUG.dump('xbStyle.getLeft: Element ID=' + this.object.id + ' does not use pixels as units. left=' + left + ' Click Ok to continue, Cancel to Abort');
196     return 0;
197   }
198
199   if (top == 'auto' && this.object && typeof(this.object.offsetTop) == 'number')
200   {
201     left = this.object.offsetTop + 'px';
202   }
203
204   if (left == '')
205     left = '0px';
206       
207   return xbToInt(left);
208 }
209
210 // xbStyle.setLeft()
211
212 function cssStyleSetLeft(left)
213 {
214   if (typeof(this.styleObj.left) == 'number')
215     this.styleObj.left = left;
216   else
217     this.styleObj.left = left + 'px';
218 }
219
220 // xbStyle.getTop()
221
222 function cssStyleGetTop()
223 {
224   var top = this.getEffectiveValue('top');
225   if (typeof(top) == 'number')
226      return top;
227
228   if (top != '' && top.indexOf('px') == -1)
229   {
230     xbDEBUG.dump('xbStyle.getTop: Element ID=' + this.object.id + ' does not use pixels as units. top=' + top + ' Click Ok to continue, Cancel to Abort');
231     return 0;
232   }
233
234   if (top == 'auto' && this.object && typeof(this.object.offsetTop) == 'number')
235   {
236     top = this.object.offsetTop + 'px';
237   }
238
239   if (top == '')
240     top = '0px';
241       
242   return xbToInt(top);
243 }
244
245 // xbStyle.setTop()
246
247 function cssStyleSetTop(top)
248 {
249   if (typeof(this.styleObj.top) == 'number')
250     this.styleObj.top = top;
251   else
252     this.styleObj.top = top + 'px';
253 }
254
255 // xbStyle.getPageX()
256
257 function cssStyleGetPageX()
258 {
259   var x = 0;
260   var elm = this.object;
261   var elmstyle;
262   var position;
263   
264   //xxxHack: Due to limitations in Gecko's (0.9.6) ability to determine the 
265   // effective position attribute , attempt to use offsetXXX
266
267   if (typeof(elm.offsetLeft) == 'number')
268   {
269     while (elm)
270     {
271       x += elm.offsetLeft;
272       elm = elm.offsetParent;
273     }
274   }
275   else
276   {
277     while (elm)
278     {
279       if (elm.style)
280       {
281         elmstyle = new xbStyle(elm);
282         position = elmstyle.getEffectiveValue('position');
283         if (position != '' && position != 'static')
284           x += elmstyle.getLeft();
285       }
286       elm = elm.parentNode;
287     }
288   }
289   
290   return x;
291 }
292
293 // xbStyle.setPageX()
294
295 function cssStyleSetPageX(x)
296 {
297   var xParent = 0;
298   var elm = this.object.parentNode;
299   var elmstyle;
300   var position;
301   
302   //xxxHack: Due to limitations in Gecko's (0.9.6) ability to determine the 
303   // effective position attribute , attempt to use offsetXXX
304
305   if (elm && typeof(elm.offsetLeft) == 'number')
306   {
307     while (elm)
308     {
309       xParent += elm.offsetLeft;
310       elm = elm.offsetParent;
311     }
312   }
313   else
314   {
315     while (elm)
316     {
317       if (elm.style)
318       {
319         elmstyle = new xbStyle(elm);
320         position = elmstyle.getEffectiveValue('position');
321         if (position != '' && position != 'static')
322           xParent += elmstyle.getLeft();
323       }
324       elm = elm.parentNode;
325     }
326   }
327   
328   x -= xParent;
329
330   this.setLeft(x);
331 }
332     
333 // xbStyle.getPageY()
334
335 function cssStyleGetPageY()
336 {
337   var y = 0;
338   var elm = this.object;
339   var elmstyle;
340   var position;
341   
342   //xxxHack: Due to limitations in Gecko's (0.9.6) ability to determine the 
343   // effective position attribute , attempt to use offsetXXX
344
345   if (typeof(elm.offsetTop) == 'number')
346   {
347     while (elm)
348     {
349       y += elm.offsetTop;
350       elm = elm.offsetParent;
351     }
352   }
353   else
354   {
355     while (elm)
356     {
357       if (elm.style)
358       {
359         elmstyle = new xbStyle(elm);
360         position = elmstyle.getEffectiveValue('position');
361         if (position != '' && position != 'static')
362           y += elmstyle.getTop();
363       }
364       elm = elm.parentNode;
365     }
366   }
367   
368   return y;
369 }
370
371 // xbStyle.setPageY()
372
373 function cssStyleSetPageY(y)
374 {
375   var yParent = 0;
376   var elm = this.object.parentNode;
377   var elmstyle;
378   var position;
379   
380   //xxxHack: Due to limitations in Gecko's (0.9.6) ability to determine the 
381   // effective position attribute , attempt to use offsetXXX
382
383   if (elm && typeof(elm.offsetTop) == 'number')
384   {
385     while (elm)
386     {
387       yParent += elm.offsetTop;
388       elm = elm.offsetParent;
389     }
390   }
391   else
392   {
393     while (elm)
394     {
395       if (elm.style)
396       {
397         elmstyle = new xbStyle(elm);
398         position = elmstyle.getEffectiveValue('position');
399         if (position != '' && position != 'static')
400           yParent += elmstyle.getTop();
401       }
402       elm = elm.parentNode;
403     }
404   }
405   
406   y -= yParent;
407
408   this.setTop(y);
409 }
410     
411 // xbStyle.getHeight()
412
413 function cssStyleGetHeight()
414 {
415   var display = this.getEffectiveValue('display');
416   var height = this.getEffectiveValue('height');
417
418   if (typeof(height) == 'number')
419   {
420      // Opera
421      return height;
422   }
423
424   if (height == '' || height == 'auto' || height.indexOf('%') != -1)
425   {
426     if (typeof(this.object.offsetHeight) == 'number')
427     {
428       height = this.object.offsetHeight + 'px';
429     }
430     else if (typeof(this.object.scrollHeight) == 'number')
431     {
432       height = this.object.scrollHeight + 'px';
433     }
434   }
435
436   if (height.indexOf('px') == -1)
437   {
438     xbDEBUG.dump('xbStyle.getHeight: Element ID=' + this.object.id + ' does not use pixels as units. height=' + height + ' Click Ok to continue, Cancel to Abort');
439     return 0;
440   }
441
442   height = xbToInt(height);
443
444   return height;
445 }
446
447 // xbStyle.setHeight()
448
449 function cssStyleSetHeight(height)
450 {
451   if (typeof(this.styleObj.height) == 'number')
452     this.styleObj.height = height;
453   else
454     this.styleObj.height = height + 'px';
455 }
456
457 // xbStyle.getWidth()
458
459 function cssStyleGetWidth()
460 {
461   var display = this.getEffectiveValue('display');
462   var width = this.getEffectiveValue('width');
463
464   if (typeof(width) == 'number')
465   {
466      // note Opera 6 has a bug in width and offsetWidth where 
467      // it returns the page width. Use clientWidth instead.
468      if (navigator.userAgent.indexOf('Opera') != -1)
469        return this.object.clientWidth;
470      else
471        return width;
472   }
473
474   if (width == '' || width == 'auto' || width.indexOf('%') != -1)
475   {
476     if (typeof(this.object.offsetWidth) == 'number')
477     {
478       width = this.object.offsetWidth + 'px';
479     }
480     else if (typeof(this.object.scrollHeight) == 'number')
481     {
482       width = this.object.scrollWidth + 'px';
483     }
484   }
485
486   if (width.indexOf('px') == -1)
487   {
488     xbDEBUG.dump('xbStyle.getWidth: Element ID=' + this.object.id + ' does not use pixels as units. width=' + width + ' Click Ok to continue, Cancel to Abort');
489     return 0;
490   }
491
492   width = xbToInt(width);
493
494   return width;
495 }
496
497 // xbStyle.setWidth()
498
499 function cssStyleSetWidth(width)
500 {
501   if (typeof(this.styleObj.width) == 'number')
502     this.styleObj.width = width;
503   else
504     this.styleObj.width = width + 'px';
505 }
506
507 // xbStyle.getVisibility()
508
509 function cssStyleGetVisibility()
510 {
511   return this.getEffectiveValue('visibility');
512 }
513
514 // xbStyle.setVisibility()
515
516 function cssStyleSetVisibility(visibility)
517 {
518   this.styleObj.visibility = visibility;
519 }
520
521 // xbStyle.getzIndex()
522
523 function cssStyleGetzIndex()
524 {
525   return xbToInt(this.getEffectiveValue('zIndex'));
526 }
527
528 // xbStyle.setzIndex()
529
530 function cssStyleSetzIndex(zIndex)
531 {
532   this.styleObj.zIndex = zIndex;
533 }
534
535 // xbStyle.getBackgroundColor()
536
537 function cssStyleGetBackgroundColor()
538 {
539   return this.getEffectiveValue('backgroundColor');
540 }
541
542 // xbStyle.setBackgroundColor()
543
544 function cssStyleSetBackgroundColor(color)
545 {
546   this.styleObj.backgroundColor = color;
547 }
548
549 // xbStyle.getColor()
550
551 function cssStyleGetColor()
552 {
553   return this.getEffectiveValue('color');
554 }
555
556 // xbStyle.setColor()
557
558 function cssStyleSetColor(color)
559 {
560   this.styleObj.color = color;
561 }
562
563 // xbStyle.moveAbove()
564
565 function xbStyleMoveAbove(cont)
566 {
567   this.setzIndex(cont.getzIndex()+1);
568 }
569
570 // xbStyle.moveBelow()
571
572 function xbStyleMoveBelow(cont)
573 {
574   var zindex = cont.getzIndex() - 1;
575             
576   this.setzIndex(zindex);
577 }
578
579 // xbStyle.moveBy()
580
581 function xbStyleMoveBy(deltaX, deltaY)
582 {
583   this.moveTo(this.getLeft() + deltaX, this.getTop() + deltaY);
584 }
585
586 // xbStyle.moveTo()
587
588 function xbStyleMoveTo(x, y)
589 {
590   this.setLeft(x);
591   this.setTop(y);
592 }
593
594 // xbStyle.moveToAbsolute()
595
596 function xbStyleMoveToAbsolute(x, y)
597 {
598   this.setPageX(x);
599   this.setPageY(y);
600 }
601
602 // xbStyle.resizeBy()
603
604 function xbStyleResizeBy(deltaX, deltaY)
605 {
606   this.setWidth( this.getWidth() + deltaX );
607   this.setHeight( this.getHeight() + deltaY );
608 }
609
610 // xbStyle.resizeTo()
611
612 function xbStyleResizeTo(x, y)
613 {
614   this.setWidth(x);
615   this.setHeight(y);
616 }
617
618 // xbStyle.setInnerHTML()
619
620 function xbSetInnerHTML(str)
621 {
622   if (typeof(this.object.innerHTML) != 'undefined')
623     this.object.innerHTML = str;
624 }
625
626
627 // Extensions to xbStyle that are not supported by Netscape Navigator 4
628 // but that provide cross browser implementations of properties for 
629 // Mozilla, Gecko, Netscape 6.x and Opera
630
631 // xbStyle.getBorderTopWidth()
632
633 function cssStyleGetBorderTopWidth()
634 {
635   return xbToInt(this.getEffectiveValue('borderTopWidth'));
636 }
637
638 // xbStyle.getBorderRightWidth()
639
640 function cssStyleGetBorderRightWidth()
641 {
642   return xbToInt(this.getEffectiveValue('borderRightWidth'));
643 }
644
645 // xbStyle.getBorderBottomWidth()
646
647 function cssStyleGetBorderBottomWidth()
648 {
649   return xbToInt(this.getEffectiveValue('borderBottomWidth'));
650 }
651
652 // xbStyle.getBorderLeftWidth()
653
654 function cssStyleGetBorderLeftWidth()
655 {
656   return xbToInt(this.getEffectiveValue('borderLeftWidth'));
657 }
658
659 // xbStyle.getMarginTop()
660
661 function cssStyleGetMarginTop()
662 {
663   return xbToInt(this.getEffectiveValue('marginTop'));
664 }
665
666 // xbStyle.getMarginRight()
667
668 function cssStyleGetMarginRight()
669 {
670   return xbToInt(this.getEffectiveValue('marginRight'));
671 }
672
673 // xbStyle.getMarginBottom()
674
675 function cssStyleGetMarginBottom()
676 {
677   return xbToInt(this.getEffectiveValue('marginBottom'));
678 }
679
680 // xbStyle.getMarginLeft()
681
682 function cssStyleGetMarginLeft()
683 {
684   return xbToInt(this.getEffectiveValue('marginLeft'));
685 }
686
687 // xbStyle.getPaddingTop()
688
689 function cssStyleGetPaddingTop()
690 {
691   return xbToInt(this.getEffectiveValue('paddingTop'));
692 }
693
694 // xbStyle.getPaddingRight()
695
696 function cssStyleGetPaddingRight()
697 {
698   return xbToInt(this.getEffectiveValue('paddingRight'));
699 }
700
701 // xbStyle.getPaddingBottom()
702
703 function cssStyleGetPaddingBottom()
704 {
705   return xbToInt(this.getEffectiveValue('paddingBottom'));
706 }
707
708 // xbStyle.getPaddingLeft()
709
710 function cssStyleGetPaddingLeft()
711 {
712   return xbToInt(this.getEffectiveValue('paddingLeft'));
713 }
714
715 // xbStyle.getClientWidth()
716
717 function cssStyleGetClientWidth()
718 {
719   return this.getWidth() + this.getPaddingLeft() + this.getPaddingRight();
720   /*
721   if (typeof(this.object.clientWidth) == 'number')
722     return this.object.clientWidth;
723
724   return null;
725     */
726 }
727
728 // xbStyle.getClientHeight()
729
730 function cssStyleGetClientHeight()
731 {
732   return this.getHeight() + this.getPaddingTop() + this.getPaddingBottom();
733   /*
734   if (typeof(this.object.clientHeight) == 'number')
735     return this.object.clientHeight;
736
737   return null;
738   */
739 }
740
741 xbStyle.prototype.getClip            = cssStyleGetClip;
742 xbStyle.prototype.setClip            = cssStyleSetClip;  
743 xbStyle.prototype.getClipTop         = cssStyleGetClipTop;
744 xbStyle.prototype.setClipTop         = cssStyleSetClipTop;  
745 xbStyle.prototype.getClipRight       = cssStyleGetClipRight;
746 xbStyle.prototype.setClipRight       = cssStyleSetClipRight;  
747 xbStyle.prototype.getClipBottom      = cssStyleGetClipBottom;
748 xbStyle.prototype.setClipBottom      = cssStyleSetClipBottom;  
749 xbStyle.prototype.getClipLeft        = cssStyleGetClipLeft;
750 xbStyle.prototype.setClipLeft        = cssStyleSetClipLeft;  
751 xbStyle.prototype.getClipWidth       = cssStyleGetClipWidth;
752 xbStyle.prototype.setClipWidth       = cssStyleSetClipWidth;  
753 xbStyle.prototype.getClipHeight      = cssStyleGetClipHeight;
754 xbStyle.prototype.setClipHeight      = cssStyleSetClipHeight;  
755 xbStyle.prototype.getLeft            = cssStyleGetLeft;
756 xbStyle.prototype.setLeft            = cssStyleSetLeft;
757 xbStyle.prototype.getTop             = cssStyleGetTop;
758 xbStyle.prototype.setTop             = cssStyleSetTop;
759 xbStyle.prototype.getPageX           = cssStyleGetPageX;
760 xbStyle.prototype.setPageX           = cssStyleSetPageX;
761 xbStyle.prototype.getPageY           = cssStyleGetPageY;
762 xbStyle.prototype.setPageY           = cssStyleSetPageY;
763 xbStyle.prototype.getVisibility      = cssStyleGetVisibility;
764 xbStyle.prototype.setVisibility      = cssStyleSetVisibility;
765 xbStyle.prototype.getzIndex          = cssStyleGetzIndex;
766 xbStyle.prototype.setzIndex          = cssStyleSetzIndex;            
767 xbStyle.prototype.getHeight          = cssStyleGetHeight;
768 xbStyle.prototype.setHeight          = cssStyleSetHeight;
769 xbStyle.prototype.getWidth           = cssStyleGetWidth;
770 xbStyle.prototype.setWidth           = cssStyleSetWidth;
771 xbStyle.prototype.getBackgroundColor = cssStyleGetBackgroundColor;
772 xbStyle.prototype.setBackgroundColor = cssStyleSetBackgroundColor;
773 xbStyle.prototype.getColor           = cssStyleGetColor;
774 xbStyle.prototype.setColor           = cssStyleSetColor;
775 xbStyle.prototype.setInnerHTML       = xbSetInnerHTML;
776 xbStyle.prototype.getBorderTopWidth    = cssStyleGetBorderTopWidth;
777 xbStyle.prototype.getBorderRightWidth  = cssStyleGetBorderRightWidth;
778 xbStyle.prototype.getBorderBottomWidth = cssStyleGetBorderBottomWidth;
779 xbStyle.prototype.getBorderLeftWidth   = cssStyleGetBorderLeftWidth;
780 xbStyle.prototype.getMarginLeft        = cssStyleGetMarginLeft;
781 xbStyle.prototype.getMarginTop         = cssStyleGetMarginTop;
782 xbStyle.prototype.getMarginRight       = cssStyleGetMarginRight;
783 xbStyle.prototype.getMarginBottom      = cssStyleGetMarginBottom;
784 xbStyle.prototype.getMarginLeft        = cssStyleGetMarginLeft;
785 xbStyle.prototype.getPaddingTop        = cssStyleGetPaddingTop;
786 xbStyle.prototype.getPaddingRight      = cssStyleGetPaddingRight;
787 xbStyle.prototype.getPaddingBottom     = cssStyleGetPaddingBottom;
788 xbStyle.prototype.getPaddingLeft       = cssStyleGetPaddingLeft;
789 xbStyle.prototype.getClientWidth       = cssStyleGetClientWidth;
790 xbStyle.prototype.getClientHeight      = cssStyleGetClientHeight;
791