[Sommaire] [Imprimer]

   1  /**
   2   * Horde Colorpicker JavaScript.
   3   *
   4   * Provides the javascript to create a colorpicker.
   5   *
   6   * $Horde: horde/js/open_colorpicker.js,v 1.2 2004/10/19 19:08:53 chuck Exp $
   7   *
   8   * See the enclosed file COPYING for license information (LGPL). If you did not
   9   * receive this file, see http://www.fsf.org/copyleft/lgpl.html.
  10   */
  11  
  12  function openColorPicker(target)
  13  {
  14      var lay = document.getElementById('colorpicker_' + target);
  15      if (lay.style.display == 'block') {
  16          lay.style.display = 'none';
  17          return false;
  18      }
  19  
  20      if (lay.firstChild) {
  21          if (lay.firstChild.nodeType == 1) {
  22              lay.style.display = 'block';
  23              return false;
  24          }
  25          else {
  26              lay.removeChild(lay.firstChild);
  27          }
  28      }
  29  
  30      var table = document.createElement('table');
  31      var tbody = document.createElement('tbody');
  32      table.appendChild(tbody);
  33      table.cellSpacing = 0;
  34      table.border = 0;
  35      table.style.cursor = 'crosshair';
  36      table.onmouseout = function() {
  37          document.getElementById('colordemo_' + target).style.backgroundColor = document.getElementById(target).value;
  38          return false;
  39      }
  40  
  41      // The palette
  42      r = 0; g = 0; b = 0;
  43      for (b = 0; b < 6; b++) {
  44          row = document.createElement('tr');
  45          color = makeColor(b * 51, b * 51, b * 51);
  46          cell = makeCell(target, color);
  47          row.appendChild(cell);
  48          for (g = 0; g < 6; g++) {
  49              for (r = 0; r < 6; r++) {
  50                  if (r != b && b != g) {
  51                      color = makeColor(r * 51, g * 51, b * 51);
  52                      cell = makeCell(target, color);
  53                      row.appendChild(cell);
  54                  }
  55              }
  56          }
  57          tbody.appendChild(row);
  58      }
  59  
  60      table.appendChild(tbody);
  61      lay.appendChild(table);
  62      lay.style.display = 'block';
  63  }
  64  
  65  function makeCell(target, color)
  66  {
  67      cell = document.createElement('td');
  68      cell.height = 3;
  69      cell.width = 6;
  70      cell.id = color;
  71      cell.style.backgroundColor = color;
  72      cell.onmouseover = function() {
  73          document.getElementById('colordemo_' + target).style.backgroundColor = this.style.backgroundColor;
  74          return false;
  75      }
  76      cell.onclick = function() {
  77          document.getElementById('colordemo_' + target).style.backgroundColor = this.style.backgroundColor;
  78          document.getElementById(target).value = this.id;
  79          return false;
  80      }
  81  
  82      return cell;
  83  }
  84  
  85  function makeColor(r, g, b)
  86  {
  87      color = "#";
  88      color += hex(Math.floor(r / 16));
  89      color += hex(r % 16);
  90      color += hex(Math.floor(g / 16));
  91      color += hex(g % 16);
  92      color += hex(Math.floor(b / 16));
  93      color += hex(b % 16);
  94      return color;
  95  }
  96  
  97  function hex(Dec)
  98  {
  99      if (Dec == 10) return "a";
 100      if (Dec == 11) return "b";
 101      if (Dec == 12) return "c";
 102      if (Dec == 13) return "d";
 103      if (Dec == 14) return "e";
 104      if (Dec == 15) return "f";
 105      return "" + Dec;
 106  }