// jQuery Ready-Handler
jQuery(document).ready(function($){

    // navigation
    $("#nav > li > a").click(function(event){
        event.preventDefault();
        $(event.target).closest("li").find("ul").slideToggle();
    });

    // calender sub
    $("#chooseDay a").not(".back").click(function(event){
        event.preventDefault();
    });

    $camInfo = $("#cam_info");
    
    if ($('#cam_info').length > 0) {
	    
        $camInfo.hide();
		$camInfo.bind('mouseover', function() {

			$camInfo.data('isMouseOver', true);

		}).bind('mouseout', function() {

            $camInfo.data('isMouseOver', false);
            window.setTimeout(function() {
                 if (!$camInfo.data('isMouseOver')) {
                     $camInfo.hide();
                 }
            }, 300);

		});

    }
    
    $("#map .cam").each(function(){
       
        $(this).bind("mouseover", function(){

            // set data (stored for mouseOut)
            $camInfo.data('isMouseOver', true);

            // get position and name of camera
            var coords = $(this).position();
            var loc = $(this).attr('class').substr(4);

            // set headline and data
			$("#cam_info_wrapper").find('h2').html(l[loc]['name']);
			$("#cam_info_wrapper").find('img').attr('src', IMG + 'previews/' + loc + '.jpg');

            // insert links
			var list = "";
			Object.each(l[loc]['cams'], function(cam, title)
			{
			    list+= "<li><a href='" + cam.href + "'>Webcam \"" + title + "\"</a></li>";
			});
			$("#cam_info_wrapper").find("ul").remove();
            $("#cam_info_wrapper").append('<ul>' + list + '</ul>');

            // show and position
			$camInfo.show().css({
			    'left': (coords.left+20),
			    'top': (coords.top+15)
			});


        }).bind("mouseout", function(){

           $camInfo.data('isMouseOver', false);
           window.setTimeout(function() {
                if (!$camInfo.data('isMouseOver')) {
                    $camInfo.hide();
                }
            }, 300);
        
        })
        
    });

    jQuery.validator.messages.required = "";  
    jQuery.validator.messages.digits = "";
    jQuery.validator.messages.email = "";

    $("form").validate({
        rules: {
            "contact[nachname]": "required",
            "contact[vorname]": "required",
            "contact[email]": {
                required: true,
                email: true
            }
        },
        invalidHandler: function(e, validator) {
            var errors = validator.numberOfInvalids();
            if (errors) {
                $("#result").html("<span class='inputerror'>Bitte überpüfen Sie die rot markierten Felder.</span><br />")
            } else {
                $("#result").html("");
            }
        }
    });

});