Visualisation d'une page Webjax
Scriptaculous (description du fichier controls.js)
Le fichier "control.js" définit des contrôles d'interfaces.
Ces contrôles d'interface permettent par exemple de créer des listes dites "autocompletion" ou en français de "recherche intuitive", mais aussi de définir les bases d'interfaces fonctionnant sur des mises à jour dites dans Scritpaculous "inPlace" ou en français "en place, dans la page".
Le contenu du fichier "controls.js" est détaillé après afin de permettre une prise de connaissance globale de ce fichier.
!!! :: attention, ce fichier ne peut être utilisé sans le fichier "effects.js" qui permet de définir les effets à appliquer, par exemple
pour les zones DOM retournées par les "Autocompleter".
Les différents contrôlés définis
Ce point liste les différents contrôles d'interface définis par ce fichier.
Classe / Objet
Description
AutoCompleter
Objet vide par défaut destiné à contenir l'ensemble des Autocompleter définis dans le fichier.
AutoCompleter.Base
Objet de base permettant d'effectuer des traitements dits "autocompletion".
Ajax.AutoCompleter
Objet qui étend donc Ajax.AutoCompleter de base en ajoutant les fonctionnalités de gestion
de la requête AJAX utilisée pour ramener la zone ou le contenu de zone à afficher.
AutoCompleter.Local
Dans le cas d'interfaces chargées en premier chargement, il est intéressant d'envisager un fonctionnement
"d'autocompletion" en local.
C'est la fonctionnalité que permet cet objet.
Ajax.inPlaceEditor
Objet permettant l'édition en place de champs de saisie.
Cet objet permet de gérer uniquement
les champs de saisie de type 'input' ou 'textarea'.
La mise à jour de champs 'select' est permise
par l'objet suivant dans ce tableau Ajax.inPlaceCollectionEditor
Ajax.inPlaceCollectionEditor
Objet qui permet l'édition en place de listes déroulantes ou champ 'select'.
Cet objet hérite de Ajax.inPlaceEditor .
La suite de ce document permet l'analyse des objets/classes définis dans le fichier 'control.js'.
( ligne 42 à ligne 330) AutoCompleter et AutoCompleter.Base
Ce point présente le détail de l'objet Autocompleter et implicitement de son
objet Autocompleter.Base .
Les méthodes de cet objet sont listées dans le tableau ci après :
Méthode
Type
Arguments
Détails
baseInitialize (element , update , options )
Function
element : élément DOM
update : élément DOM
options : objet d'options
08/01/2007 :: mise à jour à faire
show ()
Function
aucun argument.
08/01/2007 :: mise à jour à faire
fixIEOverlapping ()
Function
aucun argument.
08/01/2007 :: mise à jour à faire
hide ()
Function
aucun argument.
08/01/2007 :: mise à jour à faire
startIndicator ( )
Function
aucun argument.
08/01/2007 :: mise à jour à faire
stopIndicator ( )
Function
aucun argument.
08/01/2007 :: mise à jour à faire
onKeyPress (event)
Function
event : évènement
08/01/2007 :: mise à jour à faire
activate ()
Function
aucun argument.
08/01/2007 :: mise à jour à faire
onHover (event)
Function
event : évènement
08/01/2007 :: mise à jour à faire
onClick (event)
Function
event : évènement
08/01/2007 :: mise à jour à faire
onBlur (event)
Function
event : évènement
08/01/2007 :: mise à jour à faire
render ( )
Function
aucun argument.
08/01/2007 :: mise à jour à faire
markPrevious ( )
Function
aucun argument.
08/01/2007 :: mise à jour à faire
markNext ( )
Function
aucun argument.
08/01/2007 :: mise à jour à faire
getEntry ( index )
Function
index : valeur numérique
08/01/2007 :: mise à jour à faire
getCurrentEntry ( )
Function
aucun argument.
08/01/2007 :: mise à jour à faire
selectEntry ( )
Function
aucun argument.
08/01/2007 :: mise à jour à faire
updateElement ( elementSelectionne )
Function
elementSelectionne :
08/01/2007 :: mise à jour à faire
updateChoices ( choix )
Function
choix : chaine HTML à priori
08/01/2007 :: mise à jour à faire
addObservers (event)
Function
event : évènement
08/01/2007 :: mise à jour à faire
onObserverEvent ( )
Function
aucun argument.
08/01/2007 :: mise à jour à faire
getToken ( )
Function
aucun argument.
08/01/2007 :: mise à jour à faire
findLastToken ( )
Function
aucun argument.
08/01/2007 :: mise à jour à faire
( ligne 332 à ligne 359) Ajax.Autocompleter
Ce point présente le détail de l'objet Ajax.Autocompleter qui hérite de
Autocompleter.Base .
Les méthodes de cet objet sont listées dans le tableau ci après :
Méthode
Type
Arguments
Détails
getUpdatedChoices ( )
Function
aucun argument.
Méthode qui permet de lancer la requête Ajax.Request permettant d'obtenir le contenu
mis à jour des choix de la recherche.
Cette méthode utilise Autocompleter.Base.updateChoices(htmlContenu) pour mettre à jour
les choix.
( ligne 396 à ligne 455) AutoCompleter.Local
Ce point présente le détail de l'objet Autocompleter.Local qui permet de gérer le concept de
'autocompletion' ou 'rechercher intuitive' sans utiliser de requêtes HTTP/AJAX.
Méthode
Type
Arguments
Détails
initialize (element,update,array,options)
Function
aucun argument.
08/01/2007 :: mise à jour à faire
getUpdatedChoices ( )
Function
aucun argument.
08/01/2007 :: mise à jour à faire
setOptions (options)
Function
options : objet d'options
08/01/2007 :: mise à jour à faire
( ligne 464 à ligne 779) Ajax.inPlaceEditor
Ce point présente le détail de l'objet Ajax.inPlaceEditor() .
Méthode
Type
Arguments
Détails
initialize ( element , url , options )
Function
aucun argument.
Méthode qui intialise l'édition en place de données sur un élément en tenant
compte d'url à interroger pour l'action d'édition a proprement dite.
Cette méthode définit nombre d'options de base qui seront souvent amenées à changer
en raison de leur nature 'graphique' (ndr : beaucoup de couleurs à préciser).
enterEditMode (event)
Function
event : évènement
08/01/2007 :: mise à jour à faire
createForm ( )
Function
aucun argument.
08/01/2007 :: mise à jour à faire
hasHTMLLineBreaks ( string )
Function
string : chaîne de caractères à analyser
Méthode permettant de déterminer si des retours à la ligne sont présents dans une chaîne
de caractères transmise.
convertHTMLLineBreaks ( string )
Function
string : chaîne de caractères à convertir
Méthode permettant d'effectuer une conversion des retours à la ligne HTML en retours à la ligne ASCII '\n'.
createEditField ( )
Function
aucun argument.
08/01/2007 :: mise à jour à faire
getText ( )
Function
aucun argument.
Méthode permettant de récupérer le contenu HTML d'un élément.
loadExternalText ( )
Function
aucun argument.
08/01/2007 :: mise à jour à faire
onLoadedExternalText ( )
Function
aucun argument.
08/01/2007 :: mise à jour à faire
onclickCancel ( )
Function
aucun argument.
Méthode permettant de quitter le mode édition en place sur un champ.
Visuellement le champ redevient comme avant le passage en mode édition.
onFailure (transport)
Function
transport :
Méthode qui a détecté une erreur pour la mise à jour du champ et qui replace l'ancien contenu
HTML dans le champ de saisie
onSubmit ( )
Function
aucun argument.
08/01/2007 :: mise à jour à faire
onLoading ( )
Function
aucun argument.
08/01/2007 :: mise à jour à faire
showSaving ( )
Function
aucun argument.
Méthode permettant de recréer le champ de saisie comme dans la sauvegarde 'oldInnerHTML'.
removeForm ( )
Function
aucun argument.
Méthode permettant de supprimer la node container de la propriété 'form' de l'objet.
enterHover ( )
Function
aucun argument.
08/01/2007 :: mise à jour à faire
leaveHover ( )
Function
aucun argument.
08/01/2007 :: mise à jour à faire
leaveEditMode ( )
Function
aucun argument.
08/01/2007 :: mise à jour à faire
onComplete (transport)
Function
transport :
08/01/2007 :: mise à jour à faire
dispose ( )
Function
aucun argument.
08/01/2007 :: mise à jour à faire
onEnterEditMode ( )
Function
aucun argument.
Méthode vide.
onLeaveEditMode ( )
Function
aucun argument.
Méthode vide.
( ligne 781 à ligne 808) Ajax.inPlaceCollectionEditor
Ce point présente le détail de l'objet Ajax.inPlaceCollectionEditor() .
Cet objet hérite de Ajax.inPlaceEditor() et dispose de sa propre méthode
'createEditField' qui est adaptée au rôlé qui est confié à cet objet, à savoir
l'édition en place de listes déroulantes ou champ 'select'.
Le tableau ci après présente les méthodes de cet objet.
Méthode
Type
Arguments
Détails
createEditField ( )
Function
aucun argument.
Méthode qui remplace celle de Ajax.inPlaceEditor adaptée à des champs de saisie à caractère unique dira t-on.
Cette méthode est adaptée pour la construction des 'option' des éléments 'select'.
( ligne 814 à ligne 834) Form.Element.DelayedObserver
Une traduction littérale française de cet objet pourrait être 'observeur d'évenement décalé'.
Cet observateur permet d'inclure un délai entre la dernière saisie clavier et le moment ou l'évènement est déclenché.
Méthode
Type
Arguments
Détails
initialize ( element , delay , callback )
Function
element : élément DOM
delay : temps en secondes pour le décalage (défaut : '0.5')
callback : méthode a appeler en 'callback'
Méthode d'initialisation de l'objet.
delayedListener (event)
Function
event : évènement
09/01/2007 : mise à jour à faire
onTimerEvent ( )
Function
aucun argument.
09/01/2007 : mise à jour à faire
Ces contrôles d'interface permettent par exemple de créer des listes dites "autocompletion" ou en français de "recherche intuitive", mais aussi de définir les bases d'interfaces fonctionnant sur des mises à jour dites dans Scritpaculous "inPlace" ou en français "en place, dans la page".
Le contenu du fichier "controls.js" est détaillé après afin de permettre une prise de connaissance globale de ce fichier.
!!! :: attention, ce fichier ne peut être utilisé sans le fichier "effects.js" qui permet de définir les effets à appliquer, par exemple
pour les zones DOM retournées par les "Autocompleter".
Les différents contrôlés définis
Ce point liste les différents contrôles d'interface définis par ce fichier.| Classe / Objet | Description |
| AutoCompleter | Objet vide par défaut destiné à contenir l'ensemble des Autocompleter définis dans le fichier. |
| AutoCompleter.Base | Objet de base permettant d'effectuer des traitements dits "autocompletion". |
| Ajax.AutoCompleter | Objet qui étend donc Ajax.AutoCompleter de base en ajoutant les fonctionnalités de gestion de la requête AJAX utilisée pour ramener la zone ou le contenu de zone à afficher. |
| AutoCompleter.Local | Dans le cas d'interfaces chargées en premier chargement, il est intéressant d'envisager un fonctionnement
"d'autocompletion" en local. C'est la fonctionnalité que permet cet objet. |
| Ajax.inPlaceEditor | Objet permettant l'édition en place de champs de saisie. Cet objet permet de gérer uniquement les champs de saisie de type 'input' ou 'textarea'. La mise à jour de champs 'select' est permise par l'objet suivant dans ce tableau Ajax.inPlaceCollectionEditor |
| Ajax.inPlaceCollectionEditor | Objet qui permet l'édition en place de listes déroulantes ou champ 'select'. Cet objet hérite de Ajax.inPlaceEditor . |
La suite de ce document permet l'analyse des objets/classes définis dans le fichier 'control.js'.
( ligne 42 à ligne 330) AutoCompleter et AutoCompleter.Base
Ce point présente le détail de l'objet Autocompleter et implicitement de son objet Autocompleter.Base .Les méthodes de cet objet sont listées dans le tableau ci après :
| Méthode | Type | Arguments | Détails |
| baseInitialize (element , update , options ) | Function |
element : élément DOM
update : élément DOM options : objet d'options |
08/01/2007 :: mise à jour à faire |
| show () | Function | aucun argument. | 08/01/2007 :: mise à jour à faire |
| fixIEOverlapping () | Function | aucun argument. | 08/01/2007 :: mise à jour à faire |
| hide () | Function | aucun argument. | 08/01/2007 :: mise à jour à faire |
| startIndicator ( ) | Function | aucun argument. | 08/01/2007 :: mise à jour à faire |
| stopIndicator ( ) | Function | aucun argument. | 08/01/2007 :: mise à jour à faire |
| onKeyPress (event) | Function | event : évènement | 08/01/2007 :: mise à jour à faire |
| activate () | Function | aucun argument. | 08/01/2007 :: mise à jour à faire |
| onHover (event) | Function | event : évènement | 08/01/2007 :: mise à jour à faire |
| onClick (event) | Function | event : évènement | 08/01/2007 :: mise à jour à faire |
| onBlur (event) | Function | event : évènement | 08/01/2007 :: mise à jour à faire |
| render ( ) | Function | aucun argument. | 08/01/2007 :: mise à jour à faire |
| markPrevious ( ) | Function | aucun argument. | 08/01/2007 :: mise à jour à faire |
| markNext ( ) | Function | aucun argument. | 08/01/2007 :: mise à jour à faire |
| getEntry ( index ) | Function | index : valeur numérique | 08/01/2007 :: mise à jour à faire |
| getCurrentEntry ( ) | Function | aucun argument. | 08/01/2007 :: mise à jour à faire |
| selectEntry ( ) | Function | aucun argument. | 08/01/2007 :: mise à jour à faire |
| updateElement ( elementSelectionne ) | Function | elementSelectionne : | 08/01/2007 :: mise à jour à faire |
| updateChoices ( choix ) | Function | choix : chaine HTML à priori | 08/01/2007 :: mise à jour à faire |
| addObservers (event) | Function | event : évènement | 08/01/2007 :: mise à jour à faire |
| onObserverEvent ( ) | Function | aucun argument. | 08/01/2007 :: mise à jour à faire |
| getToken ( ) | Function | aucun argument. | 08/01/2007 :: mise à jour à faire |
| findLastToken ( ) | Function | aucun argument. | 08/01/2007 :: mise à jour à faire |
( ligne 332 à ligne 359) Ajax.Autocompleter
Ce point présente le détail de l'objet Ajax.Autocompleter qui hérite de Autocompleter.Base .Les méthodes de cet objet sont listées dans le tableau ci après :
| Méthode | Type | Arguments | Détails |
| getUpdatedChoices ( ) | Function | aucun argument. |
Méthode qui permet de lancer la requête Ajax.Request permettant d'obtenir le contenu
mis à jour des choix de la recherche. Cette méthode utilise Autocompleter.Base.updateChoices(htmlContenu) pour mettre à jour les choix. |
( ligne 396 à ligne 455) AutoCompleter.Local
Ce point présente le détail de l'objet Autocompleter.Local qui permet de gérer le concept de 'autocompletion' ou 'rechercher intuitive' sans utiliser de requêtes HTTP/AJAX.| Méthode | Type | Arguments | Détails |
| initialize (element,update,array,options) | Function | aucun argument. | 08/01/2007 :: mise à jour à faire |
| getUpdatedChoices ( ) | Function | aucun argument. | 08/01/2007 :: mise à jour à faire |
| setOptions (options) | Function | options : objet d'options | 08/01/2007 :: mise à jour à faire |
( ligne 464 à ligne 779) Ajax.inPlaceEditor
Ce point présente le détail de l'objet Ajax.inPlaceEditor() .| Méthode | Type | Arguments | Détails |
| initialize ( element , url , options ) | Function | aucun argument. |
Méthode qui intialise l'édition en place de données sur un élément en tenant
compte d'url à interroger pour l'action d'édition a proprement dite.
Cette méthode définit nombre d'options de base qui seront souvent amenées à changer en raison de leur nature 'graphique' (ndr : beaucoup de couleurs à préciser). |
| enterEditMode (event) | Function | event : évènement | 08/01/2007 :: mise à jour à faire |
| createForm ( ) | Function | aucun argument. | 08/01/2007 :: mise à jour à faire |
| hasHTMLLineBreaks ( string ) | Function | string : chaîne de caractères à analyser | Méthode permettant de déterminer si des retours à la ligne sont présents dans une chaîne de caractères transmise. |
| convertHTMLLineBreaks ( string ) | Function | string : chaîne de caractères à convertir | Méthode permettant d'effectuer une conversion des retours à la ligne HTML en retours à la ligne ASCII '\n'. |
| createEditField ( ) | Function | aucun argument. | 08/01/2007 :: mise à jour à faire |
| getText ( ) | Function | aucun argument. | Méthode permettant de récupérer le contenu HTML d'un élément. |
| loadExternalText ( ) | Function | aucun argument. | 08/01/2007 :: mise à jour à faire |
| onLoadedExternalText ( ) | Function | aucun argument. | 08/01/2007 :: mise à jour à faire |
| onclickCancel ( ) | Function | aucun argument. |
Méthode permettant de quitter le mode édition en place sur un champ.
Visuellement le champ redevient comme avant le passage en mode édition. |
| onFailure (transport) | Function | transport : | Méthode qui a détecté une erreur pour la mise à jour du champ et qui replace l'ancien contenu HTML dans le champ de saisie |
| onSubmit ( ) | Function | aucun argument. | 08/01/2007 :: mise à jour à faire |
| onLoading ( ) | Function | aucun argument. | 08/01/2007 :: mise à jour à faire |
| showSaving ( ) | Function | aucun argument. | Méthode permettant de recréer le champ de saisie comme dans la sauvegarde 'oldInnerHTML'. |
| removeForm ( ) | Function | aucun argument. | Méthode permettant de supprimer la node container de la propriété 'form' de l'objet. |
| enterHover ( ) | Function | aucun argument. | 08/01/2007 :: mise à jour à faire |
| leaveHover ( ) | Function | aucun argument. | 08/01/2007 :: mise à jour à faire |
| leaveEditMode ( ) | Function | aucun argument. | 08/01/2007 :: mise à jour à faire |
| onComplete (transport) | Function | transport : | 08/01/2007 :: mise à jour à faire |
| dispose ( ) | Function | aucun argument. | 08/01/2007 :: mise à jour à faire |
| onEnterEditMode ( ) | Function | aucun argument. | Méthode vide. |
| onLeaveEditMode ( ) | Function | aucun argument. | Méthode vide. |
( ligne 781 à ligne 808) Ajax.inPlaceCollectionEditor
Ce point présente le détail de l'objet Ajax.inPlaceCollectionEditor() .Cet objet hérite de Ajax.inPlaceEditor() et dispose de sa propre méthode 'createEditField' qui est adaptée au rôlé qui est confié à cet objet, à savoir l'édition en place de listes déroulantes ou champ 'select'.
Le tableau ci après présente les méthodes de cet objet.
| Méthode | Type | Arguments | Détails |
| createEditField ( ) | Function | aucun argument. |
Méthode qui remplace celle de Ajax.inPlaceEditor adaptée à des champs de saisie à caractère unique dira t-on.
Cette méthode est adaptée pour la construction des 'option' des éléments 'select'. |
( ligne 814 à ligne 834) Form.Element.DelayedObserver
Une traduction littérale française de cet objet pourrait être 'observeur d'évenement décalé'.Cet observateur permet d'inclure un délai entre la dernière saisie clavier et le moment ou l'évènement est déclenché.
| Méthode | Type | Arguments | Détails |
| initialize ( element , delay , callback ) | Function |
element : élément DOM
delay : temps en secondes pour le décalage (défaut : '0.5') callback : méthode a appeler en 'callback' |
Méthode d'initialisation de l'objet. |
| delayedListener (event) | Function | event : évènement | 09/01/2007 : mise à jour à faire |
| onTimerEvent ( ) | Function | aucun argument. | 09/01/2007 : mise à jour à faire |
: 05/01/2007 04:25:45 | 
: Scriptaculous, fichier, controls.js, Controls, graphique, Thomas, Fuchs, thomasfuchs, 
