//Set up the drop down menu
function swap(){this.className="msieFix"}
function swapBack(){this.className="trigger"}
function swapfocus() {this.parentNode.parentNode.parentNode.className="msieFix"}
function swapblur() {this.parentNode.parentNode.parentNode.className="trigger"}
function drop_down_menu(){
	if (document.getElementById){	
	var LI = $('menu').getElementsByTagName("li");
	var zLI= LI.length;
		for(var k=0;k<zLI;k++){
			if(LI[k].id){
				//LI[k].firstChild.href="#";
				LI[k].className="trigger";
			}
			if(LI[k].parentNode.parentNode.className=="trigger"){LI[k].firstChild.onfocus=swapfocus;LI[k].firstChild.onblur = swapblur}
			if(LI[k].className=="trigger"){LI[k].onmouseover=swap;LI[k].onmouseout=swapBack}
		}
	}
}
window.onload=function(){drop_down_menu();}


//Basic and complete specs
function viewBasicSpecs() {
	Element.hide('completeSpecs');
	$('button_for_basic_specs').className = "selected_specs";
	$('button_for_complete_specs').className = "";
}
function viewCompleteSpecs() {
	Element.show('completeSpecs');
	$('button_for_complete_specs').className = "selected_specs";
	$('button_for_basic_specs').className = "";
}


//Speed test
function begin_speed_test() {
	Element.hide('start_button');
	Element.show('indicator');
}



// Tooltips - REQUIRES PROTOTYPE
/*
 * Copyright (c) 2006 Jonathan Weiss <jw@innerewut.de>
 *
 * Permission to use, copy, modify, and distribute this software for any
 * purpose with or without fee is hereby granted, provided that the above
 * copyright notice and this permission notice appear in all copies.
 *
 * THE SOFTWARE IS PROVIDED "AS IS" AND THE AUTHOR DISCLAIMS ALL WARRANTIES
 * WITH REGARD TO THIS SOFTWARE INCLUDING ALL IMPLIED WARRANTIES OF
 * MERCHANTABILITY AND FITNESS. IN NO EVENT SHALL THE AUTHOR BE LIABLE FOR
 * ANY SPECIAL, DIRECT, INDIRECT, OR CONSEQUENTIAL DAMAGES OR ANY DAMAGES
 * WHATSOEVER RESULTING FROM LOSS OF USE, DATA OR PROFITS, WHETHER IN AN
 * ACTION OF CONTRACT, NEGLIGENCE OR OTHER TORTIOUS ACTION, ARISING OUT OF
 * OR IN CONNECTION WITH THE USE OR PERFORMANCE OF THIS SOFTWARE.
 */

var Tooltip = Class.create();
Tooltip.prototype = {
  initialize: function(element, tool_tip) {
    var options = Object.extend({
      default_css: false,
      margin: "0px",
	    padding: "5px",
	    backgroundColor: "#d6d6fc",
	    min_distance_x: 5,
      min_distance_y: 5,
      delta_x: 0,
      delta_y: 0,
      zindex: 1000
    }, arguments[2] || {});

    this.element      = $(element);

    this.options      = options;
    
    // use the supplied tooltip element or create our own div
    if($(tool_tip)) {
      this.tool_tip = $(tool_tip);
    } else {
      this.tool_tip = $(document.createElement("div")); 
      document.body.appendChild(this.tool_tip);
      this.tool_tip.addClassName("tooltip");
      this.tool_tip.appendChild(document.createTextNode(tool_tip));
    }

    // hide the tool-tip by default
    this.tool_tip.hide();

    this.eventMouseOver = this.showTooltip.bindAsEventListener(this);
    this.eventMouseOut   = this.hideTooltip.bindAsEventListener(this);
    this.eventMouseMove  = this.moveTooltip.bindAsEventListener(this);

    this.registerEvents();
  },

  destroy: function() {
    Event.stopObserving(this.element, "mouseover", this.eventMouseOver);
    Event.stopObserving(this.element, "mouseout", this.eventMouseOut);
    Event.stopObserving(this.element, "mousemove", this.eventMouseMove);
  },

  registerEvents: function() {
    Event.observe(this.element, "mouseover", this.eventMouseOver);
    Event.observe(this.element, "mouseout", this.eventMouseOut);
    Event.observe(this.element, "mousemove", this.eventMouseMove);
  },

  moveTooltip: function(event){
	  Event.stop(event);
	  // get Mouse position
    var mouse_x = Event.pointerX(event);
	  var mouse_y = Event.pointerY(event);
	
	  // decide if wee need to switch sides for the tooltip
	  var dimensions = Element.getDimensions( this.tool_tip );
	  var element_width = dimensions.width;
	  var element_height = dimensions.height;
	
	  if ( (element_width + mouse_x) >= ( this.getWindowWidth() - this.options.min_distance_x) ){ // too big for X
		  mouse_x = mouse_x - element_width;
		  // apply min_distance to make sure that the mouse is not on the tool-tip
		  mouse_x = mouse_x - this.options.min_distance_x;
	  } else {
		  mouse_x = mouse_x + this.options.min_distance_x;
	  }
	
	  if ( (element_height + mouse_y) >= ( this.getWindowHeight() - this.options.min_distance_y) ){ // too big for Y
		  mouse_y = mouse_y - element_height;
	    // apply min_distance to make sure that the mouse is not on the tool-tip
		  mouse_y = mouse_y - this.options.min_distance_y;
	  } else {
		  mouse_y = mouse_y + this.options.min_distance_y;
	  } 
	
	  // now set the right styles
	  this.setStyles(mouse_x, mouse_y);
  },
	
		
  showTooltip: function(event) {
    Event.stop(event);
    this.moveTooltip(event);
	  new Element.show(this.tool_tip);
  },
  
  setStyles: function(x, y){
    // set the right styles to position the tool tip
	  Element.setStyle(this.tool_tip, { position:'absolute',
	 								    top:y + this.options.delta_y + "px",
	 								    left:x + this.options.delta_x + "px",
									    zindex:this.options.zindex
	 								  });
	
	  // apply default theme if wanted
	  if (this.options.default_css){
	  	  Element.setStyle(this.tool_tip, { margin:this.options.margin,
		 		  						                    padding:this.options.padding,
		                                      backgroundColor:this.options.backgroundColor,
										                      zindex:this.options.zindex
		 								    });	
	  }	
  },

  hideTooltip: function(event){
	  new Element.hide(this.tool_tip);
  },

  getWindowHeight: function(){
    var innerHeight;
	  if (navigator.appVersion.indexOf('MSIE')>0) {
		  innerHeight = document.body.clientHeight;
    } else {
		  innerHeight = window.innerHeight;
    }
    return innerHeight;	
  },
 
  getWindowWidth: function(){
    var innerWidth;
	  if (navigator.appVersion.indexOf('MSIE')>0) {
		  innerWidth = document.body.clientWidth;
    } else {
		  innerWidth = window.innerWidth;
    }
    return innerWidth;	
  }

}


//****************
// Image fader
//****************
var images = new Array('/vn_images/assets/promo1.jpg', '/vn_images/assets/promo2.jpg', '/vn_images/assets/promo3.jpg');
var imageWidth = 318;
var imageHeight = 210;
var imageTimeout = 3000;
var nextImage = 1;

function setOpacity(el, opacity) {
	opacity /= 100;
	el.style.opacity = opacity;
	el.style.MozOpacity = opacity;
	el.style.filter = "alpha(opacity=" + (opacity*100) + ")";
}

function fadeImage(el, currentOpacity) {
	currentOpacity += 5;
	if (currentOpacity > 100) {
		setOpacity(el, 100);
		var prevEl = el.previousSibling ? el.previousSibling : el.parentNode.lastChild;
		prevEl.style.visibility = 'hidden';
		el.style.zIndex = 1;
		window.setTimeout(startFading, imageTimeout);
	}
	else {
		setOpacity(el, currentOpacity);
		window.setTimeout(function() { fadeImage(el, currentOpacity); }, 50);
	}
}

function startFading() {
	var el = document.getElementById('promo_img').childNodes[nextImage];
	el.style.visibility = 'visible';
	el.style.zIndex = 2;
	setOpacity(el, 0);
	fadeImage(el,0);
	nextImage = (nextImage < images.length-1) ? nextImage + 1 : 0;
}

function pageLoad() {
	var el = document.getElementById('promo_img');
	while (el.firstChild) { el.removeChild(el.firstChild); }
	el.style.width = imageWidth + 'px';
	el.style.height = imageHeight + 'px';
	for(var i=0; i<images.length; i++) {
		var t = document.createElement('IMG');
		t.setAttribute('src',images[i]);
		t.setAttribute('width',imageWidth);
		t.setAttribute('height',imageHeight);
		t.style.position = 'absolute';
		t.style.visibility = 'hidden';
		el.appendChild(t);
	}
	el.firstChild.style.visibility = 'visible';
	window.setTimeout(startFading, imageTimeout);
}



//************************
// Product type switcher
//************************
function view_basic_servers() {
	Element.show('basic_servers');
	Element.hide('advanced_servers');
	Element.hide('enterprise_servers');
	$('basic_tab').className = "basic_tab selected_tab";
	$('advanced_tab').className = "advanced_tab";
	$('enterprise_tab').className = "enterprise_tab";
}
function view_advanced_servers() {
	Element.hide('basic_servers');
	Element.show('advanced_servers');
	Element.hide('enterprise_servers');
	$('basic_tab').className = "basic_tab";
	$('advanced_tab').className = "advanced_tab selected_tab";
	$('enterprise_tab').className = "enterprise_tab";
}
function view_enterprise_servers() {
	Element.hide('basic_servers');
	Element.hide('advanced_servers');
	Element.show('enterprise_servers');
	$('basic_tab').className = "basic_tab";
	$('advanced_tab').className = "advanced_tab";
	$('enterprise_tab').className = "enterprise_tab selected_tab";
}