function add_menu() {

var tree = document.getElementById('nav');
while (tree.firstChild) {
  tree.removeChild(tree.firstChild);
}
d = new dTree('d');
d.add(0,-1,'&nbsp; <strong><a href="/Caravage/F/">Caravage- Le Prince de la Nuit</a></strong> (<a href="javascript: d.openAll();">open all</a> | <a href="javascript: d.closeAll();">close all</a>)');

d.add(1,0,'Le prince de la Nuit','javascript:ajaxpage(\'/Caravage/F/1-prince-de-la-nuit2.html\',\'content\');');
d.add(2,0,'De Botticelli à Caravage','javascript:ajaxpage(\'/Caravage/F/2-botticelli-lumiere2.html\',\'content\');');
d.add(3,0,'La naissance du clair-obscur','javascript:ajaxpage(\'/Caravage/F/3-clair2.html\',\'content\');');
d.add(4,0,'De l\'ombre à la lumière','javascript:ajaxpage(\'/Caravage/F/4-ombre-lumiere2.html\',\'content\');');
d.add(5,0,'Un destin des plus romantiques','javascript:ajaxpage(\'/Caravage/F/5-destin-des-plus-romantique2.html\',\'content\');');
d.add(6,0,'Une oeuvre emblématique','javascript:ajaxpage(\'/Caravage/F/6-mathieu2a.html\',\'content\');');
d.add(7,0,'Un tracé d\'évolution','javascript:ajaxpage(\'/Caravage/F/7-trace-evolution2.html\',\'content\');');
d.add(9,0,'Le baroque','javascript:ajaxpage(\'/Caravage/F/9-baroque2.html\',\'content\');');
d.add(10,0,'Les caravagesques en Europe','javascript:ajaxpage(\'/Caravage/F/10-caravagisme2.html\',\'content\');');

tree.innerHTML=d;

}


function popImg(ref) {  
 var console = document.getElementById('my_root');
 
 var popImg = document.getElementById('popImg');
 if (  popImg ) {
   console.removeChild(popImg);  
 } 
 
 var img = '<a href="javascript:delpopImg()"><img class="popimg" border="0" src="' + ref + '"/></a><br><a href="javascript:delpopImg()">Close Window</a>';
 var pop  = document.createElement('DIV');
 
 pop.id   = 'popImg';
 pop.className = 'popimg'; 
 console.appendChild(pop);
 pop.innerHTML = img;

}

function delpopImg() {
  var console = document.getElementById('my_root');
  var popImg  = document.getElementById('popImg');
  var removed = console.removeChild(popImg);   
} 

function delpopImg2(id) {
  var console = document.getElementById(id);
  var popImg  = document.getElementById('popImg');
  var removed = console.removeChild(popImg);   
} 

function site(url) {
     window.open(url,'mywindow','width=1024,height=780,resizable=yes,scrollbars=yes,toolbar=yes,menubar=yes,location=yes')
}



function my_note(url,id,ref,posx,posy){

var page_request = false
if (window.XMLHttpRequest) // if Mozilla, Safari etc
page_request = new XMLHttpRequest()
else if (window.ActiveXObject){ // if IE
try {
page_request = new ActiveXObject("Msxml2.XMLHTTP")
} 
catch (e){
try{
page_request = new ActiveXObject("Microsoft.XMLHTTP")
}
catch (e){}
}
}
else
return false
page_request.onreadystatechange=function(){
loadpage(page_request,id,ref,posx,posy)
}
page_request.open('GET', url, true)
page_request.send(null)
}

function loadpage(page_request,id,ref,posx,posy){
if (page_request.readyState == 4 && (page_request.status==200 || window.location.href.indexOf("http")==-1))
 
 var pop  = document.createElement('DIV');
 pop.id   = id;
 
  var popnote = 'margin    :0 0 0 0; position:relative;width:1100px;height:1500px;  background:#e2ded4;';
  popnote +=    'border-top    :0px solid black;';
  popnote +=    'display   :block;';
  popnote +=    'padding   :50px 0 0 0;'; 
  popnote +=    'font      :14px verdana, arial, sans-serif;'; 
  popnote +=    'left      :' + posx + 'px;';
  popnote +=    'top       :' + posy + 'px;';
 
 document.getElementById(ref).appendChild(pop);
 _setStyle(document.getElementById(id), popnote);

 var code = '<a href="javascript:delpopNote(\'' + ref + '\',\''  + id + '\');">Ferm&eacute;e la note/Close Note</a><hr>' + page_request.responseText + ''; 
 pop.innerHTML= code;
 
}

function delpopNote(id1,id2) {
  var console   = document.getElementById(id1);
  var popNote   = document.getElementById(id2);
  var removed   = console.removeChild(popNote); 
} 





function popImg2(ref,id,posx,posy,position) {  

 if ( ! position ) position = 'absolute';
 var console = document.getElementById(id);
 
 var popImg = document.getElementById('popImg');
 if (  popImg ) {
   console.removeChild(popImg);  
 } 

 var img = '<a href="javascript:delpopImg2(\'' + id + '\')"><img  class="popimg" border="0" src="' + ref + '"/></a><br><a href="javascript:delpopImg2(\'' + id + '\')">Close Window</a>';
 var pop  = document.createElement('DIV');
 var popimg = 'margin:0 0 0 0; position:' + position + ';width:900px;height:800px;  background:white;';
 popimg +=    'border:1px solid black;display:block;padding:0;'; 
 popimg +=    'text-align:center;font:12px verdana, arial, sans-serif;'; 
 popimg +=    'left      :' + posx + 'px;';
 popimg +=    'top       :' + posy + 'px;';
 pop.id   = 'popImg';
 console.appendChild(pop);     
//popImg.setAttribute("style",popimg); 
 _setStyle(document.getElementById('popImg') , popimg);
 pop.innerHTML = img;   
}

function rzCC(s){
   // thanks http://www.ruzee.com/blog/2006/07/\
   // retrieving-css-styles-via-javascript/
   for(var exp=/-([a-z])/; 
       exp.test(s); 
       s=s.replace(exp,RegExp.$1.toUpperCase()));
   return s;
 }

 function _setStyle(element, declaration) {
   if (declaration.charAt(declaration.length-1)==';')
     declaration = declaration.slice(0, -1);
   var k, v;
   var splitted = declaration.split(';');
   for (var i=0, len=splitted.length; i<len; i++) {
      k = rzCC(splitted[i].split(':')[0]);
      v = splitted[i].split(':')[1];
      eval("element.style."+k+"='"+v+"'");

   }
 }