From 6b8821b43e47c51a303d4080fb4a1c37893a6609 Mon Sep 17 00:00:00 2001
From: rsesek <rsesek@ad1dcce9-c9fe-0310-b82b-83ea1733dbb0>
Date: Sun, 21 Aug 2005 04:57:09 +0000
Subject: [PATCH] Hooked up decimal system

git-svn-id: svn://depot/macosx/trunk/RGB_Converter@10 ad1dcce9-c9fe-0310-b82b-83ea1733dbb0
---
 RGB_Converter.wdgt/Widget.css  |   5 ++
 RGB_Converter.wdgt/Widget.html |   8 ++-
 RGB_Converter.wdgt/Widget.js   | 115 ++++++++++++++-------------------
 3 files changed, 59 insertions(+), 69 deletions(-)

diff --git a/RGB_Converter.wdgt/Widget.css b/RGB_Converter.wdgt/Widget.css
index 85b9af5..b3307f8 100644
--- a/RGB_Converter.wdgt/Widget.css
+++ b/RGB_Converter.wdgt/Widget.css
@@ -44,6 +44,11 @@ body
 	width: 50px;
 }
 
+#swatch
+{
+
+}
+
 /* ################################################################### */
 /* Back */
 
diff --git a/RGB_Converter.wdgt/Widget.html b/RGB_Converter.wdgt/Widget.html
index 761b627..2a1c915 100644
--- a/RGB_Converter.wdgt/Widget.html
+++ b/RGB_Converter.wdgt/Widget.html
@@ -28,9 +28,11 @@
     <div id="front" onmousemove="mousemove(event);" onmouseout="mouseexit(event);">
 		<img src="Default.png" alt="" />
 		
-		<div id="redinput"><input type="text" name="redinput" id="redinputf" style="color: red" size="3" onkeyup="rgbwatcher('red')" /></div>
-		<div id="greeninput"><input type="text" name="greeninput" id="greeninputf" style="color: green" size="3" onkeydown="rgbwatcher('green')" /></div>
-		<div id="blueinput"><input type="text" name="blueinput" id="blueinputf" style="color: blue" size="3" onkeydown="rgbwatcher('blue')" /></div>
+		<div id="swatch"></div>
+		
+		<div id="redinput"><input type="text" name="redinput" id="redinputf" style="color: red" size="3" maxlength="3" onblur="rgbwatcher('red')" value="0" /></div>
+		<div id="greeninput"><input type="text" name="greeninput" id="greeninputf" style="color: green" size="3" maxlength="3" onblur="rgbwatcher('green')" value="0" /></div>
+		<div id="blueinput"><input type="text" name="blueinput" id="blueinputf" style="color: blue" size="3" maxlength="3" onblur="rgbwatcher('blue')" value="0" /></div>
 		
 		<div class="flip" id="fliprollie"></div>
 		<div class="flip" id="flip" onclick="show_back(event);" onmouseover="enterflip(event);" onmouseout="exitflip(event)";></div>
diff --git a/RGB_Converter.wdgt/Widget.js b/RGB_Converter.wdgt/Widget.js
index 7591682..526dc85 100644
--- a/RGB_Converter.wdgt/Widget.js
+++ b/RGB_Converter.wdgt/Widget.js
@@ -10,97 +10,80 @@
 \*=====================================================================*/
 
 var fields = {
-	red : '',
-	green : '',
-	blue : '',
+	red : 0,
+	green : 0,
+	blue : 0,
 	hex : ''
 };
 
+var lastinput = 'rgb';
+
 // ###################################################################
 // watches the three RGB fields to make sure they don't go over the limites
 function rgbwatcher(colour)
 {
-	keycode = event.keyCode;
 	field = document.getElementById(colour + "inputf");
 	
-	if ((keycode >= 48 && keycode <= 57) || (keycode >= 96 && keycode <= 105))
-	{
-		fields[colour] = intval(fields[colour].toString() + intval(fetch_keycode_val(keycode)));
-	}
-	// backspace
-	else if (keycode == 8)
+	// sanitize the number
+	var newval = field.value.replace(/[^0-9\-\.]*/g, "");
+	newval = Math.floor(newval);
+	
+	// make sure we don't go over 255
+	if (newval > 255)
 	{
-		fields[colour] = fields[colour].toString().substr(0, fields[colour].toString().length - 1);
-		field.value = fields[colour];
+		newval = 255;
 	}
-	else
+	else if (newval < 0)
 	{
-		//alert("bad key: " + keycode);
-		field.value = fields[colour];
+		newval = 0;
 	}
 	
-	//alert(window.event.keycode);
+	// update the text field
+	field.value = newval;
 	
+	// set fields[]
+	fields[colour] = newval;
 	
-	//alert(field.value);
+	// set hex
+	update_hex();
+	
+	// redraw the swatch
+	lastinput = 'rgb';
+	update_swatch();
 }
 
 // ###################################################################
-// fetches the integer value
-function intval(aval)
+// update the hex value
+function update_hex()
 {
-	return aval - 0;
+	var hexstr = dec2hex(fields['red']) + dec2hex(fields['green']) + dec2hex(fields['blue']);
+	fields['hex'] = hexstr;
 }
 
 // ###################################################################
-// lookup keycode
-function fetch_keycode_val(keycode)
+// update the colour swatch
+function update_swatch()
 {
-	switch (keycode)
-	{
-		case 48:
-		case 96:
-			val = 0;
-			break;
-		case 49:
-		case 97:
-			val = 1;
-			break;
-		case 50:
-		case 98:
-			val = 2;
-			break;
-		case 51:
-		case 99:
-			val = 3;
-			break;
-		case 52:
-		case 100:
-			val = 4;
-			break;
-		case 53:
-		case 101:
-			val = 5;
-			break;
-		case 54:
-		case 102:
-			val = 6;
-			break;
-		case 55:
-		case 103:
-			val = 7;
-			break;
-		case 56:
-		case 104:
-			val = 8;
-			break;
-		case 57:
-		case 105:
-			val = 9;
-			break;
-	}
 	
-	return val;
+}
+
+// ###################################################################
+// convert a decimal to a hexidecimal
+function dec2hex(dec)
+{
+	var hexstr = "0123456789ABCDEF";
+	var low = dec % 16;
+	var high = (dec - low) / 16;
+	hex = "" + hexstr.charAt(high) + hexstr.charAt(low);
+	
+	return hex.toString();
+}
+
+// ###################################################################
+// converts a hexidecimal to a decimal
+function hex2dec(hex)
+{
+	return parseInt(hex, 16);
 }
 
 // ###################################################################
-- 
2.22.5