Jaws

He estado probando el sitio de un cliente con los diferentes Navegadores (Firefox, IE6, IE7, Safari y Opera) y para variar he tenido más de algún problema, ya saben con quien!!, claro!! con el Internet Explorer 7 y no se diga con la versión 6 del IE (todo un asco de navegador).

Bueno, la cosa esta en que quiero editar dinamicamente mediante Javascript el valor de la propiedad CLASS (clase en español jeje) y al utilizar la propiedad setAttribute('class',"NOMBRE_CLASE") en el Explorer nomas no se realiza el cambio y en los demas navegadores todo va de maravilla.

Ahora bien, después de investigar un poco he encontrado que el IE no soporta el atributo class y en lugar de eso utiliza uno llamado className.

Como he utilizado prototype para mayor compatibilidad solo es necesario poner el siguiente código:

La verdad esta muy fácil de entender, solo es cosa de agregar las librerías del prototype y usar la clausula del IF la cual nos indica si es Internet Exploder entonces se procede con el className y si es cualquier otro navegador decente se procede con el atributo class, asi de fácil.

He estado probando el sitio de un cliente con los diferentes Navegadores (Firefox, IE6, IE7, Safari y Opera) y para variar he tenido más de algún problema, ya saben con quien!!, claro!! con el Internet Explorer 7 y no se diga con la versión 6 del IE (todo un asco de navegador)

Bueno, la cosa esta en que quiero editar dinamicamente mediante Javascript el valor de la propiedad CLASS (clase en español jeje) y al utilizar la propiedad setAttribute('class',"NOMBRE_CLASE") en el Explorer nomas no se realiza el cambio y en los demas navegadores todo va de maravilla.

Ahora bien, después de investigar un poco he encontrado que el IE no soporta el atributo class y en lugar de eso utiliza uno llamado className.

Como he utilizado prototype para mayor compatibilidad solo es necesario poner el siguiente código:

La verdad esta muy fácil de entender, solo es cosa de agregar las librerías del prototype y usar la clausula del IF la cual nos indica si es Internet Exploder entonces se procede con el className y si es cualquier otro navegador decente se procede con el atributo class, asi de fácil.

Nuestro amigo TuXsOuL me mando unos cambios para que el hack Captcha Jaws funcione en safe_mode de PHP, aqui pueden descargar el nuevo archivo: JawsCaptcha-0.6.x-ver0.3.zip.

Si tienen problemas con el funcionamiento del Hack, me avisan!...

Ups!, no se me ocurrio otro nombre para el post!.., pero esa es la idea , que cuando escriban mayusculas o minusculas en el codigo del captcha este se valide de manera correcta!.., y porque asi?..., haaa, porque a veces da un poco de flojera activar el bloque de las mayusculas o escribir con shift solo para poner texto en MAYUSCULAS!.., asi que ahora ya se puede escribir indistintamente en MAYUS o en MINUSC. (no se si me di a entender!..., pero bueno., fue una inquietud que tenia cuando empece el hack y que tambien me la expreso Marko en los comentarios del hack pasado)

Así que ahi les va lo que deben de modificar:

En el archivo include/JawsCaptcha.php hay que buscar la funcion IsValid y en la parte donde dice:

Se debe de reemplazar por el siguiente código:

Facil no?...., que fue lo que hicimos, haaaa!, pues utilizamos la función de PHP llamada strtoupper que se encarga de convertir el texto a mayusculas, ya que cuando se genera el codigo captcha y se guarda en la base de datos codificado con MD5, este se guarda en mayusculas

Aquí les dejo la versión JawsCaptcha 0.2 para su descarga con los originales de la versión 0.1 y esta nueva, solo hay que descompactarlo en la carpeta include/

Lo prometido es deuda, así que ahi les va el manualito para ponerle algunos añadidos a nuestro captcha como:

• Uso de fuentes TTF, digo, para que se entienda el texto que es la idea principal
• Fuentes aleatorias, asi se pueden visualizar de manera diferente cada captcha
• Agregado de más colores en las lineas del fondo
• Agregado de pixeles en el fondo!, con muchos colores!..

Empecemos por lo primero!.., hacer un respaldo de los archivos a modificar, en este caso se trata del archivo include/JawsCaptcha/Image.php, en ese archivo se crea la imagen aleatoria.

Voy a empezar explicando algunas partes del código y al final les pongo ya como queda el archivo final!.., saz!.., así que manos a la obra!.., preparen su editor de textos favoritos y al ataque!..

Primero buscamos la función Build (esta aprox por la linea 29) y vamos a remplazar en donde dice imagecolorallocate por el siguiente código, se supone que esa función se encarga de crear la gama de colores especificado por los 3 ultimos parametros de esa función., el formato esta en RGB (Red, Green, Blue).

La idea básica es primero definir el arreglo color con los diferentes colores que utilizaremos en el pintado de las letras (tu puedes jugar y ponerle los colores que desees). Despues tenemos el arreglo colorPixel , si se fijan no pongo ningun indice en el arreglo, ya que podemos luego agregar más y más colores!.., mediante la función imagecolorallocate en formato RGB recurden!., haa y en Hexadecimal, por eso tiene 0x00 hasta el 0xFF

Ahora sigue definir las fuentes TTF que utilizaremos en el captcha en este caso vamos a definir 2 tipos de letras, una llama AhnbergHand.ttf y la otra FuturaBook.ttf

Esto es facil de entender, en el primer arreglo bidimencional ponemos el nombre de la fuente, tal y como la tenemos en el servidor, sin la extención TTF y en la segunda parte el tamaño de la fuente a utilizar, lo hice así porque me di cuenta que si ponia un tamaño fijo a veces no se veia bien la letra....

Ahora vamos a remplazar la parte del creado de las lineas de fondo, en el código van a encontrar algo así //Generate a funny background.. con un for abajito.., haa pues eso lo reemplazan por:

Si observan ahi estamos usando el arreglo colorPixel definido arriba..., con esto coloramos la lineas, asi ya no aparecen de color gris como antes!... y para que sea aleatorio el color tons tenemos la función rand

Y ahora sigue abajo de este for el siguiente código, este es para los pixeles de fondo!..

Ahora sigue la inicialización de las fuentes TTF, entonces abajo de

Ponemos lo siguiente:

La idea es primero verificar si el servidor tiene soporte para las fuentes TTF, si es negativo entonces utilizamos texto plano, tal y como esta actualmente el captcha (que por cierto no se entiende muy bien que digamos), pero si es positivo entonces inicializamos las fuentes definidas arriba en el arreglo myFonts y especificamos en donde estan posicionadas nuestras fuentes en el servidor (es lo del putenv GDFONTPATH)

Ahora sigue la parte en donde vamos a crear el texto, que es el For que esta abajo de todo esto...., antes del header, ahi remplazamos por:

Primero verificamos si esta activado el soporte para las fuentes TTF e imprimimos ya sea con soporte o sin soporte!.., y en el caso que se con soporte en la variable angl ahi especificamos cuantos grados queremos que gire el texto, por eso se tiene un random para que se vea más aleatorio todo el asunto.

Y listo!..., ya con esto tenemos un resultado más o menos como el que sigue:

Ahi se puede apreciar el resultado con las dos fuentes que les dije anteriormente!., ustedes son libres de poner las que más les agrade

Aquí pueden descargar el código fuente del Hack JawsCaptcha con las 2 tipografias., solo las copian en include/JawsCaptcha/ y en teoria debe de funcionar todo (esta en RAR para comprimirlo más)

[actualizado] Aquí les dejo el hack para que funcione el Captcha Jaws con Minusculas y/o Mayusculas (alta mente recomendado )

Despues de leer en el foro de Jaws un bug sobre Jaws relacionado con los privilegios del administrador del sitio he decidido actualizar mi Jaws y todos los sitios que utilizo Jaws a esta nueva versión 0.6.3

Y de pasada arregle el problema del texto feo en los captchas que a veces no se entendia ni madres...., la idea me basé del hack que realizo E-Corona llamdo Captchas II (a la e-Corona) solo que al parecer este hack es para las versiones 0.5 asi que lo tuve que modificar un poquitin para la nueva versiòn.., ahi luego les pongo los cambios que realice!...

Haa y les adelanto algunas nuevas caracteristicas..

• Uso de fuentes TTF, digo, para que se entienda el texto que es la idea principal
• Fuentes aleatorias, asi se pueden visualizar de manera diferente cada captcha
• Agregado de mas colores en las lineas del fondo
• Agregado de pixeles en el fondo!, con muchos colores!..

Por lo pronto con eso tiene para que se entienda un poco el texto para los humanos y no tanto para las computadoras!.

Solo eso faltaba tener SPAM en el sistema de bugs de Jaws!.. la verdad que esos spamers no perdonan nada!..., es más cuando quito lo de captcha de mi página en menos de 1 hora ya tengo mensajes con caracteres japoneces o una buena lista de medicinas extrañas! (supongo que ilegales) y yo se que a veces chafea el anti-spam que tengo aunque ya entendi que son caracteres en MAYUSCULAS y asi hay que ponerlos tal y como estan!.

Aquí les dejo un screenshot del mensaje que me llego a mi mail.

[phoo album="14" picture="419" title="spam_jawsbugs" class="imagen" size="2" border="0" align=""]

Ustedes como le hacen para no tener SPAM en los comentarios/chatbox de sus páginas?.., usan el anti-spam o se encomiendan a algun santo?.

Ya esta liberada la versión del PhooInsert para Jaws 0.6.1 con esta nueva versión espero que ya no tengan problemas con el widget HBox y otros más...,

Las instrucciones de instalación son faciles, solo descarga el archivo PhooInsert versión 0.5 descomprime los archivos en sus respectivas carpetas /gadgets/Phoo y /plugins/PhooInsert (claro! antes realiza tu respaldo de Phoo y si tienes algun otro hack dentro de esa carpeta tons no lo remplaces.., obvio no?..)

Ahora una vez copiado esos archivillos en el servidor sigue este manual grafico para instalar el Plugin y utilizarlo .., recuerda que es para la versión 0.6.1 pero igual te sirve para otras versiones.

Paso 1* Picale al boton Administración de componentes.

Paso 2* Picale donde dice plugins y despues donde dice Desinstalado y busca en la lista algo que diga PhooInsert y por ultimo donde dice instalar

Paso 3* Despues dale un click en Instalado, buscas otra ves el plugin PhooInsert y le picas en la opción Usar en (la que esta en medio) y marcas donde dice blog y guardar!..

Paso 4* Ahora te regresas al Panel de Control (le puedes picar arriba al lado del dibujo del Phoo) y te metes al gadget Blog

Paso 5* Te debe de aparecer al momento de escribir en tu blog un dibujo como el de la imagen (el que esta al lado de la carita), ahi le picas y te tiene que abrir una ventana (popup, para que cheques tu bloqueador de estos....), si por algo no te aparece este dibujo y te aparece otro menù, entonces tienes que cambiar la configuraciòn del editor, para esto te metes en Ajustes (el primer icono del panel de control) y despues donde dice Editor, seleccionas en el combo la opciòn El clasico editor de Jaws.

Paso 6* Una vez abierta la ventana vas a ver a la izquierda todooos tus albums y a la derecha las imagenes de dicho album!...

Paso 7* Entonces la idea es que selecciones una foto de la derecha para que cambie la ventana y despues puedas agregar la informaciòn..., te recuerdo que puedes ver las fotos de muchos albums a la vez.., solo presiona CTRL y dale click en los diferentes lugares de combo!...

Paso 8* Ahora si como les decia, aparecen las opciones de la imagen a mostrar.., ahi cambien los datos a su gusto!.. recuerden que tienen 2 tipos de vistas!.., la miniatura que es la que se ve en la introduccion de las fotos de tu album y la Mediana que es cuando uno se mete al album es la imagen que se le da!.. y bueno, falta la original pero eso para la proxima versión bueno, cuando acaben pues le pican Insertar esta imagen y la ventana se debe de cerrar.

**Paso 9* En el cuerpo de la entrada debe de aparecer un codigo como el de la imagen!..., con un poco de imaginaciòn podran decifrarlo!..., porfas no le muevan a nada!, ya que luego chafea todo!..aunque eso si!, pueden cambiar las propiedades de posiciòn (eso ya esta validado ) y listo!.., a disfrutar de su PhooInsert!..., haa, recuerden que cuando le piquen a la imagen del Blog los enviará directo a la foto de la galería.., ahi tambien seria bueno para la otra versiòn que los mande a la página que ustedes deseen , o que no mande a ningun lado.. tambien no???.

Bueno!, espero que lo disfruten!.., y recuerden que para la ayuda de la instalaciòn o problemas con este Hack y con otros!.., esta el Foro de los usuarios de Jaws

Listo!!.., ya contamos con una nueva versión para el plugin del PhooInsert el cual le he puesto versión 0.3 y que fue creado originalmente por Erik Corona

Algunas mejoras son:

• Soporte para etiquetas de Borde y Alineación, tal como lo pidio Relenes en el foro de Jaws
• No son obligatorias todas las etiquetas ni el orden de colocación.., las unicas obligatorias son Picture y Album, las demas son opcionales.
• Compatible con la nueva versión de JAWS 0.6

Descargar el PhooInsert0.3, adentro vienen las instrucciones y el codigo por si tiene algun otro hack en el gadget Phoo , disfrutenlo! y cualquier duda..., al foroooo

Existe una nueva versión para el Hack del PhooInsert en Jaws, ahora esta actualizado y funciona en la versiòn 0.6r3 ademas que se arreglo un bugcillo en el cual no funcionaba el plugin si se escribia el sitio con www o sin www... (gracias a ecorona).

Y que es este hack?.., mmh, facil facil.,.se trata de un plugin para que puedas agregar tus fotos de la galeria en tu blog de una manera facil y agradable, la cosa es que presionas el boton de fotos, luego aparecen tus galerias, seleccionas la foto, luego el tamaño y listo!..., se genera un codigo para luego desifrarlo y aparece tu foto con una liga a la galeria correspondiente.

Algo asì pueden ver como abre la ventana para agregar las fotos

[phoo album="14" picture="328" title="foto_phooinsert_ejemplo" class="imagen" size="2"]

Bueno a descargar el plugin hack ----> PhooInsert-JAWS0.6r3.zip

Ahi vienen las instrucciones, cualquier duda al foro de jaws

Ahora que esta la fiebre de los planetas porque no tener uno para Jaws, osease todos los blogeros que usen Jaws, no importa que versión...

La liga! pos ta facil.. planet.jaws-user.com, si usas Jaws y no apareces en la lista!, mandame un mail joviedo _at_arroba_dot_gmail_dot_com

Cualquier comentario sobre el Planeta Jaws en el foro!...