Rev 208 | Blame | Compare with Previous | Last modification | View Log | RSS feed
package org.tela_botanica.client.vues.image;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 org.tela_botanica.client.vues.BarrePaginationVue;import com.google.gwt.user.client.Element;import com.google.gwt.user.client.ui.HTML;import com.gwtext.client.core.EventCallback;import com.gwtext.client.core.EventObject;import com.gwtext.client.core.Ext;import com.gwtext.client.core.ExtElement;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.Container;import com.gwtext.client.widgets.DataView;import com.gwtext.client.widgets.Panel;import com.gwtext.client.widgets.event.ContainerListener;import com.gwtext.client.widgets.event.ContainerListenerAdapter;import com.gwtext.client.widgets.event.DataViewListener;import com.gwtext.client.widgets.event.DataViewListenerAdapter;import com.gwtext.client.widgets.event.PanelListenerAdapter;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;private boolean garderRatio = true;private int tailleOr = 100 ;boolean lienUploadInitialise = false ;HTML videPanel = null ;/*** 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 entierthis.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();}}});AjouterListenersLiens();// et on ajoute la tool barpt = 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 galeriedView.addListener(new DataViewListenerAdapter() {// gestion du clic sur une imagepublic void onClick(DataView source, int index, Element node,EventObject e) {// on en notifie le médiateurgetIMediateur().clicGalerieImage(index, node, e);}// gestion du clic droitpublic void onContextMenu(DataView source, int index, Element node,EventObject e) {// on stoppe l'évenemente.stopEvent();// et on notifie le médiateurgetIMediateur().montrerContextMenu(e);}// gestion du double clicpublic void onDblClick(DataView source, int index, Element node,EventObject e) {// on notife le mediateurgetIMediateur().clicGalerieImage(index, node, e);}// gestion des actions en fonction de la selectionpublic void onSelectionChange(DataView view, Element[] selections) {// s'il n'y a aucun élement sélectionnéif (selections.length <= 0) {// on en notifie le médiateurgetIMediateur().aucuneSelection();} else {// sinon on notifie le médiateurgetIMediateur().selection();// et on lui demande de synchroniser la séléction avec les// autres vuesgetIMediateur().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 photosfinal XTemplate template = new XTemplate(new String[] {"<tpl for='.'>","<div class='thumb-wrap' id='{num_image}'>","<div class='thumb dview-list'><img src='{url_image_M}' width='{taille_x_s} px' height='{taille_y_s} px' title='{nom_original}'></div>","<span></span></div>", "</tpl>","<div class='x-clear'></div>" });// pour des raisons de performances on compile le template en une// fonctiontemplate.compile();// la dataview affichera les images en accord avec le template// cree precedemmentdView = new DataView("div.thumb-wrap") {public void prepareData(Data data) {data.setProperty("shortName", Format.ellipsis(data.getProperty("nom_original"), 15));int[] XY = {data.getPropertyAsInt("taille_x") ,data.getPropertyAsInt("taille_y")} ;int[] XYresize ;if(garderRatio) {XYresize = calculerDimensions(XY);}else {XYresize = new int[2] ;XYresize[0] = XYresize[1] = tailleOr ;}data.setProperty("taille_x_s", XYresize[0]);data.setProperty("taille_y_s", XYresize[1]);}};dView.setTpl(template);// parametre d'affichage de la dataviewthis.setAutoScroll(true);dView.setAutoHeight(true);dView.setMultiSelect(true);dView.setOverCls("x-view-over");dView.setEmptyText("");// creation du storeFieldDef defNumImage = new IntegerFieldDef("num_image");FieldDef defNomImage = new StringFieldDef("nom_original");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 defTailleX = new IntegerFieldDef("taille_x");FieldDef defTailleY = new IntegerFieldDef("taille_y");FieldDef[] defTab = { defNumImage, defNomImage, defDatImage, defLieImage,defAppImage, defUrlImageS, defUrlImageM, defUrlImage,defTailleX,defTailleY};RecordDef rd = new RecordDef(defTab);st = new Store(rd);dView.setStore(st);this.getDView().setLoadingText("chargement");this.add(dView);dView.hide();videPanel = new HTML("<div class=\"avertissement\" >Aucune image à afficher. <br/> <a id=\"lienUploadMultiple\" href=\"#\" > Cliquez ici pour ajouter un dossier entier ou plusieurs fichiers </a> (nécessite Java) <br/> " +" <a id=\"lienUploadSimple\" href=\"#\" > Cliquez ici pour ajouter un fichier à la fois </a> <br/> " +" Pour ajouter des images plus tard, allez dans le menu Fichier -> Ajouter des images </div>");this.add(videPanel);// ajouts de la gestion des evenements pour la dataviewconfigDragAndDrop() ;ajouterListenersDataView();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 ddGroupDropTargetConfig 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 grilleif(data instanceof GridDragData){// on appelle le médiateurreturn 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 storeif (nouvelleDonnees instanceof Store) {st = (Store) nouvelleDonnees;if(st.getCount() != 0) {// on le chargest.load();if(videPanel.isVisible()) {videPanel.setVisible(false) ;}if(!dView.isVisible()) {dView.setVisible(true);}// on l'affecte à la vuedView.setStore(st);// et on rafrachit la vuedView.refresh();}else{st.removeAll();st.load();dView.setStore(st);if(dView.isVisible()) {dView.hide() ;}if(!videPanel.isVisible()) {videPanel.setVisible(true);AjouterListenersLiens();}}}// si le composant doit répandre le rafraichissementif (repandreRafraichissement) {// il en notifie le médiateur en lui donnant une copie des données// et en notifiant qu'il en est l'expéditeurgetIMediateur().synchroniserDonneesZoomListeGalerie(nouvelleDonnees, this);}}/*** 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) ;}public int[] calculerDimensions(int[] tailleXY) {float[] tailleXYf = {new Float(tailleXY[0]),new Float(tailleXY[1])} ;float tailleOr = this.tailleOr ;float maxTaille = Math.max(tailleXYf[1],tailleXYf[0]) ;float[] XYresize = new float[2];if(maxTaille == tailleXY[0]) {float rapport = tailleXYf[1]/tailleXYf[0] ;XYresize[0] = tailleOr ;XYresize[1] = tailleOr*rapport ;}else {float rapport = tailleXYf[0]/tailleXYf[1] ;XYresize[1] = tailleOr ;XYresize[0] = tailleOr*rapport ;}int[] res = {Math.round(XYresize[0]),Math.round(XYresize[1])} ;return res;}private void AjouterListenersLiens() {addListener(new PanelListenerAdapter() {public void onAfterLayout(Container c) {ExtElement uploadS = Ext.get("lienUploadSimple");uploadS.removeAllListeners();uploadS.addListener("click", new EventCallback() {public void execute(EventObject e) {getIMediateur().uploaderImages(false);}}) ;ExtElement uploadM = Ext.get("lienUploadMultiple");uploadM.removeAllListeners();uploadM.addListener("click", new EventCallback() {public void execute(EventObject e) {getIMediateur().uploaderImages(true);}});}});}}