Subversion Repositories eFlore/Applications.cel

Rev

Rev 338 | Rev 973 | Go to most recent revision | 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;
104 jpm 4
import org.tela_botanica.client.modeles.Configuration;
735 aurelien 5
import org.tela_botanica.client.modeles.ImageCarnet;
94 jpm 6
import org.tela_botanica.client.observation.ObservationMediateur;
7
 
338 aurelien 8
import com.google.gwt.event.dom.client.ClickEvent;
9
import com.google.gwt.event.dom.client.ClickHandler;
10
import com.google.gwt.event.dom.client.LoadEvent;
11
import com.google.gwt.event.dom.client.LoadHandler;
94 jpm 12
import com.google.gwt.user.client.DOM;
13
import com.google.gwt.user.client.Event;
213 aurelien 14
import com.google.gwt.user.client.Window;
94 jpm 15
import com.google.gwt.user.client.ui.ClickListener;
16
import com.google.gwt.user.client.ui.Image;
213 aurelien 17
import com.google.gwt.user.client.ui.LoadListener;
94 jpm 18
import com.google.gwt.user.client.ui.Widget;
213 aurelien 19
import com.gwtext.client.core.AnimationConfig;
94 jpm 20
import com.gwtext.client.core.EventObject;
213 aurelien 21
import com.gwtext.client.core.Ext;
22
import com.gwtext.client.core.ExtElement;
94 jpm 23
import com.gwtext.client.core.RegionPosition;
24
import com.gwtext.client.widgets.Panel;
213 aurelien 25
import com.gwtext.client.widgets.ToolTip;
94 jpm 26
import com.gwtext.client.widgets.layout.BorderLayout;
27
import com.gwtext.client.widgets.layout.BorderLayoutData;
104 jpm 28
import com.gwtext.client.widgets.menu.BaseItem;
29
import com.gwtext.client.widgets.menu.Item;
30
import com.gwtext.client.widgets.menu.Menu;
31
import com.gwtext.client.widgets.menu.event.MenuListenerAdapter;
94 jpm 32
 
33
/**
34
 * Panneau d'affichage d'une image avec des boutons précdents et suivant
35
 *
36
 * @author aurelien
37
 *
38
 */
39
public class MiniZoomImageVue extends Panel implements Rafraichissable {
40
 
41
	/**
42
	 * Le médiateur associé à la vue
43
	 */
44
	private ObservationMediateur oMediateur = null;
245 aurelien 45
 
46
	/**
47
	 * Le titre du panneau
48
	 */
49
	private static String titrePanneau = "Images liées";
94 jpm 50
 
51
	/**
52
	 * Panneau conteneur pour l'image
53
	 */
54
	private Panel imageConteneur = null;
55
	/**
56
	 * l'image à afficher
57
	 */
97 jpm 58
	private Image image = new Image("");
94 jpm 59
	/**
60
	 * Bouton précédent
61
	 */
62
	private final com.google.gwt.user.client.ui.Button prev = new com.google.gwt.user.client.ui.Button();
63
	/**
64
	 * Bouton suivant
65
	 */
66
	private final com.google.gwt.user.client.ui.Button suiv = new com.google.gwt.user.client.ui.Button();
67
 
68
	/**
69
	 * Taille originale Y de l'image
70
	 */
71
	private int imageHeight = 0;
72
 
73
	/**
74
	 * Taille originale X de l'image
75
	 */
76
	private int imageWidth = 0;
77
 
78
	/**
79
	 * Identifiant de l'image
80
	 */
81
	private String idImage = "0" ;
82
 
213 aurelien 83
	private String[] infosImages[] = null ;
94 jpm 84
 
85
	private int index = 0 ;
86
 
87
	/**
213 aurelien 88
	 * true pour animer les transitions
89
	 */
90
	private boolean animerTransition = false;
91
	/**
92
	 * Détermine la durée de la transition
93
	 */
94
	private float dureeAnimation = (float) 0.15;
95
 
96
	/**
94 jpm 97
	 * Booleen d'initalisation général
98
	 */
99
	private boolean initialise = false;
100
 
101
	/**
102
	 * Booleen d'initalisation du conteneur d'image
103
	 */
104
	private boolean conteneurInitialise = false;
213 aurelien 105
 
106
	private ToolTip tp = new ToolTip("<div class=\"x-tooltip-help\"> Double cliquez pour agrandir l'image </div>") ;
107
 
108
	com.gwtext.client.widgets.Window imgZoom = new com.gwtext.client.widgets.Window("Agrandissement") ;
109
 
110
	Image imgAgrandie = null;
94 jpm 111
 
112
	/**
113
	 * Constructeur sans argument (privé car ne doit être utilisé)
114
	 */
115
	@SuppressWarnings("unused")
116
	private MiniZoomImageVue() {
117
		super();
118
	}
119
 
120
	/**
121
	 * Constructeur avec argument
122
	 *
123
	 * @param im
124
	 *            le médiateur à associer à la vue
125
	 */
126
	public MiniZoomImageVue(ObservationMediateur im) {
245 aurelien 127
		super(titrePanneau);
94 jpm 128
		setId("x-view-mini-zoom-panel");
129
		// on associe le médiateur
130
		oMediateur = im;
131
 
132
		prev.setStylePrimaryName("x-view-zoom-button-p");
133
		suiv.setStylePrimaryName("x-view-zoom-button-s");
134
 
213 aurelien 135
		imgZoom.setCloseAction(com.gwtext.client.widgets.Window.HIDE) ;
298 aurelien 136
		imgZoom.setConstrain(true);
213 aurelien 137
 
94 jpm 138
		// on crée une image qui gère le double clic et la roulette de la souris
139
		image = new Image() {
140
 
141
			public void onBrowserEvent(Event event) {
142
 
143
				// lors d'un déplacement de la roulette
144
				if (Event.ONMOUSEWHEEL == DOM.eventGetType(event)) {
145
 
146
					// on simule un clic sur le bouton précédent
147
					if (event.getMouseWheelVelocityY() >= 1) {
148
						prev.click();
149
					}
150
 
151
					// ou suivant
152
					if (event.getMouseWheelVelocityY() <= -1) {
153
						suiv.click();
154
					}
155
				}
104 jpm 156
 
157
				if(Event.ONCONTEXTMENU == DOM.eventGetType(event)) {
158
 
159
					event.preventDefault() ;
160
					int[] xy = {event.getClientX(),event.getClientY()} ;
161
					afficherMenu(xy) ;
162
				}
213 aurelien 163
 
164
				// lors du double clic
165
				if (Event.ONDBLCLICK == DOM.eventGetType(event)) {
279 aurelien 166
					if(imgZoom.isVisible()) {
167
							imgZoom.hide();
168
					} else {
169
						afficherPanneauAgrandi();
170
					}
213 aurelien 171
				}
94 jpm 172
			}
173
 
174
		};
175
 
130 aurelien 176
		image.setPixelSize(150, 150);
177
 
213 aurelien 178
		infosImages = new String[0][0] ;
94 jpm 179
 
180
		this.setHeader(true);
181
 
182
		imageConteneur = new Panel() ;
183
		imageConteneur.setBorder(false);
184
 
185
		imageConteneur.add(image);
186
		imageConteneur.setId("x-view-mini-zoom-img");
187
 
188
		// il n'existe pas de méthode pour ajouter un listener pour le double
189
		// clic sur une image
190
		// alors on lui dit manuellement de capter l'évènement double clic
191
		image.sinkEvents(Event.ONDBLCLICK);
192
		image.sinkEvents(Event.ONMOUSEWHEEL);
104 jpm 193
		image.sinkEvents(Event.ONCONTEXTMENU) ;
94 jpm 194
 
195
		// l'image de base est vide
97 jpm 196
		image.setUrl("");
94 jpm 197
 
198
		this.setLayout(new BorderLayout());
199
 
130 aurelien 200
		prev.setWidth("15%");
201
		suiv.setWidth("15%");
94 jpm 202
 
203
		this.add(prev, new BorderLayoutData(RegionPosition.WEST));
204
		this.add(imageConteneur, new BorderLayoutData(RegionPosition.CENTER));
205
		this.add(suiv, new BorderLayoutData(RegionPosition.EAST));
206
 
207
		imageConteneur.setMaskDisabled(true);
208
		this.setBorder(false);
209
 
210
		conteneurInitialise = true;
211
		initialise = true;
212
 
213
		// on ajoute les listeners
214
		ajouterListeners();
215
 
216
	}
217
 
218
	/**
219
	 * Méthode héritée de l'interface rafraichissable
220
	 *
221
	 * @param nouvelleDonnees
222
	 *            les nouvelles données
223
	 * @param repandreRafraichissement
224
	 *            le booleen qui dit si on doit répnadre l'évènement
225
	 */
226
	public void rafraichir(Object nouvelleDonnees,
227
			boolean repandreRafraichissement) {
228
 
229
		// si on reçoit une string
213 aurelien 230
		if (nouvelleDonnees instanceof String[][] && initialise
231
				&& conteneurInitialise && ((String[][])nouvelleDonnees).length != 0) {
232
			infosImages = (String[][]) nouvelleDonnees;
94 jpm 233
			index = 0 ;
234
			afficherImage() ;
235
 
236
		} else {
237
			// sinon on met une image vide
213 aurelien 238
			infosImages = null ;
239
			afficherImage();
240
 
94 jpm 241
		}
242
	}
243
 
244
	public void afficherImage()
245
	{
246
		// c'est l'url de l'image qu'on associe à la vue
213 aurelien 247
		if(infosImages != null && infosImages.length != 0)
94 jpm 248
		{
245 aurelien 249
			setTitle(titrePanneau+"         "+(index+1)+" / "+infosImages.length);
250
 
735 aurelien 251
			getImage().setUrl(getUrlMiniature(index));
213 aurelien 252
			imageWidth = Integer.parseInt(infosImages[index][1]);
253
			imageHeight = Integer.parseInt(infosImages[index][2]);
254
			verifierEtRetaillerImage();
245 aurelien 255
			activerPanneau(true);
213 aurelien 256
		} else {
245 aurelien 257
			setTitle(titrePanneau);
213 aurelien 258
			getImage().setUrl("ill_liaison.png");
259
			imageWidth = getImage().getWidth();
130 aurelien 260
			imageHeight = getImage().getHeight();
213 aurelien 261
			if(imgZoom.isVisible()) {
262
				agrandirImage();
263
			}
245 aurelien 264
			activerPanneau(false);
265
		}
266
 
267
		if(infosImages != null && infosImages.length > 1) {
268
			prev.setEnabled(true);
269
			suiv.setEnabled(true);
270
		} else {
213 aurelien 271
			prev.setEnabled(false);
272
			suiv.setEnabled(false);
94 jpm 273
		}
274
	}
275
 
276
	/**
277
	 * Active visuellement le panneau et les boutons
278
	 */
245 aurelien 279
	public void activerPanneau(boolean activer) {
280
		if(activer) {
281
			this.getEl().unmask();
282
		} else {
283
			this.getEl().mask();
284
		}
94 jpm 285
	}
286
 
287
	/**
288
	 * Ajoute les listeners pour la gestions d'évènement
289
	 */
290
	public void ajouterListeners() {
291
 
292
		// gestion du clic sur le bouton précedent
338 aurelien 293
		prev.addClickHandler(new ClickHandler() {
94 jpm 294
 
338 aurelien 295
			public void onClick(ClickEvent event) {
94 jpm 296
				if(infosImages.length != 0) {
297
					if(index == 0)
298
					{
299
						index = infosImages.length - 1 ;
300
					}
301
					else
302
					{
303
						index-- ;
304
					}
305
 
306
					afficherImage() ;
307
				}
308
			}
309
 
310
		});
311
 
312
		// gestion du clic sur le bouton suivant
338 aurelien 313
		suiv.addClickHandler(new ClickHandler() {
94 jpm 314
 
315
			// en cas de clic
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
 
468
			public void onItemClick(BaseItem item, EventObject e) {
469
 
470
				// si c'est l'aide
471
				if (item.equals(suppLiaison)) {
472
					// on notifie le médiateur
473
					getIMediateur().supprimerLiaisonObsImage() ;
474
				}
475
			}
476
 
477
		}) ;
478
 
479
		mn.showAt(xy) ;
480
	}
481
 
130 aurelien 482
	/**
483
	 * Verifie si l'image est plus grande que le conteneur et la retaille le cas
484
	 * echeant
485
	 */
486
	public void verifierEtRetaillerImage() {
213 aurelien 487
 
130 aurelien 488
		// si l'image est nulle
489
		if (image == null) {
490
			// on ne fait rien
491
			return;
492
		}
493
 
213 aurelien 494
		int[] dim = calculerDimensions(getTailleImage(),300,imageConteneur.getWidth());
145 aurelien 495
		getImage().setSize("" + dim[0] + "px",
496
				"" + dim[1] + "px");
130 aurelien 497
 
213 aurelien 498
		doLayout();
145 aurelien 499
 
213 aurelien 500
		if(imgZoom.isVisible()) {
501
			agrandirImage();
502
		}
130 aurelien 503
	}
145 aurelien 504
 
213 aurelien 505
	public int[] calculerDimensions(int[] tailleXY, double tailleMax, double tailleConteneur) {
145 aurelien 506
 
507
		float[] tailleXYf = {new Float(tailleXY[0]),new Float(tailleXY[1])} ;
213 aurelien 508
        float tailleOr = Math.min(new Float(tailleMax),new Float(tailleConteneur)) ;
145 aurelien 509
        float maxTaille = Math.max(tailleXYf[1],tailleXYf[0]) ;
510
        float[] XYresize = new float[2];
511
 
512
        if(maxTaille == tailleXY[0]) {
513
            float rapport = tailleXYf[1]/tailleXYf[0] ;
514
            XYresize[0] = tailleOr ;
515
            XYresize[1] = tailleOr*rapport ;
516
        }else {
517
            float rapport = tailleXYf[0]/tailleXYf[1] ;
518
            XYresize[1] = tailleOr ;
519
            XYresize[0] = tailleOr*rapport ;
520
        }
521
 
279 aurelien 522
        int[] res = {(int)Math.round(XYresize[0]*0.85),(int)Math.round(XYresize[1]*0.85)} ;
145 aurelien 523
 
524
        return res;
525
    }
213 aurelien 526
 
527
	protected void agrandirImage() {
528
 
529
			String urlAgrandie = "";
530
 
531
			if(infosImages == null) {
532
				urlAgrandie = "ill_liaison.png";
533
				setTailleImage(265, 270);
534
			} else {
735 aurelien 535
				urlAgrandie = getUrlAgrandie(index);
213 aurelien 536
			}
537
 
538
			if(imgAgrandie == null) {
539
				imgAgrandie = new Image(urlAgrandie);
540
				imgZoom.add(imgAgrandie);
541
 
338 aurelien 542
				imgAgrandie.addLoadHandler(new LoadHandler() {
213 aurelien 543
 
338 aurelien 544
					public void onLoad(LoadEvent event) {
213 aurelien 545
						int[] tailleImage = calculerDimensions(getTailleImage(),getTailleImage()[1],Window.getClientHeight()*0.75);
546
						ExtElement imgElement = Ext.get(imgAgrandie.getElement());
547
						if(animerTransition) {
548
							AnimationConfig a = new AnimationConfig() ;
549
							a.setDuration((float) dureeAnimation);
550
							imgElement.setHeight(tailleImage[1], a);
551
							imgElement.setWidth(tailleImage[0], a);
552
 
553
							ExtElement winElement = Ext.get(imgZoom.getElement());
554
							winElement.setHeight(tailleImage[1], a);
555
							winElement.setWidth(tailleImage[0], a);
556
						} else {
557
							imgElement.setHeight(tailleImage[1], false);
558
							imgElement.setWidth(tailleImage[0], false);
559
 
560
							ExtElement winElement = Ext.get(imgZoom.getElement());
561
							winElement.setHeight(tailleImage[1], false);
562
							winElement.setWidth(tailleImage[0], false);
563
						}
564
					}
565
 
566
				});
567
 
568
			} else {
569
				imgAgrandie.setUrl(urlAgrandie);
570
				imgAgrandie.setVisible(true);
571
			}
572
	}
573
 
735 aurelien 574
	private String getUrlMiniature(int index) {
575
 
576
		String[][] paramsImage = {{"ci_id_image",infosImages[index][0]}};
577
		ImageCarnet ic = new ImageCarnet(paramsImage);
578
 
579
		return ic.getUrlFormatGalerie();
580
	}
581
 
582
	private String getUrlAgrandie(int index) {
583
		String[][] paramsImage = {{"ci_id_image",infosImages[index][0]}};
584
		ImageCarnet ic = new ImageCarnet(paramsImage);
585
 
586
		return ic.getUrlFormatZoom();
587
	}
588
 
213 aurelien 589
	private void afficherPanneauAgrandi() {
237 aurelien 590
		agrandirImage();
591
		imgZoom.show(this.getElement());
592
		imgZoom.setPosition((int)(Window.getClientWidth() - Window.getClientWidth()*0.50),(int)(Window.getClientHeight() - Window.getClientHeight()*0.85));
213 aurelien 593
	}
94 jpm 594
}
595