Subversion Repositories eFlore/Applications.cel

Rev

Rev 3811 | Go to most recent revision | Details | Last modification | View Log | RSS feed

Rev Author Line No. Line
3638 delphine 1
/**
2
 * Constructeur ReleveASL par défaut
3
 * S'applique au squelette apaforms.tpl.html
4
 * Qui se charge dans apa.tpl.php
5
 * Lors de la saisie du relevé et des arbres
6
 */
7
// ASL : APA, sTREETs, Lichen's Go!
8
function ReleveASL( proprietes, widgetProp ) {
9
	if  ( utils.valOk( proprietes ) && utils.valOk( widgetProp ) ) {
10
		this.sujet             = proprietes.sujet;
11
		this.tagImg            = proprietes.tagImg;
12
		this.separationTagImg  = proprietes.separationTagImg;
13
		this.tagImg            = proprietes.tagImg;
14
		this.tagObs            = proprietes.tagObs;
15
		this.separationTagObs  = proprietes.separationTagObs;
16
		this.nomSciReferentiel = proprietes.nomSciReferentiel;
17
		this.referentielImpose = proprietes.referentielImpose;
18
		this.widgetProp        = widgetProp;
19
		this.urlWidgets        = widgetProp.urlWidgets;
20
		this.projet            = widgetProp.projet;
21
	}
22
	this.isTaxonListe = false;
23
	this.numArbre     = 0;
24
}
25
ReleveASL.prototype = new WidgetsSaisiesASL( this.widgetProp );
26
 
27
/**
28
 * Initialise le formulaire, les validateurs, les listes de complétion...
29
 */
30
ReleveASL.prototype.initForm = function() {
31
	const lthis = this;
32
 
33
	var idUtilisateur = $( '#id_utilisateur' ).val();
34
 
35
	$('[type="date"]').prop('max', function(){
36
		return new Date().toJSON().split('T')[0];
37
	});
38
	if( this.valOk( idUtilisateur ) ) {
39
		if ( this.valOk( $( '#releve-data' ).val() ) ) {
40
			const datRuComun = $.parseJSON( $( '#dates-rues-communes' ).val() );
41
 
42
			var releveDatas = $.parseJSON( $( '#releve-data' ).val() );
43
			if ( !this.valOk( releveDatas[1] ) || -1 === datRuComun.indexOf( releveDatas[1]['date_rue_commune'] )  ) {
44
				this.releveDatas = releveDatas;
45
				if ( this.valOk( this.releveDatas[0].utilisateur, true, idUtilisateur ) ) {
46
					$( '#releve-date' ).val( this.releveDatas[0].date );
47
					this.rechargerFormulaire();
48
					this.saisirArbres();
49
					$( '#bouton-list-releves' )
50
						.removeClass( 'hidden' )
51
						.on( 'click', function( event ) {
52
							event.preventDefault();
53
							$( '#table-releves' ).removeClass( 'hidden' );
54
							$( this ).addClass( 'hidden' );
55
					});
56
				}
57
			}
58
		}
59
		if ( this.valOk(  $( '.charger-releve' ) ) ) {
60
			var btnChargementForm = this.determinerBtnsChargementForm( '.' );
61
			// #releve-data est modifié, bouton dans #releves-utilisateur
62
			this.btnsChargerForm( btnChargementForm );
63
		}
64
	}
65
	this.ajouterAutocompletionNoms();
66
	this.configurerFormValidator();
67
	this.definirReglesFormValidator();
68
};
69
 
70
/**
71
 * Initialise les écouteurs d'événements
72
 */
73
ReleveASL.prototype.initEvts = function() {
74
	const lthis = this;
75
 
76
	// comportement du bouton nouveau releve
77
	if ( this.valOk( $( '#id_utilisateur' ).val() ) ) {
78
		// #releve-data est modifié, bouton dans #releves-utilisateur
79
		this.btnsChargerForm( '#bouton-nouveau-releve' );
80
	}
81
	// on location, initialisation de la géoloc
82
	this.initEvtsGeoloc();
83
	// Sur téléchargement image
84
	this.initEvtsFichier();
85
 
86
	if ( 'tb_streets' !== this.projet ) {
87
		// Gérer une option "aucune" sur plusieurs checkboxes
88
		$( '#face-ombre input' ).on( 'click', function () {
89
			if ( 'aucune' === $( this ).val() ) {
90
				$( '#face-ombre input' ).not( '#aucune' ).prop( 'checked' , false );
91
			} else {
92
				$( '#aucune' ).prop( 'checked' , false );
93
			}
94
		});
95
	}
96
	$( '#soumettre-releve' ).on( 'click', function( event ) {
97
		event.preventDefault();
98
		lthis.saisirArbres();
99
	});
100
	// Création / Suppression / Transmission des obs
101
	// Défilement des miniatures dans le résumé obs
102
	this.initEvtsObs();
103
 
104
	$( '#bloc-info-arbres' ).on( 'click', '.arbre-info', function ( event ) {
105
		event.preventDefault();
106
		$( this ).addClass( 'disabled' );
107
		$( '.arbre-info' ).not( $( this ) ).removeClass( 'disabled' );
108
 
109
		var numArbre = $( this ).data( 'arbre-info' );
110
 
111
		lthis.chargerInfosArbre( numArbre );
112
		lthis.scrollFormTop( '#zone-arbres' );
113
	});
114
	// après avoir visualisé les champs d'un arbre, retour à la saisie
115
	$( '#retour' ).on( 'click', function( event ) {
116
		event.preventDefault();
117
 
118
		var numArbre = lthis.numArbre + 1;
119
 
120
		// activation des champs et retour à la saisie
121
		lthis.modeArbresBasculerActivation( false, numArbre );
122
		$( '#taxon' )
123
			.val('')
124
			.removeData([
125
				'value',
126
				'numNomSel',
127
				'nomRet',
128
				'numNomRet',
129
				'nt',
130
				'famille'
131
			]);
132
		lthis.scrollFormTop( '#zone-arbres' );
133
	});
134
	// chargement plantes ou lichens
135
	var btnChargementForm = this.determinerBtnsChargementForm( '#' );
136
	// #releve-data n'est pas modifié, bouton dans #charger-form
137
	this.btnsChargerForm( btnChargementForm, false, false );
138
	// Alertes et aides
139
	this.initEvtsAlertes();
140
};
141
 
142
/**
143
 * Recharge le formulaire relevé (étape 1) à partir des infos
144
 * présentes dans l'input hidden '#releve-data'
145
 */
146
ReleveASL.prototype.rechargerFormulaire = function() {
147
	const lthis = this;
148
 
149
	this.releveDatas = $.parseJSON( $( '#releve-data' ).val() );
150
	$.each( this.releveDatas[0], function( cle , valeur ) {
151
		if ( 'zone-pietonne' === cle ||  'pres-lampadaires' === cle ) {
152
			$( 'input[name=' + cle + '][value=' + valeur + ']' , '#zone-observation' ).prop( 'checked', true );
153
		} else if ( lthis.valOk( $( '#' + cle ) ) ) {
154
			$( '#' + cle ).val( valeur );
155
		}
156
	});
157
 
158
	if (
159
		this.valOk( $( '#geometry-releve' ).val() ) &&
160
		this.valOk( $( '#latitude-releve' ).val() ) &&
161
		this.valOk( $( '#longitude-releve' ).val() ) &&
162
		this.valOk( $( '#rue' ).val() ) &&
163
		this.valOk( $( '#commune-nom' ).val() )
164
	) {
165
		$( '#geoloc' ).addClass( 'hidden' );
166
		$( '#geoloc-datas' ).removeClass( 'hidden' );
167
	}
168
	this.scrollFormTop( '#zone-observation', '#releve-date' )
169
};
170
 
171
/**
172
 * Recharge le formulaire étape arbres à partir des infos
173
 * présentes dans l'input hidden '#releve-data'
174
 */
175
ReleveASL.prototype.chargerArbres = function() {
176
	this.releveDatas = $.parseJSON( $( '#releve-data' ).val() );
177
	this.obsNbre     = this.releveDatas.length - 1;
178
	this.numArbre    = parseInt( this.releveDatas[ this.obsNbre ]['num-arbre'] ) || this.obsNbre;
179
	$( '.obs-nbre' ).text( this.obsNbre );
180
	$( '.obs-nbre' ).triggerHandler( 'changement' );
181
	$( '#arbre-nb' ).text( this.numArbre + 1 );
182
 
183
	var infosArbre = {
184
		releve : this.releveDatas[0],
185
		obsNum : 0,
186
		sujet  : {}
187
	};
188
 
189
	for( var i = 1; i <= this.obsNbre; i ++ ) {
190
		infosArbre.obsNum = i;
191
		infosArbre.sujet = this.releveDatas[i];
192
		this.lienArbreInfo( infosArbre.sujet['num-arbre'] );
193
		this.afficherObs( infosArbre );
194
		this.stockerObsData( infosArbre, true );
195
	}
196
};
197
 
198
ReleveASL.prototype.lienArbreInfo = function( numArbre ) {
199
	if ( numArbre == 1 ) {
200
		$( '#bloc-info-arbres-title' ).removeClass( 'hidden' );
201
	}
202
	$( '#bloc-info-arbres' ).append(
203
		'<div'+
204
			' id="arbre-info-' + numArbre + '"'+
205
			' class="col-sm-8"'+
206
		'>'+
207
			'<a'+
208
				' id="arbre-info-lien-' + numArbre + '"'+
209
				' href=""'+
210
				' class="arbre-info btn btn-outline-info btn-block mb-3"'+
211
				' data-arbre-info="' + numArbre + '"'+
212
			'>'+
213
				'<i class="fas fa-info-circle"></i>'+
214
				' Arbre ' + numArbre +
215
			'</a>'+
216
		'</div>'
217
	);
218
};
219
 
220
// Ajouter Obs ****************************************************************/
221
/**
222
 * Etape formulaire avec transfert carto
223
 */
224
ReleveASL.prototype.saisirArbres = function() {
225
	const lthis = this;
226
 
227
	if ( this.validerReleve() ) {
228
		$( '#soumettre-releve' )
229
			.addClass( 'disabled' )
230
			.attr( 'aria-disabled', true )
231
			.off();
232
		$( '#form-observation' ).find( 'input, textarea' ).prop( 'disabled', true );
233
		$( '#zone-arbres,#geoloc-datas,#bouton-nouveau-releve' ).removeClass( 'hidden' );
234
		this.confirmerSortie();
235
		if ( !this.valOk( $( '#releve-data' ).val() ) ) {
236
			var releveDatasTmp = {
237
				obs  : {
238
					ce_utilisateur     : $( '#id_utilisateur' ).val(),
239
					date_observation   : $( '#releve-date' ).val(),
240
					zone_geo           : $( '#commune-nom' ).val(),
241
					ce_zone_geo        : $( '#commune-insee' ).val(),
242
					pays               : $( '#pays' ).val(),
243
					commentaire        : $( '#commentaires' ).val().trim()
244
				},
245
				obsE : {
246
					rue                : $( '#rue' ).val(),
247
					'geometry-releve'  : $( '#geometry-releve' ).val(),
248
					'latitude-releve'  : $( '#latitude-releve' ).val(),
249
					'longitude-releve' : $( '#longitude-releve' ).val(),
250
					'altitude-releve'  : $( '#altitude-releve' ).val()
251
				}
252
			};
253
			if ( 'tb_lichensgo' !== this.projet ) {
254
				releveDatasTmp.obsE['zone-pietonne'] = $( '#zone-pietonne input:checked' ).val();
255
				releveDatasTmp.obsE['pres-lampadaires'] = $( '#pres-lampadaires input:checked' ).val();
256
			}
257
			this.releveDatas = this.formaterReleveData(releveDatasTmp);
258
			$( '#releve-data' ).val( JSON.stringify( this.releveDatas ) );
259
			this.numArbre = this.releveDatas.length - 1;
260
		} else {
261
			this.releveDatas = $.parseJSON( $( '#releve-data' ).val() );
262
			this.releveDatas[0].date                = $( '#releve-date' ).val();
263
			if ( 'tb_lichensgo' !== this.projet ) {
264
				this.releveDatas[0]['zone-pietonne']    = $( '#zone-pietonne input:checked' ).val();
265
				this.releveDatas[0]['pres-lampadaires'] = $( '#pres-lampadaires input:checked' ).val();
266
			}
267
			this.releveDatas[0].commentaires        = $( '#commentaires' ).val().trim();
268
			for ( var i = 1 ; i < this.releveDatas.length; i++ ) {
269
				this.releveDatas[i]['date_rue_commune'] = (
270
					this.releveDatas[0].date +
271
					this.releveDatas[0].rue +
272
					this.releveDatas[0]['commune-nom']
273
				);
274
			}
275
			$( '#releve-data' ).val( JSON.stringify( this.releveDatas ) );
276
			//charger les images
277
			this.chargerImgEnregistrees();
278
			this.numArbre = $.parseJSON( $( '#releve-data' ).val() ).length - 1;
279
		}
280
		// transfert carto
281
		// $cartoRemplacee = $( '#tb-geolocation' ),
282
		// layer = 'osm',
283
		// zoomInit = 18
284
		var donnesResetCarto = {
285
			geometry  : $( '#geometry-releve' ).val(),
286
			latitude  : $( '#latitude-releve' ).val(),
287
			longitude : $( '#longitude-releve' ).val(),
288
			suffixe   : 'arbres',
289
			layer     : 'google hybrid'
290
		};
291
 
292
		this.transfererCarto( donnesResetCarto );
293
		this.scrollFormTop( '#zone-arbres' );
294
	}
295
};
296
 
297
ReleveASL.prototype.chargerImgEnregistrees = function() {
298
	const releveL = this.releveDatas.length;
299
	var idArbre = 0,
300
		last  = false;
301
 
302
	for ( var i = 1; i < releveL; i++ ) {
303
		idArbre = this.releveDatas[i]['id_observation'];
304
 
305
		var urlImgObs = this.serviceObsImgs + idArbre,
306
			imgDatas  = {
307
				'indice'      : i,
308
				'idArbre'     : idArbre,
309
				'numArbre'    : this.releveDatas[i]['num-arbre'],
310
				'nomRet'      : this.releveDatas[i].taxon.nomRet.replace( /\s/, '_' ),
311
				'releveDatas' : this.releveDatas
312
			};
313
 
314
		if ( ( releveL - 1) === i ) {
315
			last = true;
316
		}
317
		this.chargerImgArbre( urlImgObs, imgDatas, last );
318
	}
319
};
320
 
321
ReleveASL.prototype.chargerImgArbre = function( urlImgObs, imgDatas, last ) {
322
	const lthis   = this;
323
 
324
	$.ajax({
325
		url: urlImgObs,
326
		type: 'GET',
327
		success: function( idsImg, textStatus, jqXHR ) {
328
			if ( lthis.valOk( idsImg ) ) {
329
				var urlImg   = '',
330
					images   = [];
331
 
332
				idsImg = idsImg[parseInt( imgDatas.idArbre )];
333
				$.each( idsImg, function( i, idImg ) {
334
					urlImg = lthis.serviceObsImgUrl.replace( '{id}', '000' + idImg );
335
					images[i] = {
336
						nom : imgDatas.nomRet + '_arbre'+ imgDatas.numArbre +'_image' + ( i + 1 ),
337
						src : urlImg,
338
						b64 :[],
339
						id  : idImg
340
					};
341
				});
342
				imgDatas.releveDatas[imgDatas.indice]['miniature-img'] = images;
343
				$( '#releve-data' ).val( JSON.stringify( imgDatas.releveDatas ) );
344
			} else {
345
				console.dir( lthis.msgTraduction( 'erreur-image' ) + ' : ' + lthis.msgTraduction( 'arbre' ) + ' ' + imgDatas.idArbre );
346
			}
347
		},
348
		error: function( jqXHR, textStatus, errorThrown ) {
349
			console.dir( lthis.msgTraduction( 'erreur-image' ) );
350
		}
351
	})
352
	.always( function() {
353
		if (last) {
354
			lthis.chargerArbres();
355
		}
356
	});
357
};
358
 
359
/**
360
 * Retourne un Array contenant les valeurs des champs
361
 * dont les données seront transmises dans la table cel-obs-etendues
362
 */
363
ReleveASL.prototype.getObsChpSpecifiques = function( datasArbres ) {
364
	const lthis = this;
365
 
366
	var retour = [],
367
		champs = [
368
			'rue',
369
			'geometry-releve',
370
			'latitude-releve',
371
			'longitude-releve',
372
			'altitude-releve'
373
		];
374
 
375
	if ( 'tb_lichensgo' !== this.projet ) {
376
		champs.push(
377
			'zone-pietonne',
378
			'pres-lampadaires',
379
			'surface-pied',
380
			'equipement-pied-arbre',
381
			'tassement',
382
			'dejections',
383
			'com-arbres'
384
		);
385
	}
386
	champs.push(
387
		'rue-arbres',
388
		'circonference'
389
	);
390
 
391
	var cleValeur = '';
392
 
393
	$.each( champs, function( i , value ) {
394
		cleValeur = ( 4 > i ) || ( 6 > i && 'tb_lichensgo' !== lthis.projet ) ? 'releve' : 'sujet';
395
		if ( lthis.valOk( datasArbres[cleValeur][value] ) ) {
396
			retour.push({ cle : value, valeur : datasArbres[cleValeur][value] });
397
		}
398
	});
399
	if ( 'tb_streets' !== this.projet ) {
400
		var faceOmbre = '',
401
			faceOmbreLength = datasArbres.sujet['face-ombre'].length;
402
 
403
		if ( 'string' === typeof datasArbres.sujet['face-ombre'] ) {
404
			faceOmbre = datasArbres.sujet['face-ombre'];
405
		} else {
406
			$.each( datasArbres.sujet['face-ombre'], function( i ,value ) {
407
				faceOmbre += value
408
				if ( faceOmbreLength > ( i + 1 ) ) {
409
					faceOmbre += ';';
410
				}
411
			});
412
		}
413
		retour.push({ cle : 'face-ombre', valeur : faceOmbre });
414
	}
415
	retour.push({ cle : 'num_arbre' , valeur : datasArbres.obsNum });
416
 
417
	var stockerImg  = this.valOk( datasArbres.sujet['miniature-img'] );
418
 
419
	if( stockerImg ) {
420
		$.each( datasArbres.sujet['miniature-img'], function( i, paramsImg ) {
421
			if( !paramsImg.hasOwnProperty( 'id' ) ) {
422
				stockerImg = false;
423
			}
424
			return stockerImg;
425
		});
426
	}
427
	if( stockerImg ) {
428
		retour.push({ cle : 'miniature-img' , valeur : JSON.stringify( datasArbres.sujet['miniature-img'] ) });
429
	}
430
	return retour;
431
};
432
 
433
ReleveASL.prototype.chargerInfosArbre = function( numArbre ) {
434
	const lthis = this;
435
 
436
	var desactiverForm = ( parseInt( numArbre ) !== ( this.numArbre + 1 ) );
437
 
438
	if ( desactiverForm ) {
439
		var releveDatas = $.parseJSON( $( '#releve-data' ).val() ),
440
			arbreDatas  = releveDatas[numArbre],
441
			taxon       = {item:{}},
442
			imgHtml     = '';
443
 
444
		$( '#arbre-nb' ).text( numArbre + ' (visualisation)' );
445
		taxon.item = arbreDatas.taxon;
446
		this.surAutocompletionTaxon( {}, taxon );
447
 
448
		var selects = [ 'certitude' ];
449
 
450
		if ( 'tb_lichensgo' !== this.projet ) {
451
			selects.push( 'equipement-pied-arbre', 'tassement' );
452
		}
453
		$.each( selects, function( i, value ) {
454
			if( !lthis.valOk( arbreDatas[value] ) ) {
455
				arbreDatas[value] = '';
456
			}
457
			if ( $( this ).hasClass( 'other' ) && lthis.valOk( $( this ).val() ) ) {
458
				$( this ).text( $( this ).val() );
459
			}
460
			$( '#' + value + ' option' ).each( function() {
461
				if ( arbreDatas[value] === $( this ).val() ) {
462
					$( this ).prop( 'selected', true );
463
				} else {
464
					$( this ).prop( 'selected', false );
465
				}
466
			});
467
		});
468
		$( '#rue-arbres' ).val( arbreDatas['rue-arbres'] );
469
		$( '#geometry-arbres' ).val( arbreDatas['geometry-arbres'] );
470
		$( '#latitude-arbres' ).val( arbreDatas['latitude-arbres'] );
471
		$( '#longitude-arbres' ).val( arbreDatas['longitude-arbres'] );
472
		$( '#altitude-arbres' ).val( arbreDatas['altitude-arbres'] );
473
		// image
474
		this.supprimerMiniatures();
475
		$.each( arbreDatas['miniature-img'], function( i, value ) {
476
			imgHtml +=
477
			'<div class="miniature mb-3 mr-3">'+
478
				'<img class="miniature-img" class="miniature img-rounded" alt="' + value.nom + '" src="' + value.src + '"/>'+
479
			'</div>';
480
		});
481
		$( '#miniatures' ).append( imgHtml );
482
		$( '#circonference' ).val( arbreDatas.circonference );
483
		$( '#com-arbres' ).val( arbreDatas['com-arbres'] );
484
		if ( 'tb_lichensgo' !== this.projet ) {
485
			$( '#surface-pied' ).val( arbreDatas['surface-pied'] );
486
			if ( undefined != arbreDatas.dejections ) {
487
				$( '#dejections-oui' ).prop( 'checked', arbreDatas.dejections );
488
				$( '#dejections-non' ).prop( 'checked', !arbreDatas.dejections );
489
			}
490
		}
491
		if ( 'tb_streets' !== this.projet ) {
492
			$( '#face-ombre input' ).each( function() {
493
				if ( -1 < arbreDatas['face-ombre'].indexOf( $( this ).val() ) ) {
494
					$( this ).prop( 'checked', true );
495
				} else {
496
					$( this ).prop( 'checked', false );
497
				}
498
			});
499
		}
500
	}
501
	this.modeArbresBasculerActivation( desactiverForm, numArbre );
502
};
503
 
504
ReleveASL.prototype.modeArbresBasculerActivation = function( desactiver, numArbre = 0 ) {
505
	var selecteurs =
506
		'#taxon,'+
507
		'#certitude,'+
508
		'#geometry-arbres,'+
509
		'#latitude-arbres,'+
510
		'#longitude-arbres,'+
511
		'#rue-arbres,'+
512
		'#fichier,'+
513
		'#circonference,'+
514
		'#com-arbres,'+
515
		'#ajouter-obs';
516
 
517
	if ( 'tb_lichensgo' !== this.projet ) {
518
		selecteurs +=
519
			',#equipement-pied-arbre,'+
520
			'#tassement,'+
521
			'#surface-pied';
522
		$( '#dejections' ).find( 'input' ).prop( 'disabled', desactiver );
523
	}
524
	$( selecteurs ).prop( 'disabled', desactiver );
525
	if ( 'tb_streets' !== this.projet ) {
526
		$( '#face-ombre' ).find( 'input' ).prop( 'disabled', desactiver );
527
	}
528
	if ( desactiver ) {
529
		$( '#geoloc-arbres,#bouton-fichier,#miniature-info' ).addClass( 'hidden' );
530
		$( '#geoloc-datas-arbres,#retour' ).removeClass( 'hidden' );
531
	} else {
532
		// quand on change ou qu'on revient à la normale :
533
		$( '#geoloc-arbres,#bouton-fichier,#miniature-info' ).removeClass( 'hidden' );
534
		$( '#geoloc-datas-arbres,#retour' ).addClass( 'hidden' );
535
		// reset carto
536
		// typeLocalisation = 'point',
537
		// zoomInit = 18
538
		var donnesResetCarto = {
539
			cartoRemplacee : $( '#tb-geolocation-arbres' ),
540
			geometry       : $( '#geometry-releve' ).val(),
541
			latitude       : $( '#latitude-releve' ).val(),
542
			longitude      : $( '#longitude-releve' ).val(),
543
			suffixe        : 'arbres',
544
			layer          : 'google hybrid'
545
		};
546
		this.transfererCarto( donnesResetCarto );
547
		// retour aux valeurs par defaut
548
		selecteurs = '#certitude option';
549
		if ( 'tb_lichensgo' !== this.projet ) {
550
			selecteurs += ',#equipement-pied-arbre option,#tassement option';
551
			$( '#equipement-pied-arbre .other' ).text( 'Autre' ).val( 'other' );
552
			$( '#collect-other-equipement-pied-arbre' ).closest( '.control-group' ).remove();
553
			$( '#dejections' ).find( 'input' ).prop( 'checked', false );
554
		}
555
		if ( 'tb_streets' !== this.projet ) {
556
			$( '#face-ombre' ).find( 'input' ).prop( 'checked', false );
557
		}
558
		$( selecteurs ).each( function() {
559
			if ( $( this ).hasClass( 'choisir' ) ) {
560
				$( this ).prop( 'selected', true );
561
			} else {
562
				$( this ).prop( 'selected', false );
563
			}
564
		});
565
		this.supprimerMiniatures();
566
		selecteurs =
567
			'#circonference,'+
568
			'#com-arbres,'+
569
			'#rue-arbres,'+
570
			'#geometry-arbres,'+
571
			'#latitude-arbres,'+
572
			'#longitude-arbres,'+
573
			'#certitude';
574
		if ( 'tb_lichensgo' !== this.projet ) {
575
			selecteurs +=
576
			',#equipement-pied-arbre,'+
577
			'#tassement,'+
578
			'#surface-pied';
579
		}
580
		$( selecteurs ).val( '' );
581
		if( 0 < numArbre ) {
582
			$( '#arbre-nb' ).text( numArbre );
583
			$( '#arbre-info-lien-' + numArbre ).addClass( 'disabled' );
584
			$( '.arbre-info' ).not( '#arbre-info-lien-' + numArbre ).removeClass( 'disabled' );
585
		}
586
	}
587
};
588
 
589
/*
590
 * Actualise l'id_observation ( id de l'obs en bdd )
591
 * à partir des données renvoyées par le service après transfert
592
 */
593
ReleveASL.prototype.actualiserReleveDataIdObs = function( obsId, id_observation ) {
594
	this.releveData  = $.parseJSON( $( '#releve-data' ).val() );
595
	this.releveData[obsId ]['id_observation'] = id_observation;
596
	$( '#releve-data' ).val( JSON.stringify( this.releveData ) );
597
};
598
 
599
// Géolocalisation *************************************************************/
600
/**
601
 * Fonction handler de l'évenement location du module tb-geoloc
602
 */
603
ReleveASL.prototype.locationHandler = function( location ) {
604
	const lthis = this;
605
	var isGeolocArbres = ( 'tb-geolocation-arbres' === location.target.id ),
606
		locDatas       = location.originalEvent.detail;
607
 
608
	if ( this.valOk( locDatas ) ) {
609
		console.dir( locDatas );
610
 
611
		var rue          = ( this.valOk( locDatas.osmRoad ) ) ? locDatas.osmRoad : '';
612
		var altitude     = ( this.valOk( locDatas.elevation ) ) ? locDatas.elevation : '';
613
		var pays         = ( this.valOk( locDatas.osmCountryCode ) ) ? locDatas.osmCountryCode.toUpperCase() : 'FR';
614
		var geometry     = JSON.stringify( locDatas.geometry );
615
		var latitude     = '';
616
		var longitude    = '';
617
		var nomCommune   = '';
618
		var	communeInsee = '';
619
 
620
		if ( this.valOk( locDatas.geometry.coordinates ) ) {
621
			if ( 'Point' === locDatas.geometry.type ) {
622
				if ( this.valOk( locDatas.geometry.coordinates[0] ) ) {
623
					longitude = locDatas.geometry.coordinates[0];
624
				}
625
				if ( this.valOk( locDatas.geometry.coordinates[1] ) ) {
626
					latitude = locDatas.geometry.coordinates[1];
627
				}
628
			} else if ( 'LineString' === locDatas.geometry.type ) {// on a besoin que d'un point de la rue
629
				if ( this.valOk( locDatas.geometry.coordinates[0][0] ) ) {
630
					longitude = locDatas.geometry.coordinates[0][0];
631
				}
632
				if ( this.valOk( locDatas.geometry.coordinates[0][1] ) ){
633
					latitude = locDatas.geometry.coordinates[0][1];
634
				}
635
			}
636
		}
637
		if ( !isGeolocArbres ) {
638
			if ( this.valOk( locDatas.inseeData ) ) {
639
				nomCommune = locDatas.inseeData.nom;
640
				communeInsee = ( this.valOk( locDatas.inseeData.code ) ) ? locDatas.inseeData.code : '';
641
			} else if ( this.valOk( locDatas.locality ) ) {
642
				nomCommune = locDatas.locality;
643
			} else if ( this.valOk( locDatas.osmCounty ) ) {
644
				nomCommune = locDatas.osmCounty;
645
			}
646
			$( '#rue' ).val( rue );
647
			$( '#geometry-releve' ).val( geometry );
648
			$( '#latitude-releve' ).val( latitude );
649
			$( '#longitude-releve' ).val( longitude );
650
			$( '#commune-nom' ).val( nomCommune );
651
			$( '#commune-insee' ).val( communeInsee );
652
			$( '#altitude-releve' ).val( altitude );
653
			$( '#pays' ).val( pays );
654
			if ( this.valOk( $( '#rue' ).val() ) && this.valOk( $( '#commune-nom' ).val() ) ) {
655
				$( '#geoloc-error' ).addClass( 'hidden' );
656
				$( '#geoloc-datas' ).closest( '.control-group' ).removeClass( 'error' );
657
			} else {
658
				$( '#rue,#commune-nom' ).prop( 'disabled', false );
659
				$( '#geoloc-datas' )
660
					.removeClass( 'hidden' )
661
					.closest( '.control-group' )
662
						.addClass( 'error' );
663
				$( '#geoloc-error' ).removeClass( 'hidden' );
664
				$( '#releve-date' )
665
					.removeClass( 'erreur' )
666
					.closest( '.control-group' )
667
						.removeClass( 'error' )
668
						.find( '#error-drc' )
669
							.remove();
670
			}
671
			$( '#rue,#commune-nom' ).change( function() {
672
				if ( lthis.valOk( $( '#rue' ).val() ) && lthis.valOk( $( '#commune-nom' ).val() ) ) {
673
					$( '#geoloc-error' ).addClass( 'hidden' );
674
				} else {
675
					$( '#geoloc-error' ).removeClass( 'hidden' );
676
				}
677
			});
678
		} else {
679
			$( '#rue-arbres' ).val( rue );
680
			$( '#geometry-arbres' ).val( geometry );
681
			$( '#latitude-arbres' ).val( latitude );
682
			$( '#longitude-arbres' ).val( longitude );
683
			$( '#altitude-arbres' ).val( altitude );
684
			if ( this.valOk( $( '#latitude-arbres' ).val() ) && this.valOk( $( '#longitude-arbres' ).val() ) ) {
685
				$( '#geoloc-arbres' ).closest( '.control-group' ).removeClass( 'error' );
686
			} else {
687
				$( '#geoloc-arbres' ).closest( '.control-group' ).addClass( 'error' );
688
			}
689
		}
690
	} else {
691
		console.dir( 'Error location' );
692
	}
693
};
694
 
695
// Form Validator *************************************************************/
696
ReleveASL.prototype.validerMinMax = function( element ) {
697
	var mMCond      = new Boolean(),
698
		minCond     = parseFloat( element.value ) >= parseFloat( element.min ),
699
		maxCond     = parseFloat( element.value ) <= parseFloat( element.max ),
700
		messageMnMx = 'La valeur entrée doit être',
701
		returnMnMx  = { cond : true , message : '' };
702
 
703
	if (
704
			( this.valOk( element.type, true, 'number' ) || this.valOk( element.type, true, 'range' ) ) &&
705
			( this.valOk( element.min ) || this.valOk( element.max ) )
706
		) {
707
 
708
		if ( element.min && element.max ) {
709
			messageMnMx += ' comprise entre ' + element.min + ' et ' + element.max;
710
			mnMxCond     = ( minCond && maxCond );
711
		} else if ( element.min ) {
712
			messageMnMx += ' supérieure à ' + element.min;
713
			mnMxCond     = minCond;
714
		} else {
715
			messageMnMx += ' inférieure à ' + element.max;
716
			mnMxCond     = maxCond;
717
		}
718
		returnMnMx.cond    = mnMxCond;
719
		returnMnMx.message = messageMnMx;
720
	}
721
 
722
	return returnMnMx;
723
};
724
 
725
/**
726
 * Valider date/rue/commune par rapport aux relevés précédents
727
 */
728
ReleveASL.prototype.validerDateRueCommune = function( valeurDate, valeurRue, valeurCmn ) {
729
	var valide = true;
730
 
731
	if (
732
		this.valOk( $( '#dates-rues-communes' ).val() ) &&
733
		this.valOk( valeurDate ) &&
734
		this.valOk( valeurRue ) &&
735
		this.valOk( valeurCmn )
736
	) {
737
		var valsEltDRC = $.parseJSON( $( '#dates-rues-communes' ).val() ),
738
			valeurDRC = valeurDate + valeurRue + valeurCmn;
739
		valide = ( -1 === valsEltDRC.indexOf( valeurDRC ) );
740
 
741
	}
742
	return valide;
743
};
744
 
745
/**
746
 * FormValidator pour les champs date/rue/Commune
747
 */
748
ReleveASL.prototype.dateRueCommuneFormValidator = function() {
749
	var dateValid    = ( /^(?:[0-9]{4}-[0-9]{2}-[0-9]{2})|(?:[0-9]{2}\/[0-9]{2}\/[0-9]{4})$/.test( $( '#releve-date' ).val() ) ),
750
		geolocValid  = ( this.valOk( $( '#commune-nom' ).val() ) && this.valOk( $( '#rue' ).val() ) );
751
	const errorDateRue =
752
			'<span id="error-drc" class="error">'+
753
				this.msgTraduction( 'date-rue' )+
754
			'</span> ';
755
 
756
	if( this.validerDateRueCommune( $( '#releve-date' ).val(), $( '#rue' ).val(), $( '#commune-nom' ).val()  ) ) {
757
		$( '#releve-date' )
758
			.removeClass( 'erreur' )
759
			.closest( '.control-group' )
760
				.removeClass( 'error' )
761
				.find( '#error-drc' )
762
					.remove();
763
		if ( geolocValid ) {
764
			$( '#geoloc' )
765
			.closest( '.control-group' )
766
				.removeClass( 'error' );
767
		}
768
	} else {
769
		$( '#releve-date' )
770
			.addClass( 'erreur' )
771
			.closest( '.control-group' )
772
				.addClass( 'error' );
773
		if ( !this.valOk( $( '#releve-date' ).closest( '.control-group' ).find( '#error-drc' ) ) ) {
774
			$( '#releve-date' ).after( errorDateRue );
775
		}
776
		$( '#geoloc' ).closest( '.control-group' ).addClass( 'error' );
777
	}
778
	if ( dateValid ) {
779
		$( '#releve-date' ).closest( '.control-group span.error' ).not( '#error-drc' ).remove();
780
	}
781
};
782
 
783
ReleveASL.prototype.definirReglesFormValidator = function() {
784
	const lthis = this;
785
 
786
	$( '#form-observation' ).validate({
787
		rules : {
788
			'zone-pietonne' : {
789
				required : function() {
790
					return( 'tb_lichensgo' !== this.projet );
791
				},
792
				minlength : 1
793
			},
794
			'latitude-releve' : {
795
				required : true,
796
				minlength : 1,
797
				range : [-90, 90]
798
			},
799
			'longitude-releve' : {
800
				required : true,
801
				minlength : 1,
802
				range : [-180, 180]
803
			}
804
		}
805
	});
806
	$( 'input[type=date]' ).not( '#releve-date' ).on( 'input', function() {
807
		$( this ).valid();
808
	});
809
	// validation date/rue/commune au démarage
810
	this.dateRueCommuneFormValidator();
811
	// validation date/rue/commune sur event
812
	$( '#releve-date,#rue,#commune-nom' ).on( 'change input focusout', this.dateRueCommuneFormValidator.bind( this ) );
813
	$( '#form-arbres' ).validate({
814
		rules : {
815
			taxon : {
816
				required : true,
817
				minlength : 1
818
			},
819
			certitude : {
820
				required : true,
821
				minlength : 1
822
			},
823
			'latitude-arbres' : {
824
				required : true,
825
				minlength : 1,
826
				range : [-90, 90]
827
			},
828
			'longitude-arbres' : {
829
				required : true,
830
				minlength : 1,
831
				range : [-180, 180]
832
			}
833
		}
834
	});
835
	$( '#form-arbre-fs' ).validate({
836
		onkeyup : false,
837
		onclick : false,
838
		rules : {
839
			circonference : {
840
				required : true,
841
				minlength : 1
842
			},
843
			'surface-pied' : {
844
				required :  function() {
845
					return( 'tb_lichensgo' !== this.projet );
846
				},
847
				minlength : 1,
848
				'minMaxOk' : true
849
			},
850
			'equipement-pied-arbre' : {
851
				required :  function() {
852
					return( 'tb_lichensgo' !== this.projet );
853
				},
854
				minlength : 1
855
			},
856
			'face-ombre' : {
857
				required :  function() {
858
					return( 'tb_streets' !== this.projet );
859
				},
860
				minlength : 1
861
			}
862
		}
863
	});
864
	$( '#form-observateur' ).validate({
865
		rules : {
866
			courriel : {
867
				required : true,
868
				minlength : 1,
869
				email : true,
870
				'userEmailOk' : true
871
			},
872
			mdp : {
873
				required : true,
874
				minlength : 1
875
			}
876
		}
877
	});
878
	if ( 'tb_lichensgo' !== this.projet ) {
879
		$( '#equipement-pied-arbre' ).change( function() {
880
			if ( lthis.valOk( $( this ).val(), false, 'other' ) ) {
881
				$( this )
882
					.closest( '.control-group' )
883
						.removeClass( 'error' )
884
						.find( 'span.error' )
885
							.addClass( 'hidden' );
886
			}
887
		});
888
	}
889
	if ( 'tb_streets' !== this.projet ) {
890
		$( '#face-ombre input' ).on( 'click', function() {
891
			var oneIsChecked = false;
892
			$( '#face-ombre input' ).each( function() {
893
				if ( $( this ).is( ':checked' ) ) {
894
					oneIsChecked = true;
895
					return false;
896
				}
897
			});
898
			if ( oneIsChecked ) {
899
				$( '#face-ombre.control-group' )
900
					.removeClass( 'error' )
901
					.find( 'span.error' )
902
						.addClass( 'hidden' );
903
			} else {
904
				$( '#face-ombre.control-group' )
905
					.addClass( 'error' )
906
					.find( 'span.error' )
907
						.removeClass( 'hidden' );
908
			}
909
		});
910
	}
911
	$( '#connexion,#inscription,#oublie' ).on( 'click', function() {
912
		$( '#tb-observateur .control-group' ).removeClass( 'error' );
913
	});
914
};
915
 
916
/**
917
 * Valide le formulaire Relevé (= étape 1) au click sur un bouton "enregistrer"
918
 */
919
ReleveASL.prototype.validerReleve = function() {
920
	const observateur = ( $( '#form-observateur' ).valid() && $( '#courriel' ).valid() )
921
	const obs         = $( '#form-observation' ).valid();
922
	const geoloc      = (
923
		this.valOk( $( '#latitude-releve' ).val() ) &&
924
		this.valOk( $( '#longitude-releve' ).val() ) &&
925
		this.valOk( $( '#rue' ).val() ) &&
926
		this.valOk( $( '#commune-nom' ).val() )
927
	) ;
928
	var dateRue = true;
929
	if ( this.valOk( $( '#dates-rues-communes' ).val() ) ) {
930
		dateRue = (
931
			this.valOk( $( '#releve-date' ).val() ) &&
932
			this.valOk( $( '#rue' ).val() ) &&
933
			this.validerDateRueCommune( $( '#releve-date' ).val(), $( '#rue' ).val(), $( '#commune-nom' ).val() )
934
		);
935
	}
936
	if ( !obs ) {
937
		this.scrollFormTop( '#zone-observation' );
938
	}
939
	// panneau observateur
940
	if ( observateur ) {
941
		this.masquerPanneau( '#dialogue-utilisateur-non-identifie' );
942
		$( '#tb-observateur .control-group' ).removeClass( 'error' );
943
	} else {
944
		this.afficherPanneau( '#dialogue-utilisateur-non-identifie' );
945
		$( '#tb-observateur .control-group' ).addClass( 'error' );
946
	}
947
	if ( dateRue && geoloc ) {
948
		this.masquerPanneau( '#dialogue-date-rue-ko' );
949
		$( '#geoloc-datas' ).closest( '.control-group' ).removeClass( 'error' );
950
	} else {
951
		if (
952
			this.valOk( $( '#releve-date' ).val() ) &&
953
			this.valOk( $( '#rue' ).val() ) &&
954
			this.valOk( $( '#dates-rues-communes' ).val() )
955
		) {
956
			this.afficherPanneau( '#dialogue-date-rue-ko' );
957
		}
958
		$( '#geoloc-datas' ).closest( '.control-group' ).addClass( 'error' );
959
	}
960
	if (
961
		!this.valOk( $( '#releve-date' ).val() ) ||
962
		!this.valOk( $( '#rue' ).val() ) ||
963
		!this.valOk( $( '#dates-rues-communes' ).val() )
964
	) {
965
		this.masquerPanneau( '#dialogue-date-rue-ko' );
966
	}
967
	if ( geoloc ) {
968
		this.masquerPanneau( '#dialogue-geoloc-ko' );
969
		if ( dateRue ) {
970
			$( '#geoloc' ).closest( '.control-group' ).removeClass( 'error' );
971
		}
972
	} else {
973
		this.afficherPanneau( '#dialogue-geoloc-ko' );
974
		$( '#geoloc' ).closest( '.control-group' ).addClass( 'error' );
975
	}
976
 
977
	return  (observateur && obs && geoloc && dateRue);
978
};
979
 
980
/**
981
 * Valide le formulaire Arbres (= étape 2) au click sur un bouton "suivant"
982
 */
983
ReleveASL.prototype.validerForm = function() {
984
	const validerReleve = this.validerReleve();
985
	const geoloc      = (
986
		this.valOk( $( '#latitude-arbres' ).val() ) &&
987
		this.valOk( $( '#longitude-arbres' ).val() )
988
	);
989
	const taxon = this.valOk( $( '#taxon' ).val() );
990
	var piedArbre = true;
991
 
992
	if ( 'tb_lichensgo' !== this.projet ) {
993
		piedArbre = this.valOk( $( '#equipement-pied-arbre' ).val(), false, 'other' );
994
		if ( piedArbre ) {
995
			$( '#equipement-pied-arbre' )
996
				.closest( '.control-group' )
997
					.removeClass( 'error' )
998
					.find( 'span.error' )
999
						.addClass( 'hidden' );
1000
		} else {
1001
			$( '#equipement-pied-arbre' )
1002
				.closest( '.control-group' )
1003
					.addClass( 'error' )
1004
					.find( 'span.error' )
1005
						.removeClass( 'hidden' );
1006
		}
1007
	}
1008
 
1009
	const obs   = (
1010
		$( '#form-arbres' ).valid() &&
1011
		$( '#form-arbre-fs' ).valid() &&
1012
		piedArbre
1013
	);
1014
 
1015
	if ( geoloc ) {
1016
		this.masquerPanneau( '#dialogue-geoloc-ko' );
1017
		$( '#geoloc-arbres' ).closest( '.control-group' ).removeClass( 'error' );
1018
	} else {
1019
		this.afficherPanneau( '#dialogue-geoloc-ko' );
1020
		$( '#geoloc-arbres' ).closest( '.control-group' ).addClass( 'error' );
1021
	}
1022
 
1023
	return ( validerReleve && obs && geoloc && taxon );
1024
};