Subversion Repositories eFlore/Applications.cel

Rev

Rev 235 | Blame | Compare with Previous | Last modification | View Log | RSS feed

package org.tela_botanica.client.vues.image;

import org.tela_botanica.client.image.ImageMediateur;
import org.tela_botanica.client.interfaces.ListePaginable;
import org.tela_botanica.client.interfaces.Rafraichissable;
import org.tela_botanica.client.interfaces.VueListable;
import org.tela_botanica.client.vues.BarrePaginationVue;

import com.google.gwt.user.client.Element;
import com.google.gwt.user.client.ui.HTML;
import com.gwtext.client.core.EventCallback;
import com.gwtext.client.core.EventObject;
import com.gwtext.client.core.Ext;
import com.gwtext.client.core.ExtElement;
import com.gwtext.client.core.XTemplate;
import com.gwtext.client.data.FieldDef;
import com.gwtext.client.data.IntegerFieldDef;
import com.gwtext.client.data.Record;
import com.gwtext.client.data.RecordDef;
import com.gwtext.client.data.Store;
import com.gwtext.client.data.StringFieldDef;
import com.gwtext.client.dd.DragData;
import com.gwtext.client.dd.DragSource;
import com.gwtext.client.dd.DropTarget;
import com.gwtext.client.dd.DropTargetConfig;
import com.gwtext.client.util.Format;
import com.gwtext.client.widgets.Component;
import com.gwtext.client.widgets.Container;
import com.gwtext.client.widgets.DataView;
import com.gwtext.client.widgets.Panel;
import com.gwtext.client.widgets.event.ContainerListener;
import com.gwtext.client.widgets.event.ContainerListenerAdapter;
import com.gwtext.client.widgets.event.DataViewListener;
import com.gwtext.client.widgets.event.DataViewListenerAdapter;
import com.gwtext.client.widgets.event.PanelListenerAdapter;
import com.gwtext.client.widgets.grid.GridDragData;

/**
 * Galerie d'images miniatures Avec barre de pagination
 * 
 * @author aurelien
 */
public class GalerieImageVue extends Panel implements Rafraichissable,
                VueListable, ListePaginable {

        /**
         * instance du médiateur
         */
        private ImageMediateur iMediateur = null;
        /**
         * Dataview, littéralement "vue de données" qui permet de définir la manière
         * d'afficher les données
         */
        private DataView dView = null;
        /**
         * Dataview, littéralement "vue de données" qui permet de définir la manière
         * d'afficher les données
         */
        private Store st = null;
        /**
         * Barre de pagination gérant l'affichage d'un nombre donné d'élements par
         * page et la navigation entre eux
         */
        private BarrePaginationVue pt = null;
        /**
         * Booleen indiquant si la galerie est instanciée ou pas
         */
        private boolean estInstancie = false;
        
        private boolean garderRatio = true;
        
        private int tailleOr = 100 ;
        
        boolean lienUploadInitialise = false ;
        
        HTML videPanel = null ;


        /**
         * Constructeur sans argument, privé car ne doit pas être utilisé
         */
        @SuppressWarnings("unused")
        private GalerieImageVue() {
                super();
        }

        /**
         * Constructeur avec argument
         * 
         * @param im
         *            le médiateur avec lequel la vue va communiquer
         */
        public GalerieImageVue(ImageMediateur im) {
                super("Galerie");
                iMediateur = im;
                
                // on ajoute des listeners au composant tout entier
                this.addListener(new ContainerListenerAdapter() {

                        // pour gagner du temps on n'instancie la vue en elle même que lors
                        // du premier affichage (lazy rendering)

                        public void onShow(Component component) {

                                if (!estInstancie) {
                                        initialiser();
                                }
                                
                        }
                });
                
                AjouterListenersLiens();

                // et on ajoute la tool bar
                pt = new BarrePaginationVue(this);
                pt.setLabelElement("Images");
                pt.setTaillePageParDefaut(50);
                this.setBottomToolbar(pt);

        }

        /**
         * Ajoute tous les listeners nécessaires à l'intercation utilisateur avec la
         * vue de données
         */
        public void ajouterListenersDataView() {

                // ajout de listeners pour la gestion de la selection
                // dans la galerie
                
                dView.addListener(new DataViewListenerAdapter() {

                        // gestion du clic sur une image

                        public void onClick(DataView source, int index, Element node,
                                        EventObject e) {
                                
                                // on en notifie le médiateur
                                getIMediateur().clicGalerieImage(index, node, e);

                        }

                        // gestion du clic droit

                        public void onContextMenu(DataView source, int index, Element node,
                                        EventObject e) {

                                // on stoppe l'évenement
                                e.stopEvent();
                                // et on notifie le médiateur
                                getIMediateur().montrerContextMenu(e);

                        }

                        // gestion du double clic

                        public void onDblClick(DataView source, int index, Element node,
                                        EventObject e) {

                                // on notife le mediateur
                                getIMediateur().clicGalerieImage(index, node, e);

                        }

                        // gestion des actions en fonction de la selection

                        public void onSelectionChange(DataView view, Element[] selections) {

                                // s'il n'y a aucun élement sélectionné
                                if (selections.length <= 0) {
                                        // on en notifie le médiateur
                                        getIMediateur().aucuneSelection();
                                } else {
                                        // sinon on notifie le médiateur
                                        getIMediateur().selection();
                                        // et on lui demande de synchroniser la séléction avec les
                                        // autres vues
                                        getIMediateur().synchroniserSelection("galerie");
                                }
                        }
                });
        }

        /**
         * Accesseur pour la dataview
         * 
         * @return la dataview
         */
        public DataView getDView() {
                return dView;
        }

        /**
         * Renvoie les ids des images sélectionnées
         * 
         * @return un tableau de String contenant les identifiants des images
         *         sélectionnées
         */
        public String[] getIdSelectionnees() {
                Record[] selection = getDView().getSelectedRecords();
                int taille = selection.length;
                String id_selection[] = new String[taille];

                for (int i = 0; i < selection.length; i++) {

                        id_selection[i] = selection[i].getAsString("num_image");
                }

                return id_selection;
        }

        /**
         * Accesseur pour le médiateur
         * 
         * @return le médiateur associé à la vue
         */
        public ImageMediateur getIMediateur() {
                return iMediateur;
        }

        /**
         * Accesseur pour le store
         * 
         * @return le store associé à la vue
         */
        public Store getSt() {
                return st;
        }

        /**
         * Accesseur pour la toolbar
         * 
         * @return la toolbar associée à la vue
         */
        public BarrePaginationVue getToolBarVue() {
                return pt;
        }

        /**
         * Fonction d'initialisation du contenu (appelée lors du premier affichage
         * de la liste)
         */
        public void initialiser() {

                // Preparation de la dataview et du template
                // le template va créer une div contenant une image
                // pour chacune des photos
                final XTemplate template = new XTemplate(
                                new String[] {
                                                "<tpl for='.'>",
                                                "<div class='thumb-wrap' id='{num_image}'>",
                                                "<div class='thumb dview-list'><img src='{url_image_M}' width='{taille_x_s} px' height='{taille_y_s} px' title='{nom_original}'></div>",
                                                "<span></span></div>", "</tpl>",
                                                "<div class='x-clear'></div>" });
                // pour des raisons de performances on compile le template en une
                // fonction
                template.compile();

                // la dataview affichera les images en accord avec le template
                // cree precedemment
                dView = new DataView("div.thumb-wrap") {

                        public void prepareData(Data data) {
                                data.setProperty("shortName", Format.ellipsis(data
                                                .getProperty("nom_original"), 15));
                                
                                int[] XY = {data.getPropertyAsInt("taille_x") ,data.getPropertyAsInt("taille_y")} ;
                                int[] XYresize ;
                                
                                if(garderRatio) {
                                        XYresize = calculerDimensions(XY);
                                }
                                else {
                                        XYresize = new int[2] ;
                                        XYresize[0] = XYresize[1] = tailleOr ;
                                        
                                }
                                
                                data.setProperty("taille_x_s", XYresize[0]);
                                data.setProperty("taille_y_s", XYresize[1]);    
                        }
                };
                dView.setTpl(template);

                // parametre d'affichage de la dataview
                this.setAutoScroll(true);
                dView.setAutoHeight(true);
                dView.setMultiSelect(true);
                dView.setOverCls("x-view-over");
                dView.setEmptyText("");

                // creation du store
                FieldDef defNumImage = new IntegerFieldDef("num_image");
                FieldDef defNomImage = new StringFieldDef("nom_original");
                FieldDef defDatImage = new StringFieldDef("dat_image");
                FieldDef defLieImage = new StringFieldDef("lie_image");
                FieldDef defAppImage = new StringFieldDef("app_image");
                FieldDef defUrlImageS = new StringFieldDef("url_image_S");
                FieldDef defUrlImageM = new StringFieldDef("url_image_M");
                FieldDef defUrlImage = new StringFieldDef("url_image");
                FieldDef defTailleX = new IntegerFieldDef("taille_x");
                FieldDef defTailleY = new IntegerFieldDef("taille_y");
                FieldDef[] defTab = { defNumImage, defNomImage, defDatImage, defLieImage,
                                defAppImage, defUrlImageS, defUrlImageM, defUrlImage,defTailleX,defTailleY};
                RecordDef rd = new RecordDef(defTab);
                st = new Store(rd);
                dView.setStore(st);

                this.getDView().setLoadingText("chargement");

                this.add(dView);
                dView.hide();
                
                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/> " +
                                "                       <a id=\"lienUploadSimple\" href=\"#\" > Cliquez ici pour ajouter un fichier à la fois </a> <br/> " +
                                "                       Pour ajouter des images plus tard, allez dans le menu Fichier -> Ajouter des images </div>");
                this.add(videPanel);
                
                // ajouts de la gestion des evenements pour la dataview
                configDragAndDrop() ;
                ajouterListenersDataView();
                
                estInstancie = true ;
                
        }
        
        public void configDragAndDrop()
        {
                // on fabrique la nouvelle configuration
                // les éléments sur lesquels on fait du drag 'n drop doivent tous avoir le même ddGroup
                DropTargetConfig dtc = new DropTargetConfig();
                dtc.setdDdGroup("DragGroupName");

                //La drop target permet de gérer l'évenement onDrop sur l'élement courant
                @SuppressWarnings("unused")
                DropTarget tg = new DropTarget(this, dtc)
                {
                        public boolean notifyDrop(DragSource source, EventObject e, DragData data){             
                                
                                // si les données proviennent d'une grille
                                if(data instanceof GridDragData)
                        {
                                        // on appelle le médiateur
                                        return iMediateur.lierObsDD(source, e, data,getId()) ;   
                        }
                                return false ;
                        }
                        
                        public String notifyOver(DragSource source, EventObject e, DragData data){
                            return "x-dd-drop-ok";
                        }
                };
        
        }

        /**
         * Méthode héritée de l'interface rafraichissable
         */
        public void rafraichir(Object nouvelleDonnees,
                        boolean repandreRafraichissement) {

                // si l'objet reçu est un store
                if (nouvelleDonnees instanceof Store) {

                                st = (Store) nouvelleDonnees;
                                
                        if(st.getCount() != 0) {
                                
                                // on le charge
                                st.load();
        
                                if(videPanel.isVisible()) {
                                        videPanel.setVisible(false) ;
                                }
                                
                                if(!dView.isVisible()) {
                                        dView.setVisible(true);
                                }
                                        // on l'affecte à la vue
                                        dView.setStore(st);
                                        // et on rafrachit la vue
                                        dView.refresh();
                        }
                        else 
                        {
                                st.removeAll();
                                st.load();
                                dView.setStore(st);
                                
                                if(dView.isVisible()) {
                                        dView.hide() ;
                                }
                                
                                if(!videPanel.isVisible()) {
                                        videPanel.setVisible(true);
                                        AjouterListenersLiens();
                                }
                                
                        }
                }

                // si le composant doit répandre le rafraichissement
                if (repandreRafraichissement) {
                        // il en notifie le médiateur en lui donnant une copie des données
                        // et en notifiant qu'il en est l'expéditeur
                        getIMediateur().synchroniserDonneesZoomListeGalerie(
                                        nouvelleDonnees, this);
                }       
        }

        /**
         * Méthode héritée de l'interface VueListable Sélectionne les images dans la
         * galerie suivant les identifiants donnés en paramètres
         * 
         * @param ids
         *            les identifiants des images à sélectionner
         */
        public void selectionnerImages(int[] ids) {

                getDView().select(ids);

        }

        public void changerNumeroPage(int pageCourante) {
                
                iMediateur.changerNumeroPage(pageCourante) ;
                
        }

        public void changerTaillePage(int nouvelleTaillePage) {
                
                iMediateur.changerTaillePage(nouvelleTaillePage) ;
        }
        
        public int[] calculerDimensions(int[] tailleXY) {
            
                float[] tailleXYf = {new Float(tailleXY[0]),new Float(tailleXY[1])} ;
        float tailleOr = this.tailleOr ;
        float maxTaille = Math.max(tailleXYf[1],tailleXYf[0]) ;
        float[] XYresize = new float[2];
        
        if(maxTaille == tailleXY[0]) {
            float rapport = tailleXYf[1]/tailleXYf[0] ;
            XYresize[0] = tailleOr ;
            XYresize[1] = tailleOr*rapport ;
        }else {
            float rapport = tailleXYf[0]/tailleXYf[1] ;
            XYresize[1] = tailleOr ;
            XYresize[0] = tailleOr*rapport ;
        }
        
        int[] res = {Math.round(XYresize[0]),Math.round(XYresize[1])} ;
        
        return res;
    }
        
        private void AjouterListenersLiens() {

                addListener(new PanelListenerAdapter() {
                        
                        public void onAfterLayout(Container c) {
                                ExtElement uploadS = Ext.get("lienUploadSimple");
                                uploadS.removeAllListeners();
                                uploadS.addListener("click", new EventCallback() {
                                        public void execute(EventObject e) {
                                                getIMediateur().uploaderImages(false);
                                        }
                                        
                                }) ;
                        
                                ExtElement uploadM = Ext.get("lienUploadMultiple");
                                uploadM.removeAllListeners();
                                uploadM.addListener("click", new EventCallback() {
                                        public void execute(EventObject e) {
                                                getIMediateur().uploaderImages(true);
                                        }
                                });
                        }

                });
        }
}