Subversion Repositories eFlore/Applications.cel

import {WidgetsSaisiesASL} from './WidgetsSaisiesASL.js';
import {valOk} from './Utils.js';

/**
 * Constructeur PlantesEtLichensASL par défaut
 * S'applique au squelette apaforms.tpl.html
 * Qui se charge dans apa.tpl.php
 * Lors de la saisie des plantes ou des lichens
 */
// ASL : APA, sTREETs, Lichen's Go!
export function PlantesEtLichensASL(plantesEtLichensProp) {
        if  ( valOk( plantesEtLichensProp ) && valOk( widgetProp ) ) {
                this.sujet             = plantesEtLichensProp.sujet;
                this.tagImg            = plantesEtLichensProp.tagImg;
                this.separationTagImg  = plantesEtLichensProp.separationTagImg;
                this.tagImg            = plantesEtLichensProp.tagImg;
                this.tagObs            = plantesEtLichensProp.tagObs;
                this.separationTagObs  = plantesEtLichensProp.separationTagObs;
                this.nomSciReferentiel = plantesEtLichensProp.nomSciReferentiel;
                this.referentielImpose = plantesEtLichensProp.referentielImpose;
                this.tagsMotsCles      = widgetProp.tagsMotsCles + ',' + this.sujet;
        }
        this.isTaxonListe = false;
        this.numArbre     = 0;
}
PlantesEtLichensASL.prototype = new WidgetsSaisiesASL();

/**
 * Initialise le formulaire, les validateurs, les listes de complétion...
 */
PlantesEtLichensASL.prototype.initForm = function() {
        $('[type="date"]').prop('max', function(){
                return new Date().toJSON().split('T')[0];
        });
        this.initFormTaxonListe();
        this.configurerFormValidator();
        this.definirReglesFormValidator();
};

/**
 * Initialise les écouteurs d'événements
 */
PlantesEtLichensASL.prototype.initEvts = function() {
        const idUtilisateur = $( '#id_utilisateur' ).val();

        if( valOk( idUtilisateur ) ) {
                // #releve-data est modifié, bouton dans #releves-utilisateur
                this.btnsChargerForm( '#bouton-nouveau-releve' );
                if( valOk( $( '#releve-data' ).val() ) ) {
                        this.releveDatas = $.parseJSON( $( '#releve-data' ).val() );
                        if ( valOk( this.releveDatas[0].utilisateur, true, idUtilisateur ) ) {
                                // Sur téléchargement image
                                this.initEvtsFichier();
                                // Création / Suppression / Transmission des obs
                                // Défilement des miniatures dans le résumé obs
                                this.initEvtsObs();

                                // chargement plantes ou lichens, ajout du bouton #poursuivre
                                const btnChargementForm = this.determinerBtnsChargementForm( '#', true );

                                // #releve-data n'est pas modifié, bouton dans #charger-form
                                this.btnsChargerForm( btnChargementForm, false, false );
                                if ( 'lichens' === this.sujet ) {
                                        this.checkboxToutesLesFaces();
                                }
                                // Alertes et aides
                                this.initEvtsAlertes();
                        }
                }
        }
};

// Ajouter Obs ****************************************************************/
PlantesEtLichensASL.prototype.reinitialiserForm = function() {
        this.supprimerMiniatures();
        $( '#taxon,#taxon-autre,#commentaire' ).val( '' );
        $( '#taxon' ).removeData([
                'value',
                'numNomSel',
                'nomRet',
                'numNomRet',
                'nt',
                'famille'
        ]);
        $( '#taxon-liste,#certitude' ).find( 'option' ).each( function() {
                if ( $( this ).hasClass( 'choisir' ) ) {
                        $( this ).attr( 'selected', true );
                } else {
                        $( this ).attr( 'selected', false );
                }
        });
        $( '#taxon-input-groupe' ).addClass( 'hidden' );
        if ( 'lichens' === this.sujet ) {
                $( 'input[name=lichens-tronc]:checked' ).each( function() {
                        $( this ).prop( 'checked', false );
                });
        }
};

PlantesEtLichensASL.prototype.checkboxToutesLesFaces = function() {
        $('input[name=lichens-tronc]').on( 'click', function( event ) {
                const face = $( this ).data( 'face' );

                if ( $( this ).is( ':checked' ) ) {
                        if( $( this ).hasClass( 'lichens-tronc-all' ) ) {
                                for ( let i = 1; i <= 5 ; i++ ) {
                                        $( '#lichens-tronc-' + face + i ).prop( 'checked', false );
                                }
                        } else {
                                $( '#lichens-tronc-all-' + face ).prop( 'checked', false );
                        }
                }

        });
};

/**
 * Retourne un Array contenant les valeurs des champs
 * dont les données seront transmises dans la table cel-obs-etendues
 */
PlantesEtLichensASL.prototype.getObsChpSpecifiques = function( numArbre ) {
        const retour = [
                { cle : 'num-arbre', valeur : numArbre },
                { cle : 'id_obs_arbre', valeur : this.releveDatas[numArbre]['id_observation'] },
                { cle : 'rue' , valeur : this.releveDatas[0].rue  }
        ];

        if ( 'lichens' === this.sujet ) {
                const $lichensTronc = $( 'input[name=lichens-tronc]:checked' ),
                        LTLenght = $lichensTronc.length;
                let valeursLT  = '';

                $( 'input[name=lichens-tronc]:checked' ).each( function( i, value ) {
                        valeursLT += $(value).val();
                        if( i < LTLenght ) {
                                valeursLT += ';';
                        }
                });
                retour.push({ cle : 'loc-sur-tronc', valeur : valeursLT });
        }

        return retour;
};

// Form Validator *************************************************************/
PlantesEtLichensASL.prototype.definirReglesFormValidator = function() {
        const lthis = this;

        $( 'input[type=date]' ).on( 'input', function() {
                $( this ).valid();
        });
        // Validation Taxon si pas de miniature
        $( '#taxon' ).on( 'change', function() {
                const images = valOk( $( '#miniatures .miniature' ) );

                lthis.validerTaxonImage( valOk( $( this ).val() ), images );
        });

        // // Validation miniatures avec MutationObserver
        // this.surPresenceAbsenceMiniature();

        $( '#form-' + this.sujet ).validate({
                rules : {
                        'choisir-arbre' : {
                                required : true,
                                minlength : 1
                        },
                        'obs-date' : {
                                required : true,
                                'dateCel' : true
                        },
                        certitude : {
                                required : true,
                                minlength : 1
                        }
                }
        });
        $( '#form-observateur' ).validate({
                rules : {
                        courriel : {
                                required : true,
                                minlength : 1,
                                email : true,
                                'userEmailOk' : true
                        },
                        mdp : {
                                required : true,
                                minlength : 1
                        }
                }
        });
        $( '#connexion,#inscription,#oublie' ).on( 'click', function() {
                $( '#tb-observateur .control-group' ).removeClass( 'error' );
        });
};

PlantesEtLichensASL.prototype.validerTaxonImage = function( taxon = false, images = false ) {
        const taxonOuImage = images || taxon;

        if ( taxonOuImage ) {
                this.masquerPanneau( '#dialogue-taxon-or-image' );
                $( '#bloc-taxon' ).removeClass( 'error' )
                        .find( 'span.error' ).hide();
                $( '#fichier' ).parent( 'label.label-file' ).removeClass( 'error' );
                $( '#photos-conteneur').removeClass( 'error' ).find( 'span.error' ).hide();
                // faire passer la certitude à 'à déterminer' si on a une image et pas de taxon
                if( !taxon ) {
                        $( '#certitude' ).find( 'option' ).each( function() {
                                if ( $( this ).hasClass( 'aDeterminer' ) ) {
                                        $( this ).attr( 'selected', true );
                                } else {
                                        $( this ).attr( 'selected', false );
                                }
                        });
                }
        } else {
                this.afficherPanneau( '#dialogue-taxon-or-image' );
                $( '#bloc-taxon' ).addClass( 'error' )
                        .find( 'span.error' ).show();
                $( '#fichier' ).parent( 'label.label-file' ).addClass( 'error' );
                $( '#photos-conteneur').addClass( 'error' ).find( 'span.error' ).show();
        }

        return taxonOuImage;
};

/**
 * Valide le formulaire au click sur un bouton "suivant"
 */
PlantesEtLichensASL.prototype.validerForm = function() {
        const images     = valOk( $( '#miniatures .miniature' ) ),
                taxon        = valOk( $( '#taxon' ).val() ),
                taxonOuImage = this.validerTaxonImage( taxon, images ),
                observateur  = $( '#form-observateur' ).valid() && $( '#courriel' ).valid(),
                obs          = $( '#form-' + this.sujet ).valid();

        // panneau observateur
        if ( observateur ) {
                this.masquerPanneau( '#dialogue-utilisateur-non-identifie' );
                $( '#tb-observateur .control-group' ).removeClass( 'error' );
        } else {
                this.afficherPanneau( '#dialogue-utilisateur-non-identifie' );
                $( '#tb-observateur .control-group' ).addClass( 'error' );
        }

        return ( observateur && obs && taxonOuImage );
};