Subversion Repositories eFlore/Applications.cel

import {WidgetsSaisiesCommun,utils} from './WidgetsSaisiesCommun.js';
import {initialiserModule} from './InitialisationASL.js';
import {valOk} from './Utils.js';

/**
 * Constructeur WidgetsSaisiesASL par défaut
 * S'applique au squelette apa.tpl.html
 * Squelette de base d'apa streets et lg
 */
// ASL : APA, sTREETs, Lichen's Go!
export function WidgetsSaisiesASL() {
        WidgetsSaisiesCommun.call(this);

        if  ( valOk( widgetProp ) ) {
                this.urlWidgets                        = widgetProp.urlWidgets;
                this.projet                            = widgetProp.projet;
                this.idProjet                          = widgetProp.idProjet;
                this.tagsMotsCles                      = widgetProp.tagsMotsCles;
                this.mode                              = widgetProp.mode;
                this.langue                            = widgetProp.langue;
                this.serviceObsImgs                    = widgetProp.serviceObsImgs;
                this.serviceObsImgUrl                  = widgetProp.serviceObsImgUrl;
                this.serviceAnnuaireIdUrl              = widgetProp.serviceAnnuaireIdUrl;
                this.serviceNomCommuneUrl              = widgetProp.serviceNomCommuneUrl;
                this.serviceNomCommuneUrlAlt           = widgetProp.serviceNomCommuneUrlAlt;
                this.debug                             = widgetProp.debug;
                this.html5                             = widgetProp.html5;
                this.serviceSaisieUrl                  = widgetProp.serviceSaisieUrl;
                this.serviceObsUrl                     = widgetProp.serviceObsUrl;
                this.chargementImageIconeUrl           = widgetProp.chargementImageIconeUrl;
                this.pasDePhotoIconeUrl                = widgetProp.pasDePhotoIconeUrl;
                this.autocompletionElementsNbre        = widgetProp.autocompletionElementsNbre;
                this.serviceAutocompletionNomSciUrl    = widgetProp.serviceAutocompletionNomSciUrl;
                this.serviceAutocompletionNomSciUrlTpl = widgetProp.serviceAutocompletionNomSciUrlTpl;
                this.dureeMessage                      = widgetProp.dureeMessage;
                this.obsMaxNbre                        = widgetProp.obsMaxNbre;
        }
        this.urlRacine            = window.location.origin;
        this.isASL                = true;
        this.nbObsEnCours         = 1;
        this.obsNbre              = 0;
        this.totalObsATransmettre = 0;
        this.nbObsTransmises      = 0;
        this.tagImg               = null;
        this.tagObs               = null;
        this.separationTagImg     = null;
        this.separationTagObs     = null;
        this.nomSciReferentiel    = null;
        this.referentielImpose    = null;
        this.releveDatas          = null;
        this.urlBaseAuth          = null;
        this.idUtilisateur        = null;
        this.sujet                = null;
        this.isTaxonListe         = false;
        this.geoloc               = {};
}
WidgetsSaisiesASL.prototype = Object.create(WidgetsSaisiesCommun.prototype);
WidgetsSaisiesASL.prototype.constructor = WidgetsSaisiesASL;

WidgetsSaisiesASL.prototype.initEvts = function() {
        const lthis = this;
        // initialisation des fonctions connexion utilisateur
        this.initEvtsConnection();
        // chargement plantes ou lichens
        if ( valOk( $( '.charger-releve' ) ) ) {
                const btnChargementForm = this.determinerBtnsChargementForm( '.' );
                // #releve-data n'est pas modifié, bouton dans #releves-utilisateur
                this.btnsChargerForm( btnChargementForm, false );
        }
};

/**
 * Initialise le formulaire, les validateurs, les listes de complétion...
 */
WidgetsSaisiesASL.prototype.initForm = function() {
        this.initFormConnection();
};

WidgetsSaisiesASL.prototype.determinerBtnsChargementForm = function( typeSelecteur, ajouterBtnPoursuivre = false ) {
        let complement       = '',
                selecteurDefault = '',
                separateur       = ',';

        if ( '#' === typeSelecteur ) {
                if ( ajouterBtnPoursuivre ) {
                        selecteurDefault = 'poursuivre';
                }
                typeSelecteur += 'bouton-';
        } else if ( '.' === typeSelecteur ) {
                selecteurDefault = 'charger-releve';
                complement = separateur + typeSelecteur;
        }
        switch( this.projet ) {
                case 'tb_streets':
                        if ( !ajouterBtnPoursuivre ) {
                                complement += 'saisir-plantes';
                        }
                        break;
                case 'tb_lichensgo':
                        if ( !ajouterBtnPoursuivre ) {
                                complement += 'saisir-lichens';
                        }
                        break;
                case 'tb_aupresdemonarbre':
                default:
                        separateur += typeSelecteur;
                        if ( ajouterBtnPoursuivre) {
                                complement = separateur;
                        }
                        complement += 'saisir-plantes' + separateur + 'saisir-lichens';
                        break;
        }
        return typeSelecteur + selecteurDefault + complement;
};

WidgetsSaisiesASL.prototype.btnsChargerForm = function( btn, modifierReleveData = true, dansRelevesUtilisateur = true ) {
        const lthis = this,
                bloc    = ( dansRelevesUtilisateur ) ? '#releves-utilisateur' : '#charger-form';

        $( btn, bloc ).off().on( 'click', function( event ) {
                event.preventDefault();

                const thisWidgetObs = ( valOk( $( '#' + lthis.projet + '-obs' ).val() ) ) ? $.parseJSON( $( '#' + lthis.projet + '-obs' ).val() ) : [],
                        nomSquelette    = $( this ).data( 'load' );
                let releveDatas   = '';

                $( '#charger-form' ).data( 'load', nomSquelette );
                if ( modifierReleveData ) {
                        if ( '#bouton-nouveau-releve' !== btn ) {
                                $( '#bouton-nouveau-releve' ).removeClass( 'hidden' );
                                if ( valOk( thisWidgetObs ) ) {
                                        releveDatas = JSON.stringify( thisWidgetObs[ $( this ).data( 'releve' ) ] );
                                }
                        } else {
                                $( btn ).addClass( 'hidden' );
                        }
                        $( '#releve-data' ).val( releveDatas );
                }
                lthis.chargerForm( nomSquelette, lthis );
                if ( valOk( thisWidgetObs ) ) {
                        $( '#bouton-list-releves' ).removeClass( 'hidden' );
                }
                $( '#table-releves' ).addClass( 'hidden' );
        });
};

WidgetsSaisiesASL.prototype.chargerForm = function( nomSquelette, formObj ) {
        const lthis = this,
                urlSquelette = this.urlWidgets + 'saisie?projet=' + this.projet + '&squelette=' + nomSquelette;

        $.ajax({
                url: urlSquelette,
                type: 'get',
                success: function( squelette ) {
                        if ( valOk( squelette ) ) {
                                formObj.chargerSquelette( squelette, nomSquelette );
                        }
                },
                error: function() {
                        $( '#charger-form' ).html( lthis.msgTraduction( 'erreur-formulaire' ) );
                }
        });
};

// Préchargement des infos-obs ************************************************/
/**
 * Callback dans le chargement du formulaire dans #charger-form
 */
WidgetsSaisiesASL.prototype.chargerSquelette = function( squelette , nomSquelette ) {
        //  à compléter plus tard si nécessaire, pour le moment on charge "arbres"
        switch( nomSquelette ) {
                case 'plantes' :
                case 'lichens' :
                        this.chargerFormPlantesOuLichens( squelette, nomSquelette );
                        break;
                case 'arbres' :
                default :
                        if ( valOk( this.sujet ) ) {
                                this.reinitialiserWidget( squelette );
                        } else {
                                this.chargerObsUtilisateur( squelette );
                        }
                break;
        }
};

WidgetsSaisiesASL.prototype.chargerFormPlantesOuLichens = function( squelette, nomSquelette ) {
        if ( valOk( $( '#releve-data' ).val() ) ) {
                $( '#charger-form' ).html( squelette );
                initialiserModule(nomSquelette);
                this.confirmerSortie();

                const releveDatas = $.parseJSON( $( '#releve-data' ).val() );
                const nbArbres    = releveDatas.length -1;

                for ( let i = 1; i <= nbArbres ; i++ ) {
                        $( '#choisir-arbre' ).append(
                                '<option value="' + i + '">'+
                                        this.msgTraduction( 'arbre' ) + ' ' + i +
                                '</option>'
                        );
                }
                this.scrollFormTop( '#zone-' + nomSquelette );
        }
};

WidgetsSaisiesASL.prototype.reinitialiserWidget = function( squelette ) {
        $( '#charger-form' ).html( squelette );
        initialiserModule();
        if ( valOk( $( '#releve-data' ).val() ) ) {
                this.rechargerFormulaire();
        }
};

/**
 * Infos des obs arbres de cet utilisateur
 */
WidgetsSaisiesASL.prototype.chargerObsUtilisateur = function( formReleve ) {
        const lthis = this,
                tagsMotsCles        = this.tagsMotsCles.split( ',' ),
                reprereAjoutTags    = tagsMotsCles.length - 1;
        let queryStringMotsCles = '';

        $.each( tagsMotsCles , function( i, tag ) {
                queryStringMotsCles += 'mots_cles=' + tagsMotsCles[i];
                if ( i < reprereAjoutTags ) {
                        queryStringMotsCles += '&';
                }
        });

        const urlObs =
                $( 'body' ).data( 'obs-list' ) + '/'+
                $( '#id_utilisateur' ).val() + '?' + queryStringMotsCles;

        $.ajax({
                url: urlObs,
                type: 'GET',
                success: function( dataObs, textStatus, jqXHR ) {
                        if ( !valOk( dataObs ) ) {
                                dataObs = '';
                        }
                        lthis.preformaterDonneesObs( dataObs );
                },
                error: function( jqXHR, textStatus, errorThrown ) {
                        utils.activerModale( lthis.msgTraduction( 'erreur-chargement-obs-utilisateur' ) );
                }
        })
        .always( function() {
                $( '#charger-form' ).html( formReleve );
                initialiserModule();
        });
};

/**
 * Préformater les données des obs d'un utilisateur
 */
WidgetsSaisiesASL.prototype.preformaterDonneesObs = function( dataObs ) {
        const lthis = this;

        if ( valOk( dataObs ) ) {
                const tagsMotsCles = this.tagsMotsCles.split( ',' );
                let projetObs  = [],
                        datRuComun = [],
                        obsArbres  = [],
                        projetObsE = {},
                        count      = 0;

                $.each( dataObs, function( i, obs ) {
                        if (
                                new RegExp( tagsMotsCles[0] ).test( obs.mots_cles_texte ) &&
                                new RegExp( tagsMotsCles[1] ).test( obs.mots_cles_texte ) &&
                                !/(:?plantes|lichens(?!go))/.test( obs.mots_cles_texte )
                        ) {
                                if ( valOk( obs.obs_etendue ) ) {
                                        $.each( obs.obs_etendue, function( indice, obsE ) {
                                                projetObsE[obsE.cle] = obsE.valeur;
                                        });
                                }
                                obs.date_observation = $.trim( obs.date_observation.replace( /[0-9]{2}:[0-9]{2}:[0-9]{2}$/, '') );
                                if ( -1 === datRuComun.indexOf( obs.date_observation + projetObsE.rue + obs.zone_geo )  ) {
                                        datRuComun.push( obs.date_observation + projetObsE.rue + obs.zone_geo );
                                        projetObs[count] = lthis.formaterReleveData( { 'obs':obs, 'obsE':projetObsE } );
                                        count++;
                                }
                                obsArbres.push( lthis.formaterArbreData( { 'obs':obs, 'obsE':projetObsE } ) );
                                projetObsE = [];
                        }
                });
                // on insert les arbres dans les relevés en fonction de la date et la rue d'observation
                // car les arbres pour un relevé (date/rue) n'ont pas forcément été enregistrés dans l'ordre ni le même jour
                $.each( obsArbres, function( indexArbre, arbre ) {
                        for ( let indexReleve = 0; indexReleve < datRuComun.length; indexReleve++ ) {
                                if ( arbre.date_rue_commune  === datRuComun[indexReleve] ) {
                                        projetObs[indexReleve].push( arbre );
                                }
                        }
                });
                if ( valOk( projetObs ) ) {
                        this.prechargerLesObs( projetObs );
                        $( '#' + this.projet + '-obs' ).val( JSON.stringify( projetObs ) );
                        $( '#bouton-list-releves' ).removeClass( 'hidden' );
                }
                $( '#dates-rues-communes' ).val( JSON.stringify( datRuComun ) );
        }
};

/**
 * Stocke en Json les valeurs du relevé dans en value d'un input hidden
 */
WidgetsSaisiesASL.prototype.formaterReleveData = function( releveDatas ) {
        const obs  = releveDatas.obs,
                obsE   = releveDatas.obsE;
        let releve = [];

        releve[0] = {
                utilisateur        : obs.ce_utilisateur,
                date               : obs.date_observation,
                rue                : obsE.rue,
                'commune-nom'      : obs.zone_geo,
                'commune-insee'    : obs.ce_zone_geo,
                pays               : obs.pays,
                'geometry-releve'  : obsE['geometry-releve'],
                'latitude-releve'  : obsE['latitude-releve'],
                'longitude-releve' : obsE['longitude-releve'],
                'altitude-releve'  : obsE['altitude-releve'],
                commentaires       : obs.commentaire
        };

        if ( 'tb_lichensgo' !== this.projet ) {
                releve[0]['zone-pietonne']    = obsE['zone-pietonne'];
                releve[0]['pres-lampadaires'] = obsE['pres-lampadaires'];
        }

        return releve;
};

/**
 * Stocke en Json les valeurs d'une obs
 */
WidgetsSaisiesASL.prototype.formaterArbreData = function( arbresDatas ) {
        const obs = arbresDatas.obs,
                obsE  = arbresDatas.obsE;
        let retour       = {},
                miniatureImg = [];

        if( valOk( obs['miniature-img'] ) ) {
                miniatureImg = obs['miniature-img'];
        } else if ( valOk( obsE['miniature-img'] ) ) {
                miniatureImg = $.parseJSON( obsE['miniature-img'] );
        }

        retour = {
                'date_rue_commune'      : obs.date_observation + obsE.rue + obs.zone_geo,
                'num-arbre'             : obsE.num_arbre,
                'id_observation'        : obs.id_observation,
                'taxon'                 : {
                        'numNomSel' : obs.nom_sel_nn,
                        'value'     : obs.nom_sel,
                        'nomRet'    : obs.nom_ret,
                        'numNomRet' : obs.nom_ret_nn,
                        'nt'        : obs.nt,
                        'famille'   : obs.famille,
                },
                'miniature-img'         : miniatureImg,
                'referentiel'           : obs.nom_referentiel,
                'certitude'             : obs.certitude,
                'rue-arbres'            : obsE['rue-arbres'],
                'geometry-arbres'       : obs['geometry'],
                'latitude-arbres'       : obs['latitude'],
                'longitude-arbres'      : obs['longitude'],
                'altitude-arbres'       : obs['altitude'],
                'circonference'         : obsE.circonference,
                'com-arbres'            : obsE['com-arbres']
        };
        if ( 'tb_lichensgo' !== this.projet ) {
                retour['surface-pied']          = obsE['surface-pied'];
                retour['equipement-pied-arbre'] = obsE['equipement-pied-arbre'];
                retour['tassement']             = obsE.tassement;
                retour['dejections']            = obsE.dejections;
        }
        if ( 'tb_streets' !== this.projet ) {
                retour['face-ombre'] = obsE['face-ombre'];
        }
        return retour;
};

WidgetsSaisiesASL.prototype.prechargerLesObs = function( thisWidgetObs ) {
        const lthis = this,
                $listReleve = $( '#list-releves' ),
                TEXT_ARBRE  = ' ' + this.msgTraduction( 'arbre' ).toLowerCase();

        let nbArbres   = '',
                texteArbre = '',
                releveHtml = '';

        $( '#bouton-list-releves' )
                .removeClass( 'hidden' )
                .on( 'click', function( event ) {
                        event.preventDefault();
                        $( '#table-releves' ).removeClass( 'hidden' );
                        $( this ).addClass( 'hidden' );
        });
        function boutonsChargerReleve( lthis, squelette, indice ) {
                const boutonLichens =
                                '<a href="" class="saisir-lichens btn btn-sm btn-info" data-releve="' + indice + '" data-load="lichens">'+
                                        '<i class="far fa-snowflake"></i> ' + lthis.msgTraduction( 'saisir-lichens' )+
                                '</a> ',
                        boutonPlantes   =
                                '<a href="" class="saisir-plantes btn btn-sm btn-info mb-1" data-releve="' + indice + '" data-load="plantes">'+
                                        '<i class="fas fa-seedling"></i> ' + lthis.msgTraduction( 'saisir-plantes' )+
                                '</a> ';

                switch( squelette ) {
                        case 'tb_streets':
                                return boutonPlantes;
                        case 'tb_lichensgo' :
                                return boutonLichens;
                        case 'tb_aupresdemonarbre' :
                        default :
                                return boutonPlantes + boutonLichens;
                }
                return '';
        }

        $.each( thisWidgetObs, function( i, releve ) {
                nbArbres = releve.length - 1;
                texteArbre = ( 1 < nbArbres ) ? ( TEXT_ARBRE + 's' ) : TEXT_ARBRE;
                releveHtml +=
                        '<tr class="table-light text-center">'+
                                '<td>' +
                                        '<p>'+
                                                lthis.fournirDate( releve[0].date ) +
                                        '</p><p>'+
                                                releve[0].rue + ', ' + releve[0]['commune-nom'] +
                                        '</p><p>'+
                                                '(' + nbArbres + texteArbre + ')' +
                                        '</p>'+
                                '</td>'+
                                '<td class="d-flex flex-column">' +
                                        '<a href="" class="charger-releve btn btn-sm btn-info mb-1" data-releve="' + i + '" data-load="arbres">'+
                                                '<i class="fas fa-clone"></i> ' + lthis.msgTraduction( 'dupliquer' )+
                                        '</a> '+
                                        boutonsChargerReleve( lthis, lthis.projet, i ) +
                                '</td>'+
                        '</tr>';
        });

        $listReleve.append( releveHtml );

        $( '#nb-releves-bienvenue' )
                .removeClass( 'hidden' )
                .find( 'span.nb-releves' )
                        .text( thisWidgetObs.length );
};