//CHARACTERS OF THE "HEX ALPHABET" $hex_alpha = "0123456789abcdef"; $n = strlen($hex_alpha); //NUMBER OF ELEMENT OF THE ARRAY ABOVE $hex_combos = array(); //BLANK ARRAY VARIABLE (WILL BE USED TO MAKE THE ARRAY OF ALL COMBINATIONS OF LETTERS AND NUMBERS)
$hex_combos[$i] = $hex_alpha[$v].$hex_alpha[$h]; //PUTS THE 2-CHARS OF THE HEX-VALUE TOGETHER }
$r = 50; $g = 186; $b = 237;
$hex_value = $hex_combos[$r].$hex_combos[$g].$hex_combos[$b]; //CONVERTS FROM R/G/B TO HEX VALUE echo $hex_value; //FULL HEX VALUE echo '<br>'; echo '<div style="background:#'.$hex_value.'; width: 20px;height:20px;"></div>'; echo '<br><br>';
/*CONVERTS HEX VALUE TO R/G/B*/
$hex_value = '32baed'; //HEX VALUE $reg_hex = '/^[0-9a-f]{1,6}$/'; //PATTERN TO VALID HEX VALUE $r_g_b = array("R", "G", "B"); //LETTERS TO GO NEXT TO THEIR RESPECTIVE CONVERSIONS $x = array(); //ARRAY TO CONTAIN THE HEX VALUE IN 3 GROUPS OF 2 Ex: (32 ba ed), EACH WILL BE CONVERTED TO ITS R/G/B EQUIVELANT
//IF HEX VALUE IS VALID if(preg_match($reg_hex, $hex_value)){ //"FOR LOOP" TO PUT THE 2-CHAR COMBO TOGETHER for($i=0, $j=0; $i<strlen($hex_value)/2, $j<strlen($hex_value); $i++, $j+=2){ $hex_split = substr($hex_value, $j, 2); //PARTIAL THE HEX VALUE $x[$i] = $hex_split; //PARTIAL THE HEX VALUE INSERTED IN ARRAY WITH ITS OTHER PARTS
$rgb = array_search($x[$i], $hex_combos); //CONVERTS FROM HEX VALUE TO R/G/B echo $r_g_b[$i]. ':' .$rgb.' '; //R/G/B AND THEIR VALUES if($i==0){ $rgb_bg .= $rgb; } else { $rgb_bg .= ','.$rgb; } } echo '<div style="background:rgb('.$rgb_bg.'); width: 20px;height:20px;"></div>'; } else { echo 'Invalid Hex Value'; }
var hex_alpha = "0123456789abcdef"; //CHARACTERS OF THE "HEX ALPHABET" var n = hex_alpha.length; //NUMBER OF CHARACTERS OF THE "HEX ALPHABET" var hex_combos =[]; //BLANK ARRAY VARIABLE (WILL BE THE ARRAY OF ALL COMBINATIONS OF HEX VALUES)
//ARRAY PROCESSED HERE
for(i=0; i<(n*n); i++){
//REPEATS EACH CHARACTER VERTICALLY Ex:(0,0,0,0,0,0; 1,1,1,1,1,1)
var v =Math.floor(i/n);
//REPEATS EACH CHARACTER HORIZONTALLY Ex:(0,1,2,3,4,5; 0,1,2,3,4,5)
var h = i%n;
hex_combos[i]= hex_alpha[v]+hex_alpha[h]; //PUTS 2 CHARACTERS AT A TIME IN THE ARRAY
}
/*CONVERTS R/G/B TO ITS HEX VALUE*/
function rgb_to_hex(){
var l = $(".colors").length; //NUMBER OF R/G/B INPUTS var hex_value = ""; //BLANK VARIABLE (WILL BE THE HEX VALUE)
//"FOR LOOP" TO MAKE ARRAY OF THE HEX VALUE SPLIT IN 3 PIECES
for(i=0; i<l; i++){
var color = $(".colors:eq("+i+")").val();
//FULLY CONVERTED HEX VALUE
if(color){
hex_value += hex_combos[color];
} else {
hex_value += "00"; //SET TO "00" IF NO INPUT
}
}
$("#hex").val(hex_value); //DISLPAYS IN THIS ELEMENT IN HTML
$("#block").css({"background-color":hex_value}); //BLOCK FILLED WITH THE COLOR
}
/*CONVERTS HEX VALUE TO ITS R/G/B*/
function hex_to_rgb(hex_value, l){ //(HEX VALUE, NUMBER OF CHARACTERS) VARIABLES FROM THE INPUT FIELD
var p =/^([0-9a-f]{1,6})$/i; //PATTERN FOR VALID HEX VALUE
//IF THE HEX VALUE ISN'T EMPTY...
if(hex_value){
//IF HEX VALUE IS VALID...
if(hex_value.match(p)){
//IF HEX VALUE IS < 6 CHARACTERS, ZEROS WILL BE FILLED FOR THE # OF CHARACTER < 6
if(l<6){
for(i=1; i<=(6-l); i++){
hex_value += "0";
}
}
var x =[]; //ARRAY TO SPLIT THE HEX VALUE IN 3 GROUPS OF 2 Ex: (32 ba ed), EACH WILL BE CONVERTED TO ITS R/G/B EQUIVELANT
//"FOR LOOP" TO PUT EACH GROUP OF 2 CHARS IN THE "x" ARRAY
for(i=0, j=0; i<l/2, j<l; i++, j+=2){
x[i]= hex_value.substr(j, 2);
}
//IF THERE ARE < 6 CHARACTERS OF THE HEX VALUE...
if(l<6){
for(i=x.length; i<=2; i++){
x[i]= "00"; //0'S WILL BE CONVERTED IN ITS PART OF THE R/G/B
}
}
//"FOR LOOP" TO CONVERT FROM HEX VALUE TO R/G/B
for(i=0; i<hex_combos.length; i++){
for(j=0; j<x.length; j++){
//HEX VALUE FROM STRING IS FOUND IN FULL ARRAY OF COMBOS AND GETS ITS INDECES WHICH ARE THE R/G/B
if(x[j]==hex_combos[i]){
$(".colors:eq("+j+")").val(i); //R/G/B VALUES CONVERTED IN THEIR RESPECTIVE FIELDS
}
}
}
$("#m").html(""); //CLEARS THE MESSAGE IF THE HEX VALUE IS VALID
} else {
hex_value = "ffffff"; //IF HEX VALUE IS INVALID, THE VALUE WILL BE THIS (WHITE)
$("#m").html("Invalid Hex Value"); //THE MESSAGE
}
}
$("#block").css({"background-color":hex_value}); //BLOCK FILLED WITH THE COLOR
