Tutoriel de David Shaffer/Ancres

From OFSET Wiki

Jump to: navigation, search

Traduction de : http://www.shaffer-consulting.com/david/Seaside/Anchors/index.html


Contents

[edit] Bases

Les ancres hypertextuelles (liens) sont utilisées pour plusieurs raisons incluant la navigation vers d'autres documents et l'exécution d'actions (comme enlever un élément d'une liste par exemple). En Seaside, lorsque nous créons des ancres, nous devons spécifier un bloc d'action un peu à la façon d'un "callback" pour une interface utilisateur. Lorsque l'utilisateur suit cette ancre, le "callback" est déclenché. Le bloc peut exécuter n'importe laquelle des actions que nous avons déjà décrites précedemment. Nous n'avons pas encore discuté de la façon d'afficher d'autres composants, mais nous pouvons utiliser le message WAComponent>>inform: pour afficher un simple message à l'utilisateur. Voici un exemple :


renderContentOn: html
      html anchor callback: [self sayHello]; with: 'Say hello'.

Ceci indique à l'objet qui fait le rendu HTML, de créer une ancre et d'exécuter le bloc lorsque l'ancre est suivi. Voici une implémentation de sayHello :

sayHello
      self inform: 'hello!'

Maintenant jouons avec cette application dans notre navigateur web. Ne vous inquiétez pas de la façon dont inform: marche ... son effet est évident. Notez que lorsque le bouton OK est pressé, le composant à l'origine est affiché.

Souvent, l'action d'une ancre, change juste l'état d'un composant et retourne. C'est-à-dire que rien de plus n'est affiché. Il y pleins d'exemples de cela dans le code fournit avec Seaside. Regardons WACounter par exemple. Il y a déjà un [tutoriel sur WACounter], donc nous allors juste faire un exemple simple de changement d'une chaîne affichée par notre composant. Pour le moment, notre composant n'a pas d'état, donc ajoutons lui une variable d'instances name :

WAComponent subclass: #HelloWorldComponent
   instanceVariableNames: 'name'
   classVariableNames: 
   poolDictionaries: 
   category: 'SCSeasideTutorial'

Maintenant, nous donnons une valeur initiale et nous ajoutons quelques méthode pour changer la valeur :

initialize
      super initialize.
      name := 'Anonymous user'
bobIsHere
      name := 'Bob'
janeIsHere
      name := 'Jane'

Maintenant nous modifions la méthode de rendu pour afficher le nom et nous permettre de le changer :

renderContentOn: html
      html heading: 'Welcome ' , name level: 1.
      html anchor callback: [self bobIsHere]; with: 'Bob'.
      html br.
      html anchor callback: [self janeIsHere]; with: 'Jane'

Essayez cette nouvelle version de l'application. Suivre les liens et regarder comme l'entête change en fonction du nom. Plutôt simple, non ? Maitenant appuyez sur le lien "New Session" en bas de la page du navigateur web. Notez que vous récupérez une nouvelle version du composant (le nom est réinitialisé à "Anonymous user"). Comment Seaside sait quand utiliser une instance déjà existante de votre composant racine ou bien en créer une nouvelle ? Tout simplement, l'information est placé dans les ancres. Suivez l'une de ces ancres et vous verrez que l'URL contient un paramètre nommé "_s" :

Image:SessionParam.jpg

C'est la façon dont Seaside suit la session de l'utilisateur de requête en requête. Chaque fois que vous visitez une URL Seaside sans variable de session dans une requête vous créez une nouvelle instance du composant racine de l'application. Le concept de session utilisateur est réifié dans une instance de la classe WASesssion associée à chaque session active et qui peut être accédée en évaluant : self session. Nous utiliserons cela de manière plus intensive un peu plus tard. L'objet qui fait le rendu prend soin de faire apparaître votre identifiant de session dans chaque ancre interne (callback) et dans les formulaires. Il y a aussi des méthodes dans l'objet de rendu pour générer des formulaires et des ancres sans information de session. Ces méthodes sont utiles lorsque l'on veut faire un lien vers un site web externe.

[edit] Comment faire que l'ancre affiche un autre composant ?

[edit] Liens vers des ressources externes

[edit] Exercices

Personal tools