colorpicker.js (29083B)
1 // =================================================================== 2 // Author: Matt Kruse <matt@mattkruse.com> 3 // WWW: http://www.mattkruse.com/ 4 // 5 // NOTICE: You may use this code for any purpose, commercial or 6 // private, without any further permission from the author. You may 7 // remove this notice from your final code if you wish, however it is 8 // appreciated by the author if at least my web site address is kept. 9 // 10 // You may *NOT* re-distribute this code in any way except through its 11 // use. That means, you can include it in your product, or your web 12 // site, or any other form where the code is actually being used. You 13 // may not put the plain javascript up on your site for download or 14 // include it in your javascript libraries for download. 15 // If you wish to share this code with others, please just point them 16 // to the URL instead. 17 // Please DO NOT link directly to my .js files from your site. Copy 18 // the files to your server and use them there. Thank you. 19 // =================================================================== 20 21 22 /* SOURCE FILE: AnchorPosition.js */ 23 24 /* 25 AnchorPosition.js 26 Author: Matt Kruse 27 Last modified: 10/11/02 28 29 DESCRIPTION: These functions find the position of an <A> tag in a document, 30 so other elements can be positioned relative to it. 31 32 COMPATABILITY: Netscape 4.x,6.x,Mozilla, IE 5.x,6.x on Windows. Some small 33 positioning errors - usually with Window positioning - occur on the 34 Macintosh platform. 35 36 FUNCTIONS: 37 getAnchorPosition(anchorname) 38 Returns an Object() having .x and .y properties of the pixel coordinates 39 of the upper-left corner of the anchor. Position is relative to the PAGE. 40 41 getAnchorWindowPosition(anchorname) 42 Returns an Object() having .x and .y properties of the pixel coordinates 43 of the upper-left corner of the anchor, relative to the WHOLE SCREEN. 44 45 NOTES: 46 47 1) For popping up separate browser windows, use getAnchorWindowPosition. 48 Otherwise, use getAnchorPosition 49 50 2) Your anchor tag MUST contain both NAME and ID attributes which are the 51 same. For example: 52 <A NAME="test" ID="test"> </A> 53 54 3) There must be at least a space between <A> </A> for IE5.5 to see the 55 anchor tag correctly. Do not do <A></A> with no space. 56 */ 57 58 // getAnchorPosition(anchorname) 59 // This function returns an object having .x and .y properties which are the coordinates 60 // of the named anchor, relative to the page. 61 function getAnchorPosition(anchorname) { 62 // This function will return an Object with x and y properties 63 var useWindow=false; 64 var coordinates=new Object(); 65 var x=0,y=0; 66 // Browser capability sniffing 67 var use_gebi=false, use_css=false, use_layers=false; 68 if (document.getElementById) { use_gebi=true; } 69 else if (document.all) { use_css=true; } 70 else if (document.layers) { use_layers=true; } 71 // Logic to find position 72 if (use_gebi && document.all) { 73 x=AnchorPosition_getPageOffsetLeft(document.all[anchorname]); 74 y=AnchorPosition_getPageOffsetTop(document.all[anchorname]); 75 } 76 else if (use_gebi) { 77 var o=document.getElementById(anchorname); 78 x=AnchorPosition_getPageOffsetLeft(o); 79 y=AnchorPosition_getPageOffsetTop(o); 80 } 81 else if (use_css) { 82 x=AnchorPosition_getPageOffsetLeft(document.all[anchorname]); 83 y=AnchorPosition_getPageOffsetTop(document.all[anchorname]); 84 } 85 else if (use_layers) { 86 var found=0; 87 for (var i=0; i<document.anchors.length; i++) { 88 if (document.anchors[i].name==anchorname) { found=1; break; } 89 } 90 if (found==0) { 91 coordinates.x=0; coordinates.y=0; return coordinates; 92 } 93 x=document.anchors[i].x; 94 y=document.anchors[i].y; 95 } 96 else { 97 coordinates.x=0; coordinates.y=0; return coordinates; 98 } 99 coordinates.x=x; 100 coordinates.y=y; 101 return coordinates; 102 } 103 104 // getAnchorWindowPosition(anchorname) 105 // This function returns an object having .x and .y properties which are the coordinates 106 // of the named anchor, relative to the window 107 function getAnchorWindowPosition(anchorname) { 108 var coordinates=getAnchorPosition(anchorname); 109 var x=0; 110 var y=0; 111 if (document.getElementById) { 112 if (isNaN(window.screenX)) { 113 x=coordinates.x-document.body.scrollLeft+window.screenLeft; 114 y=coordinates.y-document.body.scrollTop+window.screenTop; 115 } 116 else { 117 x=coordinates.x+window.screenX+(window.outerWidth-window.innerWidth)-window.pageXOffset; 118 y=coordinates.y+window.screenY+(window.outerHeight-24-window.innerHeight)-window.pageYOffset; 119 } 120 } 121 else if (document.all) { 122 x=coordinates.x-document.body.scrollLeft+window.screenLeft; 123 y=coordinates.y-document.body.scrollTop+window.screenTop; 124 } 125 else if (document.layers) { 126 x=coordinates.x+window.screenX+(window.outerWidth-window.innerWidth)-window.pageXOffset; 127 y=coordinates.y+window.screenY+(window.outerHeight-24-window.innerHeight)-window.pageYOffset; 128 } 129 coordinates.x=x; 130 coordinates.y=y; 131 return coordinates; 132 } 133 134 // Functions for IE to get position of an object 135 function AnchorPosition_getPageOffsetLeft (el) { 136 var ol=el.offsetLeft; 137 while ((el=el.offsetParent) != null) { ol += el.offsetLeft; } 138 return ol; 139 } 140 function AnchorPosition_getWindowOffsetLeft (el) { 141 return AnchorPosition_getPageOffsetLeft(el)-document.body.scrollLeft; 142 } 143 function AnchorPosition_getPageOffsetTop (el) { 144 var ot=el.offsetTop; 145 while((el=el.offsetParent) != null) { ot += el.offsetTop; } 146 return ot; 147 } 148 function AnchorPosition_getWindowOffsetTop (el) { 149 return AnchorPosition_getPageOffsetTop(el)-document.body.scrollTop; 150 } 151 152 /* SOURCE FILE: PopupWindow.js */ 153 154 /* 155 PopupWindow.js 156 Author: Matt Kruse 157 Last modified: 02/16/04 158 159 DESCRIPTION: This object allows you to easily and quickly popup a window 160 in a certain place. The window can either be a DIV or a separate browser 161 window. 162 163 COMPATABILITY: Works with Netscape 4.x, 6.x, IE 5.x on Windows. Some small 164 positioning errors - usually with Window positioning - occur on the 165 Macintosh platform. Due to bugs in Netscape 4.x, populating the popup 166 window with <STYLE> tags may cause errors. 167 168 USAGE: 169 // Create an object for a WINDOW popup 170 var win = new PopupWindow(); 171 172 // Create an object for a DIV window using the DIV named 'mydiv' 173 var win = new PopupWindow('mydiv'); 174 175 // Set the window to automatically hide itself when the user clicks 176 // anywhere else on the page except the popup 177 win.autoHide(); 178 179 // Show the window relative to the anchor name passed in 180 win.showPopup(anchorname); 181 182 // Hide the popup 183 win.hidePopup(); 184 185 // Set the size of the popup window (only applies to WINDOW popups 186 win.setSize(width,height); 187 188 // Populate the contents of the popup window that will be shown. If you 189 // change the contents while it is displayed, you will need to refresh() 190 win.populate(string); 191 192 // set the URL of the window, rather than populating its contents 193 // manually 194 win.setUrl("http://www.site.com/"); 195 196 // Refresh the contents of the popup 197 win.refresh(); 198 199 // Specify how many pixels to the right of the anchor the popup will appear 200 win.offsetX = 50; 201 202 // Specify how many pixels below the anchor the popup will appear 203 win.offsetY = 100; 204 205 NOTES: 206 1) Requires the functions in AnchorPosition.js 207 208 2) Your anchor tag MUST contain both NAME and ID attributes which are the 209 same. For example: 210 <A NAME="test" ID="test"> </A> 211 212 3) There must be at least a space between <A> </A> for IE5.5 to see the 213 anchor tag correctly. Do not do <A></A> with no space. 214 215 4) When a PopupWindow object is created, a handler for 'onmouseup' is 216 attached to any event handler you may have already defined. Do NOT define 217 an event handler for 'onmouseup' after you define a PopupWindow object or 218 the autoHide() will not work correctly. 219 */ 220 221 // Set the position of the popup window based on the anchor 222 function PopupWindow_getXYPosition(anchorname) { 223 var coordinates; 224 if (this.type == "WINDOW") { 225 coordinates = getAnchorWindowPosition(anchorname); 226 } 227 else { 228 coordinates = getAnchorPosition(anchorname); 229 } 230 this.x = coordinates.x; 231 this.y = coordinates.y; 232 } 233 // Set width/height of DIV/popup window 234 function PopupWindow_setSize(width,height) { 235 this.width = width; 236 this.height = height; 237 } 238 // Fill the window with contents 239 function PopupWindow_populate(contents) { 240 this.contents = contents; 241 this.populated = false; 242 } 243 // Set the URL to go to 244 function PopupWindow_setUrl(url) { 245 this.url = url; 246 } 247 // Set the window popup properties 248 function PopupWindow_setWindowProperties(props) { 249 this.windowProperties = props; 250 } 251 // Refresh the displayed contents of the popup 252 function PopupWindow_refresh() { 253 if (this.divName != null) { 254 // refresh the DIV object 255 if (this.use_gebi) { 256 document.getElementById(this.divName).innerHTML = this.contents; 257 } 258 else if (this.use_css) { 259 document.all[this.divName].innerHTML = this.contents; 260 } 261 else if (this.use_layers) { 262 var d = document.layers[this.divName]; 263 d.document.open(); 264 d.document.writeln(this.contents); 265 d.document.close(); 266 } 267 } 268 else { 269 if (this.popupWindow != null && !this.popupWindow.closed) { 270 if (this.url!="") { 271 this.popupWindow.location.href=this.url; 272 } 273 else { 274 this.popupWindow.document.open(); 275 this.popupWindow.document.writeln(this.contents); 276 this.popupWindow.document.close(); 277 } 278 this.popupWindow.focus(); 279 } 280 } 281 } 282 // Position and show the popup, relative to an anchor object 283 function PopupWindow_showPopup(anchorname) { 284 this.getXYPosition(anchorname); 285 this.x += this.offsetX; 286 this.y += this.offsetY; 287 if (!this.populated && (this.contents != "")) { 288 this.populated = true; 289 this.refresh(); 290 } 291 if (this.divName != null) { 292 // Show the DIV object 293 if (this.use_gebi) { 294 document.getElementById(this.divName).style.left = this.x + "px"; 295 document.getElementById(this.divName).style.top = this.y; 296 document.getElementById(this.divName).style.visibility = "visible"; 297 } 298 else if (this.use_css) { 299 document.all[this.divName].style.left = this.x; 300 document.all[this.divName].style.top = this.y; 301 document.all[this.divName].style.visibility = "visible"; 302 } 303 else if (this.use_layers) { 304 document.layers[this.divName].left = this.x; 305 document.layers[this.divName].top = this.y; 306 document.layers[this.divName].visibility = "visible"; 307 } 308 } 309 else { 310 if (this.popupWindow == null || this.popupWindow.closed) { 311 // If the popup window will go off-screen, move it so it doesn't 312 if (this.x<0) { this.x=0; } 313 if (this.y<0) { this.y=0; } 314 if (screen && screen.availHeight) { 315 if ((this.y + this.height) > screen.availHeight) { 316 this.y = screen.availHeight - this.height; 317 } 318 } 319 if (screen && screen.availWidth) { 320 if ((this.x + this.width) > screen.availWidth) { 321 this.x = screen.availWidth - this.width; 322 } 323 } 324 var avoidAboutBlank = window.opera || ( document.layers && !navigator.mimeTypes['*'] ) || navigator.vendor == 'KDE' || ( document.childNodes && !document.all && !navigator.taintEnabled ); 325 this.popupWindow = window.open(avoidAboutBlank?"":"about:blank","window_"+anchorname,this.windowProperties+",width="+this.width+",height="+this.height+",screenX="+this.x+",left="+this.x+",screenY="+this.y+",top="+this.y+""); 326 } 327 this.refresh(); 328 } 329 } 330 // Hide the popup 331 function PopupWindow_hidePopup() { 332 if (this.divName != null) { 333 if (this.use_gebi) { 334 document.getElementById(this.divName).style.visibility = "hidden"; 335 } 336 else if (this.use_css) { 337 document.all[this.divName].style.visibility = "hidden"; 338 } 339 else if (this.use_layers) { 340 document.layers[this.divName].visibility = "hidden"; 341 } 342 } 343 else { 344 if (this.popupWindow && !this.popupWindow.closed) { 345 this.popupWindow.close(); 346 this.popupWindow = null; 347 } 348 } 349 } 350 // Pass an event and return whether or not it was the popup DIV that was clicked 351 function PopupWindow_isClicked(e) { 352 if (this.divName != null) { 353 if (this.use_layers) { 354 var clickX = e.pageX; 355 var clickY = e.pageY; 356 var t = document.layers[this.divName]; 357 if ((clickX > t.left) && (clickX < t.left+t.clip.width) && (clickY > t.top) && (clickY < t.top+t.clip.height)) { 358 return true; 359 } 360 else { return false; } 361 } 362 else if (document.all) { // Need to hard-code this to trap IE for error-handling 363 var t = window.event.srcElement; 364 while (t.parentElement != null) { 365 if (t.id==this.divName) { 366 return true; 367 } 368 t = t.parentElement; 369 } 370 return false; 371 } 372 else if (this.use_gebi && e) { 373 var t = e.originalTarget; 374 while (t.parentNode != null) { 375 if (t.id==this.divName) { 376 return true; 377 } 378 t = t.parentNode; 379 } 380 return false; 381 } 382 return false; 383 } 384 return false; 385 } 386 387 // Check an onMouseDown event to see if we should hide 388 function PopupWindow_hideIfNotClicked(e) { 389 if (this.autoHideEnabled && !this.isClicked(e)) { 390 this.hidePopup(); 391 } 392 } 393 // Call this to make the DIV disable automatically when mouse is clicked outside it 394 function PopupWindow_autoHide() { 395 this.autoHideEnabled = true; 396 } 397 // This global function checks all PopupWindow objects onmouseup to see if they should be hidden 398 function PopupWindow_hidePopupWindows(e) { 399 for (var i=0; i<popupWindowObjects.length; i++) { 400 if (popupWindowObjects[i] != null) { 401 var p = popupWindowObjects[i]; 402 p.hideIfNotClicked(e); 403 } 404 } 405 } 406 // Run this immediately to attach the event listener 407 function PopupWindow_attachListener() { 408 if (document.layers) { 409 document.captureEvents(Event.MOUSEUP); 410 } 411 window.popupWindowOldEventListener = document.onmouseup; 412 if (window.popupWindowOldEventListener != null) { 413 document.onmouseup = new Function("window.popupWindowOldEventListener(); PopupWindow_hidePopupWindows();"); 414 } 415 else { 416 document.onmouseup = PopupWindow_hidePopupWindows; 417 } 418 } 419 // CONSTRUCTOR for the PopupWindow object 420 // Pass it a DIV name to use a DHTML popup, otherwise will default to window popup 421 function PopupWindow() { 422 if (!window.popupWindowIndex) { window.popupWindowIndex = 0; } 423 if (!window.popupWindowObjects) { window.popupWindowObjects = new Array(); } 424 if (!window.listenerAttached) { 425 window.listenerAttached = true; 426 PopupWindow_attachListener(); 427 } 428 this.index = popupWindowIndex++; 429 popupWindowObjects[this.index] = this; 430 this.divName = null; 431 this.popupWindow = null; 432 this.width=0; 433 this.height=0; 434 this.populated = false; 435 this.visible = false; 436 this.autoHideEnabled = false; 437 438 this.contents = ""; 439 this.url=""; 440 this.windowProperties="toolbar=no,location=no,status=no,menubar=no,scrollbars=auto,resizable,alwaysRaised,dependent,titlebar=no"; 441 if (arguments.length>0) { 442 this.type="DIV"; 443 this.divName = arguments[0]; 444 } 445 else { 446 this.type="WINDOW"; 447 } 448 this.use_gebi = false; 449 this.use_css = false; 450 this.use_layers = false; 451 if (document.getElementById) { this.use_gebi = true; } 452 else if (document.all) { this.use_css = true; } 453 else if (document.layers) { this.use_layers = true; } 454 else { this.type = "WINDOW"; } 455 this.offsetX = 0; 456 this.offsetY = 0; 457 // Method mappings 458 this.getXYPosition = PopupWindow_getXYPosition; 459 this.populate = PopupWindow_populate; 460 this.setUrl = PopupWindow_setUrl; 461 this.setWindowProperties = PopupWindow_setWindowProperties; 462 this.refresh = PopupWindow_refresh; 463 this.showPopup = PopupWindow_showPopup; 464 this.hidePopup = PopupWindow_hidePopup; 465 this.setSize = PopupWindow_setSize; 466 this.isClicked = PopupWindow_isClicked; 467 this.autoHide = PopupWindow_autoHide; 468 this.hideIfNotClicked = PopupWindow_hideIfNotClicked; 469 } 470 471 /* SOURCE FILE: ColorPicker2.js */ 472 473 /* 474 Last modified: 02/24/2003 475 476 DESCRIPTION: This widget is used to select a color, in hexadecimal #RRGGBB 477 form. It uses a color "swatch" to display the standard 216-color web-safe 478 palette. The user can then click on a color to select it. 479 480 COMPATABILITY: See notes in AnchorPosition.js and PopupWindow.js. 481 Only the latest DHTML-capable browsers will show the color and hex values 482 at the bottom as your mouse goes over them. 483 484 USAGE: 485 // Create a new ColorPicker object using DHTML popup 486 var cp = new ColorPicker(); 487 488 // Create a new ColorPicker object using Window Popup 489 var cp = new ColorPicker('window'); 490 491 // Add a link in your page to trigger the popup. For example: 492 <A HREF="#" onClick="cp.show('pick');return false;" NAME="pick" ID="pick">Pick</A> 493 494 // Or use the built-in "select" function to do the dirty work for you: 495 <A HREF="#" onClick="cp.select(document.forms[0].color,'pick');return false;" NAME="pick" ID="pick">Pick</A> 496 497 // If using DHTML popup, write out the required DIV tag near the bottom 498 // of your page. 499 <SCRIPT LANGUAGE="JavaScript">cp.writeDiv()</SCRIPT> 500 501 // Write the 'pickColor' function that will be called when the user clicks 502 // a color and do something with the value. This is only required if you 503 // want to do something other than simply populate a form field, which is 504 // what the 'select' function will give you. 505 function pickColor(color) { 506 field.value = color; 507 } 508 509 NOTES: 510 1) Requires the functions in AnchorPosition.js and PopupWindow.js 511 512 2) Your anchor tag MUST contain both NAME and ID attributes which are the 513 same. For example: 514 <A NAME="test" ID="test"> </A> 515 516 3) There must be at least a space between <A> </A> for IE5.5 to see the 517 anchor tag correctly. Do not do <A></A> with no space. 518 519 4) When a ColorPicker object is created, a handler for 'onmouseup' is 520 attached to any event handler you may have already defined. Do NOT define 521 an event handler for 'onmouseup' after you define a ColorPicker object or 522 the color picker will not hide itself correctly. 523 */ 524 ColorPicker_targetInput = null; 525 function ColorPicker_writeDiv() { 526 document.writeln("<DIV ID=\"colorPickerDiv\" STYLE=\"position:absolute;visibility:hidden;\"> </DIV>"); 527 } 528 529 function ColorPicker_show(anchorname) { 530 this.showPopup(anchorname); 531 } 532 533 function ColorPicker_pickColor(color,obj) { 534 obj.hidePopup(); 535 pickColor(color); 536 } 537 538 // A Default "pickColor" function to accept the color passed back from popup. 539 // User can over-ride this with their own function. 540 function pickColor(color) { 541 if (ColorPicker_targetInput==null) { 542 alert("Target Input is null, which means you either didn't use the 'select' function or you have no defined your own 'pickColor' function to handle the picked color!"); 543 return; 544 } 545 ColorPicker_targetInput.value = color; 546 } 547 548 // This function is the easiest way to popup the window, select a color, and 549 // have the value populate a form field, which is what most people want to do. 550 function ColorPicker_select(inputobj,linkname) { 551 if (inputobj.type!="text" && inputobj.type!="hidden" && inputobj.type!="textarea") { 552 alert("colorpicker.select: Input object passed is not a valid form input object"); 553 window.ColorPicker_targetInput=null; 554 return; 555 } 556 window.ColorPicker_targetInput = inputobj; 557 this.show(linkname); 558 } 559 560 // This function runs when you move your mouse over a color block, if you have a newer browser 561 function ColorPicker_highlightColor(c) { 562 var thedoc = (arguments.length>1)?arguments[1]:window.document; 563 var d = thedoc.getElementById("colorPickerSelectedColor"); 564 d.style.backgroundColor = c; 565 d = thedoc.getElementById("colorPickerSelectedColorValue"); 566 d.innerHTML = c; 567 } 568 569 function ColorPicker() { 570 var windowMode = false; 571 // Create a new PopupWindow object 572 if (arguments.length==0) { 573 var divname = "colorPickerDiv"; 574 } 575 else if (arguments[0] == "window") { 576 var divname = ''; 577 windowMode = true; 578 } 579 else { 580 var divname = arguments[0]; 581 } 582 583 if (divname != "") { 584 var cp = new PopupWindow(divname); 585 } 586 else { 587 var cp = new PopupWindow(); 588 cp.setSize(225,250); 589 } 590 591 // Object variables 592 cp.currentValue = "#FFFFFF"; 593 594 // Method Mappings 595 cp.writeDiv = ColorPicker_writeDiv; 596 cp.highlightColor = ColorPicker_highlightColor; 597 cp.show = ColorPicker_show; 598 cp.select = ColorPicker_select; 599 600 // Code to populate color picker window 601 var colors = new Array( "#4180B6","#69AEE7","#000000","#000033","#000066","#000099","#0000CC","#0000FF","#330000","#330033","#330066","#330099", 602 "#3300CC","#3300FF","#660000","#660033","#660066","#660099","#6600CC","#6600FF","#990000","#990033","#990066","#990099", 603 "#9900CC","#9900FF","#CC0000","#CC0033","#CC0066","#CC0099","#CC00CC","#CC00FF","#FF0000","#FF0033","#FF0066","#FF0099", 604 "#FF00CC","#FF00FF","#7FFFFF","#7FFFFF","#7FF7F7","#7FEFEF","#7FE7E7","#7FDFDF","#7FD7D7","#7FCFCF","#7FC7C7","#7FBFBF", 605 "#7FB7B7","#7FAFAF","#7FA7A7","#7F9F9F","#7F9797","#7F8F8F","#7F8787","#7F7F7F","#7F7777","#7F6F6F","#7F6767","#7F5F5F", 606 "#7F5757","#7F4F4F","#7F4747","#7F3F3F","#7F3737","#7F2F2F","#7F2727","#7F1F1F","#7F1717","#7F0F0F","#7F0707","#7F0000", 607 608 "#4180B6","#69AEE7","#003300","#003333","#003366","#003399","#0033CC","#0033FF","#333300","#333333","#333366","#333399", 609 "#3333CC","#3333FF","#663300","#663333","#663366","#663399","#6633CC","#6633FF","#993300","#993333","#993366","#993399", 610 "#9933CC","#9933FF","#CC3300","#CC3333","#CC3366","#CC3399","#CC33CC","#CC33FF","#FF3300","#FF3333","#FF3366","#FF3399", 611 "#FF33CC","#FF33FF","#FF7FFF","#FF7FFF","#F77FF7","#EF7FEF","#E77FE7","#DF7FDF","#D77FD7","#CF7FCF","#C77FC7","#BF7FBF", 612 "#B77FB7","#AF7FAF","#A77FA7","#9F7F9F","#977F97","#8F7F8F","#877F87","#7F7F7F","#777F77","#6F7F6F","#677F67","#5F7F5F", 613 "#577F57","#4F7F4F","#477F47","#3F7F3F","#377F37","#2F7F2F","#277F27","#1F7F1F","#177F17","#0F7F0F","#077F07","#007F00", 614 615 "#4180B6","#69AEE7","#006600","#006633","#006666","#006699","#0066CC","#0066FF","#336600","#336633","#336666","#336699", 616 "#3366CC","#3366FF","#666600","#666633","#666666","#666699","#6666CC","#6666FF","#996600","#996633","#996666","#996699", 617 "#9966CC","#9966FF","#CC6600","#CC6633","#CC6666","#CC6699","#CC66CC","#CC66FF","#FF6600","#FF6633","#FF6666","#FF6699", 618 "#FF66CC","#FF66FF","#FFFF7F","#FFFF7F","#F7F77F","#EFEF7F","#E7E77F","#DFDF7F","#D7D77F","#CFCF7F","#C7C77F","#BFBF7F", 619 "#B7B77F","#AFAF7F","#A7A77F","#9F9F7F","#97977F","#8F8F7F","#87877F","#7F7F7F","#77777F","#6F6F7F","#67677F","#5F5F7F", 620 "#57577F","#4F4F7F","#47477F","#3F3F7F","#37377F","#2F2F7F","#27277F","#1F1F7F","#17177F","#0F0F7F","#07077F","#00007F", 621 622 "#4180B6","#69AEE7","#009900","#009933","#009966","#009999","#0099CC","#0099FF","#339900","#339933","#339966","#339999", 623 "#3399CC","#3399FF","#669900","#669933","#669966","#669999","#6699CC","#6699FF","#999900","#999933","#999966","#999999", 624 "#9999CC","#9999FF","#CC9900","#CC9933","#CC9966","#CC9999","#CC99CC","#CC99FF","#FF9900","#FF9933","#FF9966","#FF9999", 625 "#FF99CC","#FF99FF","#3FFFFF","#3FFFFF","#3FF7F7","#3FEFEF","#3FE7E7","#3FDFDF","#3FD7D7","#3FCFCF","#3FC7C7","#3FBFBF", 626 "#3FB7B7","#3FAFAF","#3FA7A7","#3F9F9F","#3F9797","#3F8F8F","#3F8787","#3F7F7F","#3F7777","#3F6F6F","#3F6767","#3F5F5F", 627 "#3F5757","#3F4F4F","#3F4747","#3F3F3F","#3F3737","#3F2F2F","#3F2727","#3F1F1F","#3F1717","#3F0F0F","#3F0707","#3F0000", 628 629 "#4180B6","#69AEE7","#00CC00","#00CC33","#00CC66","#00CC99","#00CCCC","#00CCFF","#33CC00","#33CC33","#33CC66","#33CC99", 630 "#33CCCC","#33CCFF","#66CC00","#66CC33","#66CC66","#66CC99","#66CCCC","#66CCFF","#99CC00","#99CC33","#99CC66","#99CC99", 631 "#99CCCC","#99CCFF","#CCCC00","#CCCC33","#CCCC66","#CCCC99","#CCCCCC","#CCCCFF","#FFCC00","#FFCC33","#FFCC66","#FFCC99", 632 "#FFCCCC","#FFCCFF","#FF3FFF","#FF3FFF","#F73FF7","#EF3FEF","#E73FE7","#DF3FDF","#D73FD7","#CF3FCF","#C73FC7","#BF3FBF", 633 "#B73FB7","#AF3FAF","#A73FA7","#9F3F9F","#973F97","#8F3F8F","#873F87","#7F3F7F","#773F77","#6F3F6F","#673F67","#5F3F5F", 634 "#573F57","#4F3F4F","#473F47","#3F3F3F","#373F37","#2F3F2F","#273F27","#1F3F1F","#173F17","#0F3F0F","#073F07","#003F00", 635 636 "#4180B6","#69AEE7","#00FF00","#00FF33","#00FF66","#00FF99","#00FFCC","#00FFFF","#33FF00","#33FF33","#33FF66","#33FF99", 637 "#33FFCC","#33FFFF","#66FF00","#66FF33","#66FF66","#66FF99","#66FFCC","#66FFFF","#99FF00","#99FF33","#99FF66","#99FF99", 638 "#99FFCC","#99FFFF","#CCFF00","#CCFF33","#CCFF66","#CCFF99","#CCFFCC","#CCFFFF","#FFFF00","#FFFF33","#FFFF66","#FFFF99", 639 "#FFFFCC","#FFFFFF","#FFFF3F","#FFFF3F","#F7F73F","#EFEF3F","#E7E73F","#DFDF3F","#D7D73F","#CFCF3F","#C7C73F","#BFBF3F", 640 "#B7B73F","#AFAF3F","#A7A73F","#9F9F3F","#97973F","#8F8F3F","#87873F","#7F7F3F","#77773F","#6F6F3F","#67673F","#5F5F3F", 641 "#57573F","#4F4F3F","#47473F","#3F3F3F","#37373F","#2F2F3F","#27273F","#1F1F3F","#17173F","#0F0F3F","#07073F","#00003F", 642 643 "#4180B6","#69AEE7","#FFFFFF","#FFEEEE","#FFDDDD","#FFCCCC","#FFBBBB","#FFAAAA","#FF9999","#FF8888","#FF7777","#FF6666", 644 "#FF5555","#FF4444","#FF3333","#FF2222","#FF1111","#FF0000","#FF0000","#FF0000","#FF0000","#EE0000","#DD0000","#CC0000", 645 "#BB0000","#AA0000","#990000","#880000","#770000","#660000","#550000","#440000","#330000","#220000","#110000","#000000", 646 "#000000","#000000","#000000","#001111","#002222","#003333","#004444","#005555","#006666","#007777","#008888","#009999", 647 "#00AAAA","#00BBBB","#00CCCC","#00DDDD","#00EEEE","#00FFFF","#00FFFF","#00FFFF","#00FFFF","#11FFFF","#22FFFF","#33FFFF", 648 "#44FFFF","#55FFFF","#66FFFF","#77FFFF","#88FFFF","#99FFFF","#AAFFFF","#BBFFFF","#CCFFFF","#DDFFFF","#EEFFFF","#FFFFFF", 649 650 "#4180B6","#69AEE7","#FFFFFF","#EEFFEE","#DDFFDD","#CCFFCC","#BBFFBB","#AAFFAA","#99FF99","#88FF88","#77FF77","#66FF66", 651 "#55FF55","#44FF44","#33FF33","#22FF22","#11FF11","#00FF00","#00FF00","#00FF00","#00FF00","#00EE00","#00DD00","#00CC00", 652 "#00BB00","#00AA00","#009900","#008800","#007700","#006600","#005500","#004400","#003300","#002200","#001100","#000000", 653 "#000000","#000000","#000000","#110011","#220022","#330033","#440044","#550055","#660066","#770077","#880088","#990099", 654 "#AA00AA","#BB00BB","#CC00CC","#DD00DD","#EE00EE","#FF00FF","#FF00FF","#FF00FF","#FF00FF","#FF11FF","#FF22FF","#FF33FF", 655 "#FF44FF","#FF55FF","#FF66FF","#FF77FF","#FF88FF","#FF99FF","#FFAAFF","#FFBBFF","#FFCCFF","#FFDDFF","#FFEEFF","#FFFFFF", 656 657 "#4180B6","#69AEE7","#FFFFFF","#EEEEFF","#DDDDFF","#CCCCFF","#BBBBFF","#AAAAFF","#9999FF","#8888FF","#7777FF","#6666FF", 658 "#5555FF","#4444FF","#3333FF","#2222FF","#1111FF","#0000FF","#0000FF","#0000FF","#0000FF","#0000EE","#0000DD","#0000CC", 659 "#0000BB","#0000AA","#000099","#000088","#000077","#000066","#000055","#000044","#000033","#000022","#000011","#000000", 660 "#000000","#000000","#000000","#111100","#222200","#333300","#444400","#555500","#666600","#777700","#888800","#999900", 661 "#AAAA00","#BBBB00","#CCCC00","#DDDD00","#EEEE00","#FFFF00","#FFFF00","#FFFF00","#FFFF00","#FFFF11","#FFFF22","#FFFF33", 662 "#FFFF44","#FFFF55","#FFFF66","#FFFF77","#FFFF88","#FFFF99","#FFFFAA","#FFFFBB","#FFFFCC","#FFFFDD","#FFFFEE","#FFFFFF", 663 664 "#4180B6","#69AEE7","#FFFFFF","#FFFFFF","#FBFBFB","#F7F7F7","#F3F3F3","#EFEFEF","#EBEBEB","#E7E7E7","#E3E3E3","#DFDFDF", 665 "#DBDBDB","#D7D7D7","#D3D3D3","#CFCFCF","#CBCBCB","#C7C7C7","#C3C3C3","#BFBFBF","#BBBBBB","#B7B7B7","#B3B3B3","#AFAFAF", 666 "#ABABAB","#A7A7A7","#A3A3A3","#9F9F9F","#9B9B9B","#979797","#939393","#8F8F8F","#8B8B8B","#878787","#838383","#7F7F7F", 667 "#7B7B7B","#777777","#737373","#6F6F6F","#6B6B6B","#676767","#636363","#5F5F5F","#5B5B5B","#575757","#535353","#4F4F4F", 668 "#4B4B4B","#474747","#434343","#3F3F3F","#3B3B3B","#373737","#333333","#2F2F2F","#2B2B2B","#272727","#232323","#1F1F1F", 669 "#1B1B1B","#171717","#131313","#0F0F0F","#0B0B0B","#070707","#030303","#000000","#000000","#000000","#000000","#000000"); 670 var total = colors.length; 671 var width = 72; 672 var cp_contents = ""; 673 var windowRef = (windowMode)?"window.opener.":""; 674 if (windowMode) { 675 cp_contents += "<html><head><title>Select Color</title></head>"; 676 cp_contents += "<body marginwidth=0 marginheight=0 leftmargin=0 topmargin=0><span style='text-align: center;'>"; 677 } 678 cp_contents += "<table style='border: none;' cellspacing=0 cellpadding=0>"; 679 var use_highlight = (document.getElementById || document.all)?true:false; 680 for (var i=0; i<total; i++) { 681 if ((i % width) == 0) { cp_contents += "<tr>"; } 682 if (use_highlight) { var mo = 'onMouseOver="'+windowRef+'ColorPicker_highlightColor(\''+colors[i]+'\',window.document)"'; } 683 else { mo = ""; } 684 cp_contents += '<td style="background-color: '+colors[i]+';"><a href="javascript:void()" onclick="'+windowRef+'ColorPicker_pickColor(\''+colors[i]+'\','+windowRef+'window.popupWindowObjects['+cp.index+']);return false;" '+mo+'> </a></td>'; 685 if ( ((i+1)>=total) || (((i+1) % width) == 0)) { 686 cp_contents += "</tr>"; 687 } 688 } 689 // If the browser supports dynamically changing TD cells, add the fancy stuff 690 if (document.getElementById) { 691 var width1 = Math.floor(width/2); 692 var width2 = width = width1; 693 cp_contents += "<tr><td colspan='"+width1+"' style='background-color: #FFF;' ID='colorPickerSelectedColor'> </td><td colspan='"+width2+"' style='text-align: center;' id='colorPickerSelectedColorValue'>#FFFFFF</td></tr>"; 694 } 695 cp_contents += "</table>"; 696 if (windowMode) { 697 cp_contents += "</span></body></html>"; 698 } 699 // end populate code 700 701 // Write the contents to the popup object 702 cp.populate(cp_contents+"\n"); 703 // Move the table down a bit so you can see it 704 cp.offsetY = 25; 705 cp.autoHide(); 706 return cp; 707 }