var Mouse = {};
var Event = {};
var Active = false;
var Objects = [];
var Plans = {Lite:{id:1,email:1,disk:200,cost:12}, Essentials:{id:2,email:10,disk:400,cost:28}, Pro:{id:3,email:20,disk:800,cost:64}};
var Options = {Email:0, Disk:0};
var btnWidth = 58;
var diskMultiplier = 100;
var diskCostMultiplier = 1;
var imageMultiplier = 8;
var Plan;
var w=0;

function Obj(id){return document.getElementById(id);}

function MouseDown(e){
	var o;
	Active = true;
	if(!e){e=event;o=e.srcElement;}else{o=e.target;}
	Mouse = GetOffsets(o,e);
	if(o.id=="plan-slider"){Mouse.X-=w;}
	if(o.id=="email-slider"){Mouse.X-=Options.Email;}
	if(o.id=="disk-slider"){Mouse.X-=Options.Disk;}
	o.ondragstart = function(){return false;};
	document.body.focus();
	document.onselectstart = function(){return false;};

}

function MouseUp(e){
	var o;
	Active=false;
	if(!e){e=event;o=e.srcElement;}else{o=e.target;}
	if(o.id=="plan-slider"){
		switch (Plan.id){
			case 1:
				w=0;
				break;
			case 2:
				w=111;
				break;
			case 3:
				w=221;
				break;
		}
		o.style.width=(btnWidth+w)+"px";
		o.ondragstart = null;
	}
	document.body.focus();
	document.onselectstart = null;
}

function MouseMove(o,e){
	if(Active){
		e=e||window.event;
		Event = GetOffsets(o,e);
		var counter=Event.X-Mouse.X;
		counter=(counter<0)?0:counter;
		switch (o.id){
			case "plan-slider":
				counter=(counter>221)?221:counter;
				Obj("plan-slider").style.width = (btnWidth+counter)+"px";
window.defaultStatus = counter;
				if(counter <= 45){
					ChangePlan("Lite");
				}else if(counter <= 186){
					ChangePlan("Essentials");
				}else{
					ChangePlan("Pro");
				}
				break;
			case "email-slider":
				counter=(counter>99)?99:counter;
				ChangeEmail(counter);
				break;
			case "disk-slider":
				counter=(counter>99)?99:counter;
				ChangeDisk(counter);
				break;
		}
	}
}

function GetOffsets(o,e){
	if(e.pageX){
		return {X:e.pageX, Y:e.pageY};
	}else{
		return {X:e.clientX+document.body.scrollLeft-document.body.clientLeft, Y:e.clientY+document.body.scrollTop-document.body.clientTop};
	}
}

function ChangePlan(plan){
	Plan=Plans[plan];
	Obj("plan-name").innerHTML = plan;
	Obj("pDetails").href = "javascript:Open('"+plan.toLowerCase()+"-details');";
	Obj("frmPlan").pkg.value = Plan.id;
	ChangeEmail(0);
	ChangeDisk(0);
	CalculateTotal();
}

function ChangeEmail(n){
	Options.Email=n;
	Obj("email-slider").style.width = (btnWidth+n)+"px";
	Obj("num-email").innerHTML = Obj("pEmail").innerHTML = Obj("frmPlan").email.value = (Plan.email+n);
	CalculateTotal();
}

function ChangeDisk(n){
	Options.Disk=n;
	Obj("disk-slider").style.width = (btnWidth+n)+"px";
	Obj("num-disk").innerHTML = Obj("frmPlan").disk.value = (Plan.disk+(diskMultiplier * n));
	Obj("pDisk").innerHTML = (Plan.disk+(diskMultiplier * n)) * imageMultiplier;
	CalculateTotal();
}

function CalculateTotal(){Obj("total").innerHTML = (Plan.cost+Options.Email+(Options.Disk*diskCostMultiplier));}

function Init(){
	document.onmousedown = MouseDown;
	document.onmouseup = MouseUp;
	ChangePlan('Lite');
}
function Order(href){
	if(Obj("frmPlan").email.value > Plan.email || Obj("frmPlan").disk.value > Plan.disk){
		alert("Additional email boxes and disk space can be purchased through the Account Manager by logging in to your control panel after you complete your initial purchase.");
	}
	document.location=href+"&pkg="+Obj('frmPlan').pkg.value;
}
function Open(id){Obj(id).style.display = Obj('panel-bg').style.display = 'block';Obj('panel-bg').style.opacity = .84; }
function Close(id){Obj(id).style.display = Obj('panel-bg').style.display = 'none';}

if(window.addEventListener){window.addEventListener("load",Init,false);}
if(window.attachEvent){window.attachEvent("onload",Init);}