Subversion Repositories eFlore/Applications.eflore-consultation

Rev

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

Rev Author Line No. Line
277 aurelien 1
 
227 delphine 2
var modules = Array();
3
var tableauOnglets = Array();
233 aurelien 4
var nbOngletsInvisibles = 0;
227 delphine 5
 
6
/** Classe Module
7
* Définit un module de type portlet
8
**/
9
function Module(id, module, onglet, statique) {
10
 
11
	// Variables de classe : identifiant, titre, et le HTML du résumé à afficher dans le contenu
12
	this.id = id;
13
	this.titre;
14
	this.htmlResume;
15
	this.statique = statique;
16
 
17
	// Les objets Portlet et Onglet que l'ont garde en mémoire pour pouvoir y accéder facilement
18
	this.portlet = module;
19
	this.onglet;
20
 
21
	// creerPortlet
22
	// Créer l'objet Portlet HTML à afficher et le stocker dans les variables de classe
23
	this.creerPortlet = function() {
24
		var objet = this;
25
 
26
		var titre = $(module).children('.titre');
27
		titre.className = 'titre ui-widget-header ui-corner-all';
28
		titre.id = 'titre-' + this.id;
242 aurelien 29
 
30
		var lienTitre = $(module).children('.titre').children('a');
31
		lienTitre.attr('href','#'+this.id);
32
		lienTitre.click(function() {
33
			if(objet.onglet.is(':visible')) {
34
				$('#zone_onglets').tabs('select', '#ui-tabs-'+objet.id);
35
			}
36
			return false;
37
		});
38
		lienTitre.hover(function() {
39
			if(!objet.ongletEstAffiche()) {
40
				$(this).css({"color":"white"});
41
			} else {
42
				$(this).css({"color":"#E78F08"});
43
			}
44
		});
45
 
46
		lienTitre.mouseout(function() {
47
			$(this).css({"color":"white"});
48
		});
227 delphine 49
 
50
		var contenu = $(module).children('.contenu');
51
		contenu.id = 'contenu-' + this.id;
52
		contenu.className ='contenu';
53
 
54
		var lienToggle = document.createElement('span');
55
		lienToggle.className = 'lienToggle ui-icon ui-icon-minusthick';
56
		$(titre).append(lienToggle);
57
		$(lienToggle).click(function() {
58
			objet.afficherCacherModule();
59
		});
60
 
61
		this.portlet = module;
62
		return module;
242 aurelien 63
	}
64
 
65
	this.ongletEstAffiche = function() {
66
		return $(this.onglet.selector).is(':visible');
67
	}
227 delphine 68
 
242 aurelien 69
	// Crée l'objet Onglet HTML
227 delphine 70
	this.creerOnglet = function() {
71
		var objet = this;
72
 
73
		if (!statique) {
74
			var span = document.createElement('span');
75
			span.className = "ui-icon ui-icon-close";
76
 
77
			// Gestion de la fermeture de l'onglet
78
			$(span).live( "click", function() {
79
				objet.afficherCacherModule();
80
				redimensionnerOnglets();
81
			});
82
			$(onglet).append(span);
83
		}
84
		this.onglet = onglet;
85
	}
86
 
87
	// Initialisation de l'objet
88
	this.creerPortlet();
89
	this.creerOnglet();
90
 
91
	// Accesseurs de la classe
92
	this.getOnglet = function() {
93
		return this.onglet;
94
	}
95
 
96
	this.getPortlet = function() {
97
		return this.portlet;
98
	}
99
 
100
	// fonctions d'affichage et cachage (je sais pas si on dit ça comme ça) des onglets
101
	this.afficherCacherModule = function() {
102
		$(this.portlet).find(".lienToggle").toggleClass("ui-icon-plusthick");
103
		$(this.portlet).find(".lienToggle").toggleClass("ui-icon-minusthick");
104
		$(this.portlet).find(".contenu").toggle();
105
		$(this.onglet).toggle();
106
 
107
		redimensionnerOnglets();
108
	}
109
}
110
 
111
function afficherCacherMenuOnglets() {
112
	if($("#conteneurMenuOnglets").html() != '') {
113
		$("#conteneurMenuOnglets").html('');
114
		$('#lienOngletEtPlus').text('+');
115
	} else {
116
		var htmlMenu = '<ul class="menuModules">';
233 aurelien 117
		nbOngletsInvisibles = 0;
227 delphine 118
		for (idOnglet in tableauOnglets) {
119
			var classe = "elementMenuModules";
233 aurelien 120
			if(!$(idOnglet).is(':visible')) {
121
				nbOngletsInvisibles++;
122
				htmlMenu += '<li class="'+classe+'" rel="'+idOnglet+'" id="menu_module_'+idOnglet+'">'+tableauOnglets[idOnglet].titre+'</li>';
227 delphine 123
			}
124
		}
125
		htmlMenu += '</ul>';
233 aurelien 126
 
127
		if (nbOngletsInvisibles > 0) {
128
			$("#conteneurMenuOnglets").html(htmlMenu);
129
			$("#conteneurMenuOnglets").toggle();
130
			$('#lienOngletEtPlus').text('-');
131
		}
227 delphine 132
	}
133
}
243 aurelien 134
 
135
function fermerMenuOnglets() {
136
	$("#conteneurMenuOnglets").html('');
137
	$('#lienOngletEtPlus').text('+');
138
}
227 delphine 139
 
140
function redimensionnerOnglets() {
141
	// 570 px au max
233 aurelien 142
	// 18 px largeur croix
143
	// 18 px largeur texte
144
	// 36 px largeur totale
277 aurelien 145
	// 25 px largeur et +
227 delphine 146
	var liensVisibles = $('#zone_onglets > ul > li:visible > a');
147
	var longueurLiens = 0;
148
	liensVisibles.each(function() {
149
		longueurLiens += $(this).width();
150
	});
151
	var nbOnglets = $('#zone_onglets > ul > li:visible').length;
277 aurelien 152
	var longueurMax =  505 - (nbOnglets * 36);
227 delphine 153
	if(longueurLiens >= longueurMax || nbOnglets > 5) {
154
		$('#zone_onglets > ul > li > a').not('.lien-statique').width(longueurMax/nbOnglets);
155
	} else {
156
		$('#zone_onglets > ul > li > a').not('.lien-statique').css("width","auto");
157
	}
158
}
231 aurelien 159
 
160
function selectionnerOngletSynthese() {
161
	// Suppression des classes css qui mettent en surbrillance l'onglet actif
162
	$('#zone_onglets > ul > li').removeClass('ui-tabs-selected');
163
	$('#zone_onglets > ul > li').removeClass('ui-state-active');
227 delphine 164
 
231 aurelien 165
	// application de ces même classes css à l'onglet "acceuil" qui est un onglet "articifiel"
166
	$('#onglet_synthese').addClass('ui-tabs-selected');
167
	$('#onglet_synthese').addClass('ui-state-active');
236 aurelien 168
 
169
	// si des onglets ont été ajouté ou supprimé pendant que l'onglet synthèse n'était pas selectionné
170
	// on s'assure que l'état des blocs ouvert correspond bien à celui de onglets
171
	synchroniserOngletsOuvertsEtBlocs();
231 aurelien 172
}
173
 
236 aurelien 174
function synchroniserOngletsOuvertsEtBlocs() {
175
	for(indice in tableauOnglets) {
176
		var ongletEnCours = tableauOnglets[indice];
277 aurelien 177
		if(ongletEnCours.onglet != null) {
178
			var ongletVisible = ongletEnCours.onglet.is(':visible');
179
			$(ongletEnCours.portlet).find(".contenu").toggle(ongletVisible);
180
		}
236 aurelien 181
	}
182
}
183
 
231 aurelien 184
function deselectionnerOngletSynthese() {
185
	// Suppression des classes css qui mettent en surbrillance l'onglet actif sur l'onglet acceuil
186
	$('#onglet_synthese').removeClass('ui-tabs-selected');
187
	$('#onglet_synthese').removeClass('ui-state-active');
188
}
233 aurelien 189
 
242 aurelien 190
function getUrlVars()
191
{
192
    var vars = [], hash;
193
    var hashes = window.location.href.slice(window.location.href.indexOf('?') + 1).split('&');
194
    for(var i = 0; i < hashes.length; i++)
195
    {
196
        hash = hashes[i].split('=');
197
        vars.push(hash[0]);
198
        vars[hash[0]] = hash[1];
199
    }
200
    return vars;
201
}
202
 
203
var ongletSyntheseCharge = true;
233 aurelien 204
function selectionnerOngletParDefautOuEnregistre() {
334 aurelien 205
 
242 aurelien 206
	// Si un onglet est précisé dans l'url
207
	// Récupération de l'adresse de l'onglet sélectionné
208
	var urlVars = getUrlVars();
209
	if(urlVars['onglet'] == undefined) {
210
		// Si pas d'onglet enregistré, selection du premier par défaut
211
		// Si c'est l'onglet fiche, on le sélectionne artificiellement
212
		selectionnerOngletSynthese();
213
		$('.ui-tabs-panel').hide();
214
		$('#synthese').show();
215
	} else {
216
		ongletSyntheseCharge = false;
217
	}
334 aurelien 218
	var cookieOnglet = obtenirOngletCookiePourPage();
308 aurelien 219
 
220
	// On réouvre le dernier onglet consulté, à voir si on garde ça en prod, en tout cas c'est
221
	// pratique pendant le développement
334 aurelien 222
	if(cookieOnglet && cookieOnglet != 'ui-tabs-1') {
223
		$('#zone_onglets').tabs("select", '#'+cookieOnglet);
308 aurelien 224
	} else {
225
		selectionnerOngletSynthese();
226
		$('.ui-tabs-panel').hide();
227
		$('#synthese').show();
228
	}
233 aurelien 229
}
242 aurelien 230
 
231
function afficherOngletsPourNiveau() {
232
	/* affiche les onglets par default selon niveau*/
233
	for(indice in tableauOnglets) {
234
		var ongletEnCours = tableauOnglets[indice];
277 aurelien 235
		titre_onglet = ongletEnCours.titre;
236
		titre_onglet = $.trim(titre_onglet);
237
		if (!Array.indexOf) {
238
			  Array.prototype.indexOf = function (obj, start) {
239
			    for (var i = (start || 0); i < this.length; i++) {
240
			      if (this[i] == obj) {
241
			        return i;
242
			      }
243
			    }
244
			    return -1;
245
			  }
246
			}
247
		if (ongletsDefaut.indexOf(titre_onglet) == -1) {
242 aurelien 248
			ongletEnCours.afficherCacherModule();
249
			nbOngletsInvisibles++;
250
		}
251
	}
252
}
253
 
254
function surSelectionOnglet(event,ui) {
255
	// Récupération de l'adresse de l'onglet sélectionné
256
	var url = ui.tab.href;
257
	// le fragment suivant le # dans l'url contient l'id de l'onglet
258
	var fragmentsAncre = url.split('#');
317 aurelien 259
	fancyboxinitialise = false;
231 aurelien 260
 
242 aurelien 261
	if (fragmentsAncre.length > 0) {
262
		var ancre = fragmentsAncre[fragmentsAncre.length - 1];
263
		// si on a cliqué sur l'onglet etPlus, on ne doit rien faire car celui-ci affiche le menu
264
		// TODO: voir s'il convient d'afficher le menu EtPlus dans d'autres onglets que celui de synthese
265
		if (ancre != 'etPlus') {
266
			// Si c'est un onglet correspondant à un projet, on cache la synthèse et le plugin
267
			// chargera son contenu dans l'espace approprié
268
			if (ancre != 'ui-tabs-1') {
315 aurelien 269
				var panel = $(ui.panel);
270
			    if (panel.is(":empty")) {
271
			        panel.append("<div class='tab-chargement'>Chargement des informations...</div>")
272
			    }
273
 
242 aurelien 274
				deselectionnerOngletSynthese();
275
				$('.ui-tabs-panel').show();
276
				$('#zone_contenu_fiche').hide();
356 gduche 277
 
334 aurelien 278
				enregistrerOngletCookiePourPage(ancre);
242 aurelien 279
			} else {
280
				if(ongletSyntheseCharge) {
281
					// Si c'est l'onglet fiche, on le sélectionne artificiellement
282
					selectionnerOngletSynthese();
283
					$('.ui-tabs-panel').hide();
284
					$('#zone_contenu_fiche').show();
334 aurelien 285
 
286
					enregistrerOngletCookiePourPage(ancre);
242 aurelien 287
					return false;
288
				} else {
289
					window.location = url;
290
				}
291
			}
292
		}
293
	}
294
 
295
	return true;
296
}
297
 
334 aurelien 298
function obtenirOngletCookiePourPage() {
299
 
300
	var urlVars = getUrlVars();
301
	var id_cookie = 'onglet_eflore';
302
	if(urlVars['num_nom']) {
303
		id_cookie += '_'+urlVars['num_nom'];
304
	}
305
 
306
	return $.cookie(id_cookie) ? $.cookie(id_cookie) : null;
307
}
308
 
309
function enregistrerOngletCookiePourPage(valeur) {
310
	var urlVars = getUrlVars();
311
	var id_cookie = 'onglet_eflore';
312
	if(urlVars['num_nom'] && urlVars['num_nom'] != undefined) {
313
		id_cookie += '_'+urlVars['num_nom'];
314
	}
315
	$.cookie(id_cookie, valeur);
316
}
317
 
242 aurelien 318
function lierModulesEtOnglets() {
319
	var i = 1;
227 delphine 320
 
321
	//Parcourir la totalité des modules générés et les lier grâce à la classe Module
322
	$(".module").each(function () {
323
		i++;
324
		identifiantOnglet = "#zone_onglets>ul>li:nth-child(" + i +")";
325
		var module = new Module(i, this, $(identifiantOnglet));
242 aurelien 326
		var titre = $(this).children('h3').text();
327
		module.titre = titre;
328
 
227 delphine 329
		tableauOnglets[identifiantOnglet] = module;
330
	});
230 delphine 331
	$(".lien-onglet").each(function() {
238 delphine 332
		var adresse_onglet = $(this).attr('href');
333
		var adresse_contenu_onglet = adresse_onglet.replace('action=fiche','action=onglet');
334
		$(this).attr('href', adresse_contenu_onglet);
335
	});
242 aurelien 336
}
227 delphine 337
 
242 aurelien 338
function creerMenuOngletsFermes() {
227 delphine 339
	$("#ongletEtPlus").click(function() {
340
		afficherCacherMenuOnglets();
341
	});
243 aurelien 342
 
242 aurelien 343
	$('.elementMenuModules').live('click', function() {
227 delphine 344
		var idOnglet = $(this).attr('rel');
345
		var objet = tableauOnglets[idOnglet];
346
		objet.afficherCacherModule();
347
		$(this).toggleClass("elementMenuModulesSelectionne");
233 aurelien 348
 
349
		// suppression de l'item correspondant dans le menu
350
		$(this).remove();
351
		nbOngletsInvisibles --;
352
		// si tous les onglets sont affichés alors on cache le menu
353
		if(nbOngletsInvisibles == 0) {
354
			afficherCacherMenuOnglets();
355
		}
227 delphine 356
	});
243 aurelien 357
 
358
	$('#conteneurMenuOnglets').live("mouseleave", function() {
359
		fermerMenuOnglets();
360
	});
242 aurelien 361
}
362
 
363
function ajouterTitreSurvolOnglets() {
228 delphine 364
	/* ajout de l'info au survol de l'onglet quand la taille est diminuée*/
227 delphine 365
	$('.lien-onglet').parent().each(function() {
366
		$(this).attr("title",$(this).children("a").text());
367
	});
242 aurelien 368
}
317 aurelien 369
 
370
var fancyboxinitialise = false;
371
 
242 aurelien 372
//Initialisation
373
$(document).ready(function() {
374
	lierModulesEtOnglets();
375
 
357 gduche 376
	$('#ongletEtPlus').show();
377
 
242 aurelien 378
	/* mouvement des blocs */
379
	$( ".colonne" ).sortable({
380
		connectWith: ".colonne",
381
		handle: $(".module").children('h3') // mouvement seulement sur les titres
382
	});
383
 
384
	$( ".colonne" ).disableSelection();
385
 
386
	$('#zone_onglets').tabs({
387
		add: function(event, ui) {
388
			redimensionnerOnglets();
389
		},
390
		remove: function(event, ui) {
391
			redimensionnerOnglets();
392
		},
393
		select: function(event, ui) {
394
			return surSelectionOnglet(event,ui)
395
		}
396
	});
356 gduche 397
	// TODO : devrait être .on() à la place de live()
277 aurelien 398
	$('.lien_popup').live('click',function(event) {
399
		event.preventDefault();
400
		$.fancybox(this,{
401
			autoDimensions:false,
321 aurelien 402
			width:580
277 aurelien 403
		});
404
	});
405
 
317 aurelien 406
	$('.illustration_taxon').live('click',function(event) {
407
		if(!fancyboxinitialise) {
408
			event.preventDefault();
321 aurelien 409
			$('.illustration_taxon').fancybox({
410
				cyclic:true
411
			});
317 aurelien 412
			fancyboxinitialise = true;
413
			$(this).click();
414
		}
415
	});
416
 
242 aurelien 417
	creerMenuOngletsFermes();
418
	afficherOngletsPourNiveau();
419
	ajouterTitreSurvolOnglets();
227 delphine 420
	redimensionnerOnglets();
233 aurelien 421
	selectionnerOngletParDefautOuEnregistre();
356 gduche 422
 
423
	$('.ui-icon-close').click(function() {
424
		estOngletActif = $(this).parent().hasClass('ui-state-active');
425
		if (estOngletActif) {
426
			//L'onglet que l'on veut fermet est celui qui est ouvert, on va donc le masquer et afficher celui d'accueil
427
			$("#zone_onglets").tabs('select', 0);
428
		}
429
	});
324 gduche 430
});
431
 
432
 
433
$(document).ajaxStop(function() {
434
	if (document.implementation.hasFeature('http://www.w3.org/TR/SVG11/feature#BasicStructure', '1.1') == false) {
435
	    $('.svg').each(function() {
436
 
437
	   	 alt = $(this).attr('alt');
438
	   	 img = document.createElement('img');
439
	   	 img.src = alt;
440
	   	 $(this).replaceWith(img);
441
	    });
442
	}
227 delphine 443
});