var n = 0;

//MENUS
var LslMenuEntries = new Array();
n = 0;

LslMenuEntries[n++] = new MenuEntry("1", "index.html", "Home", 0);
LslMenuEntries[n++] = new MenuEntry("1", "people.html", "People", 0);
LslMenuEntries[n++] = new MenuEntry("1", "research.html", "Projects", 0);
LslMenuEntries[n++] = new MenuEntry("1", "robots.html", "Robots", 0);
LslMenuEntries[n++] = new MenuEntry("1", "publications.html", "Publications", 0);

//NEWS
// NOTE that relative links won't work since they may appear on different levels of the folder hierarchy 
// -> use "[[ROOT]]" in links to refer to the root folder, for example <a href=\"[[ROOT]]/mll.html\" ...
var LslNewsEntries = new Array();
n = 0;
LslNewsEntries[n++] = new NewsEntry("2007/08/16", "The first draft of our page!"); 
LslNewsEntries[n++] = new NewsEntry("2009/02/17", "New pictures :)"); 

//SLIDESHOW
var LslSlideshowEntries = new Array();
n = 0;
LslSlideshowEntries[n++] = new SlideshowEntry("slideshow/airrobot (4)_small.jpg", "2007/08/03", "AirRobot tested on the West Common.", "slideshow/airrobot (4).jpg");
LslSlideshowEntries[n++] = new SlideshowEntry("slideshow/airrobot (5)_small.jpg", "2007/08/03", "AirRobot tested on the West Common.", "slideshow/airrobot (5).jpg");
LslSlideshowEntries[n++] = new SlideshowEntry("slideshow/airrobot (6)_small.jpg", "2007/08/03", "AirRobot tested on the West Common.", "slideshow/airrobot (6).jpg");
LslSlideshowEntries[n++] = new SlideshowEntry("slideshow/airrobot (7)_small.jpg", "2007/08/03", "AirRobot tested on the West Common.", "slideshow/airrobot (7).jpg");
LslSlideshowEntries[n++] = new SlideshowEntry("slideshow/airrobot (8)_small.jpg", "2007/08/03", "AirRobot tested on the West Common.", "slideshow/airrobot (8).jpg");
LslSlideshowEntries[n++] = new SlideshowEntry("slideshow/lincsrobot_290708_nrp-14_small.jpg", "2009/02/17", "Our Pioneer ground robot and Tom-Arnold.", "slideshow/lincsrobot_290708_nrp-14.jpg");
LslSlideshowEntries[n++] = new SlideshowEntry("slideshow/lincsrobot_290708_nrp-12_small.jpg", "2009/02/17", "Tom and AirRobot.", "slideshow/lincsrobot_290708_nrp-12.jpg");
LslSlideshowEntries[n++] = new SlideshowEntry("slideshow/lincsrobot_290708_nrp-17_small.jpg", "2009/02/17", "Pioneer P3-AT and AirRobot.", "slideshow/lincsrobot_290708_nrp-17.jpg");

//------------------------------------ 
// Initialise All Scripting Functions
//------------------------------------ 
function init(strLevel) {

  // remove "switch on JavaScript" messages
  removeJsStatement();
   
  // add standard elements
  addLslHeader(strLevel);
  addLslMenubar(strLevel);
  activateMenubar();
  addLslFooter(strLevel);
  addLslNewsBar(strLevel);
  slideshowStart(strLevel);
}

//------------------- 
// Add LS Lab Header
//-------------------
function removeJsStatement() {
  var contentDiv = document.getElementById("Content");
  var jsStatementDiv = document.getElementById("JsMessage");
  if(jsStatementDiv) {
    contentDiv.removeChild(jsStatementDiv);
  }
}

//------------------- 
// Add LS Lab Header
//-------------------
function addLslHeader(strLevel) {

  // <div id="Header"></div>
  var headerDiv = document.createElement("div");
  var headerDivId = document.createAttribute("id");
  headerDivId.value = "Header";
  headerDiv.setAttributeNode(headerDivId);
  
//  <img src="images/robotslincoln.gif" width="341" height="58" alt="Robotics Research at the University of Lincoln" title="Robotics Research at the University of Lincoln" />
  var imgNode = document.createElement("img");
  var imgSrc = document.createAttribute("src");
  imgSrc.value = "" + strLevel + "/images/webpage_logo.gif";
  imgNode.setAttributeNode(imgSrc);
  var imgWidth = document.createAttribute("width");
  imgWidth.value = "540";
  imgNode.setAttributeNode(imgWidth);
  var imgHeight = document.createAttribute("height");
  imgHeight.value = "120";
  imgNode.setAttributeNode(imgHeight);
  var imgAlt = document.createAttribute("alt");
//  imgAlt.value = "the Learning Systems Lab Web Page";
  imgNode.setAttributeNode(imgAlt);
  var imgTitle = document.createAttribute("title");
  imgTitle.value = "the Lincoln Robotics Group Web Page";
  imgNode.setAttributeNode(imgTitle);
  
  // add to the DOM
  headerDiv.appendChild(imgNode);  
  document.body.appendChild(headerDiv);
}

//------------------- 
// Add LS Lab Footer
//-------------------
function addLslFooter() {

  // <div id="Footer"></div>
  var footerDiv = document.createElement("div");
  var footerDivId = document.createAttribute("id");
  footerDivId.value = "Footer";
  footerDiv.setAttributeNode(footerDivId);
  
  // text inside
  footerDiv.innerHTML = "<br /><br />";
  
  // add to the DOM
  document.body.appendChild(footerDiv);
}

//-------------------- 
// Add LS Lab Menubar
//--------------------
function addLslMenubar(strLevel) {

  // <div id="MenuBar"></div>
  var menubarDiv = document.createElement("div");
  var menubarDivId = document.createAttribute("id");
  menubarDivId.value = "MenuBar";
  menubarDiv.setAttributeNode(menubarDivId);
  
  // <ul id="Menu" class="LslMenu"></ul>
  var ulL1 = document.createElement("ul");
  var ulL1Id = document.createAttribute("id");
  ulL1Id.value = "Menu";
  ulL1.setAttributeNode(ulL1Id);
  var ulL1Class = document.createAttribute("class");
  ulL1Class.value = "LslMenu";
  ulL1.setAttributeNode(ulL1Class);
  var ulL2, ulL3;
  
  var i;
  var currentParentLevelL1, currentParentLevelL2, currentParentLevelL2;
  var lastLevel = 1;
  for(i = 0; i < LslMenuEntries.length; i++) {
  
    if(LslMenuEntries[i].level == "1") {
      
      // <li><a href="./index.html">Learning Systems Lab</a></li>
      var liL1 = document.createElement("li");
      if(LslMenuEntries[i].href != "") {
        if((LslMenuEntries[i].href).substring(0,7) == "http://")
          liL1.innerHTML = "<a href=\"" + LslMenuEntries[i].href + "\">" + LslMenuEntries[i].text + "</a>";
        else 
          liL1.innerHTML = "<a href=\"" + strLevel + "/" + LslMenuEntries[i].href + "\">" + LslMenuEntries[i].text + "</a>";
      }
      else
        liL1.innerHTML = "<a href=\"\">" + LslMenuEntries[i].text + "</a>";
      //var liL1A = document.createElement("a");
      //var liL1AHref = document.createAttribute("href");
      //liL1AHref.value = "" + strLevel + "/" + LslMenuEntries[i].href;
      
      //liL1A.setAttributeNode(liL1AHref);
      //var liL1AText = document.createTextNode(LslMenuEntries[i].text); // لل
      //liL1A.appendChild(liL1AText);
      
      // add to the DOM
      //liL1.appendChild(liL1A);
      ulL1.appendChild(liL1);
      menubarDiv.appendChild(ulL1);
      
      // remember current parent level
      currentParentLevelL1 = liL1;
    }
    else {
    
      // <li><a href="./index.html">Learning Systems Lab</a></li>
      var liL2P = document.createElement("li");
      switch(LslMenuEntries[i].shadingId) {
        case 0:
          if(LslMenuEntries[i].href != "") {
            if((LslMenuEntries[i].href).substring(0,7) == "http://")
              liL2P.innerHTML = "<a href=\"" + LslMenuEntries[i].href + "\">" + LslMenuEntries[i].text + "</a>";
            else 
              liL2P.innerHTML = "<a href=\"" + strLevel + "/" + LslMenuEntries[i].href + "\">" + LslMenuEntries[i].text + "</a>";
          }
          else
            liL2P.innerHTML = "<a href=\"\">" + LslMenuEntries[i].text + "</a>";
          break;       
        case 1:
          if(LslMenuEntries[i].href != "") 
            liL2P.innerHTML = "<a class=\"bg1\" href=\"" + strLevel + "/" + LslMenuEntries[i].href + "\">" + LslMenuEntries[i].text + "</a>";
          else
            liL2P.innerHTML = "<a class=\"bg1\" href=\"\">" + LslMenuEntries[i].text + "</a>";
          break;
      }
      //liL2P.innerHTML = "<a href=\"" + strLevel + "/" + LslMenuEntries[i].href + "\">" + LslMenuEntries[i].text + "</a>";
      //var liL2PA = document.createElement("a");
      // set background colour
/*      
      var liL2PAStyle = document.createAttribute("style");
      switch(LslMenuEntries[i].shadingId) {
        case 0:
          break;       
        case 1:
          liL2PAStyle.value = "background:#DDDDE8;";
          break;
        case 2:
          liL2PAStyle.value = "background:#BBB;";
          break;
        case 3:
          liL2PAStyle.value = "background:#AAA;";
          break;
        default:
          liL2PAStyle.value = LslMenuEntries[i].shadingId;
      }
      liL2P.setAttributeNode(liL2PAStyle);
*/      
      //var liL2PAHref = document.createAttribute("href");
      //liL2PAHref.value = "" + strLevel + "/" + LslMenuEntries[i].href;
      //liL2PA.setAttributeNode(liL2PAHref);
      //var liL2PAText = document.createTextNode(LslMenuEntries[i].text);
      
      // add to the DOM
      //liL2PA.appendChild(liL2PAText);
      //liL2P.appendChild(liL2PA);
      
      // conditional creation of "ul" nodes
      if(LslMenuEntries[i].level == "2") {
        if(lastLevel == 1) { 
          // <ul></ul>
          ulL2 = document.createElement("ul");
          currentParentLevelL1.appendChild(ulL2);
        }
        // remember current parent level
        currentParentLevelL2 = liL2P;
      }
      if(LslMenuEntries[i].level == "3") { // does not work properly at the moment
        if(lastLevel == 2) { 
          // <ul></ul>
          ulL3 = document.createElement("ul");
          currentParentLevelL2.appendChild(ulL3);
        }
        currentParentLevelL3 = liL2P;
      }

      //  
      if(LslMenuEntries[i].level == "2") {
        ulL2.appendChild(liL2P);
      }
      if(LslMenuEntries[i].level == "3") {
        ulL3.appendChild(liL2P);
      }
    }
    
    lastLevel = LslMenuEntries[i].level;   
  }

  // add to the DOM
  document.body.appendChild(menubarDiv);
}
 
//------------------ 
// Activate Menubar
//------------------
function activateMenubar() {

  var submenuoffset = 0; //Offset of submenus from main menu. Default is -2 pixels.
  
  var ultags = document.getElementById("Menu").getElementsByTagName("ul");
  for(var t = 0; t < ultags.length; t++){
    var spanref=document.createElement("span")
    spanref.className="arrowdiv";
    spanref.innerHTML="&nbsp;&nbsp;&nbsp;&nbsp;";
    
    ultags[t].parentNode.getElementsByTagName("a")[0].appendChild(spanref);
    ultags[t].parentNode.onmouseover = function() {
      this.getElementsByTagName("ul")[0].style.left = this.parentNode.offsetWidth + submenuoffset + "px";
      this.getElementsByTagName("ul")[0].style.display = "block";
    }
    ultags[t].parentNode.onmouseout = function() {
      this.getElementsByTagName("ul")[0].style.display = "none";
    }
  }
  
  if (window.addEventListener)
    window.addEventListener("load", activateMenubar, false);
  else if (window.attachEvent)
    window.attachEvent("onload", activateMenubar);
}

//------------------- 
// Add LS Lab Header
//-------------------
function addLslNewsBar(strLevel) {

  // <div id="NewsArea"></div>
  var newsAreaDiv = document.createElement("div");
  var newsAreaDivId = document.createAttribute("id");
  newsAreaDivId.value = "NewsArea";
  newsAreaDiv.setAttributeNode(newsAreaDivId);
  
  // <div id="NewsAreaSlideshow">Slideshow</div>
  var newsAreaSlideshowDiv = document.createElement("div");
  var newsAreaSlideshowDivId = document.createAttribute("id");
  newsAreaSlideshowDivId.value = "NewsAreaSlideshow";
  newsAreaSlideshowDiv.setAttributeNode(newsAreaSlideshowDivId);
  
  // <div id="NewsAreaHeader">Slideshow</div>
  var newsAreaHeaderDiv = document.createElement("div");
  var newsAreaHeaderDivClass = document.createAttribute("class");
  newsAreaHeaderDivClass.value = "NewsAreaHeader";
  newsAreaHeaderDiv.setAttributeNode(newsAreaHeaderDivClass);
  var newsAreaHeaderText = document.createTextNode("Slideshow");
  newsAreaHeaderDiv.appendChild(newsAreaHeaderText);
  
  // <div id="NewsAreaSlideshowImage"></div>
  var newsAreaSlideshowImageDiv = document.createElement("div");
  var newsAreaSlideshowImageDivId = document.createAttribute("id");
  newsAreaSlideshowImageDivId.value = "NewsAreaSlideshowImage";
  newsAreaSlideshowImageDiv.setAttributeNode(newsAreaSlideshowImageDivId);

  // <div id="NewsAreaSlideshowCaptionBox"></div>
  var newsAreaSlideshowCaptionBoxDiv = document.createElement("div");
  var newsAreaSlideshowCaptionBoxDivId = document.createAttribute("id");
  newsAreaSlideshowCaptionBoxDivId.value = "NewsAreaSlideshowCaptionBox";
  newsAreaSlideshowCaptionBoxDiv.setAttributeNode(newsAreaSlideshowCaptionBoxDivId);

  // <div id="NewsAreaSlideshowCaption"></div>
  var newsAreaSlideshowCaptionDiv = document.createElement("div");
  var newsAreaSlideshowCaptionDivId = document.createAttribute("id");
  newsAreaSlideshowCaptionDivId.value = "NewsAreaSlideshowCaption";
  newsAreaSlideshowCaptionDiv.setAttributeNode(newsAreaSlideshowCaptionDivId);

  // <div id="NewsAreaNews"></div>
  var newsAreaNewsDiv = document.createElement("div");
  var newsAreaNewsDivId = document.createAttribute("id");
  newsAreaNewsDivId.value = "NewsAreaNews";
  newsAreaNewsDiv.setAttributeNode(newsAreaNewsDivId);

  // <div id="NewsAreaNewsBox"></div>
  var newsAreaNewsBoxDiv = document.createElement("div");
  var newsAreaNewsBoxDivId = document.createAttribute("id");
  newsAreaNewsBoxDivId.value = "NewsAreaNewsBox";
  newsAreaNewsBoxDiv.setAttributeNode(newsAreaNewsBoxDivId);

  // <div id="NewsAreaHeader">News</div>
  var newsAreaNewsHeaderDiv = document.createElement("div");
  var newsAreaNewsHeaderDivClass = document.createAttribute("class");
  newsAreaNewsHeaderDivClass.value = "NewsAreaHeader";
  newsAreaNewsHeaderDiv.setAttributeNode(newsAreaNewsHeaderDivClass);
  var newsAreaNewsHeaderText = document.createTextNode("News");
  newsAreaNewsHeaderDiv.appendChild(newsAreaNewsHeaderText);

  // add to the DOM
  newsAreaSlideshowCaptionBoxDiv.appendChild(newsAreaSlideshowCaptionDiv);
  newsAreaSlideshowDiv.appendChild(newsAreaHeaderDiv);  
  newsAreaSlideshowDiv.appendChild(newsAreaSlideshowImageDiv);  
  newsAreaSlideshowDiv.appendChild(newsAreaSlideshowCaptionBoxDiv);  
  newsAreaDiv.appendChild(newsAreaSlideshowDiv);
  
  newsAreaNewsDiv.appendChild(newsAreaNewsHeaderDiv);  
  newsAreaNewsDiv.appendChild(newsAreaNewsBoxDiv);  
  newsAreaDiv.appendChild(newsAreaNewsDiv);
    
  document.body.appendChild(newsAreaDiv);
  
  // Set News
  newsAreaObj = document.getElementById("NewsAreaNewsBox");
  for(i = 0; i < LslNewsEntries.length; i++) {
    newsAreaObj.innerHTML += "<b>" + LslNewsEntries[i].date + ":</b><br />\n";
    // replace [[ROOT]] element to allow for relative links
    newsAreaObj.innerHTML += (LslNewsEntries[i].text).replace(/\[\[ROOT\]\]/,strLevel);
    if(i != LslNewsEntries.length - 1) 
      newsAreaObj.innerHTML += "<br /><hr />\n";
  }
}

var currImage = -1;
var nextImage = -1;
var slideshowDelay = 15000;
var slideshowStarted = 0;

//----------- 
// Slideshow
//-----------
var currentStrLevel;
function slideshowStart(strLevel) {
  currentStrLevel = strLevel;
  slideshow();
}

function slideshow() {

  // pre-load next image
  if(nextImage == -1) {
    currImage = Math.floor(Math.random() * LslSlideshowEntries.length);
  }
  else {
    currImage = nextImage;
  }
  nextImage = Math.floor(Math.random() * LslSlideshowEntries.length);
  var cachedImage = new Image()
  cachedImage.src = LslSlideshowEntries[currImage].image;
 

  // select next new image //لل
  //window.status = currImage; 
  
  // set new image
  var newsAreaSlideshowImageObj = document.getElementById("NewsAreaSlideshowImage");
  
  if(LslSlideshowEntries[currImage].fullImgLink != "") {
    newsAreaSlideshowImageObj.innerHTML = "<a href=\"" + currentStrLevel + "/" + LslSlideshowEntries[currImage].fullImgLink + "\"><img src=\"" + currentStrLevel + "/" + LslSlideshowEntries[currImage].image + "\" width=\"186\" height=\"140\" alt=\"\" class=\"frame\" /></a>";
  }
  else {
    newsAreaSlideshowImageObj.innerHTML = "<img src=\"" + currentStrLevel + "/" + LslSlideshowEntries[currImage].image + "\" width=\"186\" height=\"140\" alt=\"\" class=\"frame\" />";
  }
  
  // set new caption
  var newsAreaSlideshowCaptionObj = document.getElementById("NewsAreaSlideshowCaption");
  if(LslSlideshowEntries[currImage].date != "") {
    newsAreaSlideshowCaptionObj.innerHTML = "<b>" + LslSlideshowEntries[currImage].date + ":</b> " + LslSlideshowEntries[currImage].caption;
  }
  else {
    newsAreaSlideshowCaptionObj.innerHTML = LslSlideshowEntries[currImage].caption;
  }

  // set next Timeout
  setTimeout("slideshow()", slideshowDelay);
}
//----------------- 
// Data Structures
//-----------------
function MenuEntry(level, href, text, shadingId) { 
  this.level     = level;
  this.href      = href;
  this.text      = text;
  this.shadingId = shadingId;
}

function NewsEntry(date, text) { 
  this.date = date;
  this.text = text;
}

function SlideshowEntry(image, date, caption, fullImgLink) { 
  this.image       = image;
  this.date        = date;
  this.caption     = caption;
  this.fullImgLink = fullImgLink;
}