//Variables

var request, 
windowPanel, panelDiv,
navButton, aboutBtn, serviceBtn, contactBtn, activeBtn,
navIcon, homeIcon, serviceIcon, emailIcon,
orangeBox, orangeDiv,
contentPage, contentDiv,
pText, cText,
hasContent = false;
//Required Functions

Array.prototype.inArray = function (value) {
  for (var i=0; i < this.length; i++) 
    if (this[i] === value) return true;
  return false;
};
function addLoadEvent(func) {
  var oldonload = window.onload;
  if (typeof window.onload != 'function') {
    window.onload = func;
  } else {
    window.onload = function() {
      if (oldonload) {
        oldonload();
      }
      func();
    }
  }
};
function getHttpObject() {
  if (window.XMLHttpRequest) {
    return new XMLHttpRequest();
  }
  if (window.ActiveXObject) {
    return new ActiveXObject("Microsoft.XMLHTTP");
  }
  return null;
};
function getElementsByClass(searchClass,node,tag) {
	var classElements = new Array();
	if ( node == null )
		node = document;
	if ( tag == null )
		tag = '*';
	var els = node.getElementsByTagName(tag);
	var elsLen = els.length;
	var pattern = new RegExp("(^|\\s)"+searchClass+"(\\s|$)");
	for (i = 0, j = 0; i < elsLen; i++) {
		if ( pattern.test(els[i].className) ) {
			classElements[j] = els[i];
			j++;
		}
	}
	return classElements;
};

function init() {
	if (navigator.userAgent.indexOf('WebKit') != -1) {
		var ss = document.createElement('style');
		var stl = '.fade {background-image: url(fade.png);}';
		var tt = document.createTextNode(stl);
		ss.appendChild(tt);
		var hh = document.getElementsByTagName('head')[0];
		hh.appendChild(ss);
	}
	
	$('content').setOpacity(0);
	addEvent ('tababout', 'mouseover',resize_about);
	addEvent ('tababout', 'mouseout', resize_about);
	addEvent ('tababout', 'click', function() {loadContent('tababout')});

	addEvent ('tabservices', 'mouseover', resize_services);
	addEvent ('tabservices', 'mouseout', resize_services);
	addEvent ('tabservices', 'click',function() {loadContent('tabservices')});

	addEvent ('tabcontact', 'mouseover', resize_contact);
	addEvent ('tabcontact', 'mouseout', resize_contact);
	addEvent ('tabcontact', 'click',function() {loadContent('tabcontact')});

/*
		 var isMac = navigator.userAgent.indexOf("Mac") != -1
if (isMac) {
    document.write("<link rel='stylesheet' type='text/css' HREF='/css/mac.css'>")
} else {
    document.write("<link rel='stylesheet' type='text/css' HREF='/css/generic.css'>")
}
*/
	addEvent ('hometarget', 'click',function(event) {loadContent('tababout')},false);
	addEvent ('servicetarget', 'click',function(event) {loadContent('tabservices')},false);
	addEvent ('emailtarget', 'click',function(event) {loadContent('tabcontact')},false);
	loadContent('tababout');

};
function resize_about () {
	aboutBtn.toggleSize();
};
function resize_services () {
	servicesBtn.toggleSize();
};
function resize_contact () {
	contactBtn.toggleSize();
};

function addEvent (obj, event, func) {
	if (window.addEventListener) {
		$(obj).addEventListener (event,func,false);
	} else if (window.attachEvent){  
  	$(obj).attachEvent('on'+event, func);  
	}
};
function removeEvent(obj, event, func) {
	if (window.removeEventListener) {
		$(obj).removeEventListener (event, func, false);
	} else if (window.attachEvent){  
  	$(obj).detachEvent('on'+event, func);  
	}
};

var xmlhttp

//Initialization
Rico.loadModule('Corner','Effect');
Rico.onLoad( function() {
	Rico.Effect.SizeAndPositionLabel = Class.create(
	{
	  initialize: function(element, label, x, y, w, h, value) {
	    this.element = $(element);
	    this.label = $(label);
	    this.x = typeof(x)=='number' ? x : this.element.offsetLeft;
	    this.y = typeof(y)=='number' ? y : this.element.offsetTop;
	    if (!Prototype.Browser.IE || (document.compatMode && document.compatMode.indexOf("CSS")!=-1)) {
	      this.pw = RicoUtil.nan2zero(Element.getStyle(this.element,'padding-left'))+RicoUtil.nan2zero(Element.getStyle(this.element,'padding-right'));
	      this.pw += RicoUtil.nan2zero(Element.getStyle(this.element,'border-left-width'))+RicoUtil.nan2zero(Element.getStyle(this.element,'border-right-width'));
	      this.ph = RicoUtil.nan2zero(Element.getStyle(this.element,'padding-top'))+RicoUtil.nan2zero(Element.getStyle(this.element,'padding-bottom'));
	      this.ph += RicoUtil.nan2zero(Element.getStyle(this.element,'border-top-width'))+RicoUtil.nan2zero(Element.getStyle(this.element,'border-bottom-width'));
	    } else {
	      this.pw=0;
	      this.ph=0;
	    }
	    this.w = typeof(w)=='number' ? w : this.element.offsetWidth;
	    this.h = typeof(h)=='number' ? h : this.element.offsetHeight;
	    this.opacity = Element.getStyle(this.element, 'opacity') || 1.0;
	    this.target = arguments.length > 5 ? Math.min(value, 1.0) : this.opacity;
	  },
	  step: function(stepsToGo) {
	    var left = this.element.offsetLeft + ((this.x - this.element.offsetLeft)/stepsToGo);
	    var top = this.element.offsetTop + ((this.y - this.element.offsetTop)/stepsToGo);
	    var width = this.element.offsetWidth + ((this.w - this.element.offsetWidth)/stepsToGo) - this.pw;
	    var height = this.element.offsetHeight + ((this.h - this.element.offsetHeight)/stepsToGo) - this.ph;
	    var style = this.element.style;
	    var labelStyle = this.label.style;
	    var curOpacity = Element.getStyle(this.element, 'opacity');
	    var newOpacity = curOpacity + (this.target - curOpacity) / stepsToGo;
	    Rico.Effect.setOpacity(this.element, Math.min(Math.max(0,newOpacity),1.0));
	    style.left = left + "px";
	    style.top = top + "px";
	    style.width = width + "px";
	    style.height = height + "px";
	  	labelStyle.lineHeight = height + "px";
	  }
	});
	Rico.Effect.Bounce = Class.create(
	{
	  initialize: function(element, x, y) {
	    this.element = $(element);
	    this.startX = this.element.offsetLeft;
	    this.startY = this.element.offsetTop;
	    this.x = typeof(x)=='number' ? x : this.element.offsetLeft;
	    this.y = typeof(y)=='number' ? y : this.element.offsetTop;
	    this.n = 0;
	    if (!Prototype.Browser.IE || (document.compatMode && document.compatMode.indexOf("CSS")!=-1)) {
	      this.pw = RicoUtil.nan2zero(Element.getStyle(this.element,'padding-left'))+RicoUtil.nan2zero(Element.getStyle(this.element,'padding-right'));
	      this.pw += RicoUtil.nan2zero(Element.getStyle(this.element,'border-left-width'))+RicoUtil.nan2zero(Element.getStyle(this.element,'border-right-width'));
	      this.ph = RicoUtil.nan2zero(Element.getStyle(this.element,'padding-top'))+RicoUtil.nan2zero(Element.getStyle(this.element,'padding-bottom'));
	      this.ph += RicoUtil.nan2zero(Element.getStyle(this.element,'border-top-width'))+RicoUtil.nan2zero(Element.getStyle(this.element,'border-bottom-width'));
	    } else {
	      this.pw=0;
	      this.ph=0;
	    }
	  },
	  step: function(stepsToGo) {
	    
	    this.n = this.n + ((Math.PI - this.n) / stepsToGo);
    	var left = this.x * Math.sin(this.n)  + this.startX;
	    var top = this.y * Math.sin(this.n) + this.startY;

	    var style = this.element.style;
	    style.left = left + "px";
	    style.top = top + "px";
	  	//if (stepsToGo == 1 ) this.running[this.element];
	  }
	});

  navButton = Class.create(
	{
  	initialize: function(element) {
      this.animator = new Rico.Effect.Animator();
      this.element = $(element);
      this.label = $(this.element.firstChild);
      this.startY = this.element.offsetHeight;
    	this.targetY = 40;
    },
    active: false,
    play: function(effect) {
      this.animator.play(effect, {steps:5, duration:100});
    },
    toggleSize: function(){
      this.play(new Rico.Effect.SizeAndPositionLabel(this.element, this.label, null, null, null, this.nextY()));
    },
    nextY: function(){
      this.active = !this.active;
      return !this.active ? this.startY : this.targetY;
    }
  });

  navIcon = Class.create(
  {
  	initialize: function(element) {
      this.animator = new Rico.Effect.Animator();
      this.element = $(element);
      this.label = $(this.element.firstChild);
    	this.toggleY = false;
    },
    toggleY: true,
    play: function(effect) {
      this.animator.play(effect, {steps:10, duration:200});
    },
    bounce: function(){
      this.play(new Rico.Effect.Bounce(this.element, null, this.nextY()));
    },
    nextY: function(){
      this.toggleY = !this.toggleY;
      return !this.toggleY ? 20 : -20;
    }
  });
  
  windowPanel = Class.create(
  {
    initialize: function(element) {
      this.animator = new Rico.Effect.Animator();
      this.element = $(element);
      this.startX = this.element.offsetLeft;
      this.startY = this.element.offsetTop;
    	this.targetX = 50
    	this.targetY = 271;
    },
    sizeXStarted: false,
    sizeYStarted: false,
    fadedOut: false,
    play: function(effect) {
      this.animator.play(effect, {steps:10, duration:200});
    },
		move: function(){
		  this.play(new Rico.Effect.SizeAndPositionFade(this.element, this.nextX(), this.nextY(), null, null, this.nextFade()));
		},
    nextX: function(){
      this.sizeXStarted = !this.sizeXStarted;
      return !this.sizeXStarted ? this.startX : this.targetX;
    },
    nextY: function(){
      this.sizeYStarted = !this.sizeYStarted;
      return !this.sizeYStarted ? this.startY : this.targetY;
    },
    nextFade: function(){
      this.fadedOut = !this.fadedOut;
      return !this.sizeYStarted ? this.startY : this.targetY;
    }
  });
orangeBox = Class.create(
{
  initialize: function(element) {
    this.animator = new Rico.Effect.Animator();
    this.element = $(element);
  	this.targetY = this.element.offsetTop;
  },
  fadedOut: false,
  play: function(effect) {
    this.animator.play(effect, {steps:15, duration:300});
  },
  show: function(){
    $(this.element).style.display='block';
    this.play(new Rico.Effect.SizeAndPosition(this.element, null, 136, null, null));
  }
});

contentPage = Class.create(
{
  initialize: function(element) {
    this.animator = new Rico.Effect.Animator();
    this.element = $(element);
  },
  fadedOut: true,
  play: function(effect) {
    this.animator.play(effect, {steps:5, duration:100});
  },
  fade: function(){
    this.play(new Rico.Effect.SizeAndPositionFade(this.element, null, null, null, null,this.nextFade()));
  },
	nextFade: function() {
		this.fadedOut = !this.fadedOut;
		return !this.fadedOut? 100: 0;
	}
});


  Rico.Corner.round('logo', {radius:17, corners: 'top'} );  
	Rico.Corner.round('orange', {radius:15, corners:'bottom'} );
	Rico.Corner.round('panel', {radius:15} );
		//buttons
	Rico.Corner.round('tab_about', {radius:15, corners:'bottom'} );
	Rico.Corner.round('tab_services', {radius:15, corners:'bottom'} );
	Rico.Corner.round('tab_contact', {radius:15, corners:'bottom'} );
	
	orangeDiv = new orangeBox ('orange');
	panelDiv = new windowPanel('panel');
	aboutBtn = new navButton('tab_about');
	servicesBtn = new navButton ('tab_services');
	contactBtn = new navButton ('tab_contact');
	contentDiv = new contentPage('content');
	homeIcon = new navIcon('homeicon');

	init();
});


//Calling Functions.

function loadContent(page) {
	orangeDiv.show();
	page = page.replace('tab','');
	if (!window[page+'Btn'].active) window[page+'Btn'].toggleSize();
	if (activeBtn && activeBtn!=page) {
		addEvent ('tab'+activeBtn, 'mouseover',eval('resize_'+activeBtn));
		addEvent ('tab'+activeBtn, 'mouseout', eval('resize_'+activeBtn));
		window[activeBtn+'Btn'].toggleSize();
	}
	activeBtn = page;
	removeEvent('tab'+page, 'mouseover', eval('resize_'+page));
	removeEvent('tab'+page, 'mouseout', eval('resize_'+page));

	new Ajax.Request ('pages/'+page+'.html', {
		method: 'get',
	  onSuccess: function(req) {cText = req.responseText}	
	});

	new Ajax.Request ('pages/'+page+'p.html', {
		method: 'get',
		onSuccess: function(req) {pText = req.responseText}	
	});
	
	if (hasContent) {
		setTimeout(function() {panelDiv.move();},200);
		contentDiv.fade();
	}
	
	setTimeout(function() {
		if (!(cText && pText)) setTimeout(CL,100);
		else {
			$('panel').innerHTML = pText;
			$('content').innerHTML = cText;
			if (activeBtn == 'about') {
				addEvent('canPost','change', goPage);
			} else if (activeBtn == 'contact') {
				addEvent('resetlink', 'click', doReset);
				addEvent('submitlink', 'click', doSubmit);
			}
			panelDiv.move();
			setTimeout(function() {contentDiv.fade();},300);
		}
	},500);

	hasContent = true;
}



function goPage() {
	window.location = $('canPost').value;	
};

function doReset() {
	$('nameField').value = 'Your Name:';
	$('phoneField').value = 'Telephone:';
	$('emailField').value = 'E-mail Address:';
	$('messageField').value = 'Message:';
};

function doSubmit(){
	
var req = new Ajax.Request('mail.php',{
	method: 'post',
	parameters: {name: $('nameField').value, phone: $('phoneField').value, email: $('emailField').value, message: $('messageField').value}
});
	alert('Thank you.\nYour email has been sent.');
};