windows-style GUI

[joeframbach]

im trying to make an interactive menu that works with the alt button, just like the one up there *points*

http://www.geocities.com/joeframbach/menu.html

line 26:
//item.style.background-color=item.style.background-color==selected?unselected:selected

i commented that line out because it causes errors. why does it err???:mad: i can't figure it out.

[liorean]

Because the JavaScript equivalents use camelCase instead of hyphenation.

item.style.backgroundColor=item.style.backgroundColor==selected?unselected:selected;

Remember that css values are not always given in their original form - earlier mozilla's always output colours in rgb(r,g,b); notation, for example.

[joeframbach]

can i test the format then convert to hex if need be?

[liorean]

Yes you can.

function getHex(val){
var
re=[
/\rgb\(\s*(\d)+\s*,\s*(\d)+\s*,\s*(\d)+\s*\)/i,
/#([0-9a-f]{1,2})([0-9a-f]{1,2})([0-9a-f]{1,2}))/i
],
result,
i=2;
if(re[0].test(val)){
result=re[0].exec(val);
result=[
parseInt(result[1]).toString(16),
parseInt(result[2]).toString(16),
parseInt(result[3]).toString(16)
];
do
result[i]=result[i].length!=2?'0'+result[i]:result[0];
while(0<--i);
result='#'+result.join('');
}
if(re[1].test(val)){
result=re[1].exec(val);
result=[
result[1],
result[2],
result[3]
];
do
result[i]=result[i].length!=2?result[i]+result[i]:result[0];
while(0<--i);
result='#'+result.join('');
}
return result;
}

This way, you'll get the string in #rrggbb form no matter whether it's originally specified in rgb(r,g,b), #rgb or #rrggbb form. It doesn't do rgb(r%,g%,b%), system names or colour names, though.

[joeframbach]

thats fine. most browsers parse it in #rrggbb, so i dont have to worry about weird names, right?

[liorean]

Well, mozilla and mozilla-based browsers such as Netscape6/7, Galeon, Chimera/Camino, Phoenix and others will return rgb notation. The rest should return either what's specified in the stylesheet or using #rrggbb notation.

[joeframbach]

in the regexp, can i change
/#([0-9a-f]{1,2})([0-9a-f]{1,2})([0-9a-f]{1,2}))/i

to

/#([0-9a-f]{6})/i
right?
itll still work?

[liorean]

No, it won't. I used that longer regex to capture either #rgb or #rrggbb. You can change the code to be more efficient, however, by changing the regex into this:/#([0-9a-f]{6}|[0-9a-f]{3})/iand the second conditional into this: if(re[1].test(val)){
result=re[1].exec(val)[1];
if(result.length==3)
result=result.replace(/./g,'$1$1');
result='#'+result;
}

[beetle]

These will always return hexString.prototype.colorToHex = function()
{
if ( /rgb/.test( this ) )
return this.match( /\((.+)\)/ )[1].rbgToHex();
if ( this.length <= 4 )
return this.replace( /#?([a-z0-9])([a-z0-9])([a-z0-9])/i, "#$1$1$2$2$3$3" );
return this.replace( /#?(.+)/, "#$1" );
}

String.prototype.rbgToHex = function()
{
var colors = this.split(',');
for ( var rgb, i = 0; ( rgb = colors[i] ); i++ )
colors[i] = parseInt( rgb ).toString( 16 ).toUpperCase().leadingZeros( 1, 2 );
return "#" + colors.join('');
}

[liorean]

Gotta' admit it - you did it much cleaner.

You forgot the leadingZeros function, though. (Shouldn't that be more gramatically correct as leadingZeroes?)

[beetle]

Oops, sorry, forgot to c&p that :rolleyes:
String.prototype.leadingZeros = function( qty, totalPlaces )
{
var s = this;
if ( this.length + qty > totalPlaces ) return s;
for ( var i=0; i<qty; i++ )
s = "0" + s;
return s;
}And yes, should be Zeroes :D

[liorean]

Well, you bested me before - so let me improve your code a little, just to bring my selfconfidence back on top for a bit :-)
String.prototype.leadingZeroes=function(toLength){
var
s=this;
toLength-=s.length;
while(toLength-->0)
s='0'+s;
return s;
}What was the meaning of qty there? As long as you knew how long the target string should be, it wasn't necessary.

[beetle]

Originally posted by liorean
Well, you bested me before - so let me improve your code a little, just to bring my selfconfidence back on top for a bit :-) Haha. What can I say, It's an old method :p