mercredi 08 septembre 2010

Tutoriel : Mon premier widget Dojo

Création d'un composant graphique Dojo pour interfacer l'accès à plusieurs moteurs de recherche (Compatible Dojo 1.2.3)


3. Définition du widget


Pour créer un widget Dojo, notre classe "Search" doit hériter des méthodes et propriétés des classes _Widget et _Templated de la librairie dijit.

dojo.declare("exemple1.widget.Search", [dijit._Widget,dijit._Templated], {});

Diagramme de classe

Search
- _nls : object
- templatePath : string
- _dropdown : object
- _engines : array
+ constructor()
+ destroy()
+ startup()
- _onKeyPress(evt object)
- _clear()
- _search()


Search.js
1
2
3
4
56
7
8
9
1011
12
13
14
1516
17
18
19
2021
22
23
24
2526
/**********************************************/
/*                                            */
/* Widget : Search                            */
/* Author : Berthenet Cyril                   */
/*                                            *//**********************************************/
 
dojo.provide("exemple1.widget.Search");
 
dojo.require("dijit._Templated");dojo.require("dijit._Widget");
 
/* Class: Search */
dojo.declare("exemple1.widget.Search", [dijit._Widget,dijit._Templated], {
   /* String: templatePath
     chemin d'acces vers le template du widget */
  templatePath: dojo.moduleUrl("exemple1.widget", "template/Search.html"),
 
  /* Function: constructor     Constructeur */
  constructor: function(){
    console.log("exemple1.widget.Search::constructor");
  }
 });
lignes 10. importation de la classe _Templated 11. importation de la classe _Widget 18. chemin d'accès vers le template du widget 22. constructeur de notre classe