[Sommaire] [Imprimer]

   1  <!--
   2   * FCKeditor - The text editor for Internet - http://www.fckeditor.net
   3   * Copyright (C) 2003-2007 Frederico Caldeira Knabben
   4   * 
   5   * == BEGIN LICENSE ==
   6   * 
   7   * Licensed under the terms of any of the following licenses at your
   8   * choice:
   9   * 
  10   *  - GNU General Public License Version 2 or later (the "GPL")
  11   *    http://www.gnu.org/licenses/gpl.html
  12   * 
  13   *  - GNU Lesser General Public License Version 2.1 or later (the "LGPL")
  14   *    http://www.gnu.org/licenses/lgpl.html
  15   * 
  16   *  - Mozilla Public License Version 1.1 or later (the "MPL")
  17   *    http://www.mozilla.org/MPL/MPL-1.1.html
  18   * 
  19   * == END LICENSE ==
  20   * 
  21   * File Name: fck_colorselector.html
  22   *     Color Selection dialog window.
  23   * 
  24   * File Authors:
  25   *         Frederico Caldeira Knabben (www.fckeditor.net)
  26  -->
  27  <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN" >
  28  <html>
  29      <head>
  30          <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
  31          <meta name="robots" content="noindex, nofollow" />
  32          <style TYPE="text/css">
  33              #ColorTable        { cursor: pointer ; cursor: hand ; }
  34              #hicolor        { height: 74px ; width: 74px ; border-width: 1px ; border-style: solid ; }
  35              #hicolortext    { width: 75px ; text-align: right ; margin-bottom: 7px ; }
  36              #selhicolor        { height: 20px ; width: 74px ; border-width: 1px ; border-style: solid ; }
  37              #selcolor        { width: 75px ; height: 20px ; margin-top: 0px ; margin-bottom: 7px ; }
  38              #btnClear        { width: 75px ; height: 22px ; margin-bottom: 6px ; }
  39              .ColorCell        { height: 15px ; width: 15px ; }
  40          </style>
  41          <script type="text/javascript">
  42          
  43  var oEditor = window.parent.InnerDialogLoaded() ;
  44  
  45  function OnLoad()
  46  {
  47      // First of all, translate the dialog box texts
  48      oEditor.FCKLanguageManager.TranslatePage(document) ;
  49      
  50      CreateColorTable() ;
  51      
  52      window.parent.SetOkButton( true ) ;    
  53      window.parent.SetAutoSize( true ) ;
  54  }
  55  
  56  function CreateColorTable()
  57  {
  58      // Get the target table.
  59      var oTable = document.getElementById('ColorTable') ;
  60  
  61      // Create the base colors array.
  62      var aColors = ['00','33','66','99','cc','ff'] ;
  63  
  64      // This function combines two ranges of three values from the color array into a row.
  65  	function AppendColorRow( rangeA, rangeB )
  66      {
  67          for ( var i = rangeA ; i < rangeA + 3 ; i++ ) 
  68          { 
  69              var oRow = oTable.insertRow(-1) ; 
  70  
  71              for ( var j = rangeB ; j < rangeB + 3 ; j++ ) 
  72              { 
  73                  for ( var n = 0 ; n < 6 ; n++ ) 
  74                  { 
  75                      AppendColorCell( oRow, '#' + aColors[j] + aColors[n] + aColors[i] ) ; 
  76                  } 
  77              } 
  78          }
  79      }
  80  
  81      // This function create a single color cell in the color table.
  82  	function AppendColorCell( targetRow, color )
  83      {
  84          var oCell = targetRow.insertCell(-1) ;
  85          oCell.className = 'ColorCell' ;
  86          oCell.bgColor = color ;
  87          
  88          oCell.onmouseover = function()
  89          {
  90              document.getElementById('hicolor').style.backgroundColor = this.bgColor ;
  91              document.getElementById('hicolortext').innerHTML = this.bgColor ;
  92          }
  93          
  94          oCell.onclick = function()
  95          {
  96              document.getElementById('selhicolor').style.backgroundColor = this.bgColor ;
  97              document.getElementById('selcolor').value = this.bgColor ;
  98          }
  99      }
 100  
 101      AppendColorRow( 0, 0 ) ;
 102      AppendColorRow( 3, 0 ) ;
 103      AppendColorRow( 0, 3 ) ;
 104      AppendColorRow( 3, 3 ) ;
 105  
 106      // Create the last row.
 107      var oRow = oTable.insertRow(-1) ;
 108      
 109      // Create the gray scale colors cells.
 110      for ( var n = 0 ; n < 6 ; n++ )
 111      {
 112          AppendColorCell( oRow, '#' + aColors[n] + aColors[n] + aColors[n] ) ; 
 113      }
 114      
 115      // Fill the row with black cells.
 116      for ( var i = 0 ; i < 12 ; i++ )
 117      {
 118          AppendColorCell( oRow, '#000000' ) ; 
 119      }
 120  }
 121  
 122  function Clear()
 123  {
 124      document.getElementById('selhicolor').style.backgroundColor = '' ;
 125      document.getElementById('selcolor').value = '' ;
 126  }
 127  
 128  function ClearActual()
 129  {
 130      document.getElementById('hicolor').style.backgroundColor = '' ;
 131      document.getElementById('hicolortext').innerHTML = '&nbsp;' ;
 132  }
 133  
 134  function UpdateColor()
 135  {
 136      try          { document.getElementById('selhicolor').style.backgroundColor = document.getElementById('selcolor').value ; }
 137      catch (e) { Clear() ; }
 138  }
 139  
 140  function Ok()
 141  {
 142      if ( typeof(window.parent.dialogArguments.CustomValue) == 'function' )
 143          window.parent.dialogArguments.CustomValue( document.getElementById('selcolor').value ) ;
 144  
 145      return true ;
 146  }
 147          </script>
 148      </head>
 149      <body onload="OnLoad()" scroll="no" style="OVERFLOW: hidden">
 150          <table cellpadding="0" cellspacing="0" border="0" width="100%" height="100%">
 151              <tr>
 152                  <td align="center" valign="middle">
 153                      <table border="0" cellspacing="5" cellpadding="0" width="100%">
 154                          <tr>
 155                              <td valign="top" align="center" nowrap width="100%">
 156                                  <table id="ColorTable" border="0" cellspacing="0" cellpadding="0" width="270" onmouseout="ClearActual();">
 157                                  </table>
 158                              </td>
 159                              <td valign="top" align="left" nowrap>
 160                                  <span fckLang="DlgColorHighlight">Highlight</span>
 161                                  <div id="hicolor"></div>
 162                                  <div id="hicolortext">&nbsp;</div>
 163                                  <span fckLang="DlgColorSelected">Selected</span>
 164                                  <div id="selhicolor"></div>
 165                                  <input id="selcolor" type="text" maxlength="20" onchange="UpdateColor();">
 166                                  <br>
 167                                  <input id="btnClear" type="button" fckLang="DlgColorBtnClear" value="Clear" onclick="Clear();" />
 168                              </td>
 169                          </tr>
 170                      </table>
 171                  </td>
 172              </tr>
 173          </table>
 174      </body>
 175  </html>