OFF-Topic; Need some help from JavaScript expert coders!

[Zyxpsilon]

First, please have a quick look at the included "HTML" applet.
Color-Blender by Eric A. Meyer.

I'm trying to figure out what makes the Coll.Arrays load up the wrong RGB values for later processing.
#00,10,60,80...*A0,C0,E0* (what i want)..#FF instead of the silly 00,16,96,128... *159,191,223* (what it gives in both decimal & hexas to 9F,BF,DF)..255 flaw. A single bit off shoot for anything above midpoint conversions. mathRound? parsedIntegers?
It's a mathematical loop that's been puzzling me for over a week.

Thanks & lemme know what you could come up with for a definitive solution.

 

[The_J]

If it doesn't have anything to do with Civ5, then it shouldn't be in the Civ5 forums .
Moderator Action: Moved to computer talk.

 

[warpus]

Can you post the part of the code that's of interest here?

 

[Zyxpsilon]

PS; Thanks to The_J!

Sure...
I think the following Function might be looping some of the tricky values i'm trying to correct;

function cText(c) {
var result = '';
var d = 1;
if (colType == 'rgbp') {d = 2.55}
for (k = 0; k < 3; k++) {
val = Math.round(c[k]/d);
piece = val.toString(base);
if (colType == 'hex' && piece.length < 2) {piece = '0' + piece;}
if (colType == 'rgbp') {piece = piece + '%'};
if (colType != 'hex' && k < 2) {piece = piece + ',';}
result = result + piece;
}
if (colType == 'hex') {result = '#' + result.toUpperCase();}
else {result = 'rgb(' + result + ')';}
return result;
}

or, at the source when the mixer is trying to determine where such values must be dumped into some newColor Array;

function mixPalette() {
var steps = parseInt(document.getElementById('steps').value);
var count = steps + 1;
palette[0] = new Color(ends[0].r,ends[0].g,ends[0].b);
palette[count] = new Color(ends[1].r,ends[1].g,ends[1].b);
for (i = 1; i < count; i++) {
var r = (ends[0].r + (step[0] * i));
var g = (ends[0].g + (step[1] * i));
var b = (ends[0].b + (step[2] * i));
palette = new Color(r,g,b);
}
for (j = count + 1; j < 21; j++) {
palette[j].text = '';
palette[j].bg = 'white';
}
}

But, it's more complex than just these two since that or any code has to be seen in a global sense.

 

[warpus]

have you started debugging? any leads?

 

[Zyxpsilon]

That's no bug i guess but rather a tricky choice made by the original author.
I tried thinking this through but can't pinpoint at the specific instruction or values responsible... Thus, why i was asking for some insight by JavaScript coders or a math genius.
It's either the logic or some weird consequence of base-16 numbering when results must suffer through Integer resets.
Strangely, it only occurs for 128+ (what should be 144 is listed as 143, etc) rgb decimals.

 

[warpus]

well, it would help if you pointed out where exactly you got stuck. i am not going to sit and debug everything from scratch, i am far too lazy for that

 

[Zyxpsilon]

If i really could, don't you think i would have been somehow able to fix it all by myself as lazy as this thread might have looked to someone willing enough to actually help out?

So Warpus, what's *your* true expertise in basic JavaScript?

 

[warpus]

I work with javascript every single day.

 

[Zyxpsilon]

Alright, then... here's what i figured so far about this specific code;

The following two functions seem to define what values are transfered in the necessary but still temporary arrays. Since the basic colors are created with an rgb set by the mixer, the steps are dependant on the Midpoints choice made.

function stepCalc() {
var steps = parseInt(document.getElementById('steps').value) + 1;
step[0] = (ends[1].r - ends[0].r) / steps;
step[1] = (ends[1].g - ends[0].g) / steps;
step[2] = (ends[1].b - ends[0].b) / steps;
}

function mixPalette() {
var steps = parseInt(document.getElementById('steps').value);
var count = steps + 1;
palette[0] = new Color(ends[0].r,ends[0].g,ends[0].b);
palette[count] = new Color(ends[1].r,ends[1].g,ends[1].b);
for (i = 1; i < count; i++) {
var r = (ends[0].r + (step[0] * i));
var g = (ends[0].g + (step[1] * i));
var b = (ends[0].b + (step[2] * i));
palette = new Color(r,g,b);
}
for (j = count + 1; j < 21; j++) {
palette[j].text = '';
palette[j].bg = 'white';
}
}

So if i select 7 midpoints (with pure White in the first slot & pure Yellow in the second) i should get these results for RGB;

(255,255,224)
(255,255,192)
(255,255,160)
(255,255,128)
(255,255,96)
(255,255,64)
(255,255,32)

BUT i don't... as explained earlier.

 

[veyDer]

Is this what you were after?

function mixPalette() {
	var steps = parseInt(document.getElementById('steps').value);
	var count = steps + 1;
	palette[0] = new Color(ends[0].r,ends[0].g,ends[0].b);
	palette[count] = new Color(ends[1].r,ends[1].g,ends[1].b);
	for (i = 1; i < count; i++) {
		var r = (ends[0].r + [B]Math.ceil(step[0] * i)[/B]);
		var g = (ends[0].g + [B]Math.ceil(step[1] * i)[/B]);
		var b = (ends[0].b + [B]Math.ceil(step[2] * i)[/B]);
			palette[i] = new Color(r,g,b);
	}
	for (j = count + 1; j < 21; j++) {
		palette[j].text = '';
		palette[j].bg = 'white';
	}
}

 

[Zyxpsilon]

omg... **IT WORKS**!!!

Just by simply converting these integers upwards, three tiny biddy little methods_instructions inserted properly and my completely weird two_weeks_long_obsession with such a puzzling trick has been finally resolved. I knew there had to be a swift (and somehow easy) solution to this problem.
Thank you sooooo much veyDer -- i owe you one.
And, also to warpus for caring.

(And *now* i can return to some important MOD work on LeoPaRd DB & UI popups!)

Oh, and since i should "reveal" why i was soooooo concerned about such an issue.
-- As i was trying to create a reference palette of valid colors where optimal variety (in theory) could be selected from... the structure of known products (Win defaults, Visibone, WebSafe, Color-Wheels, WebSmart, CMYK models, etc) never really were accurate or logic enough for my purpose.
-- So i ended up designing the hexmap template below. Of which 256, 512 versions were done. (Now i can go on with a huge but valid 4096, probably!)
-- Some of these were pulled off the flawed Color-Blender applet process and many needed quick on-the-fly editing for Hexagons Fill.
-- If i had your precious solution before... it would have taken me minutes instead of hours to finish this up.