Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 2 of 2
  1. #1
    Regular Coder djh101's Avatar
    Join Date
    May 2009
    Location
    California
    Posts
    626
    Thanks
    51
    Thanked 67 Times in 67 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 08:46 AM.
    "Yeah science!"

  • #2
    Regular Coder djh101's Avatar
    Join Date
    May 2009
    Location
    California
    Posts
    626
    Thanks
    51
    Thanked 67 Times in 67 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 02:55 AM.
    "Yeah science!"


  •  

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •