/* buttons on the main page, each button has a mouseover effect and displays
some content on click. */

/* content to be shown on click */
var buttonConfig = {
'Adresse': 'biobite_bisstro<br /><!-- Zinzendorfstraße 8<br />10555 Berlin<br />-->(04238) 94 31 83<br class="big" /><br />Öffnungszeiten:<br />geschlossen!',
'Kontakt': '<!--Zinzendorfstraße 8<br />10555 Berlin<br />--><br />(04238) 94 31 83<br /><br /><a href="mailto:kontakt@biobite.com">kontakt@biobite.com</a>',
'Stadtplan': '',
'Bisstro': '',
'Impressum': '',
'biobite': ''
};

var timeout;
var clickedButton;

/* init with div, where all buttons live */
function initButtons (container) {

   var container = $(container);
   var buttons = $A(container.getElementsByTagName('img'));
   /* each button consits of two consecutive images (for mouseover andmouseout) */
   for (var i=0; i<buttons.length/2; i++) {
      new Button(buttons[2*i], buttons[2*i+1]);
   }
}

function Button (outButton, overButton) {

   var self = this;
   var id = outButton.getAttribute('title');
   var headerImg = $('header_' + id.toLowerCase());
   var contentDiv = $('menu_content');

   var clicked = false;

   var content = document.createElement('div');
   content.setAttribute('id', 'button_content_' + id);
   content.innerHTML = buttonConfig[id];
   if (id == 'Impressum')
      var impressumWindow = new FloatingWindow("impressum_container", "impressum_close");

   var mouseover = function (event) {
      if (timeout) {
         window.clearTimeout(timeout);
         clickedButton.close();
      }
      Element.addClassName(outButton, 'hidden');
      Element.removeClassName(overButton, 'hidden');
      Element.removeClassName(headerImg, 'hidden');
   }
   outButton.onmouseover = mouseover;
   overButton.onmouseover = mouseover;

   var mouseout = function (event) {
      if (clicked) {
         timeout = window.setTimeout('clickedButton.close();', 10000);
      } else {
         self.close();
      }
   }
   overButton.onmouseout = mouseout;
   outButton.onmouseout = mouseout;

   this.close = function () {
      Element.addClassName(overButton, 'hidden');
      Element.removeClassName(outButton, 'hidden');
      this.closeHeader();
      this.closeContent();
      clicked = false;
      delete clickedButton;
   }
   this.closeHeader = function () {
      Element.addClassName(headerImg, 'hidden');
   }
   this.closeContent = function () {
      try {
         contentDiv.removeChild(content);
      } catch (e) { }
   }

   overButton.onclick = function (event) {
      if (clicked) {
         self.closeContent();
         clicked = false;
         delete clickedButton;
      } else {
         if (content.innerHTML != '') {
               contentDiv.appendChild(content);
               clicked = true;
               clickedButton = self;
         } else {
            if (id == 'Impressum') {
               impressumWindow.open();
            }
            self.close();
         }
      }
   }

}