var sw = screen.width;
var sh = screen.height;
var w= $(window).width();
var h= $(window).height();

var plaatjes = [] ;
plaatjes[0]="images/aenc.jpg"
plaatjes[1]="images/design.jpg"
plaatjes[2]="images/portfolio.jpg"
plaatjes[3]="images/pi.jpg"
plaatjes[4]=""
plaatjes[5]="images/mail.jpg"
plaatjes[6]="images/henf.jpg"


var pagina = [] ;
pagina[0]=""
pagina[1]="design.php"
pagina[2]="portfolio.php"
pagina[3]="pi.php"
pagina[4]=""
pagina[5]="mail.php"
pagina[6]=""

var normbreed=1920;
var factor=w/normbreed;

var letter=20*factor;
$('body').css("font-size",letter);

var maintop=40*factor;
var mainlinks=600*factor;
var mainbreed=1280*factor;
var mainhoog=900*factor;

var menutop=349*factor;
var menuhoog=45*factor;
var menulinks=121*factor;
var menubreed=412*factor;
var menutussen=50*factor;
var menutal=7;
var menunu=6;

$(document).ready(function() {

// maak menu divs
for (var i=0; i < menutal; i++){
$('body').append("<div id='menu-"+i+"' class='menu'>&nbsp;</div>")
var p = $("#menu-"+i);
p.css("top",menutop+i*menutussen);
p.css("left",menulinks);
p.css("height",menuhoog);
p.css("width",menubreed);
}

// maak sommige breedtes 0
for (var i=0; i <menutal; i++)
{
if (plaatjes[i]=="" || menunu==i )	
{
var p = $("#menu-"+i);
p.css("width",0);
}
}

var p = $(".img");
p.css("width",w);

var p = $(".pagina");
p.css("left",0);
p.css("top",0);
p.css("width",w);
p.css("height",h);

var p = $(".main");
p.css("left",mainlinks);
p.css("top",maintop);
p.css("width",mainbreed);
p.css("height",mainhoog);

// is er een balk verschenen?
var ww= $(window).width();
if (w!=ww)
{
var w=ww;
var p = $(".img");
p.css("width",w);
var p = $(".pagina");
p.css("width",w);
}

// document ready
});

// als het scherm wordt geresized
$(window).resize(function() {

var w= $(window).width();
var h= $(window).height();

var p = $(".img");
p.css("width",w);

var p = $(".pagina");
p.css("width",w);
p.css("height",h);

var factor=w/normbreed;

var letter=20*factor;
$('body').css("font-size",letter);

var menutop=349*factor;
var menuhoog=45*factor;
var menulinks=121*factor;
var menubreed=412*factor;
var menutussen=50*factor;

var maintop=40*factor;
var mainlinks=600*factor;
var mainbreed=1280*factor;
var mainhoog=900*factor;
var p = $(".main");
p.css("left",mainlinks);
p.css("top",maintop);
p.css("width",mainbreed);
p.css("height",mainhoog);


for (var i=0; i < menutal; i++){
var p = $("#menu-"+i);
p.css("top",menutop+i*menutussen);
p.css("left",menulinks);
p.css("height",menuhoog);
p.css("width",menubreed);
}
// resize
});


// klik op een menu item
$(".menu").live("click", function(){

var n=$(this).attr("id")

var p = $(n);
p.css("background-color","green")

var m= n.split("-");
menunu=m[1];
$("#img-1").attr("src", plaatjes[menunu]);
// pagina laden
if (pagina[menunu]!="")
{
$("#main-1").load(pagina[menunu]);
$("#main-1").css("display","block")
}
else
{
$("#main-1").css("display","none")
}


//menu bijwerken
for (var i=0; i <menutal; i++)
{
if (plaatjes[i]=="" || menunu==i )	
{
b=0;
}
else
{
b=menubreed
}
var p = $("#menu-"+i);
p.css("width",b);
}
// menu klik
});



$("#zend").live("click", function(){

$(".error").hide();

var hasError = false;
        var emailReg = /^([\w-\.]+@([\w-]+\.)+[\w-]{2,4})?$/;
 
         var naamVal = $("#naam").val();
        if(naamVal == '') {
            $("#naam").after('<span style="color:#FFF" class="error">  Type jouw naam.</span>');
            hasError = true;
        }
  if(hasError == true) {
	  $("#naam").focus();
	  return false; }
  
        var emailaddressVal = $("#email").val();
        if(emailaddressVal == '') {
            $("#email").after('<span style="color:#FFF" class="error">  Type jouw e-mailadres.</span>');
            hasError = true;
        }
 
        else if(!emailReg.test(emailaddressVal)) {
            $("#email").after('<span style="color:#FFF" class="error">  Type een geldig e-mailadres.</span>');
            hasError = true;
        }
 
        if(hasError == true) {
		$("#email").focus();
			return false; }
 
          var berichtVal = $("#bericht").val();
        if(berichtVal == '') {
            $("#bericht").after('<span style="color:#FFF" class="error">  Type het bericht.</span>');
            hasError = true;
        }
  if(hasError == true) {
		$("#bericht").focus();	  
	  return false; }
 
$.post("zend.php", { "naam": naamVal, "email": emailaddressVal, "bericht": berichtVal }, function() {
     alert("De mail is verstuurd.");
	 $("#main-1").load("mail.php");
   });
 
    });