Subversion Repositories eFlore/Applications.cel

Rev

Rev 1292 | Details | Compare with Previous | Last modification | View Log | RSS feed

Rev Author Line No. Line
199 david 1
package org.tela_botanica.client.vues.observation.indicateurs;
94 jpm 2
 
3
import org.tela_botanica.client.interfaces.Rafraichissable;
989 aurelien 4
import org.tela_botanica.client.modeles.objets.ImageCarnet;
94 jpm 5
import org.tela_botanica.client.observation.ObservationMediateur;
6
 
338 aurelien 7
import com.google.gwt.event.dom.client.ClickEvent;
8
import com.google.gwt.event.dom.client.ClickHandler;
9
import com.google.gwt.event.dom.client.LoadEvent;
10
import com.google.gwt.event.dom.client.LoadHandler;
94 jpm 11
import com.google.gwt.user.client.DOM;
12
import com.google.gwt.user.client.Event;
213 aurelien 13
import com.google.gwt.user.client.Window;
94 jpm 14
import com.google.gwt.user.client.ui.Image;
213 aurelien 15
import com.gwtext.client.core.AnimationConfig;
94 jpm 16
import com.gwtext.client.core.EventObject;
213 aurelien 17
import com.gwtext.client.core.Ext;
18
import com.gwtext.client.core.ExtElement;
94 jpm 19
import com.gwtext.client.core.RegionPosition;
20
import com.gwtext.client.widgets.Panel;
213 aurelien 21
import com.gwtext.client.widgets.ToolTip;
94 jpm 22
import com.gwtext.client.widgets.layout.BorderLayout;
23
import com.gwtext.client.widgets.layout.BorderLayoutData;
104 jpm 24
import com.gwtext.client.widgets.menu.BaseItem;
25
import com.gwtext.client.widgets.menu.Item;
26
import com.gwtext.client.widgets.menu.Menu;
27
import com.gwtext.client.widgets.menu.event.MenuListenerAdapter;
94 jpm 28
 
29
/**
30
 * Panneau d'affichage d'une image avec des boutons précdents et suivant
31
 *
32
 * @author aurelien
33
 *
34
 */
35
public class MiniZoomImageVue extends Panel implements Rafraichissable {
36
 
37
	/**
38
	 * Le médiateur associé à la vue
39
	 */
40
	private ObservationMediateur oMediateur = null;
245 aurelien 41
 
42
	/**
43
	 * Le titre du panneau
44
	 */
45
	private static String titrePanneau = "Images liées";
94 jpm 46
 
47
	/**
48
	 * Panneau conteneur pour l'image
49
	 */
50
	private Panel imageConteneur = null;
51
	/**
52
	 * l'image à afficher
53
	 */
97 jpm 54
	private Image image = new Image("");
94 jpm 55
	/**
56
	 * Bouton précédent
57
	 */
58
	private final com.google.gwt.user.client.ui.Button prev = new com.google.gwt.user.client.ui.Button();
59
	/**
60
	 * Bouton suivant
61
	 */
62
	private final com.google.gwt.user.client.ui.Button suiv = new com.google.gwt.user.client.ui.Button();
63
 
64
	/**
65
	 * Taille originale Y de l'image
66
	 */
67
	private int imageHeight = 0;
68
 
69
	/**
70
	 * Taille originale X de l'image
71
	 */
72
	private int imageWidth = 0;
73
 
74
	/**
75
	 * Identifiant de l'image
76
	 */
77
	private String idImage = "0" ;
78
 
213 aurelien 79
	private String[] infosImages[] = null ;
94 jpm 80
 
81
	private int index = 0 ;
82
 
83
	/**
213 aurelien 84
	 * true pour animer les transitions
85
	 */
86
	private boolean animerTransition = false;
87
	/**
88
	 * Détermine la durée de la transition
89
	 */
90
	private float dureeAnimation = (float) 0.15;
91
 
92
	/**
94 jpm 93
	 * Booleen d'initalisation général
94
	 */
95
	private boolean initialise = false;
96
 
97
	/**
98
	 * Booleen d'initalisation du conteneur d'image
99
	 */
100
	private boolean conteneurInitialise = false;
213 aurelien 101
 
102
	private ToolTip tp = new ToolTip("<div class=\"x-tooltip-help\"> Double cliquez pour agrandir l'image </div>") ;
103
 
104
	com.gwtext.client.widgets.Window imgZoom = new com.gwtext.client.widgets.Window("Agrandissement") ;
105
 
106
	Image imgAgrandie = null;
94 jpm 107
 
108
	/**
109
	 * Constructeur sans argument (privé car ne doit être utilisé)
110
	 */
111
	@SuppressWarnings("unused")
112
	private MiniZoomImageVue() {
113
		super();
114
	}
115
 
116
	/**
117
	 * Constructeur avec argument
118
	 *
119
	 * @param im
120
	 *            le médiateur à associer à la vue
121
	 */
122
	public MiniZoomImageVue(ObservationMediateur im) {
245 aurelien 123
		super(titrePanneau);
94 jpm 124
		setId("x-view-mini-zoom-panel");
125
		// on associe le médiateur
126
		oMediateur = im;
127
 
128
		prev.setStylePrimaryName("x-view-zoom-button-p");
129
		suiv.setStylePrimaryName("x-view-zoom-button-s");
130
 
213 aurelien 131
		imgZoom.setCloseAction(com.gwtext.client.widgets.Window.HIDE) ;
298 aurelien 132
		imgZoom.setConstrain(true);
213 aurelien 133
 
94 jpm 134
		// on crée une image qui gère le double clic et la roulette de la souris
135
		image = new Image() {
136
 
1292 aurelien 137
			@Override
94 jpm 138
			public void onBrowserEvent(Event event) {
139
 
140
				// lors d'un déplacement de la roulette
141
				if (Event.ONMOUSEWHEEL == DOM.eventGetType(event)) {
142
 
143
					// on simule un clic sur le bouton précédent
144
					if (event.getMouseWheelVelocityY() >= 1) {
145
						prev.click();
146
					}
147
 
148
					// ou suivant
149
					if (event.getMouseWheelVelocityY() <= -1) {
150
						suiv.click();
151
					}
152
				}
104 jpm 153
 
154
				if(Event.ONCONTEXTMENU == DOM.eventGetType(event)) {
155
 
156
					event.preventDefault() ;
157
					int[] xy = {event.getClientX(),event.getClientY()} ;
158
					afficherMenu(xy) ;
159
				}
213 aurelien 160
 
161
				// lors du double clic
162
				if (Event.ONDBLCLICK == DOM.eventGetType(event)) {
279 aurelien 163
					if(imgZoom.isVisible()) {
164
							imgZoom.hide();
165
					} else {
166
						afficherPanneauAgrandi();
167
					}
213 aurelien 168
				}
94 jpm 169
			}
170
 
171
		};
172
 
130 aurelien 173
		image.setPixelSize(150, 150);
174
 
213 aurelien 175
		infosImages = new String[0][0] ;
94 jpm 176
 
177
		this.setHeader(true);
178
 
179
		imageConteneur = new Panel() ;
180
		imageConteneur.setBorder(false);
181
 
182
		imageConteneur.add(image);
183
		imageConteneur.setId("x-view-mini-zoom-img");
184
 
185
		// il n'existe pas de méthode pour ajouter un listener pour le double
186
		// clic sur une image
187
		// alors on lui dit manuellement de capter l'évènement double clic
188
		image.sinkEvents(Event.ONDBLCLICK);
189
		image.sinkEvents(Event.ONMOUSEWHEEL);
104 jpm 190
		image.sinkEvents(Event.ONCONTEXTMENU) ;
94 jpm 191
 
192
		// l'image de base est vide
97 jpm 193
		image.setUrl("");
94 jpm 194
 
195
		this.setLayout(new BorderLayout());
196
 
130 aurelien 197
		prev.setWidth("15%");
198
		suiv.setWidth("15%");
94 jpm 199
 
200
		this.add(prev, new BorderLayoutData(RegionPosition.WEST));
201
		this.add(imageConteneur, new BorderLayoutData(RegionPosition.CENTER));
202
		this.add(suiv, new BorderLayoutData(RegionPosition.EAST));
203
 
204
		imageConteneur.setMaskDisabled(true);
205
		this.setBorder(false);
206
 
207
		conteneurInitialise = true;
208
		initialise = true;
209
 
210
		// on ajoute les listeners
211
		ajouterListeners();
212
 
213
	}
214
 
215
	/**
216
	 * Méthode héritée de l'interface rafraichissable
217
	 *
218
	 * @param nouvelleDonnees
219
	 *            les nouvelles données
220
	 * @param repandreRafraichissement
221
	 *            le booleen qui dit si on doit répnadre l'évènement
222
	 */
1292 aurelien 223
	@Override
94 jpm 224
	public void rafraichir(Object nouvelleDonnees,
225
			boolean repandreRafraichissement) {
226
 
227
		// si on reçoit une string
213 aurelien 228
		if (nouvelleDonnees instanceof String[][] && initialise
229
				&& conteneurInitialise && ((String[][])nouvelleDonnees).length != 0) {
230
			infosImages = (String[][]) nouvelleDonnees;
94 jpm 231
			index = 0 ;
232
			afficherImage() ;
233
 
234
		} else {
235
			// sinon on met une image vide
213 aurelien 236
			infosImages = null ;
237
			afficherImage();
238
 
94 jpm 239
		}
240
	}
241
 
242
	public void afficherImage()
243
	{
244
		// c'est l'url de l'image qu'on associe à la vue
213 aurelien 245
		if(infosImages != null && infosImages.length != 0)
94 jpm 246
		{
245 aurelien 247
			setTitle(titrePanneau+"         "+(index+1)+" / "+infosImages.length);
248
 
735 aurelien 249
			getImage().setUrl(getUrlMiniature(index));
213 aurelien 250
			imageWidth = Integer.parseInt(infosImages[index][1]);
251
			imageHeight = Integer.parseInt(infosImages[index][2]);
252
			verifierEtRetaillerImage();
245 aurelien 253
			activerPanneau(true);
213 aurelien 254
		} else {
245 aurelien 255
			setTitle(titrePanneau);
213 aurelien 256
			getImage().setUrl("ill_liaison.png");
257
			imageWidth = getImage().getWidth();
130 aurelien 258
			imageHeight = getImage().getHeight();
213 aurelien 259
			if(imgZoom.isVisible()) {
260
				agrandirImage();
261
			}
245 aurelien 262
			activerPanneau(false);
263
		}
264
 
265
		if(infosImages != null && infosImages.length > 1) {
266
			prev.setEnabled(true);
267
			suiv.setEnabled(true);
268
		} else {
213 aurelien 269
			prev.setEnabled(false);
270
			suiv.setEnabled(false);
94 jpm 271
		}
272
	}
273
 
274
	/**
275
	 * Active visuellement le panneau et les boutons
276
	 */
245 aurelien 277
	public void activerPanneau(boolean activer) {
278
		if(activer) {
279
			this.getEl().unmask();
280
		} else {
281
			this.getEl().mask();
282
		}
94 jpm 283
	}
284
 
285
	/**
286
	 * Ajoute les listeners pour la gestions d'évènement
287
	 */
288
	public void ajouterListeners() {
289
 
290
		// gestion du clic sur le bouton précedent
338 aurelien 291
		prev.addClickHandler(new ClickHandler() {
94 jpm 292
 
1292 aurelien 293
			@Override
338 aurelien 294
			public void onClick(ClickEvent event) {
94 jpm 295
				if(infosImages.length != 0) {
296
					if(index == 0)
297
					{
298
						index = infosImages.length - 1 ;
299
					}
300
					else
301
					{
302
						index-- ;
303
					}
304
 
305
					afficherImage() ;
306
				}
307
			}
308
 
309
		});
310
 
311
		// gestion du clic sur le bouton suivant
338 aurelien 312
		suiv.addClickHandler(new ClickHandler() {
94 jpm 313
 
314
			// en cas de clic
1292 aurelien 315
			@Override
338 aurelien 316
			public void onClick(ClickEvent event) {
94 jpm 317
 
318
				if(infosImages.length != 0) {
319
					if(index == infosImages.length - 1)
320
					{
321
						index = 0 ;
322
					}
323
					else
324
					{
325
						index++ ;
326
					}
327
 
328
					afficherImage() ;
329
				}
330
 
331
			}
332
 
333
		});
130 aurelien 334
 
94 jpm 335
	}
336
 
337
	/**
338
	 * Accesseur pour le médiateur
339
	 *
340
	 * @return le médiateur associé à la vue
341
	 */
342
	public ObservationMediateur getIMediateur() {
343
		return oMediateur;
344
	}
345
 
346
	/**
347
	 * Accesseur au conteneur de l'image
348
	 *
349
	 * @return le conteneur de l'image
350
	 */
351
	public Image getImage() {
352
		return image;
353
	}
354
 
355
	/**
356
	 * Acesseurs pour l'identifiant de l'image
357
	 * @return l'id de l'image
358
	 */
359
	public String getIdImage()
360
	{
213 aurelien 361
		return infosImages[index][0] ;
94 jpm 362
	}
363
 
364
	/**
365
	 * Accesseur pour le bouton précédent
366
	 *
367
	 * @return le bouton précédent
368
	 */
369
	public com.google.gwt.user.client.ui.Button getPrev() {
370
		return prev;
371
	}
372
 
373
	/**
374
	 * Accesseur pour le bouton suivant
375
	 *
376
	 * @return le bouton suivant
377
	 */
378
	public com.google.gwt.user.client.ui.Button getSuiv() {
379
		return suiv;
380
	}
381
 
382
	/**
383
	 * Setter pour la taille de l'image
384
	 *
385
	 * @param x
386
	 *            la largeur en pixels
387
	 * @param y
388
	 *            la hauteur en pixels
389
	 */
390
	public void setTailleImage(int x, int y) {
391
		imageHeight = y;
392
		imageWidth = x;
393
	}
394
 
395
	/**
396
	 * Setteur pour l'identifiant de l'image
397
	 * @param id le nouvel identifiant
398
	 */
399
	public void setIdImage(String id)
400
	{
401
		idImage = id ;
402
	}
403
 
404
	/**
405
	 * renvoie la taille originale de l'image
406
	 *
407
	 * @return un tableau de deux entiers contenant la largeur puis la hauteur
408
	 */
409
	public int[] getTailleImage() {
410
		int[] taille = { imageHeight, imageWidth };
411
 
412
		return taille;
413
	}
414
 
415
	/**
416
	 * Accesseur pour le conteneur de l'image
417
	 * @return le conteur de l'image
418
	 */
419
	public Panel getImageConteneur() {
420
 
421
		return imageConteneur;
422
 
423
	}
104 jpm 424
 
425
	public void raz() {
426
 
213 aurelien 427
		infosImages = new String[0][0] ;
104 jpm 428
		getImage().setUrl("");
429
 
430
	}
431
 
432
	public void supprimerLiaisonImage() {
433
 
434
		if(infosImages.length > 0) {
435
 
436
			getImage().setUrl("") ;
437
			int nouvelleTaille = infosImages.length - 1 ;
438
			int indexSupp = index ;
439
 
213 aurelien 440
			String[][] nouveauInfosImages = new String[nouvelleTaille][3] ;
104 jpm 441
			int j = 0 ;
442
 
443
			for(int i = 0 ; i < infosImages.length ; i++) {
444
 
445
				if(i != indexSupp) {
446
 
447
					nouveauInfosImages[j] = infosImages[i] ;
448
					j++ ;
449
				}
450
			}
451
 
452
			infosImages = nouveauInfosImages ;
453
			index = 0 ;
454
 
455
			afficherImage() ;
456
		}
457
	}
458
 
459
	public void afficherMenu(int[] xy) {
460
 
461
		Menu mn = new Menu() ;
462
		final Item suppLiaison = new Item("Supprimer la liaison") ;
463
 
464
		mn.addItem(suppLiaison) ;
465
 
466
		mn.addListener(new MenuListenerAdapter() {
467
 
1292 aurelien 468
			@Override
104 jpm 469
			public void onItemClick(BaseItem item, EventObject e) {
470
 
471
				// si c'est l'aide
472
				if (item.equals(suppLiaison)) {
473
					// on notifie le médiateur
474
					getIMediateur().supprimerLiaisonObsImage() ;
475
				}
476
			}
477
 
478
		}) ;
479
 
480
		mn.showAt(xy) ;
481
	}
482
 
130 aurelien 483
	/**
484
	 * Verifie si l'image est plus grande que le conteneur et la retaille le cas
485
	 * echeant
486
	 */
487
	public void verifierEtRetaillerImage() {
213 aurelien 488
 
130 aurelien 489
		// si l'image est nulle
490
		if (image == null) {
491
			// on ne fait rien
492
			return;
493
		}
494
 
213 aurelien 495
		int[] dim = calculerDimensions(getTailleImage(),300,imageConteneur.getWidth());
145 aurelien 496
		getImage().setSize("" + dim[0] + "px",
497
				"" + dim[1] + "px");
130 aurelien 498
 
213 aurelien 499
		doLayout();
145 aurelien 500
 
213 aurelien 501
		if(imgZoom.isVisible()) {
502
			agrandirImage();
503
		}
130 aurelien 504
	}
145 aurelien 505
 
213 aurelien 506
	public int[] calculerDimensions(int[] tailleXY, double tailleMax, double tailleConteneur) {
145 aurelien 507
 
508
		float[] tailleXYf = {new Float(tailleXY[0]),new Float(tailleXY[1])} ;
213 aurelien 509
        float tailleOr = Math.min(new Float(tailleMax),new Float(tailleConteneur)) ;
145 aurelien 510
        float maxTaille = Math.max(tailleXYf[1],tailleXYf[0]) ;
511
        float[] XYresize = new float[2];
512
 
513
        if(maxTaille == tailleXY[0]) {
514
            float rapport = tailleXYf[1]/tailleXYf[0] ;
515
            XYresize[0] = tailleOr ;
516
            XYresize[1] = tailleOr*rapport ;
517
        }else {
518
            float rapport = tailleXYf[0]/tailleXYf[1] ;
519
            XYresize[1] = tailleOr ;
520
            XYresize[0] = tailleOr*rapport ;
521
        }
522
 
279 aurelien 523
        int[] res = {(int)Math.round(XYresize[0]*0.85),(int)Math.round(XYresize[1]*0.85)} ;
145 aurelien 524
 
525
        return res;
526
    }
213 aurelien 527
 
528
	protected void agrandirImage() {
529
 
530
			String urlAgrandie = "";
531
 
532
			if(infosImages == null) {
533
				urlAgrandie = "ill_liaison.png";
534
				setTailleImage(265, 270);
535
			} else {
735 aurelien 536
				urlAgrandie = getUrlAgrandie(index);
213 aurelien 537
			}
538
 
539
			if(imgAgrandie == null) {
540
				imgAgrandie = new Image(urlAgrandie);
541
				imgZoom.add(imgAgrandie);
542
 
338 aurelien 543
				imgAgrandie.addLoadHandler(new LoadHandler() {
213 aurelien 544
 
1292 aurelien 545
					@Override
338 aurelien 546
					public void onLoad(LoadEvent event) {
213 aurelien 547
						int[] tailleImage = calculerDimensions(getTailleImage(),getTailleImage()[1],Window.getClientHeight()*0.75);
548
						ExtElement imgElement = Ext.get(imgAgrandie.getElement());
549
						if(animerTransition) {
550
							AnimationConfig a = new AnimationConfig() ;
1292 aurelien 551
							a.setDuration(dureeAnimation);
213 aurelien 552
							imgElement.setHeight(tailleImage[1], a);
553
							imgElement.setWidth(tailleImage[0], a);
554
 
555
							ExtElement winElement = Ext.get(imgZoom.getElement());
556
							winElement.setHeight(tailleImage[1], a);
557
							winElement.setWidth(tailleImage[0], a);
558
						} else {
559
							imgElement.setHeight(tailleImage[1], false);
560
							imgElement.setWidth(tailleImage[0], false);
561
 
562
							ExtElement winElement = Ext.get(imgZoom.getElement());
563
							winElement.setHeight(tailleImage[1], false);
564
							winElement.setWidth(tailleImage[0], false);
565
						}
566
					}
567
 
568
				});
569
 
570
			} else {
571
				imgAgrandie.setUrl(urlAgrandie);
572
				imgAgrandie.setVisible(true);
573
			}
574
	}
575
 
735 aurelien 576
	private String getUrlMiniature(int index) {
577
 
973 aurelien 578
		String[][] paramsImage = {{"id_image",infosImages[index][0]}};
735 aurelien 579
		ImageCarnet ic = new ImageCarnet(paramsImage);
580
 
581
		return ic.getUrlFormatGalerie();
582
	}
583
 
584
	private String getUrlAgrandie(int index) {
973 aurelien 585
		String[][] paramsImage = {{"id_image",infosImages[index][0]}};
735 aurelien 586
		ImageCarnet ic = new ImageCarnet(paramsImage);
587
 
588
		return ic.getUrlFormatZoom();
589
	}
590
 
213 aurelien 591
	private void afficherPanneauAgrandi() {
237 aurelien 592
		agrandirImage();
593
		imgZoom.show(this.getElement());
594
		imgZoom.setPosition((int)(Window.getClientWidth() - Window.getClientWidth()*0.50),(int)(Window.getClientHeight() - Window.getClientHeight()*0.85));
213 aurelien 595
	}
94 jpm 596
}
597