Formation Prototype et Scriptaculous

Présentation de Prototype

En quoi Prototype étend le langage Javascript ?
Comparaison de code avec et sans Prototype
Vue générale des classes
Installation de prototype.js

Création de classes avec Prototype

Héritage - Utilisation de superclass et subclasses
Utilisation du mot clé $super
Ajout dynamique de méthodes à une classe

Classes générales de Prototype

Chaînes de Caractères et Nombres (String, Number)
Gérer les dates et les heures (Date)
Gérer les collections avec la classe Enumerable
Manipuler les tableaux avec la classe Array
Principes et intérêts du hashage (classe Hash)
Intervalles avec la classe ObjectRange
Exécution périodique (PeriodicalExecuter)
La syntaxe concise et puissante des expressions régulières (RegExp)

Classe Function dans Prototype

Fonctionnement standard de la classe Function
Utilisation du mot clé this
Méthodes définies par prototype (bind, wrap, ...)

Classe Element, DOM et CSS

Rappels sur la gestion « classique » du DOM en javascript
En quoi Prototype facilite l'utilisation du DOM ?
Les apports de l'utilitaire $ et de l'objet Element
Mieux gérer les formulaires HTML avec $F et la collection de méthodes Form.Element
Création dynamique d'éléments HTML et texte
Méthodes d'insertion dans la page
Accès direct aux éléments de la page
Ajouter nos propres méthodes à la classe Element
Gestion des CSS avec Prototype
Classe Element.Layout

Gestion des événements avec Prototype

Gestion des événements sans Prototype
Apports de la Classe Event
Exemples d'utilisation (déplacement d'un élément dans la page, affichage d'un menu)
Classe Event.handler

Ajax et Prototype

L'objet XMLHttpRequest et les navigateurs
Valeur ajoutée de Prototype pour Ajax
Les classes Ajax.Request, Ajax.Updater et Ajax.PeriodicalUpdater

Effets visuels avec Scriptaculous

Aperçu général du framework Scriptaculous
Installation de Scriptaculous.js
Paramètres généraux des effets visuels
Etapes d'exécution d'un effet visuel
Synthèse des classes (Effect.Base, Effect.Event, Effet.Opacity, ...)
Les effets visuels standards (Fade, Appear, BlindUp, Shake, ...
Influence de l'option transition dans l'effet
Création d'un nouvel effet visuel (classe, fonction)

Auto-completion avec Scriptaculous

Compléter une zone de texte automatiquement grâce à scriptaculous
Utilisation de données locales (Autocompleter.Local)
Utilisation de données distantes depuis le serveur WEB (Ajax.Autocompleter)
Modifier le contenu d'un élément de type INPUT ou Textarea (Ajax.InPlaceEditor)
Réaliser des formulaires de données entièrement éditables (liste déroulante, select, Ajax.InPlaceCollectionEditor)

Complements (Drag & drop, Sliders)

Glisser, déposer des éléments HTML
Les Objets Droppables, Draggables, et Sortable
Récapitulatif des options les plus utilisées
Utiliser un slider (Control.Slider)