1,21 → 1,30 |
package org.tela_botanica.client.vues.image; |
|
|
import org.tela_botanica.client.image.ImageMediateur; |
import org.tela_botanica.client.interfaces.Rafraichissable; |
|
import com.google.gwt.core.client.JavaScriptObject; |
import com.google.gwt.user.client.Event; |
import com.google.gwt.user.client.Timer; |
import com.google.gwt.user.client.Window; |
import com.google.gwt.user.client.ui.ClickListener; |
import com.google.gwt.user.client.ui.Image; |
import com.google.gwt.user.client.ui.KeyboardListener; |
import com.google.gwt.user.client.ui.KeyboardListenerCollection; |
import com.google.gwt.user.client.ui.LoadListener; |
import com.google.gwt.user.client.ui.MouseListener; |
import com.google.gwt.user.client.ui.MouseWheelListener; |
import com.google.gwt.user.client.ui.MouseWheelVelocity; |
import com.google.gwt.user.client.ui.ToggleButton; |
import com.google.gwt.user.client.ui.Widget; |
import com.gwtext.client.core.AnimationConfig; |
import com.gwtext.client.core.Direction; |
import com.gwtext.client.core.DomConfig; |
import com.gwtext.client.core.EventObject; |
import com.gwtext.client.core.Ext; |
import com.gwtext.client.core.ExtElement; |
import com.gwtext.client.core.Function; |
|
import com.gwtext.client.core.RegionPosition; |
import com.gwtext.client.dd.DragData; |
22,13 → 31,21 |
import com.gwtext.client.dd.DragSource; |
import com.gwtext.client.dd.DropTarget; |
import com.gwtext.client.dd.DropTargetConfig; |
import com.gwtext.client.widgets.Button; |
import com.gwtext.client.widgets.Component; |
import com.gwtext.client.widgets.Container; |
import com.gwtext.client.widgets.Panel; |
import com.gwtext.client.widgets.ToolTip; |
import com.gwtext.client.widgets.Toolbar; |
import com.gwtext.client.widgets.ToolbarButton; |
import com.gwtext.client.widgets.ToolbarTextItem; |
import com.gwtext.client.widgets.event.ButtonListener; |
import com.gwtext.client.widgets.event.ButtonListenerAdapter; |
import com.gwtext.client.widgets.event.PanelListenerAdapter; |
import com.gwtext.client.widgets.grid.GridDragData; |
import com.gwtext.client.widgets.layout.BorderLayout; |
import com.gwtext.client.widgets.layout.BorderLayoutData; |
import com.gwtext.client.widgets.menu.Menu; |
|
/** |
* Panneau d'affichage d'une image avec des boutons précdents et suivant |
102,6 → 119,28 |
*/ |
private boolean enClic = false; |
|
private ToolbarButton modeZoom = null; |
|
private ToolbarTextItem valeurZoom = new ToolbarTextItem("x 1"); |
|
private int sourisX = 0; |
|
private int sourisY = 0; |
|
private int sourisXFin = 0; |
|
private int sourisYFin = 0; |
|
private float niveauZoom = 1; |
|
private float pasZoom = new Float(0.1); |
|
private int maxZoom = 10; |
|
private float minZoom = new Float(0.5); |
|
protected boolean scroll = false; |
|
/** |
* Constructeur sans argument (privé car ne doit être utilisé) |
*/ |
150,6 → 189,14 |
prev.setWidth("60px"); |
suiv.setWidth("60px"); |
|
|
modeZoom = new ToolbarButton("Mode Zoom"); |
Toolbar tb = new Toolbar(); |
tb.addButton(modeZoom); |
tb.addItem(valeurZoom); |
|
//setTopToolbar(tb); |
|
this.add(prev, new BorderLayoutData(RegionPosition.WEST)); |
this.add(imageConteneur, new BorderLayoutData(RegionPosition.CENTER)); |
this.add(suiv, new BorderLayoutData(RegionPosition.EAST)); |
165,7 → 212,7 |
// on ajoute les listeners |
ajouterListeners(); |
|
tp.setDismissDelay(1750); |
tp.setDismissDelay(1050); |
tp.applyTo(image.getElement()) ; |
|
} |
181,6 → 228,7 |
public void rafraichir(Object nouvelleDonnees, |
boolean repandreRafraichissement) { |
|
//niveauZoom = 1; |
// si on reçoit une string |
if (nouvelleDonnees instanceof String[] && initialise |
&& conteneurInitialise) { |
238,7 → 286,32 |
* Ajoute les listeners pour la gestions d'évènement |
*/ |
public void ajouterListeners() { |
|
modeZoom.addListener(new ButtonListenerAdapter() { |
|
public void onClick(Button button, EventObject e) { |
// TODO Auto-generated method stub |
if(modeZoom.isPressed()) { |
modeZoom.toggle(false); |
} else { |
modeZoom.toggle(true); |
} |
} |
|
public void onToggle(Button button, boolean pressed) { |
if(pressed) { |
scroll = true; |
image.addStyleName("img-curseur-depl"); |
} else { |
scroll = false; |
image.removeStyleName("img-curseur-depl"); |
niveauZoom = 1; |
verifierEtRetaillerImage(); |
Ext.get(image.getElement()).center(imageConteneur.getElement()); |
} |
} |
}); |
|
image.addLoadListener(new LoadListener() { |
|
public void onError(Widget sender) { |
247,7 → 320,7 |
|
public void onLoad(Widget sender) { |
|
int max = Math.min(imageConteneur.getHeight(), imageConteneur.getWidth()); |
/*int max = Math.min(imageConteneur.getHeight(), imageConteneur.getWidth()); |
int[] tailleImage = calculerDimensions(getTailleImage(), max, max); |
ExtElement imgElement = Ext.get(image.getElement()); |
if(animerTransition) { |
258,7 → 331,9 |
} else { |
imgElement.setHeight(tailleImage[1], false); |
imgElement.setWidth(tailleImage[0], false); |
} |
}*/ |
verifierEtRetaillerImage(); |
Ext.get(image.getElement()).center(imageConteneur.getElement()); |
demasquerChargement(); |
} |
|
267,7 → 342,7 |
image.addClickListener(new ClickListener() { |
|
public void onClick(Widget sender) { |
|
if(!scroll) { |
if(enClic) { |
getIMediateur().doubleClicZoomImage(); |
} else { |
280,6 → 355,7 |
enClic = true; |
t.schedule(800); |
} |
} |
} |
|
}); |
289,14 → 365,76 |
public void onMouseWheel(Widget sender, MouseWheelVelocity velocity) { |
|
if(velocity.getDeltaY() > 0) { |
suiv.click(); |
if(scroll) { |
zoomOut(); |
} else { |
suiv.click(); |
} |
} else { |
prev.click(); |
if(scroll) { |
zoomIn(); |
} else { |
prev.click(); |
} |
} |
} |
|
}); |
|
image.addMouseListener(new MouseListener() { |
|
public void onMouseDown(Widget sender, int x, int y) { |
if(scroll) { |
Event.getCurrentEvent().preventDefault(); |
scroll = true; |
sourisX = x; |
sourisY = y; |
image.addStyleName("img-curseur-depl"); |
} |
} |
|
public void onMouseEnter(Widget sender) { |
// TODO Auto-generated method stub |
|
} |
|
public void onMouseLeave(Widget sender) { |
// TODO Auto-generated method stub |
|
} |
|
public void onMouseMove(Widget sender, int x, int y) { |
|
sourisXFin = x; |
sourisYFin = y; |
Event.getCurrentEvent().preventDefault(); |
} |
|
public void onMouseUp(Widget sender, int x, int y) { |
|
if(scroll) { |
Event.getCurrentEvent().preventDefault(); |
|
if(sourisX - sourisXFin > 0) { |
Ext.get(image.getElement()).move(Direction.LEFT, sourisX - sourisXFin, false); |
} |
|
if(sourisXFin - sourisX > 0) { |
Ext.get(image.getElement()).move(Direction.RIGHT, sourisXFin - sourisX, false); |
} |
|
if(sourisY - sourisYFin > 0) { |
Ext.get(image.getElement()).move(Direction.UP, sourisY - sourisYFin, false); |
} |
|
if(sourisYFin - sourisY > 0) { |
Ext.get(image.getElement()).move(Direction.DOWN, sourisYFin - sourisY, false); |
} |
} |
} |
|
}); |
|
// gestion du clic sur le bouton précedent |
prev.addClickListener(new ClickListener() { |
|
357,7 → 495,7 |
} |
|
// on prend la taille originale de l'image |
int originalX = getTailleImage()[0]; |
/*int originalX = getTailleImage()[0]; |
int originalY = getTailleImage()[1]; |
|
// on la transforme en float (la division entre entier donne de curieux |
374,7 → 512,7 |
|
// on prend la taille du conteneur |
int tailleConteneurX = imageConteneur.getWidth(); |
int tailleConteneurY = imageConteneur.getHeight(); |
int tailleConteneurY = imageConteneur.getHeight();*/ |
|
// si celle-ci est égale à 0 (conteneur mal initialisé) |
/* |
384,7 → 522,7 |
* this.getWidth() - prev.getOffsetWidth() * 2 ; |
* } |
*/ |
|
/* |
// si l'image ne rentre pas telle quelle (longueur ou hauteur trop |
// grande) |
if (originalY > tailleConteneurY || originalX > tailleConteneurX) { |
405,10 → 543,39 |
* rapportTaille); |
} |
} |
|
*/ |
// on modifie enfin la taille de l'image pour qu'elle soit affichée |
getImage().setSize("" + nouvelleTailleX + "px", |
"" + nouvelleTailleY + "px"); |
int max = Math.min(imageConteneur.getHeight(), imageConteneur.getWidth()); |
|
int[] tailleImage = new int[2]; |
ExtElement imgElement = Ext.get(image.getElement()); |
|
if(max == imageConteneur.getHeight()) { |
//tailleImage[0] = getTailleImage()[0]; |
//tailleImage[1] = max; |
imgElement.setHeight(max, false); |
} else { |
//tailleImage[1] = getTailleImage()[0]; |
//tailleImage[0] = max; |
imgElement.setWidth(max, false); |
} |
|
//int[] tailleImage = calculerDimensions(getTailleImage(), max, max); |
//imgElement. |
/*if(animerTransition) { |
AnimationConfig a = new AnimationConfig() ; |
a.setDuration((float) dureeAnimation); |
imgElement.setHeight(tailleImage[1], a); |
imgElement.setWidth(tailleImage[0], a); |
} else { |
imgElement.setHeight(tailleImage[1], false); |
imgElement.setWidth(tailleImage[0], false); |
}*/ |
|
String strZoom = ""+niveauZoom+""; |
strZoom = strZoom.substring(0,3); |
|
valeurZoom.setText("x "+strZoom); |
} |
|
public int[] calculerDimensions(int[] tailleXY, double tailleMax, double tailleConteneur) { |
428,7 → 595,7 |
XYresize[0] = tailleOr*rapport ; |
} |
|
int[] res = {Math.round(XYresize[0]),Math.round(XYresize[1])} ; |
int[] res = {(int)Math.round(XYresize[0]*niveauZoom),(int) Math.round(XYresize[1]*niveauZoom)} ; |
|
return res; |
} |
550,4 → 717,74 |
return imageConteneur; |
|
} |
|
private void zoomOut() { |
if(niveauZoom >= minZoom) { |
niveauZoom -= pasZoom; |
if(niveauZoom <= minZoom) { |
niveauZoom = minZoom; |
} |
verifierEtRetaillerImage(); |
gererDecalage(false); |
} |
} |
|
private void zoomIn() { |
if(niveauZoom < maxZoom ) { |
niveauZoom += pasZoom; |
if(niveauZoom >= maxZoom) { |
niveauZoom = maxZoom; |
} |
verifierEtRetaillerImage(); |
gererDecalage(true); |
} |
} |
|
private void gererDecalage(boolean in) { |
|
float nZoom = niveauZoom; |
|
if(niveauZoom < 1) { |
nZoom = 1/niveauZoom; |
} |
|
if(!in) { |
int diffX = imageConteneur.getWidth()/2 - sourisX; |
int diffY = imageConteneur.getHeight()/2 - sourisY; |
|
if(diffX > 0) { |
Ext.get(image.getElement()).move(Direction.RIGHT, (int)((diffX/maxZoom)/nZoom), false); |
} |
|
if(-diffX > 0) { |
Ext.get(image.getElement()).move(Direction.LEFT, (int)(-(diffX/maxZoom)/nZoom), false); |
} |
|
if(diffY > 0) { |
Ext.get(image.getElement()).move(Direction.DOWN, (int)((diffY/maxZoom)/nZoom), false); |
} |
|
if(-diffY > 0) { |
Ext.get(image.getElement()).move(Direction.UP, (int)(-(diffY/maxZoom)/nZoom), false); |
} |
} else { |
int diffX = imageConteneur.getWidth()/2; |
int diffY = imageConteneur.getHeight()/2; |
if(diffX > 0) { |
Ext.get(image.getElement()).move(Direction.LEFT, (int)((diffX/maxZoom)/nZoom), false); |
} |
|
if(-diffX > 0) { |
Ext.get(image.getElement()).move(Direction.RIGHT, (int)((-diffX/maxZoom)/nZoom), false); |
} |
|
if(diffY > 0) { |
Ext.get(image.getElement()).move(Direction.UP, (int)((diffY/maxZoom)/nZoom), false); |
} |
|
if(-diffY > 0) { |
Ext.get(image.getElement()).move(Direction.DOWN, (int)(-(diffY/maxZoom)/nZoom), false); |
} |
} |
} |
} |