Subversion Repositories eFlore/Applications.eflore-consultation

Rev

Rev 201 | Rev 208 | Go to most recent revision | Show entire file | Ignore whitespace | Details | Blame | Last modification | View Log | RSS feed

Rev 201 Rev 203
Line 1... Line 1...
1 
<h1>Fiche</h1>
 1 
<h1>Fiche</h1>
2 
<?php print_r($_GET); ?>
 - 
 
3 
 
 - 
 
4 
<style>
 2 
<style>
5 
	#zone_contenu_fiche {
 3 
	#zone_contenu_fiche {
6 
		border:solid 1px red;
 4 
		border:solid 1px #DDD;
- 
 
 5 
		border-width:0px 1px 1px 1px;
7 
		width:100%;
 6 
		width:100%;
8 
		min-height:400px;
 7 
		min-height:400px;
- 
 
 8 
		clear:left;
- 
 
 9
9 
	}
 10 
	}
Line 10... Line 11...
10
11
11 
	.module {margin: 0 1em 1em 0;}
 12 
	.module {margin: 0 1em 1em 0;}
12 
	.module .titre{ margin: 0.3em; padding-bottom: 4px; padding-left: 0.2em; cursor:pointer;}
 13 
	.module .titre{ margin: 0.3em; padding-bottom: 4px; padding-left: 0.2em; cursor:pointer;}
Line 23... Line 24...
23
24
24
25
25 
	#dialog label, #dialog input { display:block; }
 26 
	#dialog label, #dialog input { display:block; }
- 
 
 27 
	#dialog label { margin-top: 0.5em; }
26 
	#dialog label { margin-top: 0.5em; }
 28 
	#dialog input, #dialog textarea { width: 95%; }
27 
	#dialog input, #dialog textarea { width: 95%; }
 29 
	#zone_onglets { margin-top: 1em; border-width: 1px 1px 0 1px; border-radius:0; width:99%; font-size:12px}
28 
	#zone_onglets { margin-top: 1em; }
 30 
	#zone_onglets li {float:left}
29 
	#zone_onglets li .ui-icon-close { float: left; margin: 0.4em 0.2em 0 0; cursor: pointer; }
 31 
	#zone_onglets li .ui-icon-close { float: left; margin: 0.4em 0.2em 0 0; cursor: pointer; }
Line 30... Line 32...
30 
	#add_tab { cursor: pointer; }
 32 
	#add_tab { cursor: pointer; }
- 
 
 33 
</style>
- 
 
 34 
 
- 
 
 35 
<div id="zone_onglets" class="ui-tabs ui-widget ui-widget-content ui-corner-all">
- 
 
 36 
	<ul class="ui-tabs-nav ui-helper-reset ui-helper-clearfix ui-widget-header ui-corner-all">
- 
 
 37 
		<li class="ui-state-default ui-corner-top ui-tabs-selected ui-state-active"><a href="#fiche">Accueil</a></li>
- 
 
 38 
		<li class="ui-state-default ui-corner-top"><a href="#fiche">Illustrations</a></li>
- 
 
 39 
		<li class="ui-state-default ui-corner-top"><a href="#fiche">Répartition</a></li>
- 
 
 40 
		<li class="ui-state-default ui-corner-top"><a href="#fiche">Wiki</a></li>
31 
</style>
 41 
	</ul>
32 
 
 42 
</div>
- 
 
 43 
 
- 
 
 44 
<div id="zone_contenu_fiche">
- 
 
 45 
	<div class="colonne">
- 
 
 46 
		<div id="illustrations" class="module ui-widget ui-widget-content ui-helper-clearfix ui-corner-all">
- 
 
 47 
			<h3 class="titre ui-widget-header ui-corner-all" id="titre-0">Illustrations</h3>
- 
 
 48 
			<span id="contenu-0" class="contenu">contenu-0</span>
- 
 
 49 
		</div>
- 
 
 50
- 
 
 51 
		<div id="repartition" class="module ui-widget ui-widget-content ui-helper-clearfix ui-corner-all">
- 
 
 52 
			<h3 class="titre ui-widget-header ui-corner-all" id="titre-0">Répartition</h3>
- 
 
 53 
			<span id="contenu-0" class="contenu">contenu-0</span>
- 
 
 54 
		</div>
- 
 
 55
- 
 
 56 
		<div id="wiki" class="module ui-widget ui-widget-content ui-helper-clearfix ui-corner-all">
- 
 
 57 
			<h3 class="titre ui-widget-header ui-corner-all" id="titre-0">Wiki<span class="lienToggle"></span></h3>
- 
 
 58 
			<span id="contenu-0" class="contenu">contenu-0</span>
- 
 
 59 
		</div>
33 
<div id="zone_onglets"><ul></ul></div>
 60
34 
<div id="zone_contenu_fiche">
 61
Line 35... Line 62...
35 
	<div class="colonne"></div>
 62 
	</div>
36 
	<div class="colonne"></div>
 63 
	<div class="colonne"></div>
Line 43... Line 70...
43 
	var modules = Array();
 70 
	var modules = Array();
Line 44... Line 71...
44
71
45 
	/** Classe Module
 72 
	/** Classe Module
46 
	* Définit un module de type portlet
 73 
	* Définit un module de type portlet
47 
	**/
 74 
	**/
Line 48... Line 75...
48 
	function Module(id, titre, htmlResume, statique) {
 75 
	function Module(id, module, onglet, statique) {
49
76
50 
		// Variables de classe : identifiant, titre, et le HTML du résumé à afficher dans le contenu
 77 
		// Variables de classe : identifiant, titre, et le HTML du résumé à afficher dans le contenu
51 
		this.id = id;
 78 
		this.id = id;
52 
		this.titre = titre;
 79 
		this.titre;
Line 53... Line 80...
53 
		this.htmlResume = htmlResume;
 80 
		this.htmlResume;
54 
		this.statique = statique;
 81 
		this.statique = statique;
55
82
Line 56... Line 83...
56 
		// Les objets Portlet et Onglet que l'ont garde en mémoire pour pouvoir y accéder facilement
83 
		// Les objets Portlet et Onglet que l'ont garde en mémoire pour pouvoir y accéder facilement
57 
		this.portlet;
 84 
		this.portlet = module;
58 
		this.onglet;
 85 
		this.onglet;
59
86
Line 60... Line -...
60 
		// creerPortlet
- 
 
61 
		// Créer l'objet Portlet HTML à afficher et le stocker dans les variables de classe
 - 
 
62 
		this.creerPortlet = function() {
 - 
 
63 
			var objet = this;
 - 
 
64
87 
		// creerPortlet
65 
			var module = document.createElement('div');
 88 
		// Créer l'objet Portlet HTML à afficher et le stocker dans les variables de classe
66 
			module.id = 'module-' + this.id;
 89 
		this.creerPortlet = function() {
Line 67... Line 90...
67 
			module.className = 'module ui-widget ui-widget-content ui-helper-clearfix ui-corner-all';
 90 
			var objet = this;
68
91
69 
			var titre = document.createElement('h3');
 92 
			var titre = $(module).children('.titre');
70 
			titre.className = 'titre ui-widget-header ui-corner-all';
 - 
 
71 
			titre.id = 'titre-' + this.id;
 - 
 
72
- 
 
Line 73... Line 93...
73 
			var contenu = document.createElement('span');
 93 
			titre.className = 'titre ui-widget-header ui-corner-all';
74 
			contenu.id = 'contenu-' + this.id;
 94 
			titre.id = 'titre-' + this.id;
- 
 
 95
75 
			contenu.className ='contenu';
 96 
			var contenu = $(module).children('.contenu');
76 
			$(titre).html(this.titre);
 97 
			contenu.id = 'contenu-' + this.id;
77 
 
 - 
 
- 
 
 98 
			contenu.className ='contenu';
78 
			$(contenu).html(this.htmlResume);
 99
79
100 
			var lienToggle = document.createElement('span');
Line 80... Line -...
80 
			var lienToggle = document.createElement('span');
 - 
 
81 
			lienToggle.className = 'lienToggle ui-icon ui-icon-minusthick';
 - 
 
82 
			$(lienToggle).click(function() {
 - 
 
83 
				$(contenu).toggle();
 - 
 
84 
				//alert($(document).children(contenu))
 101 
			lienToggle.className = 'lienToggle ui-icon ui-icon-minusthick';
85 
				$(objet.onglet).toggle()
 102 
			$(titre).append(lienToggle);
86 
			});
 103 
			$(lienToggle).click(function() {
Line 87... Line 104...
87
104 
				$(contenu).toggle();
88 
			titre.appendChild(lienToggle);
 105
89 
			module.appendChild(titre);
 106 
				$(objet.onglet).toggle()
90 
			module.appendChild(contenu);
107 
			});
Line 91... Line -...
91
- 
 
92 
			this.portlet = module;
 108
93 
			return module;
- 
 
94 
		}
- 
 
95
- 
 
Line 96... Line 109...
96 
		// creerOnglet
 109 
			this.portlet = module;
97 
		// Créer l'objet Onglet HTML
 110 
			return module;
98 
		this.creerOnglet = function() {
 111 
		}
99 
			var objet = this;
 112
Line 120... Line 133...
120 
				$(span).live( "click", function() {
 133 
				$(span).live( "click", function() {
121 
					$(span).parent().toggle();
 134 
					$(span).parent().toggle();
122 
					$(objet.portlet).find(".contenu").toggle(false);
 135 
					$(objet.portlet).find(".contenu").toggle(false);
123 
				});
 136 
				});
Line 124... Line 137...
124
137
125 
				li.appendChild(span);
 138 
				$(onglet).append(span);
Line 126... Line 139...
126 
			}
 139 
			}
127
- 
 
128 
			this.onglet = li;
 140
Line 129... Line 141...
129 
			return li;
 141 
			this.onglet = onglet;
130 
		}
 142 
		}
131
143
Line 142... Line 154...
142
154
143 
			return this.portlet;
 155 
			return this.portlet;
144 
		}
 156 
		}
Line -... Line 157...
- 
 
 157 
	}
145 
	}
 158
- 
 
 159 
	//Initialisation
Line 146... Line -...
146
- 
 
147 
	$(document).ready(function() {
 160 
	$(document).ready(function() {
148
161 
		i = 1;
149 
			i = 0;
 - 
 
150 
			var module = new Module(i, "Resume-" + i, "contenu-" + i, true);
 - 
 
151 
			modules[i] = module;
 - 
 
152 
			$("#zone_contenu_fiche>div:first-child").append(module.getPortlet());
 - 
 
153 
			$("#zone_onglets>ul").append(module.getOnglet());
 - 
 
154 
			i++;
 - 
 
155
- 
 
156 
			var module2 = new Module(i, "Resume-" + i, "contenu-" + i);
 - 
 
157 
			modules[i] = module;
 162
- 
 
 163 
		//Parcourir la totalité des modules générés et les lier grâce à la classe Module
- 
 
 164 
		$(".module").each(function () {
Line 158... Line -...
158 
			$("#zone_contenu_fiche>div:first-child").append(module2.getPortlet());
 - 
 
159 
			$("#zone_onglets>ul").append(module2.getOnglet());
 - 
 
160 
			i++;
 - 
 
161
- 
 
162 
			var module3 = new Module(i, "Resume-" + i, "contenu-" + i);
 165 
			i++;
Line 163... Line 166...
163 
			modules[i] = module;
 166 
			identifiantOnglet = "#zone_onglets>ul>li:nth-child(" + i +")";
164 
			$("#zone_contenu_fiche>div:first-child").append(module3.getPortlet());
 167 
			var module = new Module(i, this, $(identifiantOnglet));
165 
			$("#zone_onglets>ul").append(module3.getOnglet());
 168
Line 166... Line 169...
166 
			i++;
 169 
		});
167
170
168 
		$( ".colonne" ).sortable({
 - 
 
169 
			connectWith: ".colonne"
 171 
		$( ".colonne" ).sortable({
170 
		});
 172 
			connectWith: ".colonne"
171 
 
 173 
		});