source-function-F_html_color_picker

It appears that you are using AdBlocking software. The cost of running this website is covered by advertisements. If you like it please feel free to a small amount of money to secure the future of this website.
Overview

Classes

Interfaces

Exceptions

Functions

  1: <?php
  2: //============================================================+
  3: // File name   : tce_colorpicker.php
  4: // Begin       : 2001-11-05
  5: // Last Update : 2013-03-17
  6: //
  7: // Description : HTML Color Picker Functions.
  8: //
  9: // Author: Nicola Asuni
 10: //
 11: // (c) Copyright:
 12: //               Nicola Asuni
 13: //               Tecnick.com LTD
 14: //               www.tecnick.com
 15: //               info@tecnick.com
 16: //
 17: // License:
 18: //    Copyright (C) 2004-2013 Nicola Asuni - Tecnick.com LTD
 19: //    See LICENSE.TXT file for more information.
 20: //============================================================+
 21: 
 22: /**
 23:  * @file
 24:  * HTML Color Picker Functions.
 25:  * @package com.tecnick.tcexam.admin
 26:  * @author Nicola Asuni
 27:  * @since 2008-10-01
 28:  */
 29: 
 30: /**
 31:  */
 32: 
 33: require_once('../config/tce_config.php');
 34: $pagelevel = 0;
 35: //require_once('../../shared/code/tce_authorization.php');
 36: $thispage_title = 'Color Picker';
 37: require_once('../code/tce_page_header_popup.php');
 38: echo '<script src="'.K_PATH_SHARED_JSCRIPTS.'inserttag.js" type="text/javascript"></script>'.K_NEWLINE;
 39: F_html_color_picker($_REQUEST['frm'], $_REQUEST['fld'], $_REQUEST['tag']);
 40: require_once('../code/tce_page_footer_popup.php');
 41: 
 42: /**
 43:  * Display Color Picker
 44:  * @author Nicola Asuni
 45:  * @since 2008-10-01
 46:  */
 47: function F_html_color_picker($callingform, $callingfield, $tag)
 48: {
 49:     global $l;
 50:     require_once('../config/tce_config.php');
 51:     require_once('../../shared/tcpdf/include/tcpdf_colors.php');
 52:     require_once('../../shared/code/tce_functions_form.php');
 53: 
 54:     // sanitize input parameters
 55:     $callingform = preg_replace('/[^a-z0-9_]/', '', $callingform);
 56:     $callingfield = preg_replace('/[^a-z0-9_]/', '', $callingfield);
 57:     $tag = preg_replace('/[^a-z0-9_]/', '', $tag);
 58: 
 59:     echo '<div style="margin:0;padding:0;">'.K_NEWLINE;
 60:     echo '<a onclick="FJ_pick_color(0); document.getElementById(\'colorname\').selectedIndex=0;"><img src="'.K_PATH_IMAGES.'buttons/colortable.jpg" alt="" id="colorboard" width="320" height="300" style="margin:0;padding:0;border:none;" /></a>'.K_NEWLINE;
 61:     echo K_NEWLINE;
 62:     echo '<form action="'.$_SERVER['SCRIPT_NAME'].'" method="post" enctype="multipart/form-data" id="form_colorpicker">'.K_NEWLINE;
 63:     echo '<div class="smalldigit" style="width:320px;font-size:80%;" >';
 64:     echo 'DEC:';
 65:     echo '<input type="text" name="RED" id="RED" size="3" maxlength="3" readonly="readonly" title="RED (DEC)"/>';
 66:     echo '<input type="text" name="GREEN" id="GREEN" size="3" maxlength="3" readonly="readonly" title="GREEN (DEC)"/>';
 67:     echo '<input type="text" name="BLUE" id="BLUE" size="3" maxlength="3" readonly="readonly" title="BLUE (DEC)"/>';
 68:     echo '&nbsp;&nbsp;&nbsp;&nbsp;';
 69:     echo 'HEX:';
 70:     echo '<input type="text" name="HRED" id="HRED" size="3" maxlength="2" readonly="readonly" title="RED (HEX)"/>';
 71:     echo '<input type="text" name="HGREEN" id="HGREEN" size="3" maxlength="2" readonly="readonly" title="GREEN (HEX)"/>';
 72:     echo '<input type="text" name="HBLUE" id="HBLUE" size="3" maxlength="2" readonly="readonly" title="BLUE (HEX)"/>';
 73:     echo '</div>'.K_NEWLINE;
 74: 
 75:     // print a table of websafe colors
 76:     $ck = 1;
 77:     echo '<div style="width:320px;">';
 78:     while (list($key, $val) = each(TCPDF_COLORS::$webcolor)) { // for each color in table
 79:         echo '<a title="'.$key.'" onclick="document.getElementById(\'CSELECTED\').value=\'#'.$val.'\';FJ_pick_color(1);document.getElementById(\'colorname\').selectedIndex='.$ck.';" style="text-decoration:none;font-size:3px;">';
 80:         echo '<span style="background-color:#'.$val.';padding:0;margin:0;width:20px;height:10px;float:left;">&nbsp;</span>';
 81:         echo '</a>';
 82:         $ck++;
 83:     }
 84:     echo '<br style="clear:both;"/>';
 85:     echo '</div>'.K_NEWLINE;
 86:     echo '<div id="pickedcolor" style="visibility:visible;border:1px solid black;width:320px;height:30px;">&nbsp;</div>'.K_NEWLINE;
 87:     echo '<div>'.K_NEWLINE;
 88:     echo '<select name="colorname" id="colorname" size="0" onchange="document.getElementById(\'CSELECTED\').value=document.getElementById(\'colorname\').options[document.getElementById(\'colorname\').selectedIndex].value; FJ_pick_color(1);">'.K_NEWLINE;
 89:     echo '<option value=""></option>'.K_NEWLINE;
 90:     reset(TCPDF_COLORS::$webcolor);
 91:     while (list($key, $val) = each(TCPDF_COLORS::$webcolor)) { // for each color in table
 92:         echo '<option value="#'.$val.'">'.$key.'</option>'.K_NEWLINE;
 93:     }
 94:     echo '</select>';
 95:     echo '<input type="text" name="CSELECTED" id="CSELECTED" size="10" maxlength="7" value="" onchange="FJ_pick_color(1); document.getElementById(\'colorname\').selectedIndex=0;" />'.K_NEWLINE;
 96:     $onclick = 'FJ_insert_tag(window.opener.document.getElementById(\''.$callingform.'\').'.$callingfield.', \'['.$tag.'=\'+document.getElementById(\'CSELECTED\').value+\']\');';
 97:     echo '<input type="button" name="wclose" id="wclose" value="'.$l['w_close'].'" title="'.$l['h_close_window'].'" onclick="'.$onclick.'self.close();" />'.K_NEWLINE;
 98:     echo '</div>'.K_NEWLINE;
 99:     echo '</form>'.K_NEWLINE;
100:     echo '</div>'.K_NEWLINE;
101: ?>
102: <script type="text/javascript">
103: //<![CDATA[
104: // variables
105: // ------------------------------------------------------------
106: var Xpos, Ypos;
107: var Red, Green, Blue;
108: var hexChars = '0123456789ABCDEF';
109: 
110: // ------------------------------------------------------------
111: // capture event
112: // ------------------------------------------------------------
113: if (window.captureEvents) {
114:     document.captureEvents(Event.MOUSEMOVE);
115: }
116: document.onmousemove = FJ_get_coordinates;
117: 
118: // ------------------------------------------------------------
119: // Get cursor coordinates and store on Xpos and Ypos variables
120: // ------------------------------------------------------------
121: function FJ_get_coordinates(e) {
122:     if (window.captureEvents) {
123:         Xpos = e.pageX;
124:         Ypos = e.pageY;
125:     } else {
126:         Xpos = (event.clientX + document.body.scrollLeft);
127:         Ypos = (event.clientY + document.body.scrollTop);
128:     }
129: 
130:     //calculate color
131:     if (Xpos<=50) {
132:         Red=255;
133:         Green=Math.round(Xpos * 5.1);
134:         Blue=0;
135:     } else if (Xpos<=100) {
136:         Red=255-Math.round((Xpos-50) * 5.1);
137:         Green=255;
138:         Blue=0;
139:     } else if (Xpos<=150) {
140:         Red=0;
141:         Green=255;
142:         Blue=Math.round((Xpos-100) * 5.1);
143:     } else if (Xpos<=200) {
144:         Red=0;
145:         Green=255-Math.round((Xpos-150) * 5.1);
146:         Blue=255;
147:     } else if (Xpos<=250) {
148:         Red=Math.round((Xpos-200) * 5.1);
149:         Green=0;
150:         Blue=255;
151:     } else if (Xpos<=300) {
152:         Red=255;
153:         Green=0;
154:         Blue=255-Math.round((Xpos-250) * 5.1);
155:     } else if (Xpos<=320){ //grey scale
156:         light = Math.round((1-(Ypos/300))*255);
157:         Red=light;
158:         Green=light;
159:         Blue=light;
160:     }
161: 
162:     // change luminosity
163:     if ((Xpos>=0) && (Xpos<=300) && (Ypos>=0) && (Ypos<=300)) {
164:         light = Math.round((1-(Ypos/150))*255);
165:         Red += light;
166:         if (Red>255) {
167:             Red=255;
168:         } else if (Red<0) {
169:             Red=0;
170:         }
171:         Green += light;
172:         if (Green>255) {
173:             Green=255;
174:         } else if (Green<0) {
175:             Green=0;
176:         }
177:         Blue += light;
178:         if (Blue>255) {
179:             Blue=255;
180:         } else if (Blue<0) {
181:             Blue=0;
182:         }
183:     }
184:     // display color
185:     if ((Xpos>=0) && (Xpos<=320) && (Ypos>=0) && (Ypos<=300)) {
186:         document.getElementById('RED').value = Red;
187:         document.getElementById('GREEN').value = Green;
188:         document.getElementById('BLUE').value = Blue;
189:         document.getElementById('HRED').value = FJ_dec_to_hex(Red);
190:         document.getElementById('HGREEN').value = FJ_dec_to_hex(Green);
191:         document.getElementById('HBLUE').value = FJ_dec_to_hex(Blue);
192:     }
193:     return;
194: }
195: 
196: // ------------------------------------------------------------
197: // calculate color from coordinates
198: // manual=1 means color introduced by keyboard
199: // ------------------------------------------------------------
200: function FJ_pick_color(manual) {
201: if ((manual)||((Xpos<=320)&&(Ypos<=300))) { //check if coordinates are valid
202: 
203: if (!manual) {
204: document.getElementById('CSELECTED').value = '#'+document.getElementById('HRED').value+''+document.getElementById('HGREEN').value+''+document.getElementById('HBLUE').value;
205: }
206: 
207: newcolor = document.getElementById('CSELECTED').value;
208: 
209: //show selected color on picked color layer
210: // check browser capabilities
211: if (document.layers){
212: document.layers['pickedcolor'].bgColor=newcolor;
213: }
214: if (document.all){
215: document.all.pickedcolor.style.backgroundColor=newcolor;
216: }
217: if (!document.all && document.getElementById){
218: document.getElementById('pickedcolor').style.backgroundColor=newcolor;
219: }
220: }
221: return;
222: }
223: 
224: // ------------------------------------------------------------
225: // convert decimal value to hexadecimal (FF is the max value)
226: // ------------------------------------------------------------
227: function FJ_dec_to_hex (Dec) {
228: var a = Dec % 16;
229: var b = (Dec - a)/16;
230: hex = hexChars.charAt(b)+''+hexChars.charAt(a);
231: return hex;
232: }
233: 
234: // default color
235: document.getElementById('CSELECTED').value='#000000';
236: FJ_pick_color(1);
237: //]]>
238: </script>
239: <?php
240: return;
241: }
242: 
243: //============================================================+
244: // END OF FILE
245: //============================================================+
246: 
 

© 2004-2018 – Nicola Asuni - Tecnick.com - All rights reserved.
about - disclaimer - privacy