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