Re: Color Picker/ Slider

On Mar 10, 4:46 am, mrbunnylamakins <[email protected]> wrote:
> The thing the urks me a lot is MDN is missing 75% of code. They give you example of what one can do but do post much of the interaction code.
>
> <scale min="1" max="10"/>
>
> <colorpicker type="button" color="#CC0080" />
>
> I found nothing XUL on how to program those into anything.
>
> Does Any know how?

You, sir, have hit the nail on the head.  I've been complaining about
that very point for a while now.  All of the examples and tutorials
I've found are long on GUI construction and ridiculously short on
doing anything with the GUI once it is created.  All of my work has
been trial and error with a dash of this forum thrown in when I
encountered brick walls.  All of the stuff I did learn about XUL I
collected in a reference of my own.  Shameless plug, it's available
for the Kindle.  The following is from the colorpicker section:

The <colorpicker> element provides a method for choosing a color from
a color palette. Displaying the color picker simply uses the code
<colorpicker id="cp" />. This provides the color picker as seen at
above.

The value of the selected color is stored within the color property of
the <colorpicker> element. To get the value for the selected color,
use this bit of JavaScript:

     var cpcolor = document.getElementById(`cp').color;

There is one caveat to using this, however. The color property is
undefined when the color picker is first displayed. Depending on your
OS, choosing a color may not set or change the value of the color
property on the first click. To get around this, you can set the color
property when the window containing the color picker loads by setting
the onload attribute of the window/dialog/prefwindow element.

     onload="document.getElementById(`cp').color='#ffffff';"

This will set the color property to white. Once the color property is
set, selections by the user will update the property.

Hope this helps.