Subversion Repositories DevTools

Rev

Details | Last modification | View Log | RSS feed

Rev Author Line No. Line
1293 dpurdie 1
/* xbdhtml.js (Cross-Browser Nav4/Gecko/IE DHTML API) 
2
   14 May 98, Eric Krock, Copyright Netscape Communications
3
   Permission is granted to reuse, redistribute, and modify 
4
   without charge.
5
 
6
   Updated 18 July 2000 by Vladimir Ermakov, Netscape Communications,
7
   and Marcell Ortutay, Plugged in Enterprises, to include support of 
8
   the new Netscape Gecko layout engine.
9
 
10
   Updated 15 of February 2001 by Vladimir Ermakov, Netscape Communications:
11
       New Features
12
        -showElt/hideElt                -convenience functions to use insead of setEltVisibility
13
        -setEltWidth/setEltHeight       -Set the width/height of a layer
14
        -getEltPageLeft/getEltPageTop   -XBrowser version of Nav4 pageX/pageY 
15
        -stringToNumber                 -Returns 0 instead of NaN
16
       Improved: 
17
        -getEltWidth/getEltHeight       -Return offsetWidth if width not specified.
18
        -Also, where possible, replaced detection by browser with detection by property 
19
 
20
   Updated October 02, 2001 by Bob Clary, Netscape Communications
21
       Misc
22
         - changed reference to Ultimate Browser Sniffer on mozilla.org
23
       Bugs Fixed
24
         - hideElt                      -fixed missing argument to setEltVisibility
25
	 - getEltPageTop                -added marginTop for IE5/Mac
26
 
27
   Makes CSSP functionality and properties of positioned, named
28
   elements accessible from JavaScript in Netscape 4.x, IE and user
29
   agents implementing Gecko layout engine offering a single set of functions which
30
   can be used on both browsers, bridging DOM differences.
31
 
32
   Allows you to do these things from JavaScript on Nav4+/IE4+/Gecko:
33
   - get element object by specifying its name
34
   - hide/show element
35
   - get/set X, Y, Z position of element
36
   - get element height/width
37
   - get/set clipping area (visible area) of element
38
   - get/set background color and background image of element
39
 
40
   Also includes simplified JavaScript client sniffer and
41
   functions to ease dynamic, conditional generation of HTML 
42
   markup via document.write() statements.
43
 
44
   Design goals:
45
   - forwardly compatible with future DOM enhancements
46
     - redefinable stub function API
47
   - coexist peacefully with other libraries
48
     - no function name conflicts with cbdhtml.js, etc.
49
   - keep # of functions reasonable and use parameters to specify values
50
   - naming convention for functions easy to learn and remember
51
     - make as short as possible to type
52
   - loadable (though not executable!) without error on Nav3 since Nav3
53
     sometimes loads <SCRIPT LANGUAGE="JavaScript1.2" SRC=___.js>
54
   - usable in part or in whole; don't have to use whole thing
55
     - can copy and paste individual functions into existing code
56
       Exceptions to this rule: 
57
       1) you must include Is() constructor function and an
58
          instance of "is" global variable; all functions depend on this.
59
       2) getEltBackgroundColor depends on the color-related functions;
60
          to use it, you must include the others as well;
61
       3) all the functions for getting the clipping area 
62
          (getEltClipLeft getEltClipTop getEltClipRight 
63
           getEltClipBottom getEltClipWidth getEltClipHeight)
64
          depend on tempClipObj for use on IE4.
65
 
66
   Usage notes:
67
   - Place the SCRIPT element which links to this JavaScript file, xbdhtml.js,
68
     before your own SCRIPT which calls its functions.
69
 
70
     Example of correct usage: in the HEAD, place this HTML markup:
71
 
72
     <!-- This external script defines cross-browser functions for
73
          accessing CSSP and element properties. -->
74
     <SCRIPT LANGUAGE="JavaScript1.2" SRC=xbdhtml.js> </SCRIPT>
75
     <!-- Make your function calls to manipulate elements in this
76
          SCRIPT, now that the functions have been loaded. -->
77
     <SCRIPT LANGUAGE="JavaScript1.2"><!--
78
     //-*** put your function calls here ***
79
     //--></SCRIPT>
80
*/
81
 
82
 
83
// This is a simplified version of the JavaScript Client Sniffer code 
84
// found at http://www.mozilla.org/docs/web-developer/sniffer/browser_type.html
85
 
86
function Is ()
87
{   // convert all characters to lowercase to simplify testing
88
    var agt=navigator.userAgent.toLowerCase()
89
 
90
    // --- BROWSER VERSION ---
91
    this.major = stringToNumber(navigator.appVersion)
92
    this.minor = parseFloat(navigator.appVersion)
93
 
94
    this.nav  = ((agt.indexOf('mozilla')!=-1) && ((agt.indexOf('spoofer')==-1)
95
                && (agt.indexOf('compatible') == -1)))
96
    this.nav2 = (this.nav && (this.major == 2))
97
    this.nav3 = (this.nav && (this.major == 3))
98
    this.nav4 = (this.nav && (this.major == 4))
99
 
100
	//Netscape 6
101
	this.nav5 =	(this.nav && (this.major == 5))
102
	this.nav6 = (this.nav && (this.major == 5))
103
	this.gecko = (this.nav && (this.major >= 5))
104
 
105
    this.ie   = (agt.indexOf("msie") != -1)
106
    this.ie3  = (this.ie && (this.major == 2))
107
    this.ie4  = (this.ie && (this.major == 3))
108
    this.ie5  = (this.ie && (this.major == 4))
109
 
110
 
111
    this.opera = (agt.indexOf("opera") != -1)
112
 
113
    this.nav4up = this.nav && (this.major >= 4)
114
    this.ie4up  = this.ie  && (this.major >= 4)
115
}
116
 
117
 
118
var is = new Is();
119
 
120
// Convenience functions to ease dynamic/conditional markup
121
// generation depending upon browser vendor/version/OS.
122
 
123
// convenience function to save typing out document.write("STRING");
124
// if optional second argument minVersion passed in, 
125
//    only write if >= that version;
126
// if optional third  argument maxVersion passed in, 
127
//    only execute if <= that version;
128
 
129
function dw(str, minVersion, maxVersion)
130
{   if ( ((dw.arguments.length < 3) || (is.major <= maxVersion)) 
131
         && ((dw.arguments.length < 2) || (is.major >= minVersion)))
132
    document.write(str)  
133
}
134
 
135
 
136
 
137
// document write boolean
138
// convenience function to save typing out 
139
// if (aBoolean) document.write("STRING");
140
// if optional second argument aBoolean passed in, only write if
141
// aBoolean is true.
142
 
143
function dwb (str, aBoolean)
144
{   if  ((dwb.arguments.length < 2) || aBoolean)
145
    document.write(str)  
146
}
147
 
148
 
149
 
150
// string version:
151
// convenience function to return str or "" depending on version;
152
// if optional second argument version passed in, 
153
//    only return str if >= that version;
154
// if optional third  argument maxVersion passed in, 
155
//    only return str if <= that version;
156
 
157
function sv(str, minVersion, maxVersion)
158
{   if ( ((sv.arguments.length < 3) || (is.major <= maxVersion)) 
159
         && ((sv.arguments.length < 2) || (is.major >= minVersion)))
160
    return str;
161
    else return "";
162
}
163
 
164
 
165
 
166
// string boolean
167
// convenience function to save typing out 
168
// (aBoolean)?"STRING":""
169
// if optional second argument aBoolean passed in, only return
170
// str if aBoolean is true, else return "".
171
 
172
function sb (str, aBoolean)
173
{   if  ((sb.arguments.length < 2) || aBoolean)
174
    return str;
175
    else return "";
176
}
177
 
178
 
179
 
180
 
181
/* The following stub function API for cross-browser HTML 
182
   element positioning and visibility (CSSP access) was
183
   derived from Mike Hall's excellent CBDHTML API.
184
 
185
   Thanks also to Danny Goodman (http://www.dannyg.com/)
186
   and Dan Steinman (http://members.xoom.com/dynduo/).
187
 
188
   USAGE NOTE: when using the functions which get element CSSP
189
   properties [getEltLeft, getEltTop, etc.], keep in mind the 
190
   following IE4 CSSP property initialization problem: if you
191
   initialize a property value by CSSP markup, e.g.:
192
   #foo { left: 100px }
193
   rather than initializing them from JavaScript, e.g.:
194
   var fooElt = getElt ("foo");
195
   setEltLeft (fooElt, 100);
196
   ... the property value for the element's JavaScript style
197
   object (i.e. document.all.foo.style.left) is not set to the
198
   initial value! This is true for a number of IE4 style object
199
   properties including left, top, and clip. Before you get one of these
200
   properties in IE4, you must first set it from JavaScript.
201
   Workaround: set the property via JavaScript instead of CSSP
202
   markup, or set it from both to the same value.
203
*/
204
 
205
 
206
/* functions genElt, writeElt, and layerClipOrder
207
 
208
   Sometimes dynamically generating markup which is optimized for the
209
   current browser will simplify development. genElt will generate
210
   a named DIV on IE4 and Netscape6, and a LAYER/ILAYER tag on Nav4 as a string.
211
   writeElt will create the same string and write it out.
212
 
213
   These three functions must be reused as a group. writeElt calls 
214
   genElt, and those two both call layerClipOrder.
215
 
216
   ARGUMENTS OF FUNCTIONS genElt AND writeElt
217
 
218
   genElt and writeElt have identical argument lists.
219
 
220
   The first argument, name, is required. All of the other arguments 
221
   default to false and can be explicitly set to false or 
222
   omitted.  Those properties will be hard coded into the HTML markup
223
   if the argument is provided, and left unset if the argument is set 
224
   to false or omitted.  
225
 
226
   For example, both of these function calls have the same effect.
227
   They will generate a named, positioned element but not specify 
228
   any of the properties, and will write out
229
   the element and content even on Nav3/IE3 and earlier:
230
   writeElt ("foo");
231
   writeElt ("foo", false, false, false);
232
 
233
   name     STRING.  Name of element's ID.
234
   content  STRING.  Content written within element.
235
   left     INTEGER. Left edge of element in pixels.
236
   top      INTEGER. Top  edge of element in pixels.
237
   z        INTEGER. z-index of element.
238
   width    INTEGER. width in pixels.
239
   height   INTEGER. height in pixels.
240
   visibility        STRING. "visible", "hidden", or "inherit". 
241
   backgroundColor   STRING. Background color of element.
242
   backgroundImage   STRING. Background image of element.
243
   clip              STRING. Comma-delimited list (no spaces!) of 4 
244
                     integers in top-right-bottom-left order. Sets clip.
245
   relative          BOOLEAN. If true, position relatively, else absolutely.
246
                     On Nav4, this determines whether LAYER (absolute) or
247
                     ILAYER (relative) is generated.
248
   hideEltOnOlderBrowsers  BOOLEAN. If true, return '' on Nav3, IE3, and older.
249
   useDivInsteadOfLayer    BOOLEAN. If true, generate DIV on Nav4 not I/LAYER.
250
   classname               STRING.  CLASS attribute value for element.
251
 
252
   'genElt' is short for 'generate element markup'.
253
*/
254
 
255
/* maps css order <top>,<right>,<bottom>,<left> to 
256
   LAYER CLIP= order <left>,<top>,<right>,<bottom> */
257
function layerClipOrder (cssClipString)
258
{  var commaPos = cssClipString.lastIndexOf(",");
259
   return (cssClipString.substring(commaPos+1) + "," + cssClipString.substring(0,commaPos));
260
}
261
 
262
function genElt (name, content, left, top, z, width, height, visibility, 
263
                 backgroundColor, backgroundImage, clip, relative, 
264
                 hideEltOnOlderBrowsers, useDivInsteadOfLayer, classname) 
265
{ var markup = "";
266
  if (is.gecko)
267
  {
268
    markup = '<DIV ID="' + name + '"' +  
269
        ((classname)?' CLASS="' + classname + '"':'') + 
270
        ' STYLE="position:' + ((relative)?'relative;':'absolute;') + 
271
        ' overflow:none;' + 
272
        ((left)?' left:' + left + 'px;':'') + 
273
        ((top)?' top:' + top + 'px;':'') + 
274
        ((height)?' height:' + height + 'px;':'') + 
275
        ((width)?' width:' + width + 'px;':'') + 
276
        ((visibility && (visibility!='')) ? ' visibility:' + visibility + ';' : '') + 
277
        ((z)?' z-index:' + z + ';':'') + 
278
        ((backgroundColor)?' background-color:' + backgroundColor + ';':'') + 
279
        ((backgroundImage)?' background-image:url("' + backgroundImage + '");':'') +  
280
        ((clip)?' clip:rect("' + clip + '");':'') + 
281
        '">' + ((content)?content:'') + '</DIV>';
282
  }
283
 
284
  else if (is.nav && (is.major == 4 || !hideEltOnOlderBrowsers) && 
285
      !useDivInsteadOfLayer)
286
  { var tagname = (relative)?'ILAYER':'LAYER';
287
    if (visibility && (visibility!=''))
288
    {  if (visibility=="hidden") visibility = "hide";
289
       else if (visibility=="visible") visibility = "show";
290
    }
291
    markup = '<' + tagname + ' ID="' + name + '"' + ((classname)?' CLASS="' + 
292
        classname + '"':'') + ((left)?' LEFT="' + left + '"':'') + 
293
        ((top)?' TOP="' + top + '"':'') + ((width)?' WIDTH="' + width + '"':'') + 
294
        ((height)?' HEIGHT="' + height + '"':'') + 
295
        ((visibility && (visibility!='')) ? ' VISIBILITY="' + visibility + '"' : '') + 
296
        ((z)?' Z-INDEX="' + z + '"':'') + 
297
        ((backgroundColor)?' BGCOLOR="' + backgroundColor + '"':'') + 
298
        ((backgroundImage)?' BACKGROUND="' + backgroundImage + '"':'') +  
299
        ((clip)?' CLIP="' + layerClipOrder(clip) + '"':'') + 
300
        '>' + ((content)?content:'') + '</' + tagname + '>';
301
  }
302
 
303
  else if ((is.ie || (is.nav && useDivInsteadOfLayer)) && (is.major>=4 || !hideEltOnOlderBrowsers))
304
  { markup = '<DIV ID="' + name + '"' +  
305
        ((classname)?' CLASS="' + classname + '"':'') + 
306
        ' STYLE="position:' + ((relative)?'relative;':'absolute;') + 
307
        ' overflow:none;' + 
308
        ((left)?' left:' + left + 'px;':'') + 
309
        ((top)?' top:' + top + 'px;':'') + 
310
        ((height)?' height:' + height + 'px;':'') + 
311
        ((width)?' width:' + width + 'px;':'') + 
312
        ((visibility && (visibility!='')) ? ' visibility:' + visibility + ';' : '') + 
313
        ((z)?' z-index:' + z + ';':'') + 
314
        ((backgroundColor)?' background-color:' + backgroundColor + ';':'') + 
315
        ((backgroundImage)?' background-image:url("' + backgroundImage + '");':'') +  
316
        ((clip)?' clip:rect("' + clip + '");':'') + 
317
        '">' + ((content)?content:'') + '</DIV>';
318
  }
319
 
320
  return markup;
321
}
322
 
323
function writeElt (name, content, left, top, z, width, height, visibility, 
324
                   backgroundColor, backgroundImage, clip, relative, 
325
                   hideEltOnOlderBrowsers, useDivInsteadOfLayer, classname) 
326
{ if (writeElt.arguments.length < 15) classname = false;
327
  if (writeElt.arguments.length < 14) useDivInsteadOfLayer = false;
328
  if (writeElt.arguments.length < 13) hideEltOnOlderBrowsers = false;
329
  if (writeElt.arguments.length < 12) relative = false;
330
  if (writeElt.arguments.length < 11) clip = false;
331
  if (writeElt.arguments.length < 10) backgroundImage = false;
332
  if (writeElt.arguments.length < 9) backgroundColor = false;
333
  if (writeElt.arguments.length < 8) visibility = false;
334
  if (writeElt.arguments.length < 7) height = false;
335
  if (writeElt.arguments.length < 6) width = false;
336
  if (writeElt.arguments.length < 5) z = false;
337
  if (writeElt.arguments.length < 4) top = false;
338
  if (writeElt.arguments.length < 3) left = false;
339
  if (writeElt.arguments.length < 2) content = false;
340
  document.write (genElt (name, content, left, top, z, width, height, visibility, 
341
                    backgroundColor, backgroundImage, clip, relative, 
342
                 hideEltOnOlderBrowsers, useDivInsteadOfLayer, classname));
343
}
344
 
345
 
346
/* CALLING SYNTAX: each Name is a string which is an element's 
347
   ID attribute value or a LAYER tag's NAME attribute value.
348
 
349
   getElt (topLevelElementName, childElementName, grandchildElementName ...
350
                 targetElementName)
351
 
352
   Example of getting a top-level element: 
353
   var fooElement = getElt ("foo")
354
 
355
   Example of getting a nested element: 
356
   var fooElement = getElt ("bar", "baz", "foo")
357
   ... where baz is foo's containing parent, and bar is a top-level 
358
       element which is baz's containing parent.
359
*/
360
 
361
function getElt () 
362
{ if (is.nav4)
363
  {
364
    var currentLayer = document.layers[getElt.arguments[0]];
365
    for (var i=1; i<getElt.arguments.length && currentLayer; i++)
366
    {   currentLayer = currentLayer.document.layers[getElt.arguments[i]];
367
    }
368
    return currentLayer;
369
  } 
370
  else if(document.getElementById && document.getElementsByName)
371
  { 
372
    var name = getElt.arguments[getElt.arguments.length-1];
373
    if(document.getElementById(name))                      //First try to find by id
374
       return document.getElementById(name);
375
    else if (document.getElementsByName(name))             //Then if that fails by name
376
	   return document.getElementsByName(name)[0];
377
  }
378
  else if (is.ie4up) {
379
    var elt = eval('document.all.' + getElt.arguments[getElt.arguments.length-1]);
380
    return(elt);
381
  }
382
 
383
}
384
 
385
function showElt(elt)
386
{
387
	setEltVisibility(elt,'visible');
388
}
389
 
390
function hideElt(elt)
391
{
392
	setEltVisibility(elt, 'hidden');
393
}
394
 
395
/* value must be "visible", "hidden", or "inherit".
396
   These values work on Nav4, Gecko and IE for setting visibility.
397
*/
398
function setEltVisibility (elt, value)
399
{  if (is.nav4) elt.visibility = value;
400
   else if (elt.style) elt.style.visibility = value;
401
}
402
 
403
 
404
 
405
/* Return values are strings "visible", "hidden", or "inherit".
406
   This is consistent with CSS1 and IE4 usage and the settable
407
   values on all three browsers. Note that Nav4
408
   by default returns "show" and "hide" and that these values
409
   are mapped to "visible" and "hidden" to provide consistent
410
   return values across browsers. */
411
 
412
function getEltVisibility (elt)
413
{  if (is.nav4) 
414
   {  var value = elt.visibility;
415
      if (value == "show") return "visible";
416
      else if (value == "hide") return "hidden";
417
      else return value;
418
   }
419
   else if (elt.style) return elt.style.visibility;
420
}
421
 
422
 
423
 
424
/* Move elt to pixel location x,y within its coordinate system,
425
   which is the window content area for top-level elements or
426
   the parent element's coordinates for nested elements which 
427
   have an absolutely positioned parent.
428
*/
429
 
430
function moveEltTo (elt, x, y) 
431
{ if (is.nav4) elt.moveTo(x, y);
432
  else if (is.ie4up) {
433
    elt.style.pixelLeft = x;
434
    elt.style.pixelTop  = y;
435
  }
436
  else if (is.gecko) {
437
    elt.style.left = x;
438
    elt.style.top  = y;
439
  }
440
}
441
 
442
 
443
/* Offset elt's pixel location by x,y pixels. */
444
 
445
function moveEltBy (elt, x, y) 
446
{ if (is.nav4) elt.moveBy(x, y);
447
  else if (is.ie4up)  {
448
    elt.style.pixelLeft += x;
449
    elt.style.pixelTop  += y;
450
  }
451
  else if (is.gecko)  {
452
    elt.style.left = (stringToNumber(elt.style.left) + x + "px");
453
    elt.style.top  = (stringToNumber(elt.style.top)  + y + "px");
454
  }
455
}
456
 
457
/* xbrowser pageX equivalent*/
458
function getEltPageLeft(elt) {
459
  var x;
460
 
461
  if (is.nav4)
462
    return elt.pageX;
463
  if (is.ie4up) {
464
    x = 0;
465
    while (elt.offsetParent != null) {
466
      x += elt.offsetLeft;
467
      elt = elt.offsetParent;
468
    }
469
    x += elt.offsetLeft;
470
    return x;
471
  }
472
  if (is.gecko) {
473
    x = 0;
474
    while (elt.offsetParent != null) {
475
      x += elt.offsetLeft;
476
      elt = elt.offsetParent;
477
    }
478
    x += elt.offsetLeft;
479
    return x;
480
  }
481
  return -1;
482
}
483
 
484
/* xbrowser pageY equivalent */
485
function getEltPageTop(elt) {
486
  var y = 0;
487
 
488
  if (is.nav4)
489
    return elt.pageY;
490
  if (is.ie4up) {
491
    while (elt.offsetParent != null) {
492
      y += elt.offsetTop;
493
      elt = elt.offsetParent;
494
    }
495
    y += elt.offsetTop;
496
    return y;
497
  }
498
 
499
  /* ie5/mac modification added per comment from David Weingard */
500
  if (is.mac && is.ie5)
501
  {
502
    y += stringToNumber(document.body.currentStyle.marginTop);
503
  }
504
 
505
  if (is.gecko) {
506
    while (elt.offsetParent != null) {
507
      y += elt.offsetTop;
508
      elt = elt.offsetParent;
509
    }
510
    y += elt.offsetTop;
511
    return y;
512
  }
513
  return -1;
514
}
515
 
516
/* Sets position of left edge of elt in pixels. */
517
function setEltLeft (elt, x) {
518
  if (is.nav4)     elt.left=x;
519
  else if (is.ie4up) elt.style.pixelLeft=x;
520
  else if (is.gecko) elt.style.left = (x + "px");
521
}
522
 
523
 
524
/* Returns left edge of elt in pixels. */
525
function getEltLeft (elt) {
526
  if (is.nav4)     return (elt.left);
527
  else if (is.ie4up) return (elt.style.pixelLeft);
528
  else if (is.gecko) return stringToNumber(elt.style.left);
529
}
530
 
531
/* Sets top edge of elt in pixels. */
532
function setEltTop (elt, y) 
533
{ if (is.nav4)     elt.top=y;
534
  else if (is.ie4up) elt.style.pixelTop=y;
535
  else if (is.gecko) elt.style.top= (y + "px");
536
}
537
 
538
/* Returns top edge of elt in pixels. */
539
function getEltTop (elt) 
540
{ if (is.nav4)     return (elt.top);
541
  else if (is.ie4up) return (elt.style.pixelTop);
542
  else if (is.gecko) return stringToNumber(elt.style.top);
543
}
544
 
545
/* Returns width of elt in pixels. */
546
function getEltWidth(elt) {
547
 
548
  if (is.nav4) {
549
    if (elt.document.width)
550
      return elt.document.width;
551
    else
552
      return elt.clip.right - elt.clip.left;
553
  }
554
  if (is.ie4up) {
555
    if (elt.style.pixelWidth)
556
      return elt.style.pixelWidth;
557
 
558
    else
559
      return elt.offsetWidth;
560
  }
561
  if (is.gecko) {
562
    if (elt.style.width)
563
      return stringToNumber(elt.style.width);
564
    else
565
      return stringToNumber(elt.offsetWidth);
566
  }
567
  return -1;
568
}
569
 
570
/* set width of elt in pixels */
571
function setEltWidth(elt,wdth)
572
{
573
	if(is.nav4)
574
    { 
575
	     elt.document.width = wdth;
576
    }
577
    else if(elt.style)
578
    { 
579
        elt.style.width = wdth;
580
    }
581
}
582
 
583
/* Returns height of elt in pixels. */
584
function getEltHeight(elt) {
585
  if (is.nav4) {
586
    if (elt.document.height)
587
      return elt.document.height;
588
    else
589
      return elt.clip.bottom - elt.clip.top;
590
  }
591
  if (is.ie4up) {
592
    if (elt.style.pixelHeight)
593
      return elt.style.pixelHeight;
594
    else
595
      return elt.clientHeight;
596
  }
597
  if (is.gecko) {
598
    if (elt.style.height)
599
      return stringToNumber(elt.style.height);
600
    else
601
      return stringToNumber(elt.offsetHeight);
602
  }
603
  return -1;
604
}
605
 
606
/* set width of elt in pixels */
607
 
608
function setEltHeight(elt,hght)
609
{
610
	if(is.nav4)
611
    { 
612
		elt.document.height = hght;
613
    }
614
    else if(elt.style)
615
    { 
616
        elt.style.height = hght;
617
    }
618
}
619
 
620
/* Sets element clipping area. 
621
   NOTE ORDER: top, right, bottom, left to be consistent with CSS usage.
622
   cliptop, clipright, clipbottom, and clipleft are integers. 
623
*/
624
function setEltClip (elt, cliptop, clipright, clipbottom, clipleft) 
625
{ if (is.nav4) {
626
    elt.clip.left   = clipleft;
627
    elt.clip.top    = cliptop;
628
    elt.clip.right  = clipright;
629
    elt.clip.bottom = clipbottom;
630
  }
631
  else if (is.ie4up)  elt.style.clip = 'rect(' + cliptop + ' ' +  
632
       clipright + ' ' + clipbottom + ' ' + clipleft +')';
633
  else if (is.gecko)  elt.style.clip = 'rect(' + cliptop + ' ' +  
634
       clipright + ' ' + clipbottom + ' ' + clipleft +')';
635
}
636
 
637
/* utility function for IE only -- does not use regular expressions
638
   in order to avoid triggering syntax error if parsed by Nav3 */
639
function tempClipObj (elt)
640
{  var clipStr = elt.style.clip;
641
 
642
   clipStr = clipStr.substring (clipStr.indexOf("(") + 1);
643
   this.top = stringToNumber(clipStr);
644
   clipStr = clipStr.substring (clipStr.indexOf(" ") + 1);
645
   this.right = stringToNumber(clipStr);
646
   clipStr = clipStr.substring (clipStr.indexOf(" ") + 1);
647
   this.bottom = stringToNumber(clipStr);
648
   clipStr = clipStr.substring (clipStr.indexOf(" ") + 1);
649
   this.left = stringToNumber(clipStr);
650
}
651
 
652
/* Returns left edge of clipping area of elt in pixels. */
653
function getEltClipLeft (elt) 
654
{ if (is.nav4)     return (elt.clip.left);
655
  else if (elt.style) 
656
  {  var tempClip = new tempClipObj (elt);
657
     return tempClip.left;
658
  }
659
}
660
 
661
/* Returns top edge of clipping area of elt in pixels. */
662
function getEltClipTop (elt) 
663
{ if (is.nav4)     return (elt.clip.top);
664
  else if (elt.style) 
665
  {  var tempClip = new tempClipObj (elt);
666
     return tempClip.top;
667
  }
668
}
669
 
670
/* Returns right edge of clipping area of elt in pixels. */
671
function getEltClipRight (elt) {
672
  if (is.nav4)     return (elt.clip.right);
673
  else if (elt.style) 
674
  {  var tempClip = new tempClipObj (elt);
675
     return tempClip.right;
676
  }
677
 
678
}
679
 
680
/* Returns bottom edge of clipping area of elt in pixels. */
681
function getEltClipBottom (elt) 
682
{ if (is.nav4)     return (elt.clip.bottom);
683
  else if (elt.style) 
684
  {  var tempClip = new tempClipObj (elt);
685
     return tempClip.bottom;
686
  }
687
}
688
 
689
/* Returns width of clipping area of elt in pixels. */
690
 
691
function getEltClipWidth (elt) 
692
{
693
    return (getEltClipRight(elt) - getEltClipLeft(elt));
694
}
695
 
696
 
697
/* Returns height of clipping area of elt in pixels. */
698
 
699
function getEltClipHeight (elt) 
700
{
701
    return (getEltClipBottom(elt) - getEltClipTop(elt));
702
}
703
 
704
 
705
/* Returns width of current window content area in pixels. */
706
 
707
function getCurrentWinWidth() 
708
{ if (is.nav4)     return(window.innerWidth);
709
  else if (is.ie4up) return(document.body.clientWidth);
710
  else if (is.gecko) return(window.innerWidth);
711
}
712
 
713
 
714
 
715
/* Returns height of current window content area in pixels. */
716
function getCurrentWinHeight() 
717
{ if (is.nav4)     return(window.innerHeight);
718
  else if (is.ie4up) return(document.body.clientHeight);
719
  else if (is.gecko) return(window.innerHeight);
720
 
721
}
722
 
723
/* Returns z-index (stacking order) of elt,
724
   which is a positive integer.  */
725
 
726
function getEltZIndex (elt) 
727
{ if (is.nav4) return(elt.zIndex);
728
  else if (elt.style) return (elt.style.zIndex);
729
}
730
 
731
/* Sets z-index (stacking order) of elt.
732
   z is a positive integer.  */
733
 
734
function setEltZIndex (elt, z) 
735
{ if (is.nav4) elt.zIndex = z;
736
  else if (elt.style) elt.style.zIndex = z;
737
}
738
 
739
 
740
/* end CBDHTML derivative functions  */
741
/* Sets background image of elt to image at imageFilePath.
742
 
743
   Note: although this function and the next provide the 
744
   ability to set and get the background image property of
745
   an element across Nav4/Gecko/IE4+, because of differences in
746
   the way background image support is implemented, it may
747
   require considerable experimentation with HTML/CSS markup
748
   and content to achieve the same visual effect.
749
*/
750
function setEltBackgroundImage (elt, imageFilePath) 
751
{ if (is.nav4) elt.background.src = imageFilePath;
752
  else if (is.ie4up) elt.style.backgroundImage = "url(" + imageFilePath + ")";
753
  else if (is.gecko) elt.style.backgroundImage = "url(" + imageFilePath + ")";
754
}
755
 
756
/* Returns file path or URL of background image of elt. 
757
   Note: the return value strings are not identical. 
758
   On Nav4, we get back a string like 
759
   "file:///F|/DHTML/xbdhtml/xbdhtml/images/redpole.gif".
760
   On IE4 and Gecko, we get back a string like "url(images/redpole.gif)".
761
   so we trim off the leading "url(" and the trailing ")".
762
*/
763
 
764
function getEltBackgroundImage (elt) 
765
{ if (is.nav4) return (elt.background.src);
766
  else if (elt.style) { 
767
     var theURL = elt.style.backgroundImage;
768
     if (typeof(theURL) == "string")
769
     {  var URLlen = theURL.length;
770
        return (theURL.substring (4, URLlen-1));
771
     }
772
     else return(theURL);
773
  }
774
}
775
 
776
/* Sets background color of elt to colorNumber.
777
   colorNumber is an numeric color code like 0xffffff for white,
778
   or one of the 16 standard color names from CSS1 like "red". 
779
   (DO NOT USE IE's extended list of color names strings; they  
780
   are not supported on Nav4!) 
781
 
782
   NOTE: even if you set the color to one of the 16 CSS1 color name
783
   strings (e.g. "red"), getEltBackgroundColor will always return 
784
   the integer code equivalent (e.g. 0xff0000 instead of "red"), 
785
   because getEltBackgroundColor automatically converts those names to
786
   an integer on IE4 and Gecko, and on Nav4 the conversion happens by default.
787
   To avoid the confusion of setting the value to a string but getting
788
   an integer back, it's simplest to use color numbers only.
789
 
790
   Note: although this function and the next provide the 
791
   ability to set and get the background color property of
792
   an element across Nav4/Gecko/IE4+, because of differences in
793
   the way background color support is implemented, it may
794
   require considerable experimentation with HTML/CSS markup
795
   and content to achieve the same visual effect.
796
*/
797
 
798
function setEltBackgroundColor (elt, colorNumber) 
799
{ if (is.nav4) elt.bgColor = colorNumber;
800
  else if (elt.style) elt.style.backgroundColor = colorNumber;
801
}
802
 
803
/* -------------------------------------------------------------
804
        FUNCTIONS FOR GETTING ELEMENT'S BACKGROUND COLOR
805
   These depend upon each other and must be reused as a group.
806
   ------------------------------------------------------------- */
807
 
808
var colorNameString = "aqua,black,blue,fuchsia,gray,green,lime,maroon,navy,olive,purple,red,silver,teal,yellow,white";
809
var colorNames   = new Array ("aqua", "black", "blue", "fuchsia", "gray",   "green", "lime", "maroon", "navy", "olive",  "purple", "red",    "silver", "teal", "yellow", "white");
810
var colorNumbers = new Array (0xffff, 0,       0xff,   0xff00ff,  0x808080, 0x8000,  0xff00, 0x800000, 0x80,   0x808000, 0x800080, 0xff0000, 0xc0c0c0, 0x8080, 0xffff00, 0xffffff);
811
 
812
 
813
 
814
/* Tests whether string aString is one of the 16 CSS1 color names.
815
*/
816
function isColorName (aString)
817
{ return ( (typeof(aString) == "string") && (colorNameString.indexOf(aString) != -1));
818
}
819
 
820
/* Converts color name string (like "white") to number (like 0xffffff). 
821
   ONLY supports 16 standard CSS1 color names, NOT IE4 extended list!
822
*/
823
function colorNameToNumber (colorName)
824
{ for (var i=0; i<16; i++) if (colorNames[i]==colorName) return colorNumbers[i];
825
  // Return string name unchanged if not found.
826
  // This handles IE4 non-CSS1-standard color names gracefully.
827
  return colorName;
828
}
829
 
830
/* Converts color number (like 0xffffff) to name string (like "white"). 
831
   ONLY supports 16 standard CSS1 color names, NOT IE4 extended list!
832
*/
833
 
834
function colorNumberToName (colorNumber)
835
{ for (var i=0; i<16; i++) if (colorNumbers[i]==colorNumber) return colorNames[i];
836
  return null;
837
}
838
 
839
/* Returns background color of elt as integer. 
840
   (NOT color name like "red", or IE4 default return value like "#ffffff".)
841
   Nav4 returns integer by default. IE4 returns string which is either:
842
   a) a leading "#" followed by a 6-digit hexadecimal RGB value, or
843
   b) one of the 16 string color names like "red"
844
   ... so we convert this to an integer for compatibility.
845
   and Gecko returns a string which is either:
846
   a) an rgb string like "rgb(255,0,255)"
847
   b) one of the 16 string color names like red.
848
 
849
   WARNING: There is a bug in Netscape6 (Gecko) that makes the browser interpret
850
			decimal color values as hexadecimal, so if you set the color to 65280
851
			the actual color would be 0x065280. Avoid using decimal color values!
852
            They are not standard and depricated.
853
   WARNING: only the 16 CSS1 color names will be converted to integers.
854
*/
855
 
856
function getEltBackgroundColor (elt) 
857
{
858
  if (is.nav4) return (elt.bgColor);
859
  else if (is.ie4up) 
860
  {
861
     var colorVal = elt.style.backgroundColor;
862
     if (isColorName(colorVal)) return colorNameToNumber (colorVal);
863
     else if (typeof(colorVal) == "string") 
864
          return (("0x" + colorVal.substring(1)) - 0);
865
     else return colorVal;
866
  }
867
  else if (is.gecko) {
868
    var colorVal = elt.style.backgroundColor;
869
 
870
	 if (typeof(colorVal) == "string")
871
	 { 	
872
		if (isColorName(colorVal)) 	
873
		{
874
			return colorNameToNumber (colorVal);
875
		}
876
		else if (colorVal.indexOf(["rgb"]) != -1) 
877
		{	
878
			var sR,sG,sB;
879
			var iR,iG,iB;
880
			var i=0;
881
 
882
			ColorString = (elt.style.backgroundColor);
883
			//ColorString = "rgb(255,20,255)";
884
			ColorString = ColorString.slice(4,-1);
885
 
886
			while(ColorString[i] != ',' && i < 20){i++;}
887
			sR = ColorString.slice(0,-(ColorString.length - i));
888
			i++;
889
			j = i;
890
			while(ColorString[j] != ',' && j < 20){j++;}
891
			sG = ColorString.slice(i,0-(ColorString.length - j));
892
			j++;
893
			sB = ColorString.slice(j);
894
			iR = stringToNumber(sR);
895
			iG = stringToNumber(sG);
896
			iB = stringToNumber(sB);
897
			sR = iR.toString(16);if(sR.length < 2)sR = "0" + sR;if(sR.length < 2)sR = "0" + sR;
898
			sG = iG.toString(16);if(sG.length < 2)sG = "0" + sG;if(sG.length < 2)sG = "0" + sG;
899
			sB = iB.toString(16);if(sB.length < 2)sB = "0" + sB;if(sB.length < 2)sB = "0" + sB;
900
 
901
			sRGB = sR.toUpperCase()+sG.toUpperCase()+sB.toUpperCase();
902
			return (("0x" + sRGB)-0);
903
		}
904
	 }
905
     else return colorVal;
906
  }
907
}
908
 
909
/* A version of stringToNumber that returns 0 if there is NaN returned, or number is part of a string, like 100px... */
910
function stringToNumber(s)
911
{
912
        return parseInt(('0' + s), 10)
913
}