Adjust order of error output
[misc/kostenrechnung] / lib / rico / ricoColorPicker.js
1 // ===================================================================
2 // Original author: Matt Kruse <matt@mattkruse.com>
3 // WWW: http://www.mattkruse.com/
4 //
5 // Adapted to Rico by Matt Brown
6 // ===================================================================
7
8
9 Rico.ColorPicker = Class.create(
10 /** @lends Rico.ColorPicker# */
11 {
12 /**
13  * @class Implements a pop-up color picker control.
14  * @extends Rico.Popup
15  * @constructs
16  * @param id unique identifier
17  * @param options object may contain any of the following:<dl>
18  *   <dt>showColorCode</dt><dd> show hex color code as user hovers over color grid? default=false</dd>
19  *   <dt>cellsPerRow  </dt><dd> number of colors per row in the grid? default=18</dd>
20  *   <dt>palette      </dt><dd> array of 6 digit hex values, default=216 "web safe" colors</dd>
21  *</dl>
22  */
23   initialize: function(id,options) {
24     this.id=id;
25     this.currentValue = "#FFFFFF";
26     Object.extend(this, new Rico.Popup());
27     Object.extend(this.options, {
28       showColorCode : false,
29       cellsPerRow   : 18,
30       palette       : []
31     });
32     var hexvals=['00','33','66','99','CC','FF'];
33     for (var g=0; g<hexvals.length; g++) {
34       for (var r=0; r<hexvals.length; r++) {
35         for (var b=0; b<hexvals.length; b++) {
36           this.options.palette.push(hexvals[r]+hexvals[g]+hexvals[b]);
37         }
38       }
39     }
40     Object.extend(this.options, options || {});
41   },
42
43   atLoad : function() {
44     this.container=document.createElement("div");
45     this.container.style.display="none";
46     this.container.className='ricoColorPicker';
47     var width = this.options.cellsPerRow;
48     var cp_contents = "<TABLE BORDER='1' CELLSPACING='1' CELLPADDING='0'>";
49     for (var i=0; i<this.options.palette.length; i++) {
50       if ((i % width) == 0) { cp_contents += "<TR>"; }
51       cp_contents += '<TD BGCOLOR="#'+this.options.palette[i]+'">&nbsp;</TD>';
52       if ( ((i+1)>=this.options.palette.length) || (((i+1) % width) == 0)) {
53         cp_contents += "</TR>";
54       }
55     }
56     var halfwidth = Math.floor(width/2);
57     if (this.options.showColorCode) {
58       cp_contents += "<TR><TD COLSPAN='"+halfwidth+"' ID='colorPickerSelectedColor'>&nbsp;</TD><TD COLSPAN='"+(width-halfwidth)+"' ALIGN='CENTER' ID='colorPickerSelectedColorValue'>#FFFFFF</TD></TR>";
59     } else {
60       cp_contents += "<TR><TD COLSPAN='"+width+"' ID='colorPickerSelectedColor'>&nbsp;</TD></TR>";
61     }
62     cp_contents += "</TABLE>";
63     this.container.innerHTML=cp_contents;
64     document.body.appendChild(this.container);
65     this.setDiv(this.container);
66     /**
67      * alias for openPopup
68      * @function
69      */
70     this.open=this.openPopup;
71     /**
72      * alias for closePopup
73      * @function
74      */
75     this.close=this.closePopup;
76     Event.observe(this.container,"mouseover", this.highlightColor.bindAsEventListener(this), false);
77     Event.observe(this.container,"click", this.selectColor.bindAsEventListener(this), false);
78     this.close();
79   },
80
81 /** @private */
82   selectColor: function(e) {
83     Event.stop(e);
84     if (this.returnValue) this.returnValue(this.currentValue);
85     this.close();
86   },
87
88 /* This function runs when you move your mouse over a color block */
89 /** @private */
90   highlightColor: function(e) {
91     var elem = Event.element(e);
92     if (!elem.tagName || elem.tagName.toLowerCase() != 'td') return;
93     var c=Rico.Color.createColorFromBackground(elem).toString();
94     this.currentValue = c;
95     Element.setStyle('colorPickerSelectedColor', {backgroundColor:c}, true);
96     var d = $("colorPickerSelectedColorValue");
97     if (d) d.innerHTML = c;
98   }
99 });
100
101 Rico.includeLoaded('ricoColorPicker.js');