Scriptaculous

Scriptaculous
Parte de la familia Java
librería Javascript
Creador	Thomas Fuchs
Última versión estable	1.9.0 del 23 de diciembre de 2010
Sistemas Operativos compatibles	multiplataforma
Idioma	Inglés, Francés, Alemán.
Licencia	MIT
Sitio web http://script.aculo.us

Scriptaculous es una librería javascript basada en Prototype que agrega efectos visuales dinámicos y una interfaz para elementos a través de DOM. Viene incluido en Seaside y Ruby on Rails. Permite implementar numerosas animaciones y efectos que hasta hace poco solo eran posibles con flash o una herramienta similar. Entre quienes usan Scriptaculous están: NASA, Apple, CNN, Basecamp y Feedburner.

Características

Provee una interfaz de usuario multiplataforma.
Es un add-on del framework Prototype (especialmente desarrollado para páginas web dinámicas).
Incluye efectos de animación, dra&drop (arrastrar y soltar elementos), controles AJAX, utilidades para el DOM y una unidad de testeo, para chequear que no haya errores.
Dispone 5 efectos visuales: Opacidad, Escalar, Mover Por, Resaltar y Paralelo. Combinándolos se obtienen 16 efectos adicionales, además, los desarrolladores pueden crear sus propios efectos. Habilitar un efecto implica asignar un elemento con un nombre de ID y una línea de código para tal fin.
Controles, ofrece elementos de interfaz de usuario, incluyendo:
- Autocompletion (Texto autocompletable. Se despliegan opciones intuitivamente).
- In Place Editing (Editar en el lugar).
- Drag And Drop (Arrastrar y soltar).
  - Draggables
  - Droppables
  - Sortables
  - Slider
Builder permite crear elementos del DOM dinámicamente.
Se basada en Ajax autocompletado, en el lugar de edición y barras de desplazamiento.
Scriptaculous es de código abierto, permitiendo contribuir a encontrar errores y solucionarlos.

Módulos

Efectos: permite añadir de forma muy sencilla efectos especiales a cualquier elemento de la página. La librería incluye una serie de efectos básicos y otros efectos complejos construidos con la combinación de esos efectos básicos. Entre los efectos prediseñados se encuentran el parpadeo, movimiento rápido, aparecer/desaparecer, aumentar/disminuir de tamaño, desplegarse, etc.
Controles: define varios controles que se pueden añadir directamente a cualquier aplicación web. Los tres controles que forman este módulo son:
- Arrastrar y soltar: que permite definir los elementos que se pueden arrastrar y las zonas en las que se pueden soltar elementos.
- Autocompletar: que permite definir un cuadro de texto en el que los valores que se escriben se autocompletan con ayuda del servidor.
- Editor de contenidos: que permite modificar los contenidos de cualquier página web añadiendo un sencillo editor AJAX en cada elemento.
Utilidades: la utilidad principal que incluye se llama builder, que se utiliza para crear fácilmente nodos y fragmentos complejos de DOM.

Requisitos e Instalación

Para poder utilizar esta librería solo tienes que añadir dos includes en tu HTML, uno a la página que contiene las funciones javascript, y otro a la hoja de estilo que quieras utilizar; además, como Scriptaculous viene acompañado de la librería Prototype, podrás convertir divs estáticos en ventanas con aspectos muy variados gracias a las hojas de estilo (CSS). Se copian todos los archivos Javascript en una carpeta y se insertan las siguientes líneas de código en la cabecera (head) de un documento HTML, estas líneas deben cargarse antes que cualquier solicitud Javascript de cualquier prototipo de función.

<script src="javascripts/prototype.js" type="text/javascript"></script>
<script src="javascripts/scriptaculous.js" type="text/javascript"></script>

El guión cargador scriptaculous.js se cargará automáticamente en las otras bibliotecas. Por defecto, scriptaculous.js carga todos los archivos JavaScript necesarios para otros efectos, de arrastrar y soltar, sliders, y todas las características. Si usted no necesita todas las características, puede limitar las secuencias de comandos adicionales que se cargan mediante la especificación de ellas en una lista separada por comas.

Efectos

Los efectos Scriptaculous se dividen en dos grupos:

Los efectos principales: Los siguientes seis efectos principales son la base de la librería Scriptaculous comandos Visual

Efectos Java. 
Effect.Opacity 
Effect.Scale 
Effect.Morph 
Effect.Move 
Effect.Highlight 
Effect.Parallel

Todos los efectos principales de apoyo diversos parámetros comunes, así como los parámetros de efectos específicos y estos nombres efecto entre mayúsculas y minúsculas.

Efectos de la combinación: Todos los efectos de la combinación se basan en los cinco efectos principales, y son considerados como ejemplos para que usted pueda escribir sus propios efectos. Por lo general, estos efectos se basan en el paralelo, la ejecución sincronizada de otros efectos. Debido a tal ejecución es fácilmente disponible, la creación de su propio efecto combinado es muy fácil. Aquí está una lista de los efectos combinados:

Effect.Appear 
Effect.Fade 
Effect.Puff 
Effect.DropOut 
Effect.Shake 
Effect.SwitchOff 
Effect.BlindDown 
Effect.BlindUp 
Effect.SlideDown 
Effect.SlideUp 
Effect.Pulsate 
Effect.Squish 
Effect.Fold 
Effect.Grow 
Effect.Shrink

Además, está el método de utilidad para Effect.toggle elementos que desea mostrar temporalmente con una Aparecer / Desvanecer, diapositiva o animación.

Effect.toggle

Para utilizar las funciones de los efectos de script.aculo.us, tendrá que cargar el módulo de efectos. Por lo tanto, la carga mínima de script.aculo.us se verá así:

<html> 
<head>
<title> script.aculo.us efectos </ title>
<script type="text/javascript"   src="/javascript/prototype.js">
</ Script>
<script    type="text/javascript"   src="/javascript/"effects.j">
</script>
</head> 
<body>
... 
</body>
</html>

La forma correcta de iniciar un efecto principal es por lo general con el nuevo operador. Dependiendo de sus preferencias, puede utilizar una de las dos sintaxis:

new Effect.EffectName(element [, requiredArgs ] [ , options ] )
                            O
element.visualEffect('EffectName'      [, requiredArgs ] [,options])

Estas dos sintaxis son técnicamente equivalentes.

Ventajas y Desventajas

Ventajas

No es flash, por lo que los contenidos de la página son fácilmente indexables por los robots de los buscadores.
No tener que aprender Flash para hacer cosas vistosas en la web.
Es gratuito.
Puede utilizar las librerías de JavaScript para sus interfaces solo haciendo llamadas a las librerías internas.
Permite implementar la funcionalidad de arrastrar y soltar, cambiar las propiedades de estilo de un elemento accediendo directamente a ellas desde javascript, y todo esto sin necesidad de recargar ni una sola vez la página completa, gracias a las funciones Ajax que también provee esta completísima librería.

Desventajas

La documentación es muy pobre. Tiene una wiki insuficiente en el sitio oficial.
El peso son unos 140 KB que hay que cargar por lo menos en la primera visita.

Acerca del autor

Thomas Fuchs nacido el 21 de octubre 1978 es el autor y mantenedor de Scriptaculous, una biblioteca JavaScript para la mejora de la interfaz web de usuario. Él era un miembro del equipo de desarrollo Ruby on Rails y ha colaborado en el desarrollo web ágil con Rails, un libro sobre Ruby on Rails, principalmente escrita por Dave Thomas y David Heinemeier Hansson.