function ID(id){
    return document.getElementById(id);
}

function init(){
	var targetscroll = 0;
	var activemenu = null;
	
	var left = ID("arrowleft");
	var right = ID("arrowright");
	var pages = ID("pages");				
	var menu = ["home","service","gallery","news","contact"];
	
	for(var i = 0; i < menu.length; i++){
		var m = ID(menu[i]);
		m.page = ID(menu[i]+"page");
		menu[i] = m;					
		if(i == 0){
			activemenu = m;
		}
		m.index = i;
		m.onmousedown = function(){
			this.visit();
		}					
		m.visit = function(){
			if(this != activemenu){
				targetscroll = this.page.offsetLeft;
				startMove();
				activemenu.className = activemenu.className.replace(/active/g,"");
				this.className += " active";
				activemenu = this;
			}
		}
	}
	
	var interval = false;
	function startMove(){
		if(!interval){
			interval = setInterval(move,1000/30);
		}
	}
	function stopMove(){
		clearInterval(interval);
		interval = false;
	}
	function move(){
		var way = (targetscroll - pages.scrollLeft)/3;
		if(way > 1 || way < -1){
			pages.scrollLeft += way;
		}else{
			pages.scrollLeft = targetscroll;
			stopMove();
		}					
	}
	left.onmousedown = function(){
		if(activemenu.index != 0){
			menu[activemenu.index-1].visit();
		}
	}
	right.onmousedown = function(){
		if(activemenu.index != menu.length-1){
			menu[activemenu.index+1].visit();
		}
	}
    
    //showContactFormular();
    
    //google maps
    var latlng = new google.maps.LatLng(47.170176,8.283691);
    var myOptions = {
      zoom: 14,
      center: latlng,
      mapTypeId: google.maps.MapTypeId.ROADMAP
    };
    var map = new google.maps.Map(document.getElementById("map_canvas"), myOptions);
    
    var myLatlng = new google.maps.LatLng(47.170176,8.283691);    
    var marker = new google.maps.Marker({
        position: myLatlng,
        title:"Lager"
    });
    
    // To add the marker to the map, call setMap();
    marker.setMap(map);
    
    showImage(1);
    setInterval(function(){
        imageindex++;
        if(imageindex > 14){
            imageindex = 1;
        }
        showImage(imageindex);
    },5000);
    
    document.getElementById("contactformbutton").onclick = function(){
        scroll(document.getElementById("contactpage2"),0,10);
    }
    document.getElementById("cancel").onclick = function(){
        scroll(document.getElementById("contactpage1"),0,10);
    }
    document.getElementById("send").onclick = function(){

        var failed = false;
        var fields = ["firma","vorname","nachname","strasse","strassennummer","plz","wohnort","telefon","mail","typ","ort","areal","besucher","datum","budget","ton","licht","dj","pyro","video","traversen","kommentar"];
        var d = collect.apply(this,fields);
        var r = new XMLHttpRequest();
        r.open("POST","http://eventlighting.ch/mail/");
        r.onreadystatechange = function(){
            if(r.readyState == 4){
                if(failed){
                    alert("Senden fehlgeschlagen!");
                }else{
                    alert("Ihre Anfrage wurde gesendet.");
                    erase.apply(this,fields);
                    scroll(document.getElementById("contactpage1"),0,10);
                }
            }
        }
        r.onerror = function(){
            failed = true;
        }
        r.send(JSON.stringify({
            from:d.mail||"stutzeventlighting@gmail.com",
            to:"stutzeventlighting@gmail.com",
            subject:"Offertenanfrage",
            message:JSON.stringify(d,null,4)
        }));

    }
    
    function id(i){
        return getElementById(i);
    }
    
    var blogindex = 0;
    document.getElementById("blogup").onclick = function(){
        if(blogindex > 0){
            blogindex--;
        }
        scroll(document.getElementById("blog").childNodes[blogindex]);
    }
    document.getElementById("blogdown").onclick = function(){
        if(blogindex < document.getElementById("blog").childNodes.length-2){
            blogindex++;
        }
        scroll(document.getElementById("blog").childNodes[blogindex]);
    }
    
}

function scroll(e,x,y){
    if(e.parentNode.scrollInterval){
        clearInterval(e.parentNode.scrollInterval);
    }
    e.parentNode.scrollInterval = setInterval(function(){
        var wayX = ((e.offsetLeft-(x?x:0)) - e.parentNode.scrollLeft)/3;
        var wayY = ((e.offsetTop-(y?y:0)) - e.parentNode.scrollTop)/3;
        console.log(wayX,wayY);
    	if(wayX > 1 || wayX < -1 || wayY > 1 || wayY < -1){
			e.parentNode.scrollLeft += wayX;
            e.parentNode.scrollTop += wayY;
		}else{
			e.parentNode.scrollLeft = e.offsetLeft-(x?x:0);
            e.parentNode.scrollTop = e.offsetTop-(y?y:0);
            console.log("cleared");
			clearInterval(e.parentNode.scrollInterval);
            delete e.parentNode.scrollInterval;
		}
    },1000/30);
}

function collect(){
    var r = {};
    for(var i = 0; i < arguments.length; i++){
        var e = document.getElementById(arguments[i]);
        r[arguments[i]] = e.type.toUpperCase() == "CHECKBOX"?e.checked:(e.value || e.innerText);
    }
    return r;
}

function erase(){
    for(var i = 0; i < arguments.length; i++){
        var e = document.getElementById(arguments[i]);
        console.log(e);
        if(e.tagName.toUpperCase() == "INPUT"){
            if(e.type.toUpperCase() == "CHECKBOX"){
                e.checked = false;
            }else{
                e.value = "";
            }
        }else{
            e.innerText = "";
        }
    }
}

function showContactFormular(){
    var iv = document.getElementsByClassName("imageview")[0];
    iv.style.height = 50;
}

var oldimage = null;
var imageindex = 1;
function showImage(id){
    var s = document.getElementById("slideshow");
    var i = document.createElement("img");
    i.src = "slideshow/"+id+".jpg";              
    
    i.onload = function(){
        i = document.createElement("div");
        i.style.backgroundImage = "url(slideshow/"+id+".jpg)";
        i.style.backgroundPosition = "left center";
        i.style.position = "absolute";
        i.style.right = "0px";
        //i.style.width = "924px";
        i.style.height = "350px";
        s.appendChild(i);
        if(oldimage){
            //i.style.height = "0px";
            i.style.width = "0px";
            oldimage.style.right = "";
            oldimage.style.left = "0px";
            oldimage.style.backgroundPosition = "right center";
            var c = 0;
            var interval = setInterval(function(){
                //c += (350-c)/3;
                //i.style.height = c+"px";
                //oldimage.style.height = (350-c)+"px";
                //if(Math.round(c) == 350){
                c += (924-c)/5;
                i.style.width = c+"px";
                oldimage.style.width = (924-c)+"px";
                if(Math.round(c) == 924){
                    clearInterval(interval);
                    s.removeChild(oldimage);
                    oldimage = i;
                    //i.style.height = "350px";
                    i.style.width = "924px";
                }
            },1000/30);
        }else{
            //i.style.height = "350px";
            i.style.width = "924px";
            oldimage = i;
        }
    }                 
}



jQuery(document).ready(function() {
    jQuery("#pics").EmbedPicasaGallery('stutzeventlighting',{
    matcher: /.*/,
    //  auto_open: true,
    //  hide_back: true,
    //  show_more: 5,
    loading_animation: 'css/loading.gif',
    album_title_tag:    '<h2/>'
    });
    
});