Go Back   CodingForums.com > :: Client side development > Flash & ActionScript

Before you post, read our: Rules & Posting Guidelines

Reply
 
Thread Tools Rate Thread
Enjoy an ad free experience by logging in. Not a member yet? Register.
Old 10-07-2010, 12:57 AM   PM User | #1
djh101
Regular Coder

 
djh101's Avatar
 
Join Date: May 2009
Location: Santa Clarita
Posts: 603
Thanks: 48
Thanked 63 Times in 63 Posts
djh101 is an unknown quantity at this point
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; }
	
}
__________________
"Yeah science!"
Online Science Tools

Last edited by djh101; 10-07-2010 at 07:46 AM..
djh101 is offline   Reply With Quote
Old 10-07-2010, 01:50 AM   PM User | #2
djh101
Regular Coder

 
djh101's Avatar
 
Join Date: May 2009
Location: Santa Clarita
Posts: 603
Thanks: 48
Thanked 63 Times in 63 Posts
djh101 is an unknown quantity at this point
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();
}
__________________
"Yeah science!"
Online Science Tools

Last edited by djh101; 10-07-2010 at 01:55 AM..
djh101 is offline   Reply With Quote
Reply

Bookmarks

Jump To Top of Thread


Thread Tools
Rate This Thread
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

BB code is On
Smilies are On
[IMG] code is On
HTML code is Off

Forum Jump


All times are GMT +1. The time now is 03:02 PM.


Advertisement
Log in to turn off these ads.