| New file |
|---|
| 0,0 → 1,375 |
|---|
| package org.tela_botanica.client.vues; |
| |
| import org.tela_botanica.client.image.ImageMediateur; |
| import org.tela_botanica.client.interfaces.ListePaginable; |
| import org.tela_botanica.client.interfaces.Rafraichissable; |
| import org.tela_botanica.client.interfaces.VueListable; |
| |
| import com.google.gwt.user.client.Element; |
| import com.google.gwt.user.client.ui.HTML; |
| import com.gwtext.client.core.EventObject; |
| import com.gwtext.client.core.XTemplate; |
| import com.gwtext.client.data.FieldDef; |
| import com.gwtext.client.data.IntegerFieldDef; |
| import com.gwtext.client.data.Record; |
| import com.gwtext.client.data.RecordDef; |
| import com.gwtext.client.data.Store; |
| import com.gwtext.client.data.StringFieldDef; |
| import com.gwtext.client.dd.DragData; |
| import com.gwtext.client.dd.DragSource; |
| import com.gwtext.client.dd.DropTarget; |
| import com.gwtext.client.dd.DropTargetConfig; |
| import com.gwtext.client.util.Format; |
| import com.gwtext.client.widgets.Component; |
| import com.gwtext.client.widgets.DataView; |
| import com.gwtext.client.widgets.Panel; |
| import com.gwtext.client.widgets.event.ContainerListenerAdapter; |
| import com.gwtext.client.widgets.event.DataViewListenerAdapter; |
| import com.gwtext.client.widgets.grid.GridDragData; |
| |
| /** |
| * Galerie d'images miniatures Avec barre de pagination |
| * |
| * @author aurelien |
| */ |
| public class GalerieImageVue extends Panel implements Rafraichissable, |
| VueListable, ListePaginable { |
| |
| /** |
| * instance du médiateur |
| */ |
| private ImageMediateur iMediateur = null; |
| /** |
| * Dataview, littéralement "vue de données" qui permet de définir la manière |
| * d'afficher les données |
| */ |
| private DataView dView = null; |
| /** |
| * Dataview, littéralement "vue de données" qui permet de définir la manière |
| * d'afficher les données |
| */ |
| private Store st = null; |
| /** |
| * Barre de pagination gérant l'affichage d'un nombre donné d'élements par |
| * page et la navigation entre eux |
| */ |
| private BarrePaginationVue pt = null; |
| /** |
| * Booleen indiquant si la galerie est instanciée ou pas |
| */ |
| private boolean estInstancie = false; |
| |
| /** |
| * Constructeur sans argument, privé car ne doit pas être utilisé |
| */ |
| @SuppressWarnings("unused") |
| private GalerieImageVue() { |
| super(); |
| } |
| |
| /** |
| * Constructeur avec argument |
| * |
| * @param im |
| * le médiateur avec lequel la vue va communiquer |
| */ |
| public GalerieImageVue(ImageMediateur im) { |
| super("Galerie"); |
| iMediateur = im; |
| |
| // on ajoute des listeners au composant tout entier |
| this.addListener(new ContainerListenerAdapter() { |
| |
| // pour gagner du temps on n'instancie la vue en elle même que lors |
| // du premier affichage (lazy rendering) |
| |
| public void onShow(Component component) { |
| |
| if (!estInstancie) { |
| initialiser(); |
| } |
| } |
| |
| }); |
| |
| // et on ajoute la tool bar |
| pt = new BarrePaginationVue(this); |
| pt.setLabelElement("Images"); |
| pt.setTaillePageParDefaut(50); |
| this.setBottomToolbar(pt); |
| |
| } |
| |
| /** |
| * Ajoute tous les listeners nécessaires à l'intercation utilisateur avec la |
| * vue de données |
| */ |
| public void ajouterListenersDataView() { |
| |
| // ajout de listeners pour la gestion de la selection |
| // dans la galerie |
| dView.addListener(new DataViewListenerAdapter() { |
| |
| // gestion du clic sur une image |
| |
| public void onClick(DataView source, int index, Element node, |
| EventObject e) { |
| |
| // on en notifie le médiateur |
| getIMediateur().clicGalerieImage(index, node, e); |
| |
| } |
| |
| // gestion du clic droit |
| |
| public void onContextMenu(DataView source, int index, Element node, |
| EventObject e) { |
| |
| // on stoppe l'évenement |
| e.stopEvent(); |
| // et on notifie le médiateur |
| getIMediateur().montrerContextMenu(e); |
| |
| } |
| |
| // gestion du double clic |
| |
| public void onDblClick(DataView source, int index, Element node, |
| EventObject e) { |
| |
| // on notife le mediateur |
| getIMediateur().clicGalerieImage(index, node, e); |
| |
| } |
| |
| // gestion des actions en fonction de la selection |
| |
| public void onSelectionChange(DataView view, Element[] selections) { |
| |
| // s'il n'y a aucun élement sélectionné |
| if (selections.length <= 0) { |
| // on en notifie le médiateur |
| getIMediateur().aucuneSelection(); |
| } else { |
| // sinon on notifie le médiateur |
| getIMediateur().selection(); |
| // et on lui demande de synchroniser la séléction avec les |
| // autres vues |
| getIMediateur().synchroniserSelection("galerie"); |
| } |
| } |
| |
| }); |
| } |
| |
| /** |
| * Accesseur pour la dataview |
| * |
| * @return la dataview |
| */ |
| public DataView getDView() { |
| return dView; |
| } |
| |
| /** |
| * Renvoie les ids des images sélectionnées |
| * |
| * @return un tableau de String contenant les identifiants des images |
| * sélectionnées |
| */ |
| public String[] getIdSelectionnees() { |
| Record[] selection = getDView().getSelectedRecords(); |
| int taille = selection.length; |
| String id_selection[] = new String[taille]; |
| |
| for (int i = 0; i < selection.length; i++) { |
| |
| id_selection[i] = selection[i].getAsString("num_image"); |
| } |
| |
| return id_selection; |
| } |
| |
| /** |
| * Accesseur pour le médiateur |
| * |
| * @return le médiateur associé à la vue |
| */ |
| public ImageMediateur getIMediateur() { |
| return iMediateur; |
| } |
| |
| /** |
| * Accesseur pour le store |
| * |
| * @return le store associé à la vue |
| */ |
| public Store getSt() { |
| return st; |
| } |
| |
| /** |
| * Accesseur pour la toolbar |
| * |
| * @return la toolbar associée à la vue |
| */ |
| public BarrePaginationVue getToolBarVue() { |
| return pt; |
| } |
| |
| /** |
| * Fonction d'initialisation du contenu (appelée lors du premier affichage |
| * de la liste) |
| */ |
| public void initialiser() { |
| |
| // Preparation de la dataview et du template |
| // le template va créer une div contenant une image |
| // pour chacune des photos |
| final XTemplate template = new XTemplate( |
| new String[] { |
| "<tpl for='.'>", |
| "<div class='thumb-wrap' id='{num_image}'>", |
| "<div class='thumb'><img src='{url_image_M}' title='{num_image}'></div>", |
| "<span>{nom}</span></div>", "</tpl>", |
| "<div class='x-clear'></div>" }); |
| // pour des raisons de performances on compile le template en une |
| // fonction |
| template.compile(); |
| |
| // la dataview affichera les images en accord avec le template |
| // cree precedemment |
| dView = new DataView("div.thumb-wrap") { |
| |
| public void prepareData(Data data) { |
| data.setProperty("shortName", Format.ellipsis(data |
| .getProperty("num_image"), 15)); |
| } |
| |
| }; |
| dView.setTpl(template); |
| |
| // parametre d'affichage de la dataview |
| this.setAutoScroll(true); |
| dView.setAutoHeight(true); |
| dView.setMultiSelect(true); |
| dView.setOverCls("x-view-over"); |
| dView.setEmptyText("Aucune image à afficher"); |
| |
| // creation du store |
| FieldDef defNumImage = new IntegerFieldDef("num_image"); |
| FieldDef defDatImage = new StringFieldDef("dat_image"); |
| FieldDef defLieImage = new StringFieldDef("lie_image"); |
| FieldDef defAppImage = new StringFieldDef("app_image"); |
| FieldDef defUrlImageS = new StringFieldDef("url_image_S"); |
| FieldDef defUrlImageM = new StringFieldDef("url_image_M"); |
| FieldDef defUrlImage = new StringFieldDef("url_image"); |
| FieldDef[] defTab = { defNumImage, defDatImage, defLieImage, |
| defAppImage, defUrlImageS, defUrlImageM, defUrlImage }; |
| RecordDef rd = new RecordDef(defTab); |
| st = new Store(rd); |
| dView.setStore(st); |
| |
| this.getDView().setLoadingText("chargement"); |
| |
| // ajouts de la gestion des evenements pour la dataview |
| ajouterListenersDataView(); |
| configDragAndDrop() ; |
| |
| this.add(dView); |
| |
| // enfin on envoie une demande de données au médiateur |
| getIMediateur().obtenirPhotoGalerie(this); |
| // et on déclare le composant comme instancié |
| estInstancie = true; |
| } |
| |
| public void configDragAndDrop() |
| { |
| // on fabrique la nouvelle configuration |
| // les éléments sur lesquels on fait du drag 'n drop doivent tous avoir le même ddGroup |
| DropTargetConfig dtc = new DropTargetConfig(); |
| dtc.setdDdGroup("DragGroupName"); |
| |
| //La drop target permet de gérer l'évenement onDrop sur l'élement courant |
| @SuppressWarnings("unused") |
| DropTarget tg = new DropTarget(this, dtc) |
| { |
| public boolean notifyDrop(DragSource source, EventObject e, DragData data){ |
| |
| // si les données proviennent d'une grille |
| if(data instanceof GridDragData) |
| { |
| // on appelle le médiateur |
| return iMediateur.lierObsDD(source, e, data,getId()) ; |
| } |
| return false ; |
| } |
| |
| public String notifyOver(DragSource source, EventObject e, DragData data){ |
| return "x-dd-drop-ok"; |
| } |
| }; |
| |
| } |
| |
| /** |
| * Méthode héritée de l'interface rafraichissable |
| */ |
| public void rafraichir(Object nouvelleDonnees, |
| boolean repandreRafraichissement) { |
| |
| // si l'objet reçu est un store |
| if (nouvelleDonnees instanceof Store) { |
| |
| st = (Store) nouvelleDonnees; |
| // on le charge |
| st.load(); |
| |
| // on l'affecte à la vue |
| dView.setStore(st); |
| // et on rafrachit la vue |
| dView.refresh(); |
| |
| } |
| |
| // si le composant doit répandre le rafraichissement |
| if (repandreRafraichissement) { |
| // il en notifie le médiateur en lui donnant une copie des données |
| // et en notifiant qu'il en est l'expéditeur |
| getIMediateur().synchroniserDonneesZoomListeGalerie( |
| nouvelleDonnees, this); |
| } |
| |
| // si c'est la première mise à jour que l'on reçoit |
| if (!estInstancie) { |
| // alors le composant est considéré comme instancié |
| estInstancie = true; |
| } |
| } |
| |
| /** |
| * Méthode héritée de l'interface VueListable Sélectionne les images dans la |
| * galerie suivant les identifiants donnés en paramètres |
| * |
| * @param ids |
| * les identifiants des images à sélectionner |
| */ |
| public void selectionnerImages(int[] ids) { |
| |
| getDView().select(ids); |
| |
| } |
| |
| public void changerNumeroPage(int pageCourante) { |
| |
| iMediateur.changerNumeroPage(pageCourante) ; |
| |
| } |
| |
| public void changerTaillePage(int nouvelleTaillePage) { |
| |
| iMediateur.changerTaillePage(nouvelleTaillePage) ; |
| } |
| |
| } |