Enjoy an ad free experience by logging in. Not a member yet?
Register .
10-07-2010, 12:57 AM
PM User |
#1
Regular Coder
Join Date: May 2009
Location: Santa Clarita
Posts: 603
Thanks: 48
Thanked 63 Times in 63 Posts
Converting RGB to HSB
http://stupidgamestuff.com/colorchanger.swf
My color changer is almost perfect, the only problem is that I can't get it to correctly find the color and translate to HSB when the user inputs the RGB values directly into the text box. Anyone think they can maybe correct my formula?
Code:
function rgbtohsb(){
if(redV >= greenV && redV >= blueV){ foo = redV; clrhigh = 'red'}
else if(greenV >= blueV && greenV >= redV){ foo = greenV; clrhigh = 'green'}
else { foo = blueV; clrhigh = 'blue'}
if(redV <= greenV && redV <= blueV){ bar = redV; }
else if(greenV <= blueV && greenV <= redV){ bar = greenV; }
else { bar = blueV; }
brightnessV = Math.round(foo / 2.55);
saturationV = Math.round((255 - bar) / 2.55);
if(greenV == redV && redV == blueV){
hueV = 0;
} else if(greenV > redV && redV >= blueV){
hueV = Math.round(60 * (2 - (redV-blueV)/(greenV-blueV)));
} else if(blueV > redV && redV >= greenV){
hueV = Math.round(60 * (4 + (redV-greenV)/(blueV-greenV)));
} else if(blueV > greenV && greenV > redV){
hueV = Math.round(60 * (4 - (greenV-redV)/(blueV-redV)));
} else if(redV >= greenV && greenV >= blueV){
hueV = Math.round(60 * ((greenV-blueV)/(redV-blueV)));
} else if(redV >= blueV && blueV > greenV){
hueV = Math.round(60 * (6 - (blueV-greenV)/(redV/greenV)));
} else if(greenV >= blueV && blueV > greenV){
hueV = Math.round(60 * (2 + (blueV-redV)/(greenV/redV)));
} else {
hueV = 0;
}
if(hueV >= 360){ hueV = 360; }
if(hueV <= 0){ hueV = 0; }
}
Last edited by djh101; 10-07-2010 at 07:46 AM ..
10-07-2010, 01:50 AM
PM User |
#2
Regular Coder
Join Date: May 2009
Location: Santa Clarita
Posts: 603
Thanks: 48
Thanked 63 Times in 63 Posts
Okay, nevermind, the formula is fine, but for some reason the hue doesn't change when I input RGB values. Here's the full code just in case anyone wants to read through it. I'll resolve this if I find the problem myself, though, it shouldn't be too hard to find.
Code:
stop();
var hueV = 0, saturationV = 0, brightnessV = 0;
var redV = 0, greenV = 0, blueV = 0;
var redV2 = 255, greenV2 = 0, blueV2 = 0;
var hexV, hexV2, hexRGB, hexRGB2;
var hsbchange = false, rgbchange = false;
var a,b,c,d,e,f;
var a1,b1,c1,d1,e1,f1,a2,b2,c2,d2,e2,f2,a3,b3,c3,d3,e3,f3;
var foo,bar,moobar,fb3,clrhigh,clrmed,clrlow;
var hueBox,satBox,brightBox,redBox,greenBox,blueBox,hexBox;
function hexconvert1(x1){
return x1.toString(16).toUpperCase();
}
function rgbtohex(){
a1 = Math.floor(redV / 16);
a = hexconvert1(a1);
b1 = redV % 16;
b = hexconvert1(b1);
c1 = Math.floor(greenV / 16);
c = hexconvert1(c1);
d1 = greenV % 16;
d = hexconvert1(d1);
e1 = Math.floor(blueV / 16);
e = hexconvert1(e1);
f1 = blueV % 16;
f = hexconvert1(f1);
a3 = Math.floor(redV2 / 16);
a2 = hexconvert1(a3);
b3 = redV2 % 16;
b2 = hexconvert1(b3);
c3 = Math.floor(greenV2 / 16);
c2 = hexconvert1(c3);
d3 = greenV2 % 16;
d2 = hexconvert1(d3);
e3 = Math.floor(blueV2 / 16);
e2 = hexconvert1(e3);
f3 = blueV2 % 16;
f2 = hexconvert1(f3);
}
function rgbtohsb(){
if(redV >= greenV && redV >= blueV){ foo = redV; clrhigh = 'red'}
else if(greenV >= blueV && greenV >= redV){ foo = greenV; clrhigh = 'green'}
else { foo = blueV; clrhigh = 'blue'}
if(redV <= greenV && redV <= blueV){ bar = redV; }
else if(greenV <= blueV && greenV <= redV){ bar = greenV; }
else { bar = blueV; }
if((redV <= greenV && redV >= blueV) || (redV >= greenV && redV <= blueV)){
moobar = redV; clrmed = 'red';
} else if((greenV <= redV && greenV >= blueV) || (greenV >= redV && greenV <= blueV)){
moobar = greenV; clrhigh = 'green';
} else {
moobar = blueV; clrhigh = 'blue';
}
brightnessV = Math.round(foo / 2.55);
saturationV = Math.round((255 - (bar / (brightnessV / 100))) / 2.55);
if(clrhigh == 'red'){
if(clrmed == 'green'){
hueV = 0 + (60 * ((moobar * (brightnessV / 100)) / 255));
} else if(clrmed == 'blue'){
hueV = 360 - (60 * ((moobar * (brightnessV / 100)) / 255));
}
} else if(clrhigh == 'green'){
if(clrmed == 'blue'){
hueV = 120 + (60 * ((moobar * (brightnessV / 100)) / 255));
} else if(clrmed == 'red'){
hueV = 120 - (60 * ((moobar * (brightnessV / 100)) / 255));
}
} else if(clrhigh == 'blue'){
if(clrmed == 'red'){
hueV = 240 + (60 * ((moobar * (brightnessV / 100)) / 255));
} else if(clrmed == 'green'){
hueV = 240 - (60 * ((moobar * (brightnessV / 100)) / 255));
}
}
/*if(greenV == redV && redV == blueV){
hueV = 0;
} else if(greenV > redV && redV >= blueV){
hueV = Math.round(60 * (2 - (redV-blueV)/(greenV-blueV)));
} else if(blueV > redV && redV >= greenV){
hueV = Math.round(60 * (4 + (redV-greenV)/(blueV-greenV)));
} else if(blueV > greenV && greenV > redV){
hueV = Math.round(60 * (4 - (greenV-redV)/(blueV-redV)));
} else if(redV >= greenV && greenV >= blueV){
hueV = Math.round(60 * ((greenV-blueV)/(redV-blueV)));
} else if(redV >= blueV && blueV > greenV){
hueV = Math.round(60 * (6 - (blueV-greenV)/(redV/greenV)));
} else if(greenV >= blueV && blueV > greenV){
hueV = Math.round(60 * (2 + (blueV-redV)/(greenV/redV)));
} else {
hueV = 0;
}*/
}
function hsbfunc(){
var hue6 = hueV / 60;
//RED
if (hue6 > 4 && hue6 < 5){
redV = 255 * (hue6 - 4);
redV2 = Math.round(255 * (hue6 - 4));
} else if (hue6 > 1 && hue6 < 2){
redV = 255 - (255 * (hue6 - 1));
redV2 = Math.round(255 - (255 * (hue6 - 1)));
} else if (hue6 >= 5 || hue6 <= 1){
redV = 255; redV2 = 255;
} else {
redV = 0; redV2 = 0;
}
redV = Math.round(brightnessV/100 * (redV + ((255 - redV) * ((100 - saturationV) / 100))));
//GREEN
if (hue6 > 0 && hue6 < 1){
greenV = 255 * (hue6 - 0);
greenV2 = Math.round(255 * (hue6 - 0));
} else if (hue6 > 3 && hue6 < 4){
greenV = 255 - (255 * (hue6 - 3));
greenV2 = Math.round(255 - (255 * (hue6 - 3)));
} else if (hue6 >= 1 && hue6 <= 3){
greenV = 255; greenV2 = 255;
} else {
greenV = 0; greenV2 = 0;
}
greenV = Math.round(brightnessV/100 * (greenV + ((255 - greenV) * ((100 - saturationV) / 100))));
//BLUE
if (hue6 > 2 && hue6 < 3){
blueV = 255 * (hue6 - 2);
blueV2 = Math.round(255 * (hue6 - 2));
} else if (hue6 > 5 && hue6 < 6){
blueV = 255 - (255 * (hue6 - 5));
blueV2 = Math.round(255 - (255 * (hue6 - 5)));
} else if (hue6 >= 3 && hue6 <= 5){
blueV = 255; blueV2 = 255;
} else {
blueV = 0; blueV2 = 0;
}
blueV = Math.round(brightnessV/100 * (blueV + ((255 - blueV) * ((100 - saturationV) / 100))));
}
var mouseDownVar;
stage.addEventListener(MouseEvent.MOUSE_DOWN, mouseDownFunction);
stage.addEventListener(MouseEvent.MOUSE_UP, mouseUpFunction);
function mouseDownFunction(e:MouseEvent):void {
addEventListener(MouseEvent.MOUSE_UP, mouseUpFunction);
mouseDownVar = true;
} function mouseUpFunction(e:MouseEvent):void {
removeEventListener(MouseEvent.MOUSE_UP, mouseUpFunction);
mouseDownVar = false;
}
var enterDownVar;
stage.addEventListener(KeyboardEvent.KEY_DOWN, enterDownFunction);
stage.addEventListener(KeyboardEvent.KEY_UP, enterUpFunction);
function enterDownFunction(e:KeyboardEvent):void {
if (e.keyCode == 13 || e.keyCode == 9) {
addEventListener(KeyboardEvent.KEY_UP, enterUpFunction);
enterDownVar = true;
}
} function enterUpFunction(e:KeyboardEvent):void {
removeEventListener(KeyboardEvent.KEY_UP, enterUpFunction);
enterDownVar = false;
}
addEventListener(Event.ENTER_FRAME,enterFrameFunction);
function enterFrameFunction(event:Event) {
if((mouseDownVar == true || enterDownVar == true) && hsbchange == false){ //INPUT TEXT INTO TEXT BOXES
if(hueV != hueTB.text){
hueV = hueTB.text;
if(hueV >= 360){ hueV = 360; }
if(hueV <= 0){ hueV = 0; }
hsbchange = true;
} if(saturationV != saturationTB.text){
saturationV = saturationTB.text;
if(saturationV >= 100){ saturationV = 100; }
if(saturationV <= 0){ saturationV = 0; }
hsbchange = true;
} if(brightnessV != brightnessTB.text){
brightnessV = brightnessTB.text;
if(brightnessV >= 100){ brightnessV = 100; }
if(brightnessV <= 0){ brightnessV = 0; }
hsbchange = true;
} if(redV != redTB.text){
redV = redTB.text;
if(redV >= 255){ redV = 255; }
if(redV <= 0){ redV = 0; }
rgbchange = true;
} if(greenV != greenTB.text){
greenV = greenTB.text;
if(greenV >= 255){ greenV = 255; }
if(greenV <= 0){ greenV = 0; }
rgbchange = true;
} if(blueV != blueTB.text){
blueV = blueTB.text;
if(blueV >= 255){ blueV = 255; }
if(blueV <= 0){ blueV = 0; }
rgbchange = true;
} if(hexV != hexTB.text){
hexV = hexTB.text;
if(hexV >= 100){ hexV = 100; }
if(hexV <= 0){ hexV = 0; }
hexTB.text = hexV;
rgbchange = true;
}
}
var huechange = 255 * ((hueV % 60) / 60);
if(rgbchange == true){
rgbtohsb();
hsbfunc();
hsbchange = false;
rgbchange = false;
}
if(hsbchange == true){
hsbfunc();
hsbchange = false;
}
hsbchange = false;
rgbchange = false;
rgbtohex();
hexV = a+b+c+d+e+f;
hexV2 = a2+b2+c2+d2+e2+f2;
hexRGB = "0x"+hexV;
if(hueBox != hueV){
hueBox = hueV; hueTB.text = hueBox;
} if(satBox != saturationV){
satBox = saturationV; saturationTB.text = saturationV;
} if(brightBox != brightnessV){
brightBox = brightnessV; brightnessTB.text = brightBox;
} if(redBox != redV){
redBox = redV; redTB.text = redBox;
} if(greenBox != greenV){
greenBox = greenV; greenTB.text = greenBox;
} if(blueBox != blueV){
blueBox = blueV; blueTB.text = blueBox;
} if(hexBox != hexV){
hexBox = hexV; hexTB.text = hexBox;
}
}
sgsbtn.addEventListener(MouseEvent.CLICK, myButtonFunction);
function myButtonFunction(event: MouseEvent) {
var request:URLRequest = new URLRequest("http://stupidgamestuff.com");
navigateToURL(request, "_blank");
}
colorcursor.x = 25;
colorcursor.y = 349;
var colordrag = false;
colorcursor.addEventListener(Event.ENTER_FRAME,enterFrameColor);
function enterFrameColor(event:Event) {
if(colordrag == true){
saturationV = Math.round(100 * ((colorcursor.x - 25) / 249));
brightnessV = 100 - Math.round(100 * ((colorcursor.y - 100) / 249));
hsbchange = true;
} else {
colorcursor.x = 25 + Math.round(249 * (saturationV / 100));
colorcursor.y = 100 + Math.round(249 - (249 * (brightnessV / 100)));
}
}
sbbtn.addEventListener(MouseEvent.MOUSE_DOWN, sbbtnPress);
sbbtn.addEventListener(MouseEvent.MOUSE_UP, sbbtnRelease);
function sbbtnPress(e:MouseEvent):void {
sbbtn.parent.stage.addEventListener(MouseEvent.MOUSE_UP, sbbtnRelease);
colordrag = true;
colorcursor.startDrag(true,new Rectangle(25, 100, 249, 249));
}
function sbbtnRelease(e:MouseEvent):void {
sbbtn.parent.stage.removeEventListener(MouseEvent.MOUSE_UP, sbbtnRelease);
if (e.currentTarget != sbbtn) {
colordrag = false;
colorcursor.stopDrag();
} else {
colordrag = false;
colorcursor.stopDrag();
}
}
huecursor.x = 298;
huecursor.y = 349;
var huedrag = false;
huecursor.addEventListener(Event.ENTER_FRAME,hueFrameFunction);
function hueFrameFunction(event:Event) {
if(huedrag == true){
hueV = 360 - Math.round(360 * ((huecursor.y - 100) / 249));
hsbchange = true;
} else {
huecursor.y = Math.round(349 - (249 * (hueV / 360)));
}
}
huebtn.addEventListener(MouseEvent.MOUSE_DOWN, huebtnPress);
huebtn.addEventListener(MouseEvent.MOUSE_UP, huebtnRelease);
function huebtnPress(e:MouseEvent):void {
huebtn.parent.stage.addEventListener(MouseEvent.MOUSE_UP, huebtnRelease);
huedrag = true;
huecursor.startDrag(true,new Rectangle(298, 100, 0, 249));
}
function huebtnRelease(e:MouseEvent):void {
huebtn.parent.stage.removeEventListener(MouseEvent.MOUSE_UP, huebtnRelease);
if (e.currentTarget != huebtn) {
huedrag = false;
huecursor.stopDrag();
} else {
huedrag = false;
huecursor.stopDrag();
}
}
//startDrag(huecursor,true,-2,0,-2,249);
var myColor:ColorTransform;
updateBackColor();
function updateBackColor():void {
myColor=new ColorTransform(0,0,0,1,redV2,greenV2,blueV2,0);
backcolor.transform.colorTransform = myColor;
}
addEventListener(Event.ENTER_FRAME,enterColor3);
function enterColor3(event:Event) {
updateBackColor();
}
var myColor2:ColorTransform;
updateSwatch();
function updateSwatch():void {
myColor2=new ColorTransform(0,0,0,1,redV,greenV,blueV,0);
swatch.transform.colorTransform = myColor2;
}
addEventListener(Event.ENTER_FRAME,enterColor3b);
function enterColor3b(event:Event) {
updateSwatch();
}
Last edited by djh101; 10-07-2010 at 01:55 AM ..
Jump To Top of Thread
Thread Tools
Rate This Thread
Posting Rules
You may not post new threads
You may not post replies
You may not post attachments
You may not edit your posts
HTML code is Off
All times are GMT +1. The time now is 03:02 PM .
Advertisement
Log in to turn off these ads.