www.aleph1.co.uk Git - yaffs-website/blob - web/core/modules/color/preview.js

   1 /**
   2  * @file
   3  * Attaches preview-related behavior for the Color module.
   4  */
   5
   6 (function ($, Drupal) {
   7
   8   'use strict';
   9
  10   /**
  11    * Namespace for color-related functionality for Drupal.
  12    *
  13    * @namespace
  14    */
  15   Drupal.color = {
  16
  17     /**
  18      * The callback for when the color preview has been attached.
  19      *
  20      * @param {Element} context
  21      *   The context to initiate the color behaviour.
  22      * @param {object} settings
  23      *   Settings for the color functionality.
  24      * @param {HTMLFormElement} form
  25      *   The form to initiate the color behaviour on.
  26      * @param {object} farb
  27      *   The farbtastic object.
  28      * @param {number} height
  29      *   Height of gradient.
  30      * @param {number} width
  31      *   Width of gradient.
  32      */
  33     callback: function (context, settings, form, farb, height, width) {
  34       var accum;
  35       var delta;
  36       // Solid background.
  37       form.find('.color-preview').css('backgroundColor', form.find('.color-palette input[name="palette[base]"]').val());
  38
  39       // Text preview.
  40       form.find('#text').css('color', form.find('.color-palette input[name="palette[text]"]').val());
  41       form.find('#text a, #text h2').css('color', form.find('.color-palette input[name="palette[link]"]').val());
  42
  43       function gradientLineColor(i, element) {
  44         for (var k in accum) {
  45           if (accum.hasOwnProperty(k)) {
  46             accum[k] += delta[k];
  47           }
  48         }
  49         element.style.backgroundColor = farb.pack(accum);
  50       }
  51
  52       // Set up gradients if there are some.
  53       var color_start;
  54       var color_end;
  55       for (var i in settings.gradients) {
  56         if (settings.gradients.hasOwnProperty(i)) {
  57           color_start = farb.unpack(form.find('.color-palette input[name="palette[' + settings.gradients[i].colors[0] + ']"]').val());
  58           color_end = farb.unpack(form.find('.color-palette input[name="palette[' + settings.gradients[i].colors[1] + ']"]').val());
  59           if (color_start && color_end) {
  60             delta = [];
  61             for (var j in color_start) {
  62               if (color_start.hasOwnProperty(j)) {
  63                 delta[j] = (color_end[j] - color_start[j]) / (settings.gradients[i].vertical ? height[i] : width[i]);
  64               }
  65             }
  66             accum = color_start;
  67             // Render gradient lines.
  68             form.find('#gradient-' + i + ' > div').each(gradientLineColor);
  69           }
  70         }
  71       }
  72     }
  73   };
  74 })(jQuery, Drupal);