BlogESfera Directorio de Blogs Hispanos - Agrega tu Blog
Sitio certificado por
Adoos
ingyenes hirdetés
petites annonces gratuites
Buscador de blog
Neurona Rabiosa | Rompecabezas, Acertijos, Enigmas
Floggers vs Emos | Danos tu opinion al respecto

Un poco de Prototype.js - Parte 1

Fecha Agosto 1st, 2008  Categoria PHP, Prototype.js, Tutoriales

Prototype.js

Bueno, ya hace bastante que no escribo algun post medio decente y ya me estaban viniendo las ganas de hacer algo grande con Prototype, y es asi que hoy les traigo toda (o CASI toda) la info que tengo (yo) sobre este espectacular Framework, pero (SI, hay “peros”) la voy a traer divida en partes. Esta semana, un poco de ayuda para empezar en el tema, y un par de ejemplos. Espero sirva.

Entonces…

1 - Que es?

Prototype es una libreria (framework) javascript orientado al desarrollo de aplicaciones (y sitios) web, brindandonos facil y rapido acceso a las funciones de js, asi tambien como simplifica BASTANTE el acceso a las funciones de AJAX.

Descarga la ultima version haciendo click aqui (1.6.0.2)

A diferencia de Mootools o jQuery, Prototype no tiene soporte nativo para efectos graficos (como fades por ej.), si no que para este tipo de funcionalidades es que existe Script.aculo.us, una libreria especialmente creada para utilizarse con Prototype.


Descarga la ultima version de Script.aculo.us (1.8.1)

2 - Cheet sheet:

Las cheet sheet u hojas de trampa, son “pequeños documentos” que nos van tirando ajatos (tips) sobre lo que estamos trabajando. Aqu les dejo la de Prototype y la de Script.aculo.us:

Cheet sheet de Prototype

Cheet sheet de Script.aculo.us

3 - Scripteka:

Scripteka es un sitio-repositorio de extensiones para prototype, donde podemos encontrar desde Carouseles hasta Color pikers listos para funcionar. Asi tambien nos da la posibilidad de enviar nuestros propios scripts para que otros usuarios puedan descargarlos.
Scripteka

4 - Perfection Skills:

Perfection Skills es un blog dedicado exclusivamente a Prototype, dandonos las novedades sobre la libreria, nuevos codigos, ejemplos, etc.
Ellos fueron los desarrolladores de la Cheat Sheet de Prototype.
Perfection Skills

5 - LivePipe UI:

LivePipe UI es una semi-libreria que comprende un conjunto de controles desarrollados para extender y “embellecer” nuestras aplicaciones/sitios. Cuenta con tabs, editor WYSIWYG, selector multiple, scrollbars y varias cosas mas que nos seran utiles.
LivePipe UI

6 - Prototype UI:

Prototype UI es un pequeño proyecto de la gente de Xilinus.com, que pretende desarrollar controles (como los del LivePipe) para ser utilizados con Prototype. Por ahora solo cuentan con 2 codigos, pero cantidad no es calidad, puesto que ambos son bastantes utiles y estan muy buenos: Administrador de ventanas y un Carousel muy particular.
Prototype UI

_______________________________________________________

Aqui hacemos una pausa y cambiamos de tema, ahora vamos a ver scripts y articulos
que seguramente no seran de ayuda a la hora de desarrollar con Prototype.
_______________________________________________________

1 - Lightview:

Lightview es muchisimo mas que un simple lightbox, ya que nos da la posiblidad de emeber flash, hacer iframes, mandar contenido en linea y hasta incluir ajax. Su implementacion no es complicada. Lo recomeiendo bastante, yo ahora mismo lo estoy usando en varios proyectos.
Lightview

2 - Prototip:

Prototip es un script basado en Prototype que nos da la posibilidad de agregar tooltipboxs dinamicas en nuestras aplicaciones/sitios. Es posible customizar el estilo y la mayoria de las funcionalidades, lo que te deja un monton de alternativas para implementar.
Prototip

3 - Ribosomatic.com: Implementar Comet con Prototype y PHP:

Muy buen articulo que te explica con un ejemplo como crear una conexion persistente con prototype hacia el servidor, mediante Comet, que es el uso de Ajax de una forma invertida, dado que el cliente no llama al server si no que este llama al cliente. Espero les sirva, puesto que a mi me sirvio bastante ya.
Ribosomatic

4 - Protochart:

Protochart es una libreria que, mediante el uso de Prototype y Canvas, te permite crear graficos dinamicos los cuales siempre son utiles para mostrar estadiscticas en nuestra aplicacion/sitio:
Protochart

5 - Auto-scrolling Page:

Autoscrolling page es un script relativamente parecido al smooth scroll, pero esta basado en Prototype. Si no sabes nada sobre el smooth scroll, es un script que hace que en los links a anchors de la pagina, en vez de saltar hasta la posicion, el scroll se mueva automaticamente.
Auto-scrolling Page

5 - Fisheye con Prototype:

Fisheye con Prototype es un clasico menu del tipo dock como los de mac, pero basado en esta libreria. Bastante interesante para integrarlo a tu aplicacion/sitio.
Fisheye

6 - TabOrder:

TabOrder es una clase hecha en Prototype que genera tablas sorteables facilmente, muy util para aplicaciones mas qe para sitios web, donde tenemos esas tablas infinitas llenas de datos :P.
TabOrder

7 - Ajaxio:

Ajaxio es un control que trabaja sobre Prototype y Script.aculo.us y que nos da la posibilidad de crear cajas flotantes y de contenido editable. Pero lo mas importante de este script, es la posiblidad de resizear el tamaño de las cajas.
Ajaxio

8 - DateChooser:

DateChooser es un completo datepicker que no solo te devuelve la fecha que seleccionaste si no que te permite configurar con que formato lo hace.
DateChooser

9 - Phototype:

Phototype es un impresionante script de manipulacion de imagenes, que nos permite rotar, hacerla en escala de grises, agregarle sombras, agregarle texto, y hasta agregarle una marca de agua de Chuck Norris.
Phototype

10 - Tutorial de Prototype con Google Maps:

El articulo, a pesar de que esta en ingles, es basatante bueno, y nos da informacion detallada de como integrar Google Maps a nustras aplicaciones/sitio, mediante su API y Prototype.
Google Maps
_______________________________________________________

Para terminar esta primera entrega, les dejo un link a una pagina que tiene en descarga directa, un PDF con toda la documentacion de Prototype.

Prototype Documentation

La semana que viene mando mas de la info que pueda conseguir….

2 Comentarios to
“Un poco de Prototype.js - Parte 1”

dekpitado Dijo:

Vientos hijo, este post esta muy bueno ya que tiene buenas referencias para aquellos que estamos interesados en el manejo de estas 2 librerias…

Mariano Dijo:

Un golazo, felicitaciones.

Muy buena info.

Decime que opinas

Segun Twitter...
Twitter Veamos si esto funciona : http://tinyurl.com/rdhwp

Subscribite al Feed
RSS Feed Agregar a del.icio.us Agregar a Technorati Agregar a StumbleUpon Agregar a Digg
Geek Readers
Control del Blog

Ultimos Posts

Post Blog2iPhone.co... Post 10 Imagenes mo... Post Forma correcta... Post Humor: Lo que ... Post Justifico mi r... Post Humor para pro... Post Mi bloqueo a I... Post Clase PHP para... Post Jaxer RC 1.0 Post Que opinan sob...
Cronologia

2008 2007
Colabora con mis proyectos
1 Centavo hace la
diferencia
Proyectos

Proximamente!

Powered by
PHP xHTML Get Firefox
MySQL CSS Wordpress

Esta obra está licenciada bajo una
Licencia Creative Commons
Atribución-No Comercial 2.5 Argentina
Blog potenciado por
Wordpress & nBlak Studios

RSS | Legal | Contactar