colorWidget.js

Go to the documentation of this file.

 
define( [
                'remoto!stdlib:js/widgets/widget.js',
                //'include/modal/chooseColor4f/jscolor4f',
                'remoto!stdlib:js/modal/chooseColor/jscolor.js',
                'remoto!stdlib:js/include/utils.js',
                'remoto!stdlib:js/include/color.js',
        ],
        function(widget,jscolor,utils,color)
        {
                'use strict';
 
                colorWidget.prototype = new widget;
                function colorWidget( d )
                {
                        this._color = null;
                        this._colorJq = null;
 
                        var value = d.value;
 
                        if (!value || value.toString().startsWith("RANDOM"))
                        {       //d.value = color.randomHSV().html;
                                var THIS = this;
                                setTimeout( function() {
                                        THIS.value = color.randomHSV().html;
                                        //THIS.value = d.value  //trigger an update
                                }, 0 );
                        }
 
                        widget.call( this, d );
                }
 
                colorWidget.prototype.createWidget = function()
                {
                        if (this._colorJq) return this._colorJq;
                
                        widget.prototype.createWidget.call(this);
 
                        this._widgetJq.hide();                  
 
                        this._colorJq = $("<div class='widgetInputField' id='"+this._id+"_color' style='height:18px; border:var(--Border1); margin-bottom:2px; box-sizing:border-box; font-size:11px; line-height:18px; min-width:28px;' tabindex='-1' type='text'>&nbsp;</div>");
 
                        if (this._options.class)
                                this._colorJq.addClass(this._options.class);
 
                        return this._colorJq;
                }
 
                colorWidget.prototype.activate = function()
                {
                        widget.prototype.activate.call(this);
 
                        this._colorJq.css("cursor","pointer");
 
                        var ops = {
                                valueElement:   this._widgetJq[0],
                                styleElement:   this._colorJq[0],
                                pickerFace:     5,
                        }
 
                        this._color = new jscolor.color(this._colorJq[0],ops);
                }
 
                // same as base class
                colorWidget.prototype.sync = function()
                {
                        var v = this._widgetJq ? this._widgetJq.val() : null;
 
                        //this.value = utils.hexDec(v);
                        this.value = v;
                }
 
                colorWidget.prototype.deactivate = function()
                {
                        widget.prototype.deactivate.call(this);
 
                        if (this._color)
                                this._color.hidePicker();
                        this._color = null;
                }
 
                colorWidget.prototype.__defineSetter__("value", function(v)
                {
                        widget.prototype.__lookupSetter__("value").call(this,v);
 
                        //v = utils.decHex(v);
 
                        this._widgetJq.val(this._value);
 
                        this._color.importColor();
 
                        return this._value;
                });
 
                colorWidget.prototype.__defineGetter__("value", function()
                {
                        return widget.prototype.__lookupGetter__("value").call(this);
                } );
 
                colorWidget.prototype.__defineGetter__("visibleWidget", function()
                {
                        return this._colorJq;
                });
 
                return colorWidget;
        }
);