/*
**********************************************************************
* systeme       : Outils site citemaison.fr
* fichier       : paroi-opaque-choix-mat.js
* Auteur        : Arnaud Sellé
* date création : 22/10/2007
* description   : fonctions communes pour gérer l'IHM de la calculette
*                 parois opaques
*
**********************************************************************
*/
//------------------------------------------------------------------------------------
// partie 1 : gestion du menu déroulant à 2 niveaux pour affichage et choix des matériaux
//            par utilisation de 2 listes <ul><li> imbriquées
//            inspiré de Sarka SPIP
//------------------------------------------------------------------------------------
function hover(obj) {
	if(document.all) {
		UL = obj.getElementsByTagName('ul');
		if(UL.length > 0) {UL[0].style.display = 'block';}
	}
}

function hout(obj) {
	if(document.all) {
		UL = obj.getElementsByTagName('ul');
		if(UL.length > 0) {UL[0].style.display = 'none';}
	}
}
function setHover(){
	if (document.getElementById('nav1')) {
		LI = document.getElementById('nav1').getElementsByTagName('li');
		nLI = LI.length;
		for(i=0; i < nLI; i++){
			LI[i].onmouseover = function(){hover(this);}
			LI[i].onmouseout = function(){hout(this);}
		}
	}
}

//------------------------------------------------------------------------------------
// partie 2 : gestion de l'affichage dans une couche du menu déroulant de choix des matériaux
//            par utilisation de iframe
//            inspiré du calendrier de https://engineering.purdue.edu/ECN/Support/KnowledgeBase/Docs/20040414131404
//------------------------------------------------------------------------------------
// -- positionInfo --
function positionInfo(object) {

  var p_elm = object;

  this.getElementWidth = getElementWidth;
  function getElementWidth(){
    var elm;
    if(typeof(p_elm) == "object"){
      elm = p_elm;
    } else {
      elm = document.getElementById(p_elm);
    }
    return parseInt(elm.offsetWidth);
  }

  this.getElementHeight = getElementHeight;
  function getElementHeight(){
    var elm;
    if(typeof(p_elm) == "object"){
      elm = p_elm;
    } else {
      elm = document.getElementById(p_elm);
    }
    return parseInt(elm.offsetHeight);
  }
}

//===============================================================
// ChoixMateriau
// classe de gestion du menu déroulant de choix des matériaux
// fonctons encapsulées 
//   setElementProperty, setProperty, clearMat
//   setMateriau, materiauDrawTable, show, hide
//===============================================================
// -- ChoixMateriau --
function ChoixMateriau() {

  var ChoixMateriauId = 'ChoixMateriau';
  var champMat = null;

  function setElementProperty(p_property, p_value, p_elmId){
    var p_elm = p_elmId;
    var elm = null;

    if(typeof(p_elm) == "object"){
      elm = p_elm;
    } else {
      elm = document.getElementById(p_elm);
    }
    if((elm != null) && (elm.style != null)){
      elm = elm.style;
      elm[ p_property ] = p_value;
    }
  }

  function setProperty(p_property, p_value) {
    setElementProperty(p_property, p_value, ChoixMateriauId);
  }

  // effacer les champs par clic sur le lien Annuler
  this.clearMat = clearMat;
  function clearMat(numLigne) {
    document.forms["rt2005"].elements['poLibelle' + numLigne].value = '';
    document.forms["rt2005"].elements['poEpaisseur' + numLigne].value = '';
    document.forms["rt2005"].elements['poLambda' + numLigne].value = '';
    hide();
  }

  // renseigner les valeurs thermiques d'un matériau par clic sur son nom
  this.setMateriau = setMateriau;
  function setMateriau(numLigne,idMat) {
    // mettre à jour les champs descriptifs
    document.forms["rt2005"].elements['poLibelle' + numLigne].value = libelle[idMat];
    //document.forms["rt2005"].elements['poEpaisseur' + numLigne].value = epaisseur[idMat];
    // document.forms["rt2005"].elements['poEpaisseur' + numLigne].value = '';
    document.forms["rt2005"].elements['poLambda' + numLigne].value = lambda[idMat];
    hide();
    
    ajax_send();
    return;
  }


  //------------------------
  function materiauDrawTable(numLigne) {
  
    var table = "<table cellspacing='0' cellpadding='0' border='0'>";
    table = table + "<tr class='header'><td class='title'>Choisir votre matériau</td></tr>";
    table = table + "<tr><th><a href='javascript:clearChoixMateriau(" + numLigne + ");'>Annuler</a> | <a href='javascript:hideChoixMateriau();'>Fermer</a></th></tr>";
    table = table + "<tr><td>";
    
    table = table + "<div id=\"nav1\" class=\"nav1\"><ul class=\"menulist\">";
  
    // menu déroulant inspiré de Sarka SPIP (2 <li> imbriqués)
    var categCour="";
    for (i=0; i<categ.length; i++) { 
      if (categ[i] != categCour) {
        if (i > 0) table = table + "</ul></li>";
        table = table + "<li class=\"smenu\"><a href=\"#\" onclick=\"return false;\">" + categ[i] + "</a><ul>";
        categCour=categ[i];
      }
      table = table + "<a href=\"javascript:setChoixMateriau(" + numLigne + "," + i + ")\">" + libelle[i] + "</a>";
      
    }
    table = table + "</ul></li></ul></div>";
    table = table + "</td></tr>";
    table = table + "</table>";
  
    return table;
  }
  
  
  // - show -
  function show(numLigne) {

    if(document.getElementById){
      materiau = document.getElementById(ChoixMateriauId);
      materiau.innerHTML = materiauDrawTable(numLigne);
  
      setProperty('display', 'block');
      setHover();
      var materiauPos = new positionInfo(ChoixMateriauId);
  
      if (document.all) { // internet explorer
        setElementProperty('display', 'block', 'ChoixMateriauIFrame');
        setElementProperty('width', materiauPos.getElementWidth() + "px", 'ChoixMateriauIFrame');
        setElementProperty('height', materiauPos.getElementHeight() + "px", 'ChoixMateriauIFrame');
      }
    }
   }
  
  function hide() {
   setProperty('display', 'none');
   setElementProperty('display', 'none', 'ChoixMateriauIFrame');
   }

// code de l'objet ChoixMateriau
//------------------------
this.show = show;
this.hide = hide;

}

//===============================================================
// AffChoixMateriau
// fonction d'affichage du menu déroulant de choix des matériaux
// paramètres
//   numligne  : numéro de ligne (indice) pour les variables du formulaire
//===============================================================
function AffChoixMateriau(numLigne) {
  var scrollY = getScrollY() + 100;
  
  ChoixMateriau.show(numLigne);
  document.getElementById("ChoixMateriau").style.top=scrollY + "px";
}

//===============================================================
// getScrollY
//  retourne le décalage entre le haut de page réel le haut affiché
// paramètres
//   aucun
// http://forum.alsacreations.com/topic-5-19703-1-Dimensions-de-la-page-scroll-inclus.html
//===============================================================
function getScrollY() {
  
  var scrollY = 0;	// scrollY
  if (document.doctype == null || document.documentElement.clientHeight == 0) {
  	if (window.innerWidth           // IE -OU- pas de doctype
  	|| (document.body.offsetHeight == document.documentElement.offsetHeight 
  && document.body.offsetWidth == document.documentElement.offsetWidth)) 	{
  		scrollY = document.body.scrollTop;
  	}
  	else {  // IE avec doctype XHTML 1.0
  		scrollY = document.documentElement.scrollTop; 
  	}
  }
  else { // Firefox
  	if (document.doctype.publicId.search(/xhtml/i) != -1) { // Firefox doctype XHTML 1.0
  		scrollY = document.documentElement.scrollTop; 
  	}
  	else { // Firefox doctype HTML 4.0
  		scrollY = document.body.scrollTop;
  	}
  }
  return(scrollY);
}
//===============================================================
// clearChoixMateriau
// fonction de fermeture du menu déroulant de choix des matériaux
// et d'effacement des données de la ligne du formulaire
//===============================================================
function clearChoixMateriau(numLigne) {
  ChoixMateriau.clearMat(numLigne);
}

//===============================================================
// hideChoixMateriau
// fonction de fermeture (sans choix) du menu déroulant de choix des matériaux
//===============================================================
function hideChoixMateriau() {
    ChoixMateriau.hide();
}

//===============================================================
// setChoixMateriau
// fonction de remplissage du formulaire sur clic du matériau choisi
// et fermeture du menu
// paramètres
//   numligne  : numéro de ligne (indice) pour les variables du formulaire
//   idMat     : indice du matériau dans les tableaux de variables javascript
//               générés par materiaux.js.php
//===============================================================
function setChoixMateriau(numLigne,idMat) {

  ChoixMateriau.setMateriau(numLigne,idMat);
}

// créer un objet de classe ChoixMateriau
var ChoixMateriau = new ChoixMateriau();

// créer l'iframe qui servira à ancrer la div 'ChoixMateriau' permettant d'afficher le menu
document.write("<iframe id='ChoixMateriauIFrame' height='100' src='javascript:false;' frameBorder='0' scrolling='no'></iframe>");
document.write("<div id='ChoixMateriau'></div>");


