1 function dmx_input (head, attr) {

     2     var value = $('.dmx-input#' + head + '-' + attr).val();

     3     

     4     if (value == undefined )

     5         return undefined;

     6 

     7     if (value == "")

     8         return 0; // default

     9     

    10     return parseInt(value);

    11 }

    12 

    13 /*

    14  * Update color for head.

    15  */

    16 function dmx_color (head) {

    17     var alpha = dmx_input(head, 'alpha');

    18 

    19     if (alpha) 

    20         alpha = alpha / 255;

    21 

    22     $('.dmx-color#' + head + '-color').background_color(

    23             dmx_input(head, 'red') / 255,

    24             dmx_input(head, 'green') / 255,

    25             dmx_input(head, 'blue') / 255,

    26             alpha

    27     );

    28 }

    29 

    30 /*

    31  * Update slider from <input>.

    32  */

    33 function _slider_input (input, slider) {

    34     var value;

    35 

    36     if (input.val())

    37         value = parseInt(input.val());

    38     else

    39         value = 0;

    40     

    41     slider.slider('value', value);

    42 }

    43 

    44 /*

    45  * Bind given <input> to given slider.

    46  */

    47 function slider_input (input, slider) {

    48     // bind

    49     input.change(function () { _slider_input(input, slider); });

    50 

    51     // initialize

    52     _slider_input(input, slider);

    53 }

    54 

    55 $(function () {

    56     $('.dmx-input').each(function () {

    57         var attr = this.id;

    58         var head = attr.split('-', 1)[0];

    59         var input = $(this);

    60         var slider = $('.dmx-slider#' + attr + '-slider');

    61         var color = $('.dmx-color#' + head + '-color');

    62         

    63         // slider control

    64         slider.slider({

    65             orientation:    'horizontal',

    66             range:          'min',

    67             min:            0,

    68             max:            255,

    69 

    70             slide:          function () {

    71                 var value = slider.slider('value');

    72                 

    73                 // update input

    74                 input.val(value.toString());

    75 

    76                 if (color) {

    77                     // update color value

    78                     dmx_color(head);

    79                 }

    80 

    81             },

    82         });

    83 

    84         // update slider from <input>

    85         slider_input(input, slider);

    86 

    87         // init

    88         if (color) {

    89             dmx_color(head);

    90         }

    91     });

    92 });