var Main = {
  xmlHttp: new XmlHttp('content'),

  onResize: function() {
    FindDOM.getStyle('content').height = Math.max(document.body.clientHeight - 310, 245);
  },
  
  addMenu: function(items) { // items = [{name: name1, width: width1, page: page1}, {name: name2, width: width2, page: page2}...]
    this.addMenuItem = function(name, width, page) {
      document.writeln('<td class="button" style="width:' + width + 'px;" onmouseover="this.style.backgroundPosition = \'0 -30\'" onmouseout="this.style.backgroundPosition = \'0 0\'" onmousedown="this.style.backgroundPosition = \'0 -60\'" onmouseup="this.style.backgroundPosition = \'0 -30\'" onclick="Main.getPage(\'' + page + '\')">' + name + '</td>');
    }
    this.addMenuSeparator = function() {
      document.writeln('<td class="button_separator">&nbsp;</td>');
    }
    document.writeln('<center class="menu">\n<table cellspacing="0px" cellpadding="0px">\n<tr>\n<td class="button_left">&nbsp;</td>');
    this.addMenuSeparator();
    for (var i = 0; i < items.length; ++i) {
      this.addMenuItem(items[i].name, items[i].width, items[i].page);
      this.addMenuSeparator();
    }
    document.writeln('<td class="button_right">&nbsp;</td>\n</tr>\n</table>\n</center>');
  },
  
  getPage: function(pageName) {
    Main.xmlHttp.remembers[Main.xmlHttp.currentPage] = FindDOM.getObject('content').innerHTML;
    if (Main.xmlHttp.remembers[pageName] !== undefined) {
      FindDOM.getObject('content').innerHTML = Main.xmlHttp.remembers[pageName];
      Main.xmlHttp.currentPage = pageName;
    } else {
      FindDOM.getObject('content').innerHTML = 'Fetching animation pending...';
      Main.xmlHttp.getPage(pageName);
    }
  }  
}