Subversion Repositories eFlore/Applications.cel

Rev

Rev 3988 | Go to most recent revision | Details | Compare with Previous | Last modification | View Log | RSS feed

Rev Author Line No. Line
3631 idir 1 
function WidgetPhotoPopup( proprietes ) {
2 
	if( this.valOk( proprietes ) ) {
3823 idir 3 
		this.urlWidget                    = proprietes.urlWidget;
4 
		this.urls                         = proprietes.urls;
3837 idir 5 
		this.infosImages                  = proprietes.infosImages;
6 
		this.urlImage                     = proprietes.urlImage;
7 
		this.indexPremiereImage           = proprietes.indexPremiereImage;
3833 idir 8 
		this.indexImage                   = this.indexPremiereImage;
3823 idir 9 
		this.tailleMax                    = proprietes.tailleMax;
10 
		this.popupUrl                     = proprietes.popupUrl;
11 
		this.urlBaseTelechargement        = proprietes.urlBaseTelechargement;
12 
		this.urlServiceRegenererMiniature = proprietes.urlServiceRegenererMiniature;
3958 julien 13 
		this.userId       				  = proprietes.userId;
14 
		this.token						  = proprietes.token;
15 
		this.protocoles					  = proprietes.protocoles;
3983 julien 16 
		this.urlServiceDel				  = proprietes.urlServiceDel;
3985 julien 17 
		this.urlServiceNewCel			  = proprietes.urlServiceNewCel;
3631 idir 18 
	}
3958 julien 19 
	this.protocole = null;
20 
	this.voteId = null;
21 
	this.votes = null;
3823 idir 22 
	this.mettreAJourInfosImage();
3631 idir 23 
}
24 
 
3825 idir 25 
WidgetPhotoPopup.prototype = new WidgetPhotoCommun();
3631 idir 26 
 
27 
WidgetPhotoPopup.prototype.initTpl = function() {
28 
	this.redimensionnerGalerie();
3837 idir 29 
	$( '#info-img-galerie' ).find( '.active' ).removeClass( 'active' );
30 
	$( '#img-cadre-' + this.indexImage + ',#indicateur-img-' + this.indexImage ).addClass( 'active' );
3823 idir 31 
 
3837 idir 32 
	this.mettreAJourPopup();
3823 idir 33 
 
3631 idir 34 
	this.redimentionnerModaleCarousel();
35 
};
36 
 
37 
WidgetPhotoPopup.prototype.initEvts = function() {
38 
	const lthis = this;
39 
 
40 
	this.initEvtsDefilerImage();
3980 julien 41 
	// this.initEvtsContact();
3631 idir 42 
	$( window ).on( 'resize', lthis.redimentionnerModaleCarousel.bind( lthis ) );
3823 idir 43 
	this.initEvtsFonctionsPhoto();
3631 idir 44 
	this.initEvtsRetourGalerieResponsive();
3989 julien 45 
	this.initEvtsToggleVolet();
3631 idir 46 
};
47 
 
3823 idir 48 
WidgetPhotoPopup.prototype.mettreAJourPopup = function() {
49 
	this.mettreAJourInfosImage();
50 
	this.afficherTitreImage();
51 
	this.traiterMetas();
52 
	this.regenererMiniature();
53 
	this.fournirLienIdentiplante();
3948 julien 54 
	this.pivoterImage();
3958 julien 55 
	this.initEvtsProtocole();
3983 julien 56 
	this.initEvtsTagsPF();
57 
	this.initEvtsTagsCel();
3823 idir 58 
};
59 
 
60 
WidgetPhotoPopup.prototype.mettreAJourInfosImage = function() {
3837 idir 61 
	this.item          = this.infosImages[this.urls[this.indexImage]];
3826 idir 62 
	this.titreImage    = this.item['titre'];
3825 idir 63 
	this.urlLienEflore = this.item['lien'];
3826 idir 64 
	this.idImage       = this.item['id_photo'];
3946 julien 65 
 
66 
	// If last caract of the url is a ',' we remove it
67 
	const lastCaractUrlImage = this.item['url_photo'].slice(-1);
68 
	if (lastCaractUrlImage === ','){
69 
		this.item['url_photo'] = this.item['url_photo'].replace(/.$/,'');
70 
	}
71 
 
3826 idir 72 
	this.urlThisImage  = this.item['url_photo']+'.jpg';
73 
	this.obs           = this.item['obs'];
74 
	this.nn            = '[nn' + this.obs['nom_sel_nn']+']';
75 
	this.urlIP         = this.obs['url_ip'];
76 
	this.tagsImage     = this.tagsToArray( this.item['tags_photo'] );
77 
	this.tagsObs       = this.tagsToArray( this.obs['tags_obs'] );
3958 julien 78 
	let auteurMail = this.item['utilisateur']['mail_utilisateur'].split("@")[0];
79 
	this.auteur        = this.item["utilisateur"]["nom_utilisateur"] ? this.item["utilisateur"]["nom_utilisateur"] : auteurMail;
3826 idir 80 
	this.date          = this.item['date'];
3987 julien 81 
	this.urlTpl 	   = this.item['url_tpl'];
3823 idir 82 
};
83 
 
3825 idir 84 
WidgetPhotoPopup.prototype.tagsToArray = function( tags ) {
3832 idir 85 
	if(!this.valOk(tags)) {
86 
		return [];
87 
	}
3825 idir 88 
	tags = tags.replace( new RegExp('\\.'), '' ).split( ',' );
89 
 
90 
	let cleanTags       = [],
91 
		nbTags          = tags.length,
92 
		tag             = '',
93 
		tagsSansEspaces = '',
94 
		cleanTagIndex   = 0;
95 
 
96 
	for(let i = 0; i < nbTags; i++) {
97 
		tag = tags[i];
98 
		tagsSansEspaces = tag.replace( ' ', '');
99 
		if( '' !== tagsSansEspaces ) {
100 
			cleanTags.push( tag.trim() );
101 
		}
102 
	}
103 
 
104 
	return cleanTags;
105 
};
106 
 
3631 idir 107 
WidgetPhotoPopup.prototype.initEvtsDefilerImage = function() {
108 
	const lthis = this;
109 
 
3983 julien 110 
	$( '#precedent, #suivant' ).off('click');
111 
 
3631 idir 112 
	$( '#precedent, #suivant' ).on( 'click', function() {
113 
		lthis.defilerImage( this.id );
3983 julien 114 
		lthis.initEvtsTagsPF();
3631 idir 115 
	});
3823 idir 116 
 
3631 idir 117 
	$( '#print_content:not(saisir-tag)' ).on( 'keydown', function( event ) {
118 
 
3823 idir 119 
		const determinerSens = function( enventKey, left, right ) {
120 
			switch ( enventKey ) {
121 
				case left:
122 
					return 'suivant';
123 
				case right:
3825 idir 124 
					return 'precedent';
3823 idir 125 
				default:
126 
					break;
3631 idir 127 
			}
3823 idir 128 
 
129 
			return;
3631 idir 130 
		}
3823 idir 131 
 
132 
		event = (event || window.event);
133 
		// event.keyCode déprécié, on tente d'abord event.key
134 
		let sens = ( 'key' in event ) ? determinerSens( event.key, 'ArrowLeft', 'ArrowRight' ) : determinerSens( event.keyCode, 37, 39 );;
3984 julien 135 
console.log(sens);
3631 idir 136 
		if ( lthis.valOk( sens ) ) {
137 
			lthis.defilerImage( sens );
138 
		}
139 
	});
140 
};
141 
 
3980 julien 142 
// WidgetPhotoPopup.prototype.initEvtsContact = function() {
143 
// 	const lthis = this;
144 
//
145 
// 	$( '#bloc-infos-img' ).on( 'click', '.lien_contact', function( event ) {
146 
// 		event.preventDefault();
147 
// 		lthis.chargerContenuModale( this.href );
148 
// 	});
149 
// };
3631 idir 150 
 
3823 idir 151 
WidgetPhotoPopup.prototype.initEvtsFonctionsPhoto = function() {
3631 idir 152 
	const lthis = this;
153 
 
154 
	$( '#boutons-footer #bloc-fct a, #retour-metas' ).on( 'click', function( event ){
155 
		event.preventDefault();
156 
		var voletAOuvrir = $( this ).data( 'volet' ),
157 
			voletAFermer = $( '.bloc-volet:not(.hidden)' ).data( 'volet' );
158 
 
159 
		lthis.ouvrirVoletFct( voletAOuvrir, voletAFermer );
160 
		if ( window.matchMedia( '(max-width: 991px)' ).matches ) {
161 
			$( '#info-img-galerie' ).addClass( 'hidden' );
162 
			$( '#volet, #retour-galerie' ).removeClass( 'hidden' );
3989 julien 163 
			$( '#hide-metas-div' ).removeClass( 'hidden' );
3631 idir 164 
		}
165 
	});
166 
};
167 
 
168 
WidgetPhotoPopup.prototype.initEvtsRetourGalerieResponsive = function() {
169 
	$( '#retour-galerie' ).on( 'click', function( event ) {
170 
		event.preventDefault();
171 
		$( '#info-img-galerie' ).removeClass( 'hidden' );
172 
		$( this ).addClass( 'hidden' );
173 
		if ( window.matchMedia( '(max-width: 991px)' ).matches ) {
174 
			$( '#volet' ).addClass( 'hidden' );
175 
			$( '.bouton-fct.actif' ).removeClass( 'actif' );
3989 julien 176 
			$( '#hide-metas-div' ).addClass( 'hidden' );
3631 idir 177 
		}
178 
	});
179 
};
180 
 
3983 julien 181 
WidgetPhotoPopup.prototype.initEvtsTagsCel = function(){
182 
	const lthis = this;
183 
	$( '#tags-cel' ).html('');
184 
 
185 
	$( '#tags-cel' ).append(
186 
		"<p>"+ lthis.item['tags_photo']+"</p>"
187 
	)
188 
}
189 
 
3631 idir 190 
WidgetPhotoPopup.prototype.initEvtsTagsPF = function() {
3983 julien 191 
	const tagsPfDiv = $('#tags-pf');
192 
	tagsPfDiv.html('');
193 
	tagsPfDiv.append('<a id="port" class="btn tag">Port</a>' +
194 
		'<a id="fleur" class="btn tag">Fleur</a>' +
195 
		'<a id="fruit" class="btn tag">Fruit</a>' +
196 
		'<a id="feuille" class="btn tag">Feuille</a>' +
197 
		'<a id="ecorce" class="btn tag">Ecorce</a>' +
198 
		'<a id="rameau" class="btn tag">Rameau</a>' +
199 
		'<a id="planche" class="btn tag">Planche</a>' +
200 
		'<a id="rosette" class="btn tag">Rosette</a>' +
201 
		'<a id="pousse" class="btn tag">Pousse</a>');
202 
 
203 
	this.tagsPf();
3631 idir 204 
	this.tagsPfCustom();
3983 julien 205 
 
206 
	$( '#bloc-tags' ).off('click');
207 
 
3631 idir 208 
	$( '#bloc-tags' ).on( 'click', '.tag', function( event ) {
209 
		event.preventDefault();
210 
		$( this ).toggleClass( 'actif' );
3983 julien 211 
 
212 
		var motCleClique = '';
213 
		motCleClique = $(this).attr('id');
214 
 
215 
		// Utiliser la méthode findIndex pour obtenir l'index de l'élément dans le tableau
216 
		var indexElementTrouve = lthis.item['tags_pf'].findIndex(function (tag) {
217 
			return tag['mot_cle'] === motCleClique;
218 
		});
219 
 
220 
		// Vérifier si l'élément a été trouvé
221 
		if (indexElementTrouve !== -1) {
222 
			//supprimer tag dans DEL
223 
			if (lthis.item['tags_pf'][indexElementTrouve].hasOwnProperty('id_mot_cle') && lthis.item['tags_pf'][indexElementTrouve]['id_mot_cle'] != ''){
224 
				let url = lthis.urlServiceDel + 'mots-cles/' + lthis.item['tags_pf'][indexElementTrouve]['id_mot_cle']
225 
 
226 
				lthis.envoyerVersService('DELETE', url)
227 
			}
228 
 
229 
			// Supprimer l'élément de this.item['tags_pf'] à l'index trouvé
230 
			lthis.item['tags_pf'].splice(indexElementTrouve, 1);
231 
		} else {
232 
			//Ajout tag dans le DEL
233 
			let url = lthis.urlServiceDel + 'mots-cles';
234 
			let donnees = {
235 
				"image" : lthis.idImage,
236 
				"mot_cle" : motCleClique,
237 
				"auteur.id" : lthis.item["utilisateur"]["id_utilisateur"]
238 
			}
239 
 
3985 julien 240 
			lthis.envoyerVersService('PUT', url, null, JSON.stringify(donnees), function (erreur, tagId) {
3983 julien 241 
				if (erreur) {
242 
					console.error("Erreur lors de la requête :", erreur);
243 
				} else {
244 
					console.log('tag : ' + motCleClique + ' ajouté');
245 
					lthis.item['tags_pf'].push({'id_mot_cle' : tagId['id'][0], 'mot_cle' : motCleClique})
246 
				}
247 
			});
248 
		}
3631 idir 249 
	});
3983 julien 250 
	/* //@TODO est-ce qu'on garde cette croix?
3631 idir 251 
	$( '#bloc-tags' ).on( 'click', '.custom-tag.actif .fermer', function( event ) {
252 
		event.preventDefault();
253 
		//			Supprimer un custom-tag
254 
		//	_OPTIONS
255 
		// https://api-test.tela-botanica.org/service:del:0.1/mots-cles/38368
256 
		// 	_paramètres
257 
		// L'id du tag à la fin de l'url
258 
		//	_DELETE
259 
		// https://api-test.tela-botanica.org/service:del:0.1/mots-cles/38368
260 
		// 	_réponse:
261 
		// ""
262 
		// 			Mettre à jour les mots cles
263 
		//	_OPTIONS
264 
		// https://api-test.tela-botanica.org/service:del:0.1/mots-cles?image=197938
265 
		//	_GET
266 
		// https://api-test.tela-botanica.org/service:del:0.1/mots-cles?image=197938
267 
		$( this ).parent( '.custom-tag' ).remove();
268 
	});
3983 julien 269 
	*/
270 
/*
3631 idir 271 
	$( '#bloc-tags' ).on( 'keyup', '.custom-tag.actif', function( event ) {
3823 idir 272 
		let supprimerTag = false;
3631 idir 273 
 
3823 idir 274 
		event = ( event || window.event );
3631 idir 275 
		// event.keyCode déprécié, on tente d'abord event.key
276 
		if ( 'key' in event ) {
277 
			supprimerTag = ( 'Delete' === event.key || 'Backspace' === event.key );
278 
		} else {
279 
			supprimerTag = ( 46 === event.keyCode || 8 === event.keyCode );
280 
		}
281 
		if ( supprimerTag ) {
3823 idir 282 
			//			Supprimer un custom-tag
283 
			//	_OPTIONS
284 
			// https://api-test.tela-botanica.org/service:del:0.1/mots-cles/38368
285 
			// 	_paramètres
286 
			// L'id du tag à la fin de l'url
287 
			//	_DELETE
288 
			// https://api-test.tela-botanica.org/service:del:0.1/mots-cles/38368
289 
			// 	_réponse:
290 
			// ""
291 
			// 			Mettre à jour les mots cles
292 
			//	_OPTIONS
293 
			// https://api-test.tela-botanica.org/service:del:0.1/mots-cles?image=197938
294 
			//	_GET
295 
			// https://api-test.tela-botanica.org/service:del:0.1/mots-cles?image=197938
3631 idir 296 
			$( this ).parent( '.custom-tag' ).remove();
297 
		}
298 
	});
3983 julien 299 
 */
3631 idir 300 
};
301 
 
302 
WidgetPhotoPopup.prototype.defilerImage = function( sens ) {
3823 idir 303 
	if ( 'suivant' === sens ) {
3631 idir 304 
		this.indexImage++ ;
3837 idir 305 
		if( this.indexImage >= this.urls.length ) {
3631 idir 306 
			this.indexImage = 0;
307 
		}
3823 idir 308 
	} else if ( 'precedent' === sens ) {
3631 idir 309 
		this.indexImage--;
3984 julien 310 
		if( this.indexImage < 0 ) {
3837 idir 311 
			this.indexImage = this.urls.length -1;
3631 idir 312 
		}
313 
	}
3823 idir 314 
	// @TODO: Modifier l'attr content de 'meta[property=og:image]' et y mettre l'url de l'image
315 
	this.mettreAJourPopup();
3631 idir 316 
};
317 
 
318 
WidgetPhotoPopup.prototype.afficherTitreImage = function() {
3823 idir 319 
	let lienContact  =
320 
			this.urlWidget +'?mode=contact&nn=' + this.nn +
321 
			'&nom_sci=' + this.obs['nom_sel'] +
322 
			'&date=' + this.date +
323 
			'&localisation=' + this.obs['localisation'] +
324 
			'&id_image=' + this.idImage +
325 
			'&auteur=' + this.auteur;
3631 idir 326 
 
3823 idir 327 
	if ( this.valOk( this.popupUrl ) ) {
328 
		if (! this.popupUrl.match( new RegExp( 'img:' + this.idImage ) ) ) {
329 
			this.popupUrl = this.actualiserPopupUrl( this.popupUrl, this.urlThisImage );
3631 idir 330 
		}
3823 idir 331 
		lienContact += '&popup_url=' + encodeURIComponent( this.popupUrl );
3631 idir 332 
	}
333 
 
3823 idir 334 
	$( '#bloc-infos-img' ).html(
3825 idir 335 
		this.afficherLien( this.urlLienEflore, this.obs['nom_sel'] )+
3823 idir 336 
		' par '+
3979 julien 337 
		'<a class="lien_contact" href="' + this.item['urlProfil'] + '" target="_blank" title="Afficher le profil">' + this.auteur + '</a> '+
3823 idir 338 
		' le ' + this.date + ' - ' + this.obs['localisation']
339 
	);
3631 idir 340 
};
341 
 
342 
WidgetPhotoPopup.prototype.actualiserPopupUrl = function( queryString, remplacement ) {
3823 idir 343 
	let queryStringParsee = queryString.substring(1).split('&');
3631 idir 344 
 
345 
	$.each( queryStringParsee,  function( i, param ) {
346 
		if( /url_image/.test( param ) ) {
347 
			queryString = queryString.replace( param, 'url_image=' + remplacement );
348 
			return false;
349 
		}
350 
	});
351 
	return queryString;
352 
};
353 
 
354 
WidgetPhotoPopup.prototype.redimentionnerModaleCarousel = function() {
355 
	this.redimensionnerGalerie();
356 
	if ( window.matchMedia( '(max-width: 991px)' ).matches ) {
357 
		$( '#volet, #retour-galerie' ).addClass( 'hidden' );
358 
		$( '#info-img-galerie' ).removeClass( 'hidden' );
359 
		$( '.bouton-fct.actif' ).removeClass( 'actif' );
360 
		$( '.nettoyage-volet.haut' ).text( $( '#bloc-infos-img' ).text() );
361 
		$( '#boutons-footer, #info-img-galerie' ).removeClass( 'col-lg-8' );
362 
		$( '#bloc-infos-img, #volet' ).removeClass( 'col-lg-4' );
363 
	} else {
364 
		$( '#volet, #info-img-galerie' ).removeClass( 'hidden' );
365 
		if ( this.valOk( $( '.bloc-volet:not(.hidden)' ) ) ) {
366 
			$( '.bouton-fct.' + $( '.bloc-volet:not(.hidden)' ).data( 'volet' ) ).addClass( 'actif' );
367 
		}
368 
		$( '.nettoyage-volet.bas' ).text( $( '#bloc-infos-img' ).text() );
369 
		$( '#boutons-footer, #info-img-galerie' ).addClass( 'col-lg-8' );
370 
		$( '#bloc-infos-img, #volet' ).addClass( 'col-lg-4' );
371 
		$( '#retour-galerie' ).addClass( 'hidden' );
372 
	}
373 
};
374 
 
375 
WidgetPhotoPopup.prototype.redimensionnerGalerie = function() {
376 
	var maxSize = ( $( window ).width() / $( window ).height() ) < 1 ? $( window ).width() : $( window ).height();
377 
 
378 
	maxSize -= 30;
379 
	$( '.carousel-item img' ).each( function( index, image ) {
380 
		var proportion  = image.dataset.width / image.dataset.height,
381 
			cssResize   = {};
382 
 
383 
		if ( proportion >= 1 ) {
384 
			cssResize['width'] = maxSize;
385 
		}
386 
		if ( proportion <= 1) {
387 
			cssResize['height'] = maxSize;
388 
		}
389 
		$( image ).css( cssResize );
390 
	});
391 
};
392 
 
393 
WidgetPhotoPopup.prototype.ouvrirVoletFct = function( voletAOuvrir, voletAFermer ) {
394 
	if( voletAOuvrir !== voletAFermer ) {
395 
		$( '#boutons-footer  .' + voletAFermer ).removeClass( 'actif' );
396 
		$( '#boutons-footer  .' + voletAOuvrir ).addClass( 'actif' );
397 
		$( '#bloc-' + voletAFermer ).addClass( 'hidden' );
398 
		$( '#bloc-' + voletAOuvrir ).removeClass( 'hidden' );
399 
		$( '#volet' ).scrollTop(0);
3823 idir 400 
		$( '#retour-metas' ).removeClass( 'hidden', 'meta' === voletAOuvrir );
3631 idir 401 
	}
402 
};
403 
 
3983 julien 404 
WidgetPhotoPopup.prototype.tagsPf = function () {
405 
	const lthis = this;
406 
	$('#tags-pf-supp').html('');
407 
 
408 
	lthis.item['tags_pf'].forEach(tag => {
409 
		const tagElement = document.getElementById(tag['mot_cle']);
410 
 
411 
		// Vérifier si l'élément existe
412 
		if (tagElement) {
413 
			// Ajouter la classe 'active' à l'élément <a>
414 
			tagElement.classList.add('actif');
415 
		} else {
416 
			$('#tags-pf-supp').append('<a id="'+tag['mot_cle']+'" class="btn tag custom-tag actif">' + tag['mot_cle'] + '&nbsp;' +
417 
				// '<i class="fas fa-times-circle fermer"></i>' +
418 
				'</a>')
419 
		}
420 
	});
421 
}
422 
 
3631 idir 423 
WidgetPhotoPopup.prototype.tagsPfCustom = function() {
424 
	const lthis = this;
425 
 
426 
	$( '#saisir-tag' ).on( 'blur keyup', function( event ) {
3823 idir 427 
		event = ( event || window.event );
3631 idir 428 
 
429 
		var ajouterTag = ( 'blur' === event.type );
430 
 
431 
		// event.keyCode déprécié, on tente d'abord event.key
432 
		if ( 'key' in event  ) {
433 
			if ( 'Enter' === event.key ) {
434 
				ajouterTag = true;
435 
			}
436 
		} else if ( 13 === event.keyCode ) {
437 
			ajouterTag = true;
438 
		}
439 
		if	( ajouterTag ) {
440 
			var nouveauTag     = $( this ).val(),
441 
				nouveauTagAttr = lthis.chaineValableAttributsHtml( nouveauTag.toLowerCase() );
442 
 
443 
			if( lthis.valOk( nouveauTagAttr ) && !lthis.valOk( $( '#' + nouveauTagAttr + '.tag' ) ) ) {
444 
				$( '#tags-pf-supp' ).append(
3823 idir 445 
					'<a id="' + nouveauTagAttr + '" class="btn tag custom-tag actif">' +
3983 julien 446 
						nouveauTag + '&nbsp;' +
447 
					// '<i class="fas fa-times-circle fermer"></i>' +
3631 idir 448 
					'</a>'
449 
				);
3983 julien 450 
 
451 
				let url = lthis.urlServiceDel + 'mots-cles';
452 
				let donnees = {
453 
					"image" : lthis.idImage,
454 
					"mot_cle" : nouveauTagAttr,
455 
					"auteur.id" : lthis.item["utilisateur"]["id_utilisateur"]
456 
				}
457 
 
458 
				// Envoie du nouveau tag dans le DEL
3985 julien 459 
				lthis.envoyerVersService('PUT', url, null, JSON.stringify(donnees), function (erreur, tagId) {
3983 julien 460 
					if (erreur) {
461 
						console.error("Erreur lors de la requête :", erreur);
462 
					} else {
463 
						console.log('tag : ' + nouveauTagAttr + ' ajouté');
464 
						lthis.item['tags_pf'].push({'id_mot_cle' : tagId['id'][0], 'mot_cle' : nouveauTagAttr})
465 
					}
466 
				});
467 
 
468 
				// $( '#form-tags-auteur' )[0].reset();
3631 idir 469 
				$( this ).val( '' );
470 
			}
471 
		}
472 
	});
473 
};
3823 idir 474 
 
475 
WidgetPhotoPopup.prototype.traiterMetas = function() {
476 
	this.afficherMetas();
477 
	this.afficherPopupLocalisation();
478 
	this.afficherMetasPlus();
479 
	this.fournirLienTelechargement();
480 
};
481 
 
482 
WidgetPhotoPopup.prototype.afficherMetas = function() {
483 
	const lthis         = this;
484 
	const META_CONTENUS = {
3825 idir 485 
		'nom' : this.afficherLien( this.urlLienEflore, this.obs['nom_sel'] ),
3823 idir 486 
		'localisation' : this.obs['localisation'],
487 
		'auteur' : this.auteur,
488 
		'date-obs' : this.date,
489 
		'commentaire' : this.obs['commentaire'],
490 
		'certitude' : this.obs['certitude'],
491 
		'fiabilite' : this.obs['fiabilite'],
492 
		'num-photo' : this.idImage,
493 
		'titre-original' : this.item['nom_original'],
494 
		'date-photo' : this.formaterDate( this.item['date_photo'] ),
495 
		'attribution-copy' : this.item['attribution'],
496 
		'url-copy' : this.urlThisImage
497 
	};
498 
 
499 
	$.each( META_CONTENUS, function( attrId, contenu ) {
500 
		let $metaContainer = $( '#bloc-meta #'+attrId );
501 
 
502 
		if ( lthis.valOk( contenu ) ) {
503 
			switch( attrId ) {
504 
				case 'attribution-copy' :
505 
				case 'url-copy' :
506 
					$metaContainer.val( contenu );
507 
					lthis.copieAutoChamp( $metaContainer );
508 
					break;
509 
				case 'nom' :
510 
					$( '.contenu', $metaContainer ).html( contenu );
3825 idir 511 
					$( '.bouton', $metaContainer ).attr( 'href', lthis.urlLienEflore );
3823 idir 512 
					break;
513 
				case 'auteur' :
3827 idir 514 
					$( '.bouton', $metaContainer ).attr( 'href', lthis.item['urlProfil'] );
3823 idir 515 
				default:
516 
					$( '.contenu', $metaContainer ).text( contenu );
517 
					break;
518 
			}
519 
		}
520 
	});
521 
};
522 
 
3824 idir 523 
WidgetPhotoPopup.prototype.copieAutoChamp = function( $champACopier ) {
3838 idir 524 
	$champACopier.off( 'click' ).on( 'click', function() {
525 
		$( '#attribution-copy, #url-copy' ).removeClass( 'hidden' )
526 
			.find( '.copy-message' ).remove();
3823 idir 527 
 
528 
		$( this ).select();
529 
		document.execCommand( 'copy' );
530 
 
531 
		$( this ).after(
532 
			'<p class="copy-message alert-success" style="width: 100%; height:' + $( this ).outerHeight() + 'px; margin: 0; display:flex;">'+
533 
				'<span style="margin:auto; font-size:1rem;">Copié dans le presse papier</span>'+
534 
			'</p>'
535 
		).addClass( 'hidden' );
536 
 
537 
		setTimeout( function() {
538 
			$( '.copy-message' ).remove();
539 
			$champACopier.removeClass( 'hidden' );
540 
		}, 1000 );
541 
	});
542 
};
543 
 
544 
WidgetPhotoPopup.prototype.afficherMetasPlus = function() {
545 
	const lthis         = this;
546 
	const META_LABELS  = {
547 
		'id_obs' : 'observation n°',
548 
		'projet' : 'projet',
3825 idir 549 
		'nom_referentiel' : 'réferentiel',
3823 idir 550 
		'date_obs' : 'date d´observation',
551 
		'nom_sel': 'nom scientifique',
552 
		'nom_sel_nn' : 'nom scientifique n°',
553 
		'nom_ret' : 'nom retenu',
554 
		'nom_ret_nn' : 'nom retenu n°',
555 
		'famille' : 'famille',
556 
		'tags_obs' : 'tags de l´observation',
557 
		'lieudit' : 'lieu dit',
558 
		'station' : 'station',
559 
		'milieu' : 'milieu',
560 
		'latitude' : 'latitude',
561 
		'longitude' : 'longitude',
562 
		'altitude' : 'altitude',
563 
		'localisation_precision': 'précision de la localisation',
564 
		'code_insee' : 'code insee de la commune',
565 
		'dept' : 'département',
566 
		'pays' : 'pays',
567 
		'est_ip_valide' : 'validée sur identiplante',
568 
		'score_ip' : 'score identiplante',
569 
		'url_ip' : 'url identiplante',
570 
		'abondance' : 'abondance',
571 
		'phenologie' : 'phénologie',
572 
		'spontaneite' : 'spontaneite',
573 
		'type_donnees' : 'type de donnees',
574 
		'biblio' : 'bibliographie',
575 
		'source' : 'source',
576 
		'herbier' : 'herbier',
577 
		'observateur' : 'observateur',
578 
		'observateur_structure' : 'structure'
579 
	};
3825 idir 580 
 
3823 idir 581 
	const $contenuPlusMeta  = $( '#contenu-meta-plus' );
3825 idir 582 
	let degres = $contenuPlusMeta.is( ':visible' ) ? '180' : '0';
3823 idir 583 
 
584 
	this.rotationFleche( degres );
3825 idir 585 
	$contenuPlusMeta.empty();
3823 idir 586 
 
587 
	$.each( META_LABELS, function( cle, label ) {
588 
		let idAttr = cle.replace( '_', '-' ),
589 
			contenu = lthis.obs[cle];
590 
 
3825 idir 591 
		switch( cle ) {
592 
			case 'nom_sel':
593 
				contenu = lthis.afficherLien( lthis.urlLienEflore, contenu );
594 
				break;
595 
 
596 
			case 'nom_ret':
597 
				let urlEfloreNomRetenu = lthis.urlLienEflore.replace( lthis.obs['nom_sel_nn'], lthis.obs['nom_ret_nn'] );
598 
 
599 
				contenu = lthis.afficherLien( urlEfloreNomRetenu, contenu );
600 
				break;
601 
 
602 
			case 'url_ip':
603 
				contenu = lthis.afficherLien( contenu, contenu );
604 
				break;
605 
 
606 
			case 'est_ip_valide':
607 
			case 'herbier':
608 
				if( '0' === contenu ) {
609 
					contenu = 'non';
610 
				}
611 
				break;
612 
 
613 
			case 'date_obs':
614 
				contenu = lthis.formaterDate( contenu );
615 
				break;
616 
 
617 
			case 'tags_obs':
618 
				let tagsObsLength = lthis.tagsObs.length;
619 
				contenu = lthis.tagsObs.join( '<br>' );
620 
				break;
621 
 
622 
			default:
623 
				break;
3823 idir 624 
		}
625 
 
626 
		if ( lthis.valOk( contenu ) ) {
627 
			$contenuPlusMeta.append(
628 
				'<li id="' + idAttr + '-meta-plus" class="row">'+
629 
					'<div class="col-5 label">' + label.charAt( 0 ).toUpperCase() + label.slice( 1 ) + '</div>'+
3829 idir 630 
					'<div class="col-7 contenu">' + contenu + '</div>'+
3823 idir 631 
				'</li>'
632 
			);
633 
		}
634 
	});
635 
 
3825 idir 636 
	if( !$contenuPlusMeta.hasClass( 'actif' ) ) {
637 
		$contenuPlusMeta.hide();
638 
	}
639 
 
640 
	let estVisible = false;
641 
 
3823 idir 642 
	$( '#plus-meta' ).off( 'click' ).on( 'click', function( event ) {
643 
		event.preventDefault();
644 
		$contenuPlusMeta.toggle( 200, function() {
3825 idir 645 
			estVisible = $contenuPlusMeta.is( ':visible' );
646 
			degres     = estVisible ? '180' : '0';
647 
			$( this ).toggleClass( 'actif', estVisible );
3823 idir 648 
			lthis.rotationFleche( degres );
649 
		});
650 
	});
651 
};
652 
 
653 
WidgetPhotoPopup.prototype.rotationFleche = function( degres ) {
654 
	$( '#plus-meta i' ).css({
655 
		'-webkit-transform' : 'rotate('+ degres +'deg)',
656 
		'-moz-transform' : 'rotate('+ degres +'deg)',
657 
		'-ms-transform' : 'rotate('+ degres +'deg)',
658 
		'transform' : 'rotate('+ degres +'deg)'
659 
	});
660 
};
661 
 
662 
WidgetPhotoPopup.prototype.fournirLienTelechargement = function() {
663 
	const lthis = this;
664 
 
665 
	$( '#formats' ).on( 'change', function() {
666 
		let format             = ( $( this ).val() || 'O' ),
667 
			lienTelechargement = lthis.urlBaseTelechargement + lthis.idImage + '?methode=telecharger&format=' + format;
668 
 
669 
		$( '#telecharger' ).attr( 'href', lienTelechargement );
670 
	});
671 
 
672 
	$( '#formats' ).trigger( 'change' );
673 
};
674 
 
675 
 
676 
WidgetPhotoPopup.prototype.afficherPopupLocalisation = function() {
677 
	const lthis = this;
678 
 
679 
	$( '#localisation a.bouton' ).on( 'click', function( event ){
680 
		event.preventDefault();
681 
 
682 
		$( this ).after(
683 
			'<div id="localisation-map-container">'+
684 
				'<button id="map-close" type="button" class="bouton btn btn-sm btn-outline-secondary" aria-label="Close">'+
685 
					'<span aria-hidden="true">×</span>'+
686 
				'</button>'+
687 
				'<div id="localisation-map"></div>'+
688 
			'</div>'
689 
		);
690 
 
691 
		let lat = lthis.obs['latitude'],
692 
			lng = lthis.obs['longitude'],
693 
			map = L.map( 'localisation-map', {
694 
				zoomControl: true,
695 
				dragging: false,
696 
				scrollWheelZoom: 'center'
697 
			} ).setView( [lat, lng], 12 );
698 
 
699 
		map.markers = [];
700 
 
701 
		L.tileLayer(
3971 julien 702 
			// 'https://osm.tela-botanica.org/tuiles/osmfr/{z}/{x}/{y}.png',
703 
			'https://a.tile.openstreetmap.fr/osmfr/{z}/{x}/{y}.png',
3823 idir 704 
			{
705 
				attribution: 'Data © <a href="http://osm.org/copyright">OpenStreetMap</a>',
706 
				maxZoom: 18
707 
			}
708 
		).addTo( map );
709 
 
710 
		map.addLayer( new L.FeatureGroup() );
711 
 
712 
		let marker = new L.Marker(
713 
			{
714 
				'lat': lat,
715 
				'lng': lng
716 
			},
717 
			{
718 
				draggable: false,
719 
			}
720 
		);
721 
 
722 
 
723 
		map.addLayer( marker );
724 
		map.markers.push( marker );
725 
 
726 
		$( '#map-close' ).on( 'click', function( event ){
727 
			$( '#localisation-map-container' ).remove();
728 
		});
729 
	});
730 
 
731 
	$( '#fenetre-modal' ).on( 'click', function( event ) {
732 
		if(
733 
			!$( event.target ).closest( '#localisation-map-container' ).length
734 
			&& !$( event.target ).closest( '#obs-localisation' ).length
735 
		) {
736 
			$( '#localisation-map-container' ).remove();
737 
		}
738 
	});
739 
};
740 
 
741 
 
742 
WidgetPhotoPopup.prototype.regenererMiniature = function() {
743 
	const lthis = this;
744 
	$( '#regenerer-miniature' ).off( 'click' ).on( 'click', function( event ) {
745 
		event.preventDefault();
746 
 
747 
		let url = lthis.urlServiceRegenererMiniature + lthis.idImage;
3829 idir 748 
		$.get( url, function( data ) {
749 
				console.log( data );
3987 julien 750 
			lthis.forcerMajImage(lthis.urlThisImage, lthis.urlTpl);
3829 idir 751 
			}
752 
		).fail( function() {
3948 julien 753 
			console.log( 'La régénération d´image ne s´est pas faite' );
3823 idir 754 
		});
755 
	});
756 
};
757 
 
758 
WidgetPhotoPopup.prototype.formaterDate = function( sqlDate ) {
759 
	dateFormatee = sqlDate
760 
		.substring( 0, 10 )
761 
		.split( '-' )
762 
		.reverse()
763 
		.join('/');
764 
 
765 
	return dateFormatee;
766 
};
767 
 
3825 idir 768 
WidgetPhotoPopup.prototype.afficherLien = function( url, nom ) {
769 
	if( !/https?:\/\//.test( url ) ) {
770 
		url = 'https://' + url;
771 
	}
772 
	return '<a href="' + url + '" target="_blank">' + nom + '</a> ';
773 
};
774 
 
3823 idir 775 
WidgetPhotoPopup.prototype.fournirLienIdentiplante = function() {
776 
	const lthis = this;
777 
	$( '.signaler-erreur-obs' ).each( function() {
3950 julien 778 
		$( this ).attr( 'href', 'https://' + lthis.urlIP );
3823 idir 779 
	});
780 
};
781 
 
3948 julien 782 
WidgetPhotoPopup.prototype.initEvtsProtocole = function() {
783 
	const lthis = this;
3958 julien 784 
	$('#bloc-notes-protocole').addClass('hidden');
785 
	lthis.votes = null
786 
	//On transforme la promesse en array
787 
	const PROTOCOLES_ARRAY = Object.values(lthis.protocoles);
3948 julien 788 
 
3958 julien 789 
	const $select = $('#protocole');
790 
	$select.empty(); // Clear existing options
791 
 
792 
	// Add the default hidden option
793 
	$select.append('<option value="" selected hidden>Choix du protocole</option>');
794 
 
795 
	PROTOCOLES_ARRAY.forEach(protocoleData => {
796 
		$select.append(`<option id="protocole_${protocoleData['protocole.id']}" value="protocole_${protocoleData['protocole.id']}">${protocoleData['protocole.intitule']}</option>`);
797 
	})
798 
 
3948 julien 799 
	$( '#protocole').on( 'change', function( event ){
800 
		event.preventDefault();
3958 julien 801 
		lthis.votes = null
802 
 
3948 julien 803 
		var id = $(this).children(":selected").attr("id");
3958 julien 804 
		var protocole = id.split("_")[1];
3948 julien 805 
 
806 
		$('#bloc-notes-protocole').removeClass('hidden');
807 
 
3958 julien 808 
		// Find the object corresponding to the selected id (protocole.id)
809 
		var selectedProtocoleData = PROTOCOLES_ARRAY.find(protocoleData => protocoleData['protocole.id'] === protocole);
810 
 
811 
		lthis.protocole = selectedProtocoleData['protocole.id'];
812 
		const message = selectedProtocoleData['protocole.descriptif'];
813 
 
814 
		$('#message-protocole').html('<p>' + message + '</p>');
815 
 
816 
		// On envoie le protocole sélectionné à la partie "vote"
817 
		// On récupère tous les votes de l'image depuis pictoflora
818 
		lthis.votes = lthis.getVotes(lthis.protocole)
819 
 
820 
		// Si l'utilisateur est connect, on vérifie s'il a déjà voté pour cette image et on affiche les étoiles
821 
		// correspondantes
822 
		if(lthis.userId){
823 
			lthis.checkUserVote(lthis.userId, lthis.protocole, lthis.votes);
824 
		} else {
825 
			lthis.voteId = null;
826 
			lthis.removeVoteStars()
3948 julien 827 
		}
3958 julien 828 
 
829 
		// Remove any previous click event listeners on rating stars
830 
		for (let i=1; i<=5; i++){
831 
			$("#rating-star-"+i).off("click");
832 
		}
833 
 
834 
		// Si l'utilisateur vote, on affiche les étoiles correspondantes et on l'envoie vers pictoflora
835 
		lthis.traiterVote();
3948 julien 836 
	});
3958 julien 837 
}
3948 julien 838 
 
839 
WidgetPhotoPopup.prototype.traiterVote = function () {
3958 julien 840 
	const lthis = this;
841 
	let starSelected = 0
842 
	let mode = '';
3948 julien 843 
 
844 
	$("#note").attr("value", -1);
845 
 
3958 julien 846 
	// Traitement du bouton suppression du vote
3948 julien 847 
	$("#note-remove").click(function (){
3958 julien 848 
		lthis.removeVoteStars();
849 
		mode = 'DELETE';
850 
		// On n'envoie le vote que si l'utilisateur est connecté
851 
		if (lthis.userId) {
852 
			lthis.sendVote(lthis.userId, lthis.protocole, starSelected, mode, lthis.voteId);
853 
		}
3948 julien 854 
	})
855 
 
3958 julien 856 
	// Si l'utilisateur a déjà voté pour cette image on affiche son vote et on passe en mode modification
857 
	let userAVoter = lthis.checkUserVote(lthis.userId, lthis.protocole, lthis.votes);
858 
	userAVoter ? mode = 'POST' : mode = 'PUT';
3948 julien 859 
 
3958 julien 860 
	// Affichage du nombre d'étoiles sélectionnées et envoi du vote
861 
	for (let i=1; i<=5; i++){
862 
		$("#rating-star-"+i).click(function () {
863 
			starSelected = i
864 
			lthis.displayVote(starSelected);
865 
			$("#note").attr("value", starSelected);
866 
			// On n'envoie le vote que si l'utilisateur est connecté
867 
			if (lthis.userId){
868 
				lthis.sendVote(lthis.userId, lthis.protocole, starSelected, mode);
869 
			}
870 
		});
871 
	}
872 
};
3948 julien 873 
 
3958 julien 874 
// Envoi du vote vers la fonction sendVote() du fichier php
875 
WidgetPhotoPopup.prototype.sendVote = function (userId, protocole, note, mode, voteId){
876 
	const lthis = this;
3948 julien 877 
 
3958 julien 878 
	var xhttp = new XMLHttpRequest();
879 
	xhttp.onreadystatechange = function() {
880 
		if (this.readyState == 4 && this.status == 200) {
3988 julien 881 
			let votesUrl = lthis.urlServiceDel + 'images/' + lthis.idImage + '/votes';
882 
			// Récupération des données et maj de l'affichage
883 
			lthis.envoyerVersService('GET', votesUrl, null, null, function (erreur, data) {
884 
				if (erreur) {
885 
					console.error("Erreur lors de la requête :", erreur);
886 
				} else {
887 
					lthis.item["votes"] = Object.values(data['resultats']);
888 
					lthis.getVotes(protocole)
889 
				}
890 
			});
3979 julien 891 
			console.log('vote envoyé')
3958 julien 892 
		}
893 
	};
3948 julien 894 
 
3958 julien 895 
	var url = "../widget:cel:photo/";
3948 julien 896 
 
3958 julien 897 
	// Convertir les données en une chaîne JSON pour les envoyer dans le corps de la requête
898 
	var data = {
899 
		idImage: this.idImage,
900 
		mode: mode,
901 
		user: userId,
902 
		protocole: protocole,
903 
		vote: note,
904 
		voteId: voteId
905 
	}
906 
	var jsonData = JSON.stringify(data);
3948 julien 907 
 
3958 julien 908 
	xhttp.open("POST", url+"?action=send_pf_vote", true);
909 
	xhttp.setRequestHeader("Content-Type", "application/json");
910 
	xhttp.send(jsonData);
911 
}
3948 julien 912 
 
3958 julien 913 
WidgetPhotoPopup.prototype.getVotes = function (protocoleId){
914 
	let votes = Object.values(this.item["votes"]);
915 
	let noteMoyenne = 0;
916 
	let nombreVotes= 0;
917 
	let noteTotal = 0;
918 
	let itemVotes = [];
3948 julien 919 
 
3958 julien 920 
	votes.forEach(vote => {
921 
		if (vote["protocole.id"] == protocoleId){
922 
			nombreVotes++
923 
			noteTotal += parseInt(vote["vote"]);
924 
			noteMoyenne = (noteTotal / nombreVotes).toFixed(1)
925 
			itemVotes.push(vote);
926 
		}
927 
	})
3948 julien 928 
 
3958 julien 929 
	let elementNoteMoyenne = $("#note-moyenne .contenu");
930 
	elementNoteMoyenne.text(noteMoyenne);
3948 julien 931 
 
3958 julien 932 
	let elementNoteCount = $("#note-count .contenu");
933 
	elementNoteCount.text(nombreVotes);
3948 julien 934 
 
3958 julien 935 
	return itemVotes;
936 
}
3948 julien 937 
 
3958 julien 938 
WidgetPhotoPopup.prototype.displayVote = function (note){
939 
	lthis.removeVoteStars();
3948 julien 940 
 
3958 julien 941 
	for (let i=1; i<=5; i++){
942 
		for (let j=1; j<=note; j++){
943 
			$("#rating-star-"+j).removeClass('far').addClass('fa').css("color", "#c3d45d");
944 
		}
945 
	}
946 
}
3948 julien 947 
 
3958 julien 948 
WidgetPhotoPopup.prototype.removeVoteStars = function (){
949 
	$(".notation-star").removeClass('fa').addClass('far').css("color", "grey");
950 
	$("#note").attr("value", -1);
951 
}
3948 julien 952 
 
3958 julien 953 
WidgetPhotoPopup.prototype.checkUserVote = function (userId, protocoleId, votes){
954 
	let userVote = null;
3948 julien 955 
 
3958 julien 956 
	votes.forEach(vote => {
957 
		if (vote["protocole.id"] == protocoleId && vote["auteur.id"] == userId){
958 
			userVote = vote;
959 
		}
960 
	})
961 
 
962 
	if (userVote){
963 
		this.displayVote(userVote['vote']);
964 
		// this.traiterVote()
965 
		this.voteId = userVote['vote.id'];
966 
 
967 
		return true
968 
	} else {
969 
		this.voteId = null;
970 
		this.removeVoteStars()
971 
	}
972 
}
973 
 
3948 julien 974 
WidgetPhotoPopup.prototype.pivoterImage = function() {
3949 julien 975 
	lthis = this;
3985 julien 976 
 
977 
	let newCel = lthis.urlServiceNewCel + "photo_rotations?photoId=" + lthis.idImage + "&degrees=";
978 
	let url = '';
979 
 
3949 julien 980 
	$( '#pivoter-droite' ).off( 'click' ).on( 'click', function( event ) {
3948 julien 981 
		event.preventDefault();
982 
 
3985 julien 983 
		url = "";
3949 julien 984 
		lthis.pivoter('droite');
3985 julien 985 
		url = newCel + "-90";
3987 julien 986 
		// lthis.envoyerVersService('GET', url, lthis.token )
987 
 
988 
		lthis.envoyerVersService('GET', url, lthis.token, null, function (erreur, cb) {
989 
			lthis.forcerMajImage(lthis.urlThisImage, lthis.urlTpl);
990 
		});
991 
 
992 
		// lthis.forcerMajImage(lthis.urlThisImage);
3948 julien 993 
	});
994 
 
3949 julien 995 
	$( '#pivoter-gauche' ).off( 'click' ).on( 'click', function( event ) {
3948 julien 996 
		event.preventDefault();
997 
 
3985 julien 998 
		url = "";
3949 julien 999 
		lthis.pivoter('gauche');
3985 julien 1000 
		url = newCel + "90";
3987 julien 1001 
		lthis.envoyerVersService('GET', url, lthis.token, null, function (erreur, cb) {
1002 
			lthis.forcerMajImage(lthis.urlThisImage, lthis.urlTpl);
1003 
		});
3948 julien 1004 
	});
1005 
};
1006 
 
3949 julien 1007 
WidgetPhotoPopup.prototype.pivoter = function(direction) {
1008 
	let imageSelected = $('img[src="' + lthis.urlThisImage + '"]').attr('id');
1009 
	let angle = $('#' + imageSelected).data('angle');
1010 
 
1011 
	if (angle == 360 || angle == (-360) || angle == undefined){
1012 
		angle = 0
1013 
	}
1014 
	if (direction == 'droite'){
1015 
		angle += 90;
1016 
	} else {
1017 
		angle -= 90;
1018 
	}
3950 julien 1019 
 
3949 julien 1020 
	$('#' + imageSelected).css("transform", "rotate(" + angle + "deg) ");
1021 
	$('#' + imageSelected).data('angle', angle);
1022 
}
1023 
 
3987 julien 1024 
WidgetPhotoPopup.prototype.forcerMajImage = function (urlImage, urlTpl){
1025 
	var indexPourcentage = urlTpl.indexOf('%');
1026 
	urlTpl = urlTpl.substring(0, indexPourcentage);
3823 idir 1027 
 
3987 julien 1028 
	// Sélectionne l'élément img avec l'attribut src égal à this.urlImage
1029 
	var $image = $('img[src^="' +  urlTpl + '"]');
1030 
 
1031 
	// Ajoute un paramètre unique à l'URL pour éviter le cache
1032 
	var newSrc = urlImage + '?timestamp=' + new Date().getTime();
1033 
 
1034 
	// Met à jour l'attribut 'src' de l'image avec la nouvelle URL
1035 
	$image.attr('src', newSrc);
1036 
}
3989 julien 1037 
 
1038 
WidgetPhotoPopup.prototype.initEvtsToggleVolet = function (){
1039 
	lthis = this;
1040 
 
1041 
	$('#hide-metas-div').off('click').on('click', function () {
1042 
		$('#hide-metas-div').toggleClass('volet-hidden')
1043 
		$('#hide-metas i').toggleClass('fa-angle-double-left')
1044 
		$('#hide-metas i').toggleClass('fa-angle-double-right')
1045 
		if ($('#hide-metas-div').hasClass('volet-hidden')){
1046 
			$('#hide-metas').attr('title', "Afficher le volet d'information")
1047 
		} else {
1048 
			$('#hide-metas').attr('title', "Cacher le volet d'information")
1049 
		}
1050 
 
1051 
		$( '#volet, #retour-galerie' ).toggleClass( 'hidden' );
1052 
		$( '#boutons-footer, #info-img-galerie' ).toggleClass( 'col-lg-8' );
1053 
	})
1054 
}