window.log = function(){
  log.history = log.history || []; // store logs to an array for reference
  log.history.push(arguments);
  // if(this.console){
  //   console.log( Array.prototype.slice.call(arguments) );
  // }
};
var j = jQuery.noConflict();
////////////////////////////////////////////////
// plugins
////////////////////////////////////////////////

if ( typeof jQuery != "undefined" ){
    // clear default value
    jQuery.fn.clearDefault = function(){
        return this.each(function(){
            var default_value = j(this).val();
            j(this).focus(function(){
                if (j(this).val() == default_value) j(this).val("");
            });
            j(this).blur(function(){
                if (j(this).val() == "") j(this).val(default_value);
            });
        });
    };
};

////////////////////////////////////////
// vacations
////////////////////////////////////////

var vacations = {

    init:function(){
        vacations.maps.load();
    },


    ////////////////////////////////////////
    // maps
    ////////////////////////////////////////

    maps:{
        DEFAULT_ICON: '../images/marker.png', // marker icon
        DEFAULT_LOCATION: 'Western Europe', // start location for the map
        JSON_URL: '/Json', // json url
		JSON_OPTIONS: '',

        // load google maps async
        load:function(){
            var script = document.createElement("script");
            script.type = "text/javascript";
            script.src = "http://maps.google.com/maps/api/js?sensor=false&callback=vacations.maps.init";
            document.body.appendChild(script);
        },


        // init
        init:function(){
			this.markersArray = [];
			// new map
			this.map = new google.maps.Map(document.getElementById("map_canvas"), {scrollwheel: false,zoom: 10, center: new google.maps.LatLng(0, 0), mapTypeId: google.maps.MapTypeId.ROADMAP});

			// get json locations
			if(window.location.href.indexOf('?') >= 0){
				options = window.location.search.substr(1);
				this.get(options);
				this.setFormElements(options)
			} else{
				this.get(j('#vacForm').serialize());
			}
		
			// catch form submit
			j('#vacForm').change(this.search);
        },

        // get json
        get:function(JSON_OPTIONS){
        	var streetview = vacations.maps.map.getStreetView();
        	streetview.setVisible(false);

			if(!j.browser.msie){
				j('#vacationFinder').css('opacity', 0.7);
			}
			j('#loader').show();

			j.getJSON(vacations.maps.JSON_URL+(JSON_OPTIONS ? '?'+JSON_OPTIONS : ''), function(data){
				//  Create a new viewpoint bound
				bounds = new google.maps.LatLngBounds();
				infoWin = new google.maps.InfoWindow({maxWidth: 280});

				if (vacations.maps.markersArray.length) {
					for (var i = 0; i < vacations.maps.markersArray.length; i++) {
						vacations.maps.markersArray[i].setMap(null);
					}
					vacations.maps.markersArray.length = 0;
				}
				if(!j.browser.msie){
					j('#vacationFinder').css('opacity', 1);
				}
				j('#loader').hide()
				if(!data.locations){
					j('#noResults').show()
					
				} else{
					if(j('#noResults')){
						j('#noResults').hide();
					}
					for (var i = 0; i < data.locations.length; i++) {
						var category = data.locations[i].category;

						var markerColor = vacations.maps.category2color(category);
					    // create marker
					    var marker = new google.maps.Marker({
					        position: new google.maps.LatLng(parseFloat(data.locations[i].lat), parseFloat(data.locations[i].lng)),
					        map: vacations.maps.map,
					        icon: '../images/vakantie/marker-'+ markerColor +'.png'
					    });

						bounds = bounds.extend(marker.position);
						vacations.maps.markersArray.push(marker);

						var locationUrl = data.locations[i].url;
						var locationTitle = data.locations[i].title;
						var locationDescr = data.locations[i].description;
						var locationImageurl = data.locations[i].image;
						var locationtravels = data.locations[i].travels;

						// handle marker click
						google.maps.event.addListener(marker, 'click', function(url, title, desc, imageurl, travels) {
							return function(){

								imagetag = '';
								if (imageurl.length > 0) {
									imagetag = '<img class="vacDetailImg" src="' + imageurl + '" alt="' + title + '" />';
								}
								
								// set info window content, wrap html in <p>
								infoWin.setContent(''+
								'<div id="vacBal_'+i+'" class="vacationBalloon" style="width: 260px;">'+
									'<h2><a href="'+ url +'">'+ title +'</a></h2>'+
									'<p>'+ desc +'<br/><br/>'+ travels +'<br/>'+
										'<a href="'+ url +'"><img src="/images/vakantie/but_go_to_vacation.png" alt="Bekijk de vakantie &raquo;" /></a>'+
									'</p>' + imagetag + '</div>');
								// open infowin
								infoWin.open(vacations.maps.map, this);
							}
						}.call(this, locationUrl, locationTitle, locationDescr, locationImageurl, locationtravels));
					}

					if (vacations.maps.markersArray) {
						for (var i = 0; i < vacations.maps.markersArray.length; i++){
							vacations.maps.markersArray[i].setMap(vacations.maps.map);
						}
					}

					//  Fit these bounds to the map
					vacations.maps.map.fitBounds(bounds);

					zoomLevel = vacations.maps.map.getZoom();
					if(zoomLevel >= 8){
						vacations.maps.map.setZoom(7);
					};
				}
				
			})
        },
		setFormElements:function(url){
			options = url.split('&');
			options.each(function(i){
				option = i.split('=');
				j('#'+option[0]).val(option[1])
			});
		},
		category2color:function(category) {
		   var color = "red";
		   switch(category) {
		     case "-12": color = "orange";
		                break;
		     case "-16":    color = "red";
		                break;
		     case "+16":    color = "blue";
		                break;
		     case "+21":    color = "green";
		                break;
		     default:   color = "red";
		                break;
		   }
		   return color;
		},
		// search
        search:function(e){
            // catch form event
            if(e){
				e.preventDefault();
				ser = j(this).serialize();
				vacations.maps.get(ser);
			}
        }
    }
};
jQuery(document).ready(function($) {
	var t=setTimeout("vacations.init()", 500);
});