Paleta de colores con su valor hex?

[hieloverde]

Hola amigos,

La pregunta es. ¿Donde puedo conseguir algun codigo que me presente una paleta con todos los colores y que al darle clic se salga su valor?

Asi como sale el selector de colores en el dreamweaver, alguien sabe?

Creo que seria ver el codigo de cada color y hacer una tabla que en cada celda tenga un color y al darle clic se presente el valor, aunque se me hace muy latoso . No vayan a creer que me da flojera hacerlo yo mismo, lo que pasa es que se me ocurrio para hacer mas facil el trabajo de seleccion de colores.

Me parece averlo visto ya en algun sitio, pero no se como se generan todos los colores y que estos tengan orden por tono.

Ya saben que agradezco la orientacion que me puedan dar.


Saludos

[Mickel]

Mira esto:
http://javascript.internet.com/page-...lor-wheel.html

[hieloverde]

Si, gracias Mickel eso eso es a lo que me referia.

Ese selector de colores es super bueno

Saludos

[tunait]

Tema trasladado al foro de javascript desde (x)html

[Mickel]

el paso siguiente con ese selector es meterlo en un include, una clase o un control de usuario, ¿no?

[hieloverde]

Si, le diste. Lo que sigue es ponerlo en un include para que quede como utilitario, aunque estoy trabajandolo para que con un clic se fije un color y se pueda copiar a algun campo text el color que se ha seleccionado.

Esto por que, ya vez que al mover el puntero se pierde el color.

Quiza sea mejor ponerlo en un popup de unos 300 x 300 px, pero para copiar el color a otra vantana se podra?

Saludos

[Mickel]

¿estas haciendolo con PHP? Comparte el codigo pues...

Creo que tu idea es la mejor, hacer que el color se copie a un campo text y luego viaje el codigo en el post para usarlo. Quizas se podria hacer algo como para que solo un area de la pagina cambie...

Me cuentas...

[Mickel]

A ver amigo, hice esto. A ver que te parece:
http://www.mickel.biz/colorwheel.php

[hieloverde]

Mickel, te quedo bastante bien, vaya que no tuve ni tiempo de modificar el codigo del selector para cuando tu ya lo tenias hecho y empaquetado.

Felicidades amigo!

Bueno, quiero compartirte el porque de tener el selector de colores. Hace unos dias me vino a la mente la idea de dedicar una seccion en mi web que fuera de accesorios en formato incluible para todos los webmasters. Gratis por supuesto .

En este momento la seccion esta ya mas o menos visitable, el primer codigo es un selector de colores pero basico (de cuadritos) y pues si estas deacuerdo podriamos incluir tu selector de colores, este quedaria como avanzado, tu eres el autor de las mejoras. ¿Que te parece?

Esta es la seccion:

http://www.sahuaromex.com/accesorios_gratis.php

Y asi ir creando mas accesorios.

Saludos

PD: En serio que te quedo muy bien.

[Karlos135]

Buenas,

Andaba buscando un ejemplo de paleta de colores y este de mickel esta realmente bien, pero le veo un pequeño problema, ya que el 50 % de los internautas no lo pueden utilizar debido a que para firefox no funciona, lo he probado con Explorer y va perfectamente, pero Firefox no coge el color.

Yo utilizo Mozilla para navegar y he probado a cambiar opciones de seguridad de mozilla y ni con esas.

¿Que solución veis?, yo es que de PHP bien, pero JavaScript me pilla un poco mas verde.

Saludos

[Mickel]

Iniciado por hieloverde

Mickel, te quedo bastante bien, vaya que no tuve ni tiempo de modificar el codigo del selector para cuando tu ya lo tenias hecho y empaquetado.

Felicidades amigo!

Bueno, quiero compartirte el porque de tener el selector de colores. Hace unos dias me vino a la mente la idea de dedicar una seccion en mi web que fuera de accesorios en formato incluible para todos los webmasters. Gratis por supuesto .

En este momento la seccion esta ya mas o menos visitable, el primer codigo es un selector de colores pero basico (de cuadritos) y pues si estas deacuerdo podriamos incluir tu selector de colores, este quedaria como avanzado, tu eres el autor de las mejoras. ¿Que te parece?

Esta es la seccion:

http://www.sahuaromex.com/accesorios_gratis.php

Y asi ir creando mas accesorios.

Saludos

PD: En serio que te quedo muy bien.

Pues claro, hombre, incluyelo. En mi site debe haber algunas otras cosas que te sirvan tambien, como el ExtendedTextArea, el enviador de emails, el RecordViewer y alguna otra cosa que he puesto en el(http://www.mickel.biz por si no lo ves en la firma). Sientete en libertad de tomar lo que gustes y con un link a mi site me basta.

Ahorita entro a ver tu site...

[Mickel]

Iniciado por Karlos135

Buenas,

Andaba buscando un ejemplo de paleta de colores y este de mickel esta realmente bien, pero le veo un pequeño problema, ya que el 50 % de los internautas no lo pueden utilizar debido a que para firefox no funciona, lo he probado con Explorer y va perfectamente, pero Firefox no coge el color.

Yo utilizo Mozilla para navegar y he probado a cambiar opciones de seguridad de mozilla y ni con esas.

¿Que solución veis?, yo es que de PHP bien, pero JavaScript me pilla un poco mas verde.

El tema es en JS, no en PHP. Alli estamos usando los eventos onmousemove, on mousedown y el onclick. Dejame chequear si hay restricciones con ellos para Firefox...

[tunait]

Por lo que veo el código js que se usa es algo antíguo y contempla sólo NS4.x e IExplorer

[Mickel]

Alli si me vendria bien una manito, tunait. JS no lo manejo tan bien como me gustaria...

[tunait]

Voy a ver si lo puedo actualizar y te cuento

[hieloverde]

Gracias Mickel por el apoyo!

Bueno...La invitación para publicar accesorios para la Web esta abierta a todos los que deseen participar, se trata de reunir dichos accesorios en su formato descargable, para que cuando alguien los necesite pueda encontrarlos fácilmente y ahí mismo conocer el nombre del autor que lo realizo y un enlace si es que lo hay.

Saludos

[tunait]

Bueno pues el script queda así

Código:

<script type="text/javascript">
<!-- Original:  D10n ([email protected]) -->
<!-- Web Site:  http://www.iinet.net.au/~biab -->

<!-- This script and many more are available free online at -->
<!-- The JavaScript Source!! http://javascript.internet.com -->

<!-- Begin
addary = new Array();           //red
addary[0] = new Array(0,1,0);   //red green
addary[1] = new Array(-1,0,0);  //green
addary[2] = new Array(0,0,1);   //green blue
addary[3] = new Array(0,-1,0);  //blue
addary[4] = new Array(1,0,0);   //red blue
addary[5] = new Array(0,0,-1);  //red
addary[6] = new Array(255,1,1);
clrary = new Array(360);
for(i = 0; i < 6; i++)
for(j = 0; j < 60; j++) {
clrary[60 * i + j] = new Array(3);
for(k = 0; k < 3; k++) {
clrary[60 * i + j][k] = addary[6][k];
addary[6][k] += (addary[i][k] * 4);
   }
}
var tunIex=navigator.appName=="Microsoft Internet Explorer"?true:false;
if(tunIex && navigator.userAgent.indexOf('Opera')>=0){tunIex = false}
function capture() {
var layobj = document.getElementById("wheel");
if(!tunIex) {
layobj.addEventListener("mousemove", moved, false);
}
else {
layobj.onmousemove = moved;
   }
}
function moved(e) {
y = 4 * ((!tunIex)?e.layerX:event.offsetX);
x = 4 * ((!tunIex)?e.layerY:event.offsetY);
sx = x - 512;
sy = y - 512;
qx = (sx < 0)?0:1;
qy = (sy < 0)?0:1;
q = 2 * qy + qx;
quad = new Array(-180,360,180,0);
xa = Math.abs(sx);
ya = Math.abs(sy);
d = ya * 45 / xa;
if(ya > xa) d = 90 - (xa * 45 / ya);
deg = Math.floor(Math.abs(quad[q] - d));
n = 0;
sx = Math.abs(x - 512);
sy = Math.abs(y - 512);
r = Math.sqrt((sx * sx) + (sy * sy));
if(x == 512 & y == 512) {
c = "000000";
}
else {
for(i = 0; i < 3; i++) {
r2 = clrary[deg][i] * r / 256;
if(r > 256) r2 += Math.floor(r - 256);
if(r2 > 255) r2 = 255;
n = 256 * n + Math.floor(r2);
}
c = n.toString(16);
while(c.length < 6) c = "0" + c;
}
document.f.t.value = "#" + c;
document.getElementById("wheel").style.backgroundColor = "#" + c;
return false;
}
//  End -->
</script>

Si lo quieren probar a ver si me dejé algo pendiente ...

Un saludo

[Mickel]

Bueno, ya actualice tu JS con mi prueba de includes de PHP en http://www.mickel.biz/colorwheel.php , tunait, faltaria que la prueben en otros navegadores...

[Karlos135]

Buenas,

he probado el nuevo codigo JavaScript y sigue pasando lo mismo, con Explorer va perfectamente, pero con Mozilla, nada.
Si alguien lo prueba con netscape ya dira si funciona.

Saludos

[tunait]

Es extraño, anoche lo dejé funcionando en mozilla y firefox.

Lo que sí hoy lo he probado con Opera y no iba, veo que opera necesita funcionar con el código para explorer. Lo arreglé comentando una línea, así que también funciona en opera(8)

http://www.tunait.com/pruebas/paletacolores/paleta.html

[hieloverde]

Si tunait, probe el enlace que dejaste y si funciona en el firefox.

Pero tunait, cual es el codigo .js con las modificaciones que tu y mickel le hicieron.

Saludos.

[tunait]

Hola hieloverde,

Lo que hice fue copiar directamente el código original de http://javascript.internet.com/page-...lor-wheel.html y ponerlo todo dentro del mismo documento, y el mismo sobre el que realicé los cambios es el que colgué en el servidor.

[furoya]

Hola todos :

Iniciado por tunait

...el código js que se usa es algo antíguo ...

Yo agregaría algo más teniendo en cuenta que

Iniciado por hieloverde

...una paleta con todos los colores ...

Primero habría que ver cuántos son "todos los colores".
Si vamos a usar la paleta por nombres, varía con cada navegador.
Si vamos a usar la paleta básica (VGA) son 16.
Si vamos a usar la paleta pura son 64.
Si vamos a usar la paleta segura son más de 250.
Si vamos a usar el formato #RGB son más de 4000.
Si vamos a usar el formato #RRGGBB son más de 16.5 millones.
Y si vamos a usar el formato #AARRGGBB ... ni vale la pena hacer la cuenta.

El primer ejemplo no cubre "todos los colores" ni de casualidad.

Dejo un enlace que contiene una herramienta hecha por Caricatos ( Hola!). Mejor que una paleta, me parece un editor con botones deslizantes. Pero es mi opinión.

Todo sobre colores

saludos

furoya

[tunait]

Mickel y hieloverde,

¿por qué han quitado los créditos originales del autor del color wheel del código fuente?

[hieloverde]

Hola tunait ,

Ups... ya los créditos estan puestos en la ultima versión para descargar y tambien en la seccion donde se obtiene el paquete de color wheel mejorado.

Mira.
http://www.sahuaromex.com/accesorios_gratis.php


Un saludo

[tunait]

Óle

Un saludo

[Karlos135]

Hola Hielo Verde !!

En primer lugar felicitarte por la página, y en segundo lugar y haciendo referencia al color wheel mejorado, sigue sin funcionar en mozilla.

El link que dejo tunait

http://www.tunait.com/pruebas/paletacolores/paleta.html

Este link me funciono un dia, pero al siguiente ya no me funcionaba.

A ver si tunait lo incluye en su pagina cuando ya este acabado o puede pasar el codigo JS, para que funcione en ambos navegadores.

Saludos

[hieloverde]

Hola Karlos135,

El color wheel mejorado ya esta funcionando bien para fire fox, con todas las mejoras que se le han hecho.

La version compuesta con las mejoras de tunait, Mickel y unos detallitos de mi parte. Puedes bajarla de la pagina de los accesorios gratis.

Por cualquier cosa aqui la pongo de nuevo.

http://www.sahuaromex.com/accesorios_gratis.php

Pruebalo y comenta si te funciona o que defectos le encuentras.

Un saludo

[Karlos135]

Buenas, ya he conseguido que me funcione el codigo.

Muchas gracias.

(Eso si en los *.inc que te bajas de tu web(hieloverde), hay varios errores, primero en la pagina principal llamas a colorwheel.inc y el archivo es color_wheel.inc, pero los fallos mas significativos son en la pagina color_wheel.inc, ya que la linea del echo(".....") de abajo tiene como nombre de campo donde se va a quedar marcado el color: $campo, y en el echo("..") de arriba llamas a $campo con los puntos para concatenar cadenas, eso no funciona,lo mejor es poner como nombre campo sin el $ y en el echo de arriba quitar las comillas y punto de concatenacion de $campo y poner this.form.campo en las dos veces que aparece $campo, espero que lo mires y lo cambies en la web, ya que el ejemplo esta muy bien.)

Saludos

[hieloverde]

Bien hechas tus anotaciones Karlos135 ,

Ya han sido corregidos los problemas que mencionas, el error en la pagina y los errores en el archivo color_wheel.inc.

La idea original de Mickel, es que el campo de texto pueda nombrarse, para efectos de que pueda ser adaptable en cualquier formulario, esto se logra poniendo el nombre en $txtfield para que se propage de una sola vez en todo el codigo.

Reconozco que el error fue mio al malnombrar el campo de texto y el archivo que se incluye .

No esta de mas que lo pruebes para ver que ya todo funciona

Agradezco mucho tus observaciones ya que esto contribuye a un mejor funcionamiento del color wheel mejorado.

Saludos