color generator
by Leo
HTML
<script src="http://maps.google.com/maps/api/js?sensor=false&.js"></script>
<input type="button" value="generate color" onclick="generateRect();">
<div id="container" style="height:300px; width:300px; background-color: #FFEEFF;"></div>
JavaScript
window.registry = {};
$(document).ready(function() {
function _gen(quant)
{
return 'rgb(' + random(32, 250, quant).toString()+','
+ random(32, 250, quant).toString()+','
+ random(32, 250, quant).toString()+')';
}
function generateColor()
{
var ATTEPTS_COUNT = 10;
var quant = 64;
for(var i = 0; quant >= 16 && i < ATTEPTS_COUNT; i++)
{
color = _gen(quant);
if(!registry[color])
{
break;
}
if(i == ATTEPTS_COUNT - 1)
{
i = 0;
quant = Math.floor(quant / 2);
}
}
if(registry[color])
{
console.log('color ' + color + ' repeated');
}
registry[color] = color;
return color;
}
function random(min, max, quant)
{
var color = Math.floor((Math.random() * (max - min) + min) / quant) * quant;
color = Math.max(min, color);
color = Math.min(max, color);
return color;
}
window.generateRect = function generateRect() {
var container = document.getElementById('container');
var div = document.createElement('div');
div.style.width = '30px';
div.style.height = '30px';
var color = generateColor();
console.log(color);
div.style.backgroundColor = color;
div.style.float = 'left';
container.appendChild(div)
}
});