Subversion Repositories eFlore/Applications.eflore-consultation

Compare Revisions

Ignore whitespace Rev 202 → Rev 203

/trunk/modules/fiche/squelettes/fiche_accueil.tpl.html
1,11 → 1,12
<h1>Fiche</h1>
<?php print_r($_GET); ?>
 
<style>
#zone_contenu_fiche {
border:solid 1px red;
border:solid 1px #DDD;
border-width:0px 1px 1px 1px;
width:100%;
min-height:400px;
clear:left;
}
.module {margin: 0 1em 1em 0;}
25,16 → 26,42
#dialog label, #dialog input { display:block; }
#dialog label { margin-top: 0.5em; }
#dialog input, #dialog textarea { width: 95%; }
#zone_onglets { margin-top: 1em; }
#zone_onglets { margin-top: 1em; border-width: 1px 1px 0 1px; border-radius:0; width:99%; font-size:12px}
#zone_onglets li {float:left}
#zone_onglets li .ui-icon-close { float: left; margin: 0.4em 0.2em 0 0; cursor: pointer; }
#add_tab { cursor: pointer; }
</style>
 
<div id="zone_onglets"><ul></ul></div>
<div id="zone_onglets" class="ui-tabs ui-widget ui-widget-content ui-corner-all">
<ul class="ui-tabs-nav ui-helper-reset ui-helper-clearfix ui-widget-header ui-corner-all">
<li class="ui-state-default ui-corner-top ui-tabs-selected ui-state-active"><a href="#fiche">Accueil</a></li>
<li class="ui-state-default ui-corner-top"><a href="#fiche">Illustrations</a></li>
<li class="ui-state-default ui-corner-top"><a href="#fiche">Répartition</a></li>
<li class="ui-state-default ui-corner-top"><a href="#fiche">Wiki</a></li>
</ul>
</div>
 
<div id="zone_contenu_fiche">
<div class="colonne">
<div id="illustrations" class="module ui-widget ui-widget-content ui-helper-clearfix ui-corner-all">
<h3 class="titre ui-widget-header ui-corner-all" id="titre-0">Illustrations</h3>
<span id="contenu-0" class="contenu">contenu-0</span>
</div>
<div id="repartition" class="module ui-widget ui-widget-content ui-helper-clearfix ui-corner-all">
<h3 class="titre ui-widget-header ui-corner-all" id="titre-0">Répartition</h3>
<span id="contenu-0" class="contenu">contenu-0</span>
</div>
<div id="wiki" class="module ui-widget ui-widget-content ui-helper-clearfix ui-corner-all">
<h3 class="titre ui-widget-header ui-corner-all" id="titre-0">Wiki<span class="lienToggle"></span></h3>
<span id="contenu-0" class="contenu">contenu-0</span>
</div>
</div>
<div class="colonne"></div>
<div class="colonne"></div>
<div class="colonne"></div>
<br style="clear:left" />
</div>
45,16 → 72,16
/** Classe Module
* Définit un module de type portlet
**/
function Module(id, titre, htmlResume, statique) {
function Module(id, module, onglet, statique) {
// Variables de classe : identifiant, titre, et le HTML du résumé à afficher dans le contenu
this.id = id;
this.titre = titre;
this.htmlResume = htmlResume;
this.titre;
this.htmlResume;
this.statique = statique;
// Les objets Portlet et Onglet que l'ont garde en mémoire pour pouvoir y accéder facilement
this.portlet;
this.portlet = module;
this.onglet;
// creerPortlet
62,33 → 89,23
this.creerPortlet = function() {
var objet = this;
var module = document.createElement('div');
module.id = 'module-' + this.id;
module.className = 'module ui-widget ui-widget-content ui-helper-clearfix ui-corner-all';
var titre = document.createElement('h3');
var titre = $(module).children('.titre');
titre.className = 'titre ui-widget-header ui-corner-all';
titre.id = 'titre-' + this.id;
var contenu = document.createElement('span');
var contenu = $(module).children('.contenu');
contenu.id = 'contenu-' + this.id;
contenu.className ='contenu';
$(titre).html(this.titre);
 
$(contenu).html(this.htmlResume);
var lienToggle = document.createElement('span');
lienToggle.className = 'lienToggle ui-icon ui-icon-minusthick';
$(titre).append(lienToggle);
$(lienToggle).click(function() {
$(contenu).toggle();
//alert($(document).children(contenu))
$(objet.onglet).toggle()
});
titre.appendChild(lienToggle);
module.appendChild(titre);
module.appendChild(contenu);
this.portlet = module;
return module;
}
98,11 → 115,7
this.creerOnglet = function() {
var objet = this;
var li = document.createElement('li');
var a = document.createElement('a');
a.href = '#module-' + this.id;
$(a).html(this.titre);
li.appendChild(a);
var a = $(onglet).find("a");
// Gestion du clic sur le lien
// Comme les liens sont mis en place par jqueryui tabs, il faut ajouter une surcouche pour
122,11 → 135,10
$(objet.portlet).find(".contenu").toggle(false);
});
li.appendChild(span);
$(onglet).append(span);
}
this.onglet = li;
return li;
this.onglet = onglet;
}
// Initialisation de l'objet
144,26 → 156,17
}
}
//Initialisation
$(document).ready(function() {
i = 1;
i = 0;
var module = new Module(i, "Resume-" + i, "contenu-" + i, true);
modules[i] = module;
$("#zone_contenu_fiche>div:first-child").append(module.getPortlet());
$("#zone_onglets>ul").append(module.getOnglet());
//Parcourir la totalité des modules générés et les lier grâce à la classe Module
$(".module").each(function () {
i++;
identifiantOnglet = "#zone_onglets>ul>li:nth-child(" + i +")";
var module = new Module(i, this, $(identifiantOnglet));
var module2 = new Module(i, "Resume-" + i, "contenu-" + i);
modules[i] = module;
$("#zone_contenu_fiche>div:first-child").append(module2.getPortlet());
$("#zone_onglets>ul").append(module2.getOnglet());
i++;
var module3 = new Module(i, "Resume-" + i, "contenu-" + i);
modules[i] = module;
$("#zone_contenu_fiche>div:first-child").append(module3.getPortlet());
$("#zone_onglets>ul").append(module3.getOnglet());
i++;
});
$( ".colonne" ).sortable({
connectWith: ".colonne"
171,6 → 174,5
 
$( ".colonne" ).disableSelection();
$('#zone_onglets').tabs();
});
</script>