function opentab(tab, url){
	path = unescape(document.location); 
	path = path.substring(0,path.lastIndexOf("/")+1);
    var file = '';
    switch (tab) {
        case 'homemenu':
            file = url + 'home.php';
            break;
        case 'servicesmenu':
            file = url + 'services.php';
            break;
        case 'portfoliomenu':
            file = url + 'portfolio.php';
            break;
        case 'contactmenu':
            file = url + 'contact.php';
            break;
        default:
            file = url + 'home.php';
    }
    var ajax = false;
    try {
        ajax = new ActiveXObject("Msxml1.XMLHTTP");
    } 
    catch (e) {
        try {
            ajax = new ActiveXObject("Microsoft.XMLHTTP");
        } 
        catch (E) {
            ajax = false;
        }
    }
    if (!ajax && typeof XMLHttpRequest != 'undefined') {
        ajax = new XMLHttpRequest();
    }
    
    if (ajax) {
        ajax.open("GET", file, true);
        ajax.onreadystatechange = function(){
            if (ajax.readyState == 4) {
                if (ajax.status == 200) {
                    document.getElementById('content').innerHTML = ajax.responseText;
                    // document.getElementById('flash').innerHTML = "";
                }
                else {
                    window.location.reload();
                }
            }
        }
    }
    ajax.send(null);
	return true;
}

function positiontab(tab){
    document.getElementById('tab').style.left = document.getElementById(tab).style.left;
}

function getRoot(){
	var url = "" + location.href;
	var tmp = url.split('/');
	var root = tmp[2];
	return root;
}

function movetab(atab){
    document.getElementById("homemenu").disabled = true;
    document.getElementById("servicesmenu").disabled = true;
    document.getElementById("portfoliomenu").disabled = true;
    document.getElementById("contactmenu").disabled = true;
    var i, f;
    i = document.getElementById('tab').offsetLeft;
    f = document.getElementById(atab).offsetLeft;
    if (i != f) {
        t = setTimeout("realmoviment(\'" + atab + "\');", 1);
    }
    else {
        top.location.href = "http://" + getRoot() + "/" + atab.split('menu')[0];        
    }
}

function realmoviment(atab){
    var i, f;
    i = document.getElementById('tab').offsetLeft;
    f = document.getElementById(atab).offsetLeft;
    
    if (i < f) {
        i += 10;
    }
    else {
        i -= 10;
    }
    document.getElementById('tab').style.left = i + "px";
    movetab(atab);
}

function showmenu(){
    var i, f;
    i = document.getElementById('menubar').offsetTop;
    f = 0;
    if (i < f) {
        t = setTimeout("unhidemenu();", 100);
    }
}

function positionmenu(){
    var i, f;
    i = 0;
    document.getElementById('menubar').style.top = i + "px";
    document.getElementById('lcorner').style.top = (i + 26) + "px";
    document.getElementById('rcorner').style.top = (i + 26) + "px";
}

function unhidemenu(){
    i = document.getElementById('menubar').offsetTop;
    i += 5;
    document.getElementById('menubar').style.top = i + "px";
    document.getElementById('lcorner').style.top = (i + 26) + "px";
    document.getElementById('rcorner').style.top = (i + 26) + "px";
    showmenu();
}

function upflashf(){
    document.getElementById('upflash').style.left = document.getElementById('flash').offsetLeft;
    document.getElementById('upflash').style.top = document.getElementById('flash').offsetTop;
    document.getElementById('upflash').style.width = document.getElementById('flash').offsetWidth;
    document.getElementById('upflash').style.height = document.getElementById('flash').offsetHeight;
}

function flash(tab, url){
    switch (tab) {
        case 'homemenu':
            var s1 = new SWFObject(url + "swf/home.swf", "anim", document.body.clientWidth, "250", "9", "#FFFFFF");
            break;
        case 'servicesmenu':
            var s1 = new SWFObject(url + "swf/services.swf", "anim", document.body.clientWidth, "250", "9", "#FFFFFF");
            break;
        case 'portfoliomenu':
            var s1 = new SWFObject(url + "swf/portfolio.swf", "anim", document.body.clientWidth, "250", "9", "#FFFFFF");
            break;
        case 'contactmenu':
            var s1 = new SWFObject(url + "swf/contact.swf", "anim", document.body.clientWidth, "250", "9", "#FFFFFF");
            break;
    }
    s1.addParam("allowfullscreen", "false");
    s1.addParam("allowscriptaccess", "always");
    s1.addParam("wmode", "transparent");
    s1.write("flash");
}

function movebarout(tab){
    if (document.getElementById('rightbar').offsetLeft < 2000) {
        t = setTimeout("sendbarout(\'" + tab + "\');", 1);
    }
    else {
        // bar(tab);
        // movebar(tab);
        // top.location.href = '?p=' + tab.split('menu')[0];
    }
}

function sendbarout(tab){
    document.getElementById('rightbar').style.left = (document.getElementById('rightbar').offsetLeft + 50) + "px";
    
    document.getElementById('flash').style.opacity = document.getElementById('flash').style.opacity - 0.1;
    document.getElementById('upflash').style.filter = "alpha(opacity=" + (100 - document.getElementById('flash').style.opacity * 100) + ")";
    
    movebarout(tab);
}

function movebar(tab){
    document.getElementById('flash').style.top = '440px';
    switch (tab) {
        case 'homemenu':
            var f = (document.getElementById('menubar').offsetLeft + document.getElementById("menubar").offsetWidth) - document.getElementById("rightbar").offsetWidth - 10;
            break;
        case 'servicesmenu':
            var f = (document.getElementById('menubar').offsetLeft + document.getElementById("menubar").offsetWidth) - document.getElementById("rightbar").offsetWidth - 10;
            break;
        case 'portfoliomenu':
            var f = (document.getElementById('menubar').offsetLeft + document.getElementById("menubar").offsetWidth) - 323;
            break;
        case 'contactmenu':
            document.getElementById('flash').style.top = '400px';
            var f = (document.getElementById('menubar').offsetLeft + document.getElementById("menubar").offsetWidth) - 465;
            break;
    }
    if (document.getElementById('rightbar').offsetLeft > f) {
        t = setTimeout("repositionbar(\'" + tab + "\');", 1);
    }
    else {
        document.getElementById("homemenu").disabled = false
        document.getElementById("servicesmenu").disabled = false;
        document.getElementById("portfoliomenu").disabled = false;
        document.getElementById("contactmenu").disabled = false;
    }
}

function repositionbar(tab){
    document.getElementById('rightbar').style.left = (document.getElementById('rightbar').offsetLeft - 20) + "px";
    movebar(tab);
}

function bar(tab, s, url){
    document.getElementById('flash').style.opacity = 1.0;
    document.getElementById('upflash').style.filter = "alpha(opacity=0)";
    switch (tab) {
        case 'homemenu':
            document.getElementById("rightbar").style.width = "240px";
            var bar = "\
				<div style='position: relative; left: 13px; top: 80px;'><a href='http://www.acctuamedia.com/sites/ohashi' target='blank'><img src='img/home/img1.jpg' border='0' /></a></div>\
				<div style='position: relative; left: 10px; top: 80px;'><img src='img/home/littlebar.jpg' border='0' /></div>\
				<div style='position: relative; left: 5px; top: 90px; color: #434128; font: 14px Arial; font-weight: bolder;'>URL</div>\
				<div style='position: relative; left: 5px; top: 90px; font: 12px Arial;'><a href='http://www.acctuamedia.com/sites/ohashi' target='blank'>www.restauranteohashi.com</a></div>\
				<div style='position: relative; left: 5px; top: 95px; color: #434128; font: 14px Arial; font-weight: bolder;'>Company</div>\
				<div style='position: relative; left: 5px; top: 95px; font: 12px Arial;'>Eastern Cuisine</div>\
				<div style='position: relative; left: 5px; top: 100px; color: #434128; font: 14px Arial; font-weight: bolder;'>Description</div>\
				<div style='width: 230px; position: relative; left: 5px; top: 100px; font: 12px Arial;'>An innovative design was used on this project. Flash tools provide a great look and also intuitive interactivity.</div>\
				\
				<div style='position: relative; left: 13px; top: 120px;'><a href='http://www.acctuamedia.com/sites/cactus' target='blank'><img src='img/home/img2.jpg' border='0' /></a></div>\
				<div style='position: relative; left: 10px; top: 120px;'><img src='img/home/littlebar.jpg' border='0' /></div>\
				<div style='position: relative; left: 5px; top: 130px; color: #434128; font: 14px Arial; font-weight: bolder;'>URL</div>\
				<div style='position: relative; left: 5px; top: 130px; font: 12px Arial;'><a href='http://www.acctuamedia.com/sites/cactus' target='blank'>www.cactusjeans.com</a></div>\
				<div style='position: relative; left: 5px; top: 135px; color: #434128; font: 14px Arial; font-weight: bolder;'>Company</div>\
				<div style='position: relative; left: 5px; top: 135px; font: 12px Arial;'>Cactus Company Fashion Clothes</div>\
				<div style='position: relative; left: 5px; top: 140px; color: #434128; font: 14px Arial; font-weight: bolder;'>Description</div>\
				<div style='width: 230px; position: relative; left: 5px; top: 140px; font: 12px Arial;'>For this Fashion project, we built a striking look and at the same time maintained a clean, easy to use layout. Finally we mixed in some great style to round out a fun, colorful site.</div>\
				";
            break;
        case 'servicesmenu':
            document.getElementById("rightbar").style.width = "265px";
            var bar = "\
				<div style='position: relative; width: 250px; height: 30px; top: 120px; left: 10px;'>\
					<input type='hidden' id='opened' name='opened' value='' />\
					<div style='cursor: pointer;' onclick='openService(this.id, \"" + url +  "\")' id='brandinganddesign' name='brandinganddesign'><img id='brandinganddesign_plus' name='brandinganddesign_plus' style='border: 6px #c6c5b2 solid;' src='img/services/plus.jpg'><img src='" + url +  "img/services/brandinganddesign.jpg'></div>\
					<br />\
					\
					<div style='cursor: pointer;' onclick='openService(this.id, \"" + url +  "\")' id='webdevelopment' name='webdevelopment'><img id='webdevelopment_plus' name='webdevelopment_plus' style='border: 6px #c6c5b2 solid;' src='img/services/plus.jpg'><img src='" + url +  "img/services/webdevelopment.jpg'></div>\
					<br />\
					\
					<div style='cursor: pointer;' onclick='openService(this.id, \"" + url +  "\")' id='webhosting' name='webhosting'><img id='webhosting_plus' name='webhosting_plus' style='border: 6px #c6c5b2 solid;' src='img/services/plus.jpg'><img src='" + url +  "img/services/webhosting.jpg'></div>\
					<br />\
					\
					<div style='cursor: pointer;' onclick='openService(this.id, \"" + url +  "\")' id='flashdevelopment' name='flashdevelopment'><img id='flashdevelopment_plus' name='flashdevelopment_plus' style='border: 6px #c6c5b2 solid;' src='img/services/plus.jpg'><img src='" + url +  "img/services/flashdevelopment.jpg'></div>\
					<br />\
					\
					<div style='cursor: pointer;' onclick='openService(this.id, \"" + url +  "\")' id='seo' name='seo'><img id='seo_plus' name='seo_plus' style='border: 6px #c6c5b2 solid;' src='img/services/plus.jpg'><img src='" + url +  "img/services/seo.jpg'></div>\
					<br />\
					\
					<div style='cursor: pointer;' onclick='openService(this.id, \"" + url +  "\")' id='onlinemarketing' name='onlinemarketing'><img id='onlinemarketing_plus' name='onlinemarketing_plus' style='border: 6px #c6c5b2 solid;' src='img/services/plus.jpg'><img src='" + url +  "img/services/onlinemarketing.jpg'></div>\
					<br />\
				</div>\
				";
            break;
        case 'portfoliomenu':
            document.getElementById("rightbar").style.width = "290px";
            var bar = "\
				<div style='position: absolute; width: 227px; height: 16px; left: 25px; top: 260px;'><img src='" + url + "img/portfolio/littlebar.png'></div>\
				<div id='port_img_div' name='port_img_div' style='position: absolute; opacity: 1.0; width: 227px; height: 16px; left: 48px; top: 78px;'><a id='bigImageUrl' name='bigImageUrl' href='http://www.acctuamedia.com/sites/peixe-gato' target='_blank'><img border='0' id='port_img' name='port_img' src='img/portfolio/peixe-gato.jpg'></a></div>\
				<div style='position: absolute; width: 227px; height: 16px; left: 48px; top: 310px; color: #434128; font: 14px Arial; font-weight: bolder;''>URL</div>\
				<div id='port_url' name='port_url' style='position: absolute; width: 227px; height: 16px; left: 48px; top: 325px; font: 14px Arial;'>www.peixegato.com</div>\
				<div style='position: absolute; width: 227px; height: 16px; left: 48px; top: 350px; color: #434128; font: 14px Arial; font-weight: bolder;''>Company</div>\
				<div id='port_company' name='port_company' style='position: absolute; width: 227px; height: 16px; left: 48px; top: 365px; font: 14px Arial;'>Eastern cousine</div>\
				<div id='port_text' name='port_text' style='position: absolute; width: 227px; height: 16px; left: 48px; top: 390px; font: 14px Arial;'>With over 20 years of combined experience in Web Development; the founders of Acctua Media have been creating Websites since 1997. </div>\
				<div style='width: 270px; height: 55px; position: absolute; top: 510px; left: 5px;;'>\
					<div onclick='prev(document.getElementById(\"nav_bar\").offsetLeft);' style='cursor: pointer; position: absolute; left: 0; top: 12px;'><img src='" + url + "img/portfolio/back.png'></div>\
					<div style='left: 20; overflow: hidden; position: absolute; display: block; width: 240px; height: 55px;'>\
						<div id='nav_bar' name='nav_bar' style='width: 1000px; position: relative; left: 0;'>\
                            <img onclick='change(\"gfi\",\"" + url + "\")' style=\"border: #640304 2px solid; cursor: pointer; width: 50px; margin-left: 2px;\" src=\"" + url + "img/portfolio/snapshots/img6.jpg\"/>\
                            <img onclick='change(\"gugcy\",\"" + url + "\")' style=\"border: #640304 2px solid; cursor: pointer; width: 50px; margin-left: 2px;\" src=\"" + url + "img/portfolio/snapshots/img1.jpg\"/>\
							<img onclick='change(\"peixe-gato\",\"" + url + "\")' style=\"border: #640304 2px solid; cursor: pointer; width: 50px; margin-left: 2px;\" src=\"" + url + "img/portfolio/snapshots/img2.jpg\"/>\
							<img onclick='change(\"ohashi\",\"" + url + "\")' style=\"border: #640304 2px solid; cursor: pointer; width: 50px; margin-left: 2px;\" src=\"" + url + "img/portfolio/snapshots/img3.jpg\"/>\
							<img onclick='change(\"cactus\",\"" + url + "\")' style=\"border: #640304 2px solid; cursor: pointer; width: 50px; margin-left: 2px;\" src=\"" + url + "img/portfolio/snapshots/img4.jpg\"/>\
							<img onclick='change(\"mnoi\",\"" + url + "\")' style=\"border: #640304 2px solid; cursor: pointer; width: 50px; margin-left: 2px;\" src=\"" + url + "img/portfolio/snapshots/img5.jpg\"/>\
							<!--<img onclick='change(\"telemetry\",\"" + url + "\")' style=\"border: #640304 2px solid; cursor: pointer; width: 50px; margin-left: 2px;\" src=\"" + url + "img/portfolio/snapshots/img7.jpg\"/>-->\
						</div>\
					</div>\
					<div onclick='next(document.getElementById(\"nav_bar\").offsetLeft);' style='cursor: pointer; position: absolute; left: 100%; top: 12px;'><img src='" + url + "img/portfolio/foward.png'></div>\
				</div>\
				";
            var ohashi, gugcy, peixegato, mnoi, gfi, cactus, telemetry;
            ohashi = new Image();
            gugcy = new Image();
            peixegato = new Image();
            mnoi = new Image();
            gfi = new Image();
            cactus = new Image();
            telemetry = new Image();
            ohashi.src = "img/portfolio/ohashi.jpg";
            gugcy.src = "img/portfolio/gugcy.jpg";
            peixegato.src = "img/portfolio/peixegato.jpg";
            mnoi.src = "img/portfolio/mnoi.jpg";
            gfi.src = "img/portfolio/gfi.jpg";
            cactus.src = "img/portfolio/cactus.jpg";
            telemetry.src = "img/portfolio/telemetry.jpg";
            
            break;
        case 'contactmenu':
            // document.getElementById('flash').style.height = '300px';
            document.getElementById("rightbar").style.width = "380px";
            var bar = "\
				<form id='contact' name='contact' action='process.php' method='post'>\
				<div style='font: 14px \"Myriad Pro\"; color: #470000; position: absolute; left: 60px; top: 100px;'>Department</div>\
				<div style='font: 14px \"Myriad Pro\"; color: #470000; position: absolute; left: 60px; top: 120px;'>\
					<select style='border: 1px solid #9da3ad; width: 250px;' name='department' id='department' />\
						<option value='Design'>Design</option>\
						<option value='Marketing'>Marketing</option>\
						<option value='Administrative'>Administrative</option>\
					</select>\
				</div>\
				<div style='font: 14px \"Myriad Pro\"; color: #470000; position: absolute; left: 60px; top: 160px;'>Name</div>\
				<div style='font: 14px \"Myriad Pro\"; color: #470000; position: absolute; left: 60px; top: 180px;'><input type='text' style='border: 1px solid #9da3ad; width: 250px;' name='name' id='name' /></div>\
				<div style='font: 14px \"Myriad Pro\"; color: #470000; position: absolute; left: 60px; top: 225px;'>E-mail</div>\
				<div style='font: 14px \"Myriad Pro\"; color: #470000; position: absolute; left: 60px; top: 245px;'><input type='text' style='border: 1px solid #9da3ad; width: 250px;' name='email' id='email' /></div>\
				<div style='font: 14px \"Myriad Pro\"; color: #470000; position: absolute; left: 60px; top: 290px;'>Business</div>\
				<div style='font: 14px \"Myriad Pro\"; color: #470000; position: absolute; left: 60px; top: 310px;'><input type='text' style='border: 1px solid #9da3ad; width: 250px;' name='business' id='business' /></div>\
				<div style='font: 14px \"Myriad Pro\"; color: #470000; position: absolute; left: 60px; top: 355px;'>Message</div>\
				<div style='font: 14px \"Myriad Pro\"; color: #470000; position: absolute; left: 60px; top: 375px;'><textarea style='width: 250px; height: 200px; border: 1px solid #9da3ad;' id='message' name='message'></textarea></div>\
				</form>\
				<div style='font: 14px \"Myriad Pro\"; color: #470000; position: absolute; left: 60px; top: 590px; width: 250px;' align='right'><input onclick=\"document.getElementById(\'contact\').submit();\" type='submit' value='Send' /></div>\
				";
            break;
    }
    document.getElementById('rightbar').innerHTML = bar;
    if (tab == "portfoliomenu") {
        if (s == '') {
            change('gfi',url);
        }
        else {
            change(s,url);
        }
    }
	if(tab == "servicesmenu"){
		openService(s, url);
	}
}
