Subversion Repositories eFlore/Applications.cel

Rev

Go to most recent revision | Details | Last modification | View Log | RSS feed

Rev Author Line No. Line
195 david 1
package org.tela_botanica.client.vues.image;
2 aperonnet 2
 
3
import org.tela_botanica.client.image.ImageMediateur;
60 jpm 4
import org.tela_botanica.client.interfaces.ListePaginable;
2 aperonnet 5
import org.tela_botanica.client.interfaces.Rafraichissable;
6
import org.tela_botanica.client.interfaces.VueListable;
195 david 7
import org.tela_botanica.client.vues.BarrePaginationVue;
2 aperonnet 8
 
401 aurelien 9
import com.google.gwt.core.client.GWT;
2 aperonnet 10
import com.google.gwt.user.client.Element;
401 aurelien 11
import com.google.gwt.user.client.Window;
81 jpm 12
import com.google.gwt.user.client.ui.HTML;
134 aurelien 13
import com.gwtext.client.core.EventCallback;
2 aperonnet 14
import com.gwtext.client.core.EventObject;
134 aurelien 15
import com.gwtext.client.core.Ext;
16
import com.gwtext.client.core.ExtElement;
2 aperonnet 17
import com.gwtext.client.core.XTemplate;
18
import com.gwtext.client.data.FieldDef;
19
import com.gwtext.client.data.IntegerFieldDef;
20
import com.gwtext.client.data.Record;
21
import com.gwtext.client.data.RecordDef;
22
import com.gwtext.client.data.Store;
23
import com.gwtext.client.data.StringFieldDef;
5 aperonnet 24
import com.gwtext.client.dd.DragData;
25
import com.gwtext.client.dd.DragSource;
26
import com.gwtext.client.dd.DropTarget;
27
import com.gwtext.client.dd.DropTargetConfig;
2 aperonnet 28
import com.gwtext.client.util.Format;
29
import com.gwtext.client.widgets.Component;
134 aurelien 30
import com.gwtext.client.widgets.Container;
2 aperonnet 31
import com.gwtext.client.widgets.DataView;
32
import com.gwtext.client.widgets.Panel;
146 aurelien 33
import com.gwtext.client.widgets.event.ContainerListener;
2 aperonnet 34
import com.gwtext.client.widgets.event.ContainerListenerAdapter;
208 aurelien 35
import com.gwtext.client.widgets.event.DataViewListener;
2 aperonnet 36
import com.gwtext.client.widgets.event.DataViewListenerAdapter;
146 aurelien 37
import com.gwtext.client.widgets.event.PanelListenerAdapter;
5 aperonnet 38
import com.gwtext.client.widgets.grid.GridDragData;
2 aperonnet 39
 
40
/**
5 aperonnet 41
 * Galerie d'images miniatures Avec barre de pagination
42
 *
2 aperonnet 43
 * @author aurelien
44
 */
5 aperonnet 45
public class GalerieImageVue extends Panel implements Rafraichissable,
60 jpm 46
		VueListable, ListePaginable {
2 aperonnet 47
 
48
	/**
49
	 * instance du médiateur
5 aperonnet 50
	 */
51
	private ImageMediateur iMediateur = null;
2 aperonnet 52
	/**
5 aperonnet 53
	 * Dataview, littéralement "vue de données" qui permet de définir la manière
54
	 * d'afficher les données
55
	 */
56
	private DataView dView = null;
2 aperonnet 57
	/**
5 aperonnet 58
	 * Dataview, littéralement "vue de données" qui permet de définir la manière
59
	 * d'afficher les données
60
	 */
61
	private Store st = null;
2 aperonnet 62
	/**
5 aperonnet 63
	 * Barre de pagination gérant l'affichage d'un nombre donné d'élements par
64
	 * page et la navigation entre eux
65
	 */
59 david 66
	private BarrePaginationVue pt = null;
2 aperonnet 67
	/**
68
	 * Booleen indiquant si la galerie est instanciée ou pas
5 aperonnet 69
	 */
70
	private boolean estInstancie = false;
140 aurelien 71
 
208 aurelien 72
	private boolean garderRatio = true;
140 aurelien 73
 
74
	private int tailleOr = 100 ;
146 aurelien 75
 
76
	boolean lienUploadInitialise = false ;
77
 
78
	HTML videPanel = null ;
2 aperonnet 79
 
146 aurelien 80
 
2 aperonnet 81
	/**
82
	 * Constructeur sans argument, privé car ne doit pas être utilisé
83
	 */
84
	@SuppressWarnings("unused")
5 aperonnet 85
	private GalerieImageVue() {
86
		super();
2 aperonnet 87
	}
5 aperonnet 88
 
2 aperonnet 89
	/**
90
	 * Constructeur avec argument
5 aperonnet 91
	 *
92
	 * @param im
93
	 *            le médiateur avec lequel la vue va communiquer
2 aperonnet 94
	 */
95
	public GalerieImageVue(ImageMediateur im) {
96
		super("Galerie");
97
		iMediateur = im;
146 aurelien 98
 
2 aperonnet 99
		// on ajoute des listeners au composant tout entier
100
		this.addListener(new ContainerListenerAdapter() {
101
 
5 aperonnet 102
			// pour gagner du temps on n'instancie la vue en elle même que lors
103
			// du premier affichage (lazy rendering)
2 aperonnet 104
			public void onShow(Component component) {
105
 
106
				if (!estInstancie) {
107
					initialiser();
108
				}
134 aurelien 109
 
110
			}
2 aperonnet 111
		});
146 aurelien 112
 
113
		AjouterListenersLiens();
5 aperonnet 114
 
2 aperonnet 115
		// et on ajoute la tool bar
60 jpm 116
		pt = new BarrePaginationVue(this);
59 david 117
		pt.setLabelElement("Images");
118
		pt.setTaillePageParDefaut(50);
5 aperonnet 119
		this.setBottomToolbar(pt);
2 aperonnet 120
 
121
	}
122
 
123
	/**
5 aperonnet 124
	 * Ajoute tous les listeners nécessaires à l'intercation utilisateur avec la
125
	 * vue de données
2 aperonnet 126
	 */
127
	public void ajouterListenersDataView() {
128
 
129
		// ajout de listeners pour la gestion de la selection
130
		// dans la galerie
146 aurelien 131
 
2 aperonnet 132
		dView.addListener(new DataViewListenerAdapter() {
5 aperonnet 133
 
2 aperonnet 134
			// gestion du clic sur une image
5 aperonnet 135
 
2 aperonnet 136
			public void onClick(DataView source, int index, Element node,
137
					EventObject e) {
146 aurelien 138
 
2 aperonnet 139
				// on en notifie le médiateur
140
				getIMediateur().clicGalerieImage(index, node, e);
141
 
142
			}
143
 
144
			// gestion du clic droit
5 aperonnet 145
 
2 aperonnet 146
			public void onContextMenu(DataView source, int index, Element node,
147
					EventObject e) {
148
 
5 aperonnet 149
				// on stoppe l'évenement
2 aperonnet 150
				e.stopEvent();
151
				// et on notifie le médiateur
152
				getIMediateur().montrerContextMenu(e);
153
 
154
			}
155
 
156
			// gestion du double clic
5 aperonnet 157
 
2 aperonnet 158
			public void onDblClick(DataView source, int index, Element node,
159
					EventObject e) {
160
 
161
				// on notife le mediateur
162
				getIMediateur().clicGalerieImage(index, node, e);
5 aperonnet 163
 
2 aperonnet 164
			}
165
 
166
			// gestion des actions en fonction de la selection
5 aperonnet 167
 
2 aperonnet 168
			public void onSelectionChange(DataView view, Element[] selections) {
169
 
170
				// s'il n'y a aucun élement sélectionné
171
				if (selections.length <= 0) {
172
					// on en notifie le médiateur
173
					getIMediateur().aucuneSelection();
174
				} else {
175
					// sinon on notifie le médiateur
176
					getIMediateur().selection();
5 aperonnet 177
					// et on lui demande de synchroniser la séléction avec les
178
					// autres vues
2 aperonnet 179
					getIMediateur().synchroniserSelection("galerie");
180
				}
181
			}
182
		});
183
	}
184
 
185
	/**
186
	 * Accesseur pour la dataview
5 aperonnet 187
	 *
188
	 * @return la dataview
2 aperonnet 189
	 */
190
	public DataView getDView() {
191
		return dView;
192
	}
193
 
194
	/**
195
	 * Renvoie les ids des images sélectionnées
5 aperonnet 196
	 *
197
	 * @return un tableau de String contenant les identifiants des images
198
	 *         sélectionnées
2 aperonnet 199
	 */
200
	public String[] getIdSelectionnees() {
201
		Record[] selection = getDView().getSelectedRecords();
202
		int taille = selection.length;
203
		String id_selection[] = new String[taille];
204
 
205
		for (int i = 0; i < selection.length; i++) {
206
 
207
			id_selection[i] = selection[i].getAsString("num_image");
208
		}
209
 
210
		return id_selection;
211
	}
212
 
213
	/**
214
	 * Accesseur pour le médiateur
5 aperonnet 215
	 *
2 aperonnet 216
	 * @return le médiateur associé à la vue
217
	 */
218
	public ImageMediateur getIMediateur() {
219
		return iMediateur;
220
	}
221
 
222
	/**
223
	 * Accesseur pour le store
5 aperonnet 224
	 *
2 aperonnet 225
	 * @return le store associé à la vue
226
	 */
227
	public Store getSt() {
228
		return st;
229
	}
5 aperonnet 230
 
2 aperonnet 231
	/**
5 aperonnet 232
	 * Accesseur pour la toolbar
233
	 *
2 aperonnet 234
	 * @return la toolbar associée à la vue
235
	 */
59 david 236
	public BarrePaginationVue getToolBarVue() {
5 aperonnet 237
		return pt;
2 aperonnet 238
	}
239
 
240
	/**
5 aperonnet 241
	 * Fonction d'initialisation du contenu (appelée lors du premier affichage
242
	 * de la liste)
2 aperonnet 243
	 */
244
	public void initialiser() {
5 aperonnet 245
 
2 aperonnet 246
		// Preparation de la dataview et du template
247
		// le template va créer une div contenant une image
248
		// pour chacune des photos
249
		final XTemplate template = new XTemplate(
250
				new String[] {
251
						"<tpl for='.'>",
252
						"<div class='thumb-wrap' id='{num_image}'>",
408 aurelien 253
						"<div class='thumb dview-list'>{indication_transmission}{indication_liaison}<img class='miniature_galerie' src='{url_image_M}' width='{taille_x_s} px' height='{taille_y_s} px' title='{infobulle}' /></div>",
401 aurelien 254
						"<span class='info_image'>{nom_obs_associees_formatees}</span></div>", "</tpl>",
2 aperonnet 255
						"<div class='x-clear'></div>" });
5 aperonnet 256
		// pour des raisons de performances on compile le template en une
257
		// fonction
2 aperonnet 258
		template.compile();
259
 
260
		// la dataview affichera les images en accord avec le template
261
		// cree precedemment
262
		dView = new DataView("div.thumb-wrap") {
263
 
264
			public void prepareData(Data data) {
265
				data.setProperty("shortName", Format.ellipsis(data
208 aurelien 266
						.getProperty("nom_original"), 15));
140 aurelien 267
 
268
				int[] XY = {data.getPropertyAsInt("taille_x") ,data.getPropertyAsInt("taille_y")} ;
269
				int[] XYresize ;
270
 
271
				if(garderRatio) {
272
					XYresize = calculerDimensions(XY);
273
				}
274
				else {
275
					XYresize = new int[2] ;
276
					XYresize[0] = XYresize[1] = tailleOr ;
277
 
278
				}
279
 
280
				data.setProperty("taille_x_s", XYresize[0]);
281
				data.setProperty("taille_y_s", XYresize[1]);
401 aurelien 282
 
283
				String nomObs = data.getProperty("obs_associees");
408 aurelien 284
 
401 aurelien 285
				String htmltransmis = "";
286
				String htmllie = "";
408 aurelien 287
 
288
				boolean associee = estAssocieeTransmise(nomObs)[0];
289
				boolean transmise = estAssocieeTransmise(nomObs)[1];
290
 
291
				String nomFormate = getNomsObservationsFormatees(nomObs);
292
 
293
				if(associee) {
294
					htmllie = "<img class='picto_haut_droite' src='chain.png' />";
401 aurelien 295
				}
408 aurelien 296
 
297
				if(transmise) {
298
					htmltransmis = "<img class='picto_haut_gauche' src='tela.png' />";
299
				}
401 aurelien 300
 
408 aurelien 301
				data.setProperty("infobulle", nomFormate);
401 aurelien 302
				data.setProperty("indication_transmission", htmltransmis);
303
				data.setProperty("indication_liaison", htmllie);
408 aurelien 304
				data.setProperty("nom_obs_associees_formatees", nomFormate);
401 aurelien 305
 
2 aperonnet 306
			}
307
		};
308
		dView.setTpl(template);
309
 
310
		// parametre d'affichage de la dataview
311
		this.setAutoScroll(true);
312
		dView.setAutoHeight(true);
313
		dView.setMultiSelect(true);
314
		dView.setOverCls("x-view-over");
146 aurelien 315
		dView.setEmptyText("");
2 aperonnet 316
 
317
		// creation du store
318
		FieldDef defNumImage = new IntegerFieldDef("num_image");
208 aurelien 319
		FieldDef defNomImage = new StringFieldDef("nom_original");
2 aperonnet 320
		FieldDef defDatImage = new StringFieldDef("dat_image");
321
		FieldDef defLieImage = new StringFieldDef("lie_image");
322
		FieldDef defAppImage = new StringFieldDef("app_image");
323
		FieldDef defUrlImageS = new StringFieldDef("url_image_S");
324
		FieldDef defUrlImageM = new StringFieldDef("url_image_M");
325
		FieldDef defUrlImage = new StringFieldDef("url_image");
140 aurelien 326
		FieldDef defTailleX = new IntegerFieldDef("taille_x");
327
		FieldDef defTailleY = new IntegerFieldDef("taille_y");
401 aurelien 328
		FieldDef defObsAssociees = new StringFieldDef("obs_associees");
208 aurelien 329
		FieldDef[] defTab = { defNumImage, defNomImage, defDatImage, defLieImage,
401 aurelien 330
				defAppImage, defUrlImageS, defUrlImageM, defUrlImage,defTailleX,defTailleY, defObsAssociees};
2 aperonnet 331
		RecordDef rd = new RecordDef(defTab);
332
		st = new Store(rd);
333
		dView.setStore(st);
334
 
335
		this.getDView().setLoadingText("chargement");
336
 
146 aurelien 337
		this.add(dView);
338
		dView.hide();
339
 
340
		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/> " +
341
				"			<a id=\"lienUploadSimple\" href=\"#\" > Cliquez ici pour ajouter un fichier à la fois </a> <br/> " +
342
				"			Pour ajouter des images plus tard, allez dans le menu Fichier -> Ajouter des images </div>");
343
		this.add(videPanel);
344
 
2 aperonnet 345
		// ajouts de la gestion des evenements pour la dataview
146 aurelien 346
		configDragAndDrop() ;
2 aperonnet 347
		ajouterListenersDataView();
146 aurelien 348
 
349
		estInstancie = true ;
350
 
2 aperonnet 351
	}
5 aperonnet 352
 
353
	public void configDragAndDrop()
354
	{
355
		// on fabrique la nouvelle configuration
356
		// les éléments sur lesquels on fait du drag 'n drop doivent tous avoir le même ddGroup
357
		DropTargetConfig dtc = new DropTargetConfig();
358
		dtc.setdDdGroup("DragGroupName");
2 aperonnet 359
 
5 aperonnet 360
		//La drop target permet de gérer l'évenement onDrop sur l'élement courant
361
		@SuppressWarnings("unused")
362
		DropTarget tg = new DropTarget(this, dtc)
363
		{
364
			public boolean notifyDrop(DragSource source, EventObject e, DragData data){
365
 
366
				// si les données proviennent d'une grille
367
				if(data instanceof GridDragData)
368
		    	{
369
					// on appelle le médiateur
370
		    		  	return iMediateur.lierObsDD(source, e, data,getId()) ;
371
		    	}
372
				return false ;
373
			}
374
 
375
			public String notifyOver(DragSource source, EventObject e, DragData data){
376
			    return "x-dd-drop-ok";
377
			}
378
		};
379
 
380
	}
381
 
2 aperonnet 382
	/**
383
	 * Méthode héritée de l'interface rafraichissable
384
	 */
385
	public void rafraichir(Object nouvelleDonnees,
386
			boolean repandreRafraichissement) {
387
 
388
		// si l'objet reçu est un store
389
		if (nouvelleDonnees instanceof Store) {
5 aperonnet 390
 
134 aurelien 391
				st = (Store) nouvelleDonnees;
392
 
393
			if(st.getCount() != 0) {
394
 
395
				// on le charge
396
				st.load();
397
 
146 aurelien 398
				if(videPanel.isVisible()) {
399
					videPanel.setVisible(false) ;
400
				}
401
 
402
				if(!dView.isVisible()) {
403
					dView.setVisible(true);
404
				}
134 aurelien 405
					// on l'affecte à la vue
406
					dView.setStore(st);
407
					// et on rafrachit la vue
408
					dView.refresh();
409
			}
140 aurelien 410
			else
411
			{
412
				st.removeAll();
413
				st.load();
414
				dView.setStore(st);
146 aurelien 415
 
416
				if(dView.isVisible()) {
417
					dView.hide() ;
418
				}
419
 
420
				if(!videPanel.isVisible()) {
421
					videPanel.setVisible(true);
422
					AjouterListenersLiens();
423
				}
424
 
140 aurelien 425
			}
2 aperonnet 426
		}
427
 
428
		// si le composant doit répandre le rafraichissement
429
		if (repandreRafraichissement) {
5 aperonnet 430
			// il en notifie le médiateur en lui donnant une copie des données
431
			// et en notifiant qu'il en est l'expéditeur
2 aperonnet 432
			getIMediateur().synchroniserDonneesZoomListeGalerie(
433
					nouvelleDonnees, this);
146 aurelien 434
		}
2 aperonnet 435
	}
436
 
437
	/**
5 aperonnet 438
	 * Méthode héritée de l'interface VueListable Sélectionne les images dans la
439
	 * galerie suivant les identifiants donnés en paramètres
440
	 *
441
	 * @param ids
442
	 *            les identifiants des images à sélectionner
2 aperonnet 443
	 */
444
	public void selectionnerImages(int[] ids) {
445
 
446
		getDView().select(ids);
447
 
448
	}
5 aperonnet 449
 
60 jpm 450
	public void changerNumeroPage(int pageCourante) {
451
 
452
		iMediateur.changerNumeroPage(pageCourante) ;
453
 
454
	}
455
 
456
	public void changerTaillePage(int nouvelleTaillePage) {
457
 
458
		iMediateur.changerTaillePage(nouvelleTaillePage) ;
459
	}
140 aurelien 460
 
461
	public int[] calculerDimensions(int[] tailleXY) {
462
 
463
		float[] tailleXYf = {new Float(tailleXY[0]),new Float(tailleXY[1])} ;
464
        float tailleOr = this.tailleOr ;
465
        float maxTaille = Math.max(tailleXYf[1],tailleXYf[0]) ;
466
        float[] XYresize = new float[2];
467
 
468
        if(maxTaille == tailleXY[0]) {
469
            float rapport = tailleXYf[1]/tailleXYf[0] ;
470
            XYresize[0] = tailleOr ;
471
            XYresize[1] = tailleOr*rapport ;
472
        }else {
473
            float rapport = tailleXYf[0]/tailleXYf[1] ;
474
            XYresize[1] = tailleOr ;
475
            XYresize[0] = tailleOr*rapport ;
476
        }
477
 
478
        int[] res = {Math.round(XYresize[0]),Math.round(XYresize[1])} ;
479
 
480
        return res;
481
    }
146 aurelien 482
 
483
	private void AjouterListenersLiens() {
60 jpm 484
 
146 aurelien 485
		addListener(new PanelListenerAdapter() {
486
 
487
			public void onAfterLayout(Container c) {
488
				ExtElement uploadS = Ext.get("lienUploadSimple");
489
				uploadS.removeAllListeners();
490
				uploadS.addListener("click", new EventCallback() {
491
					public void execute(EventObject e) {
492
						getIMediateur().uploaderImages(false);
493
					}
494
 
495
				}) ;
496
 
497
				ExtElement uploadM = Ext.get("lienUploadMultiple");
498
				uploadM.removeAllListeners();
499
				uploadM.addListener("click", new EventCallback() {
500
					public void execute(EventObject e) {
501
						getIMediateur().uploaderImages(true);
502
					}
503
				});
504
			}
505
 
506
		});
507
	}
408 aurelien 508
 
509
	private String getNomsObservationsFormatees(String nomObs) {
510
 
511
		String htmlInfobulle = "";
512
 
513
		String[][] obs = getObservationsAssociees(nomObs);
514
 
515
		for(int i = 0; i < obs.length; i++) {
516
			if(obs[i].length == 3 && obs[i][1] != null && !obs[i][1].equals("")) {
517
				htmlInfobulle += ", "+obs[i][1];
518
			}
519
		}
520
 
521
		htmlInfobulle = htmlInfobulle.replaceFirst(", ", "");
522
 
523
		return htmlInfobulle;
524
	}
525
 
526
	private String[][] getObservationsAssociees(String nomObs) {
527
 
528
		if(nomObs.trim().equals("")) {
529
			return new String[0][0];
530
		}
531
 
532
		String[] obsTab = nomObs.split(";;");
533
		String[][] obsAnalysees = new String[obsTab.length][3];
534
 
535
		for(int i = 0; i < obsTab.length; i++) {
536
 
537
			obsAnalysees[i] = obsTab[i].split("#");
538
 
539
		}
540
 
541
		return obsAnalysees;
542
	}
543
 
544
	private boolean[] estAssocieeTransmise(String nomObs) {
545
 
546
		String[][] obs = getObservationsAssociees(nomObs);
547
		boolean[] associeesTranmises = {false, false};
548
 
549
		if(obs.length > 0) {
550
			associeesTranmises[0] = true;
551
		}
552
 
553
		for(int i = 0; i < obs.length; i++) {
554
 
555
			if(obs[i].length == 3 && obs[i][2] != null && obs[i][2].equals("1")) {
556
				associeesTranmises[1] = true;
557
			}
558
		}
559
 
560
		return associeesTranmises;
561
	}
2 aperonnet 562
}