// class Path
function Path(name, dscr, url, parent) {
  this.name = name;
  this.dscr = dscr;
  this.url = url;
  this.parent = parent;
  }

//class Picture
function Picture(title, url, urlThumb, dscr, date, urlLarge)
  {
  this.title = title;
  this.url = url;
  this.urlThumb = urlThumb;
  this.urlLarge = urlLarge;
  this.dscr = dscr;
  this.date = date;
  this.lineBreak = false;
  this.lineBreakText = "";
  if (urlLarge==undefined)
    this.urlLarge = "";
  this.diptych = 0;
  }

//class Portfolio
function Portfolio_addPicture(picture)
  {
  this.pictures[this.pictures.length] = picture;
  }

function Portfolio_addDiptych(picture1, picture2)
  {
  this.addPicture(picture1);
  this.addPicture(picture2);
  picture1.diptych = 1;
  picture2.diptych = 2;
  }

function Portfolio_setLineBreak(lineBreakText)
  {
  if(this.pictures.length==0)
    this.initialLineBreakText = lineBreakText;
  else
    {
    this.pictures[this.pictures.length-1].lineBreak = true;
    this.pictures[this.pictures.length-1].lineBreakText = lineBreakText;
    }
  }

var portfolios = null;

function Portfolio(name, title, dscr, path, maxColumns) 
  {
    if (portfolios == null)
      portfolios = new Array();

  portfolios.push(this);  
  this.name = name;
  this.pictures = new Array();
  this.title = title; //title of portfolio
  this.dscr = dscr;
  this.independentRows = false; // if true : each row is a separate table, and thus columns are not aligned.
  this.path = path;
  this.maxColumns = maxColumns; //max pictures on one row
  this.addPicture = Portfolio_addPicture;
  this.addDiptych = Portfolio_addDiptych;
  this.setLineBreak = Portfolio_setLineBreak;
  this.initialLineBreakText = "";
  this.introduction = "";
  this.basePath = "";
  }

function writeThumbnails(portfolioName)
  {
  var port = eval(portfolioName);
  var pictures = port.pictures;
  var colCnt = 0;
  var i = 0;
  var strHtml = "";
  strHtml = "<table>";
  if(port.initialLineBreakText!="")
    strHtml += "<tr><td align=\"left\" colspan=\""+port.maxColumns+"\" class=\"lineBreakText\">"+port.initialLineBreakText+"</td></tr>";
  for(i=0;i<pictures.length;i++)
    {
    if(colCnt == 0)
      {
      strHtml += "<tr>";
      if(port.independentRows==true)//each row in a different table.
        strHtml += "<td><table><tr>";
      }
    strHtml += "<td align=\"left\">";
    strHtml += "<a href='viewer.html?portfolio="+portfolioName+"&pos="+i+"' target='_top'><img src='"+port.basePath+pictures[i].urlThumb+"' title='"+pictures[i].title+"'/></a>";
    strHtml += "</td>";
    colCnt++;
    if(colCnt >= port.maxColumns || pictures[i].lineBreak)
      {
      if(port.independentRows==true)//each row in a different table.
        strHtml += "</tr></table></td>";
      strHtml += "</tr>";
      if(pictures[i].lineBreak && pictures[i].lineBreakText)
        strHtml += "<tr><td align=\"left\" colspan=\""+port.maxColumns+"\" class=\"lineBreakText\">"+pictures[i].lineBreakText+"</td></tr>";
      colCnt = 0;
      }
    }
  strHtml += "</table>";
  document.getElementById("viewerdiv").innerHTML=strHtml;
  }

function getParam( param )
{
  var begin,end;
  if(self.location.search.length>1)
  {
    begin=self.location.search.indexOf(param);
    if(begin==-1)
      return "";
    begin+=param.length+1;
    end=self.location.search.indexOf("&",begin);
    if(end==(-1)) end=self.location.search.length;
    return(self.location.search.substring(begin,end));
  }
  else return("");
}//getParam()

function clearNavigation()
{
  window.parent.Navigation.document.getElementById("subMenuContent").innerHTML="";
  window.parent.Navigation.document.getElementById("infoBlock").innerHTML="";
  window.parent.Navigation.document.getElementById("navBlock").innerHTML="";
}


function addBreadCrumbs(pt, root)
  {
  var strHtml = "";
  if(pt == null)
    return;
//  if(pt.parent != null)
    strHtml = addBreadCrumb(pt, root);
  strHtml + "<img src='"+root+"miniSquare.jpg' alt='+'/>"+pt.dscr;
  document.getElementById("breadcrumbsdiv").innerHTML=strHtml;
  } 

function addBreadCrumb(pt, root)
  {
  var strHtml = "";
  if(pt.parent != null)
    strHtml = addBreadCrumb(pt.parent, root);
  return strHtml + "<img src='"+root+"miniSquare.jpg' alt='+'/><a class='linknoline' href='"+root+pt.url+"'>"+pt.dscr+"</a>";
  }

  function displayIntroduction(strIntro) {
      document.getElementById("introductiondiv").innerHTML = strIntro;
  }
    
function addMenu()
  {
  var strHtml = "";
  strHtml +="    <div id='menudiv'>";
  strHtml += createMenuItem("Home", "/index.html");
  strHtml += createMenuItem("Graph", "/Graph.html");
  strHtml += createMenuItem("Photo", "/Photo.html");
  strHtml += createMenuItem("Text", "/Text.html");
  strHtml += createMenuItem("Books", "/viewer.html?portfolio=Publications");
  strHtml += createMenuItem("Music", "/Music.html");
  strHtml += createMenuItem("Varia", "/Varia.html");
  strHtml += createMenuItem("About", "/About.html");
  strHtml +="    </div>";
  document.getElementById("headerdiv").innerHTML=strHtml;
  }

function createMenuItem(strName, strUrl)
  {
  var strHtml = "";
  strHtml +="<a target='_top' href='"+strUrl+"'>"+strName+"</a>";
  return strHtml;
  }

  function displayInfoTitle(strTitle)
  {
  document.getElementById("titleBlock").innerHTML=strTitle;
  }

  function getPicture(portfolioName, position) 
    {
    var portfolio = eval(portfolioName);
    var pos = parseInt(position);

    if (isNaN(pos))
      return null;
    else
      return portfolio.pictures[parseInt(position)];
    }

function viewPortfolio(portfolioName, position)
  {
  var portfolio = eval(portfolioName);
  var pos = parseInt(position);

  if(isNaN(pos))
    {
    addBreadCrumbs(portfolio.path, "");
    writeThumbnails(portfolioName);
    displayInfoTitle(portfolio.title);
    displayInfoDescription("", "", portfolio.dscr);
    displayIntroduction(portfolio.introduction);
    document.getElementById("navBlock").style.display="none";
    }
  else
    {
    addBreadCrumbs(portfolio.path, "");
    document.getElementById("navBlock").style.display="";
    var picture = portfolio.pictures[pos];
    var ptImage = new Path(picture.title, "", portfolio.path); //TODO : this line not used ???
    var large = getParam("large");
    if(large == undefined)
      large = false;
    var strHtml = "";
    strHtml += "<table><tr><td>";
    if(picture.diptych == 2 && large == false)
      {
      strHtml += viewPicture(portfolio, pos-1, portfolio.pictures[pos-1], large);
  	  strHtml += "</td><td>";
      }
    strHtml += viewPicture(portfolio, pos, picture, large);
    if(picture.diptych == 1 && large == false)
      {
  	  strHtml += "</td><td>";
      strHtml += viewPicture(portfolio, pos+1, portfolio.pictures[pos+1], large);
      }
	  strHtml += "</td></tr></table>";
    document.getElementById("viewerdiv").innerHTML=strHtml;

    displayInfoTitle(portfolio.title);

    if(picture.diptych == 0 || large)
      {
      displayInfoDescription(picture.title, picture.date, picture.dscr);
      hideInfoDescription2();
      addNavv(portfolioName, pos-1, pos+1);
      }
    else if(picture.diptych == 1)
      {
      displayInfoDescription(picture.title, picture.date, picture.dscr);
      displayInfoDescription2(portfolio.pictures[pos+1].title, portfolio.pictures[pos+1].date, portfolio.pictures[pos+1].dscr);
      addNavv(portfolioName, pos-1, pos+2);
      }
    else if(picture.diptych == 2)
      {
      displayInfoDescription(portfolio.pictures[pos-1].title, portfolio.pictures[pos-1].date, portfolio.pictures[pos-1].dscr);
      displayInfoDescription2(picture.title, picture.date, picture.dscr);
      addNavv(portfolioName, pos-2, pos+1);
      }
    }
  }

function viewPicture(portfolio, pos, picture, large)
  {
  var strHtml = "";
  if(picture.urlLarge)
    if(large=="true")
      strHtml += "<a href=\"viewer.html?portfolio="+portfolioName+"&pos="+pos+"&large=false\">";
    else
      strHtml += "<a href=\"viewer.html?portfolio="+portfolioName+"&pos="+pos+"&large=true\">";
  if(large=="true")
    strHtml += "<img class='exhibit' src=\""+portfolio.basePath+picture.urlLarge+"\" alt=\"\" border=\"0\" title=\"Click to reduce\">";
  else
    if(picture.urlLarge)
      strHtml += "<img class='exhibit' src=\""+portfolio.basePath+picture.url+"\" alt=\"\" border=\"0\" title=\"Click to enlarge\">";
    else
      strHtml += "<img class='exhibit' src=\""+portfolio.basePath+picture.url+"\" alt=\"\" border=\"0\">";
  if(picture.urlLarge)
    strHtml += "</a>";
  return strHtml;
  }

function addNavv(portfolioName, prev, next)
  {
  var picType = "png";
  if(/MSIE 6/i.test(navigator.userAgent))
    picType = "gif";
  var portfolio = eval(portfolioName);
  var pictures = portfolio.pictures;
  if (prev < 0)
    leftPage = "<div style='width: 50px; height: 60px;'>&nbsp;</div>";
  else
    leftPage = "<a href='viewer.html?portfolio="+portfolioName+"&pos="+prev+"'><img src='"+portfolio.basePath+pictures[prev].urlThumb+"' width='50' height='50' border='0' title='"+pictures[prev].title+"'/><br/><img src='ArrowLeft."+picType+"' border='0'></a>";
  if (next >= portfolio.pictures.length)
    rightPage = "<div style='width: 50px; height: 60px;'>&nbsp;</div>";
  else
    rightPage = "<a href='viewer.html?portfolio="+portfolioName+"&pos="+next+"'><img src='"+portfolio.basePath+pictures[next].urlThumb+"' width='50' height='50' border='0' title='"+pictures[next].title+"'/><br/><img src='ArrowRight."+picType+"' border='0'></a>";
  thumbPage = "<a href='viewer.html?portfolio="+portfolioName+"'><img src='Index."+picType+"' border=0><br/><img src='ArrowUp."+picType+"' border=0></a>"; 
  strHtml = "<div class='navCell'>"+leftPage+"</div>";
  strHtml += "<div class='navCell'>"+thumbPage+"</div>";
  strHtml += "<div class='navCell'>"+rightPage+"</div>";
  document.getElementById("navBlock").innerHTML=strHtml;
  }//addNavv()

function displayInfoDescription(strTitle, strDate, strDscr)
  {
  document.getElementById("infoBlock").innerHTML=writeInfoDesc(strTitle, strDate, strDscr);
  }

function displayInfoDescription2(strTitle, strDate, strDscr)
  {
  document.getElementById("infoBlock2").innerHTML=writeInfoDesc(strTitle, strDate, strDscr);
  document.getElementById("infoBlock2").style.display="block";
  }

function hideInfoDescription2()
  {
  document.getElementById("infoBlock2").style.display="none";
  }

function writeInfoDesc(strTitle, strDate, strDscr)
  {
  var strHtml = "<table width='190'><tr>";
  if(strTitle)
    strHtml += "<td align='center' class='infoTitle'>"+strTitle+"</td></tr><tr>";
  if(strDate)
    strHtml += "<td align='center'>"+strDate+"</td></tr><tr>";
  if(strDscr)
    strHtml += "<td align='left'>"+strDscr+"</td>";
  strHtml += "</tr></table>";
  return strHtml;
  }