var width = 0;
var height = 0;
var left = 0;
var topi = 0;
var openbox = false;
var boxid = "";
var headertop = "";
//a
var bheight = $(window).height();
bheight = bheight - 620;
bheight = bheight / 2;
$("#container").delay(500).fadeIn(500);
/*$(document).ready(function(){

$("#container").css("top", bheight);

//});

$(window).resize(function() {
var bheight = $(window).height();
bheight = bheight - 620;
bheight = bheight / 2;
$("#container").css("top", bheight);
if (openbox == true && 1 == 2) {
var heighta = $("#container").height() * 0.7
var widtha = 500
var widthba = ($("body").width() - widtha) / 2;
var widthbb = ($("body").width() - 500) / 2
var borderwidth = $(this).css("borderTopWidth")
borderwidth = parseFloat(borderwidth)
widthb = widthbb - (widthba) + (borderwidth)
$("#" + boxid).animate({
left: '-' + widthb,
width: widtha,
top: "100",
height: heighta
}, 0);
}
});
*/

$('.box').mouseover(function() {
		if (openbox == false) {
		$(this).css('z-index', 2)
		$(".box").not(this).stop().animate({
		opacity: '0.4',
		}, 700);
		$(this).stop().animate({
		opacity: '1',
		}, 400);
		
		}
});

$('.box').mouseout(function() {
		if (openbox == false) {
		$(this).css('z-index', 1)
		$(".box").not(this).stop().animate({
		opacity: '1',
		}, 700);
		}});

$('img').mousedown(function() {
if (event.preventDefault) event.preventDefault()		
});

$('.close_button').mousedown(function() {
if (event.preventDefault) event.preventDefault()		
});


$('.box').click(function() {
if (openbox == false && $(this).html() !== "") {
    openbox = true;
    boxid = $(this).attr("id");
    $(this).css('z-index', 4)
    width = parseFloat($(this).css("width"));
    height = parseFloat($(this).css("height"));
    left = parseFloat($(this).css("left"));
    topi = parseFloat($(this).css("top"));
    var heighta = $("#container").height() * 0.7
    var topa = $(window).height() * 0.15
    var widtha = 520
    var widthba = ($("body").width() - widtha) / 2;
    var widthbb = ($("body").width() - 500) / 2
    var borderwidth = $(this).css("borderTopWidth")
    var topa = 100;
    //borderwidth = borderwidth.slice(0, -2)
    borderwidth = parseFloat(borderwidth)
    topa = topa - borderwidth;
    widthb = widthbb - (widthba) + (borderwidth)
    $(this).animate({
        left: '-' + widthb,
        width: widtha,
        top: topa,
        height: heighta,
        opacity: 0.75
      }, 1000);
    headertop = $("#" + boxid + " > .header").css("top");
    $("#" + boxid + " > .header").animate({
        top: '2%'
      }, 1000);
    $(this).css("backgroundColor", "white")
    $(".backdrop").fadeIn(1000);
    $(this).append('<img src="images/close.png" class="close_button" onClick="closeButton();">')
    
   // $(".close_button").css("left", widthb + 500 - (borderwidth * 2));
   // $(".close_button").css("top", "60");
    $(".close_button").delay(1300).fadeIn()
    $("#" + boxid + " > .content").delay(1500).fadeIn(500);
    setTimeout(function() {$("input").css("opacity", 1)} , 1500);
}
});



function closeButton() {
$("#" + boxid + " > .content").fadeOut(300);
var leftz = parseFloat(left)
var topz = parseFloat(topi)
var heightz = parseFloat(height)
var widthz = parseFloat(width)
$("#" + boxid).animate({
    left: leftz,
    width: widthz,
    top: topz,
    height: heightz,
    opacity: 1
  }, 1000);
$("#" + boxid + " > .header").animate({
    top: headertop
  }, 1000);
$(".close_button").remove();
$("#" + boxid).css("backgroundColor", "transparent")
$(".backdrop").fadeOut(1000);
$("#" + boxid).css('z-index', 1)
$(".box").css('opacity', "1")
setTimeout(function() {openbox = false;} , 1500);
}

$('.app_label').click(function() {
$('.selected').toggleClass("selected");
$(this).toggleClass("selected");
});

$('.about_label').click(function() {
$('.selectedab').toggleClass("selectedab");
$(this).toggleClass("selectedab");

	if ($(this).html() == "Josh") {
	$('#david').slideUp();
	$('#stevie').slideUp();
	$('#josh').slideDown();
	}
	else if ($(this).html() == "David") {
	$('#josh').slideUp();
	$('#stevie').slideUp();
	$('#david').slideDown();
	}
	else {
	$('#david').slideUp();
	$('#josh').slideUp();
	$('#stevie').slideDown();
	}
});

function form_submit() {
var name = $("#form_name").val()
var email = $("#form_email").val()
var comment = $("#form_comment").val()
var data = {
name:  name,
email:  email,
comment: comment
}
$.ajax({
   type: "POST",
   url: "contact.php",
   data: data,
   success: function(msg){
   $(".form_alert").html("<font color='#55ccf0'>Contact form submitted successfully. We will get back to you as soon as possible!</font><br /><br />")
   $("#form_name").val("")
   $("#form_email").val("")
   $("#form_comment").val("")
   }
});
}

function form_reset() {
   $("#form_name").val("")
   $("#form_email").val("")
   $("#form_comment").val("")	
}
