$(document).ready( function(){ 

/* Main Nav  */	
     $("ul#mainnav").superfish({ 
	 	delay: 750, // one second delay on mouseout 
	    speed: 'fast', // faster animation speed 
	    autoArrows: true, // disable generation of arrow mark-up 
	    dropShadows: false // disable drop shadows 
     });
	 $("ul#mainnav li:last-child ul").addClass('last');

/* Rounded Corners (DIVS) */
	/* HomePage */
	$('#parking, #eventfeature .info').corner("6px");
	/* Directory */
	$('.directory').corner("6px");
	/* Calendar */
	$('#calendarcontainer, #Cal1_wrapper, #callegend').corner("5px");
	$('.RadCalendar_Default .rcMain .rcRow a.past, .RadCalendar_Default .rcMain .rcRow a.upcoming').corner('15px');
	$('.RadCalendar_Default .rcTitlebar').corner("top 5px");
	/* Events and News*/
	$('#eventscontainer .item, #eventscontainer .item .info, #newscontainer .item, #newscontainer .item .info').corner("5px");
	$('#eventscontainer .item .head, #newscontainer .item .head').corner("top 5px");
	/* Features */
	$('.feature').corner("5px");
	/* Backlink */
	$('.backLink a').corner("5px");

/* Rounded Corners (IMAGES) */
	$(".contentsidecol .sideimg, .directory .img, #eventscontainer .img, #eventsarticle .img, #directorycontainer .img, #banner .item, #gallerylisting .img, #gallery .img").each( function () {
		var img = $(this);
		// build wrapper
		var wrapper = $('<div class="rounded_wrapper"></div>');
		wrapper.width(img.width());
		wrapper.height(img.height());
		// move CSS properties from img to wrapper
		wrapper.css('float', img.css('float'));
		img.css('float', 'none')
		wrapper.css('margin-right', img.css('margin-right'));
		img.css('margin-right', '0')
		wrapper.css('margin-left', img.css('margin-left'));
		img.css('margin-left', '0')
		wrapper.css('margin-bottom', img.css('margin-bottom'));
		img.css('margin-bottom', '0')
		wrapper.css('margin-top', img.css('margin-top'));
		img.css('margin-top', '0')
		wrapper.css('display', 'block');
		img.css('display', 'block')
		// wrap image
		img.wrap(wrapper);
		// add rounded corners
		img.after('<div class="tl"></div>');
		img.after('<div class="tr"></div>');
		img.after('<div class="bl"></div>');
		img.after('<div class="br"></div>');
	});

/* Events and News Scrollable */
	$("#eventscontainer, #newscontainer, #directorycontainer").scrollable({ 
        size: 4,
		clickable: false,
		vertical: true
    }).navigator();
	$("div.navi a").each(function(i) { 
  		$(this).html(i+1); 
	});
	
/* Homepage Scrollable */
	$("#banner").scrollable({
		size: 1, 
		clickable: false,
		onLoad: function() { 
        	onBeforeSeek(function() { return false; }); // disables autoscroll 
		},
		onClose: function() { 
        	unbind("onBeforeSeek"); // reenables autoscroll 
		} 
		})
	.circular().autoscroll({ 
		steps: 1, 
		interval: 5000,
		autopause: true
	});

/* List classes */
	$('ul#topnav1 li:last-child').addClass('last');
	$('ul.infolist li:odd').addClass('alt');
	$('ul.sitemap li ul li:last-child a').addClass('last');

/* Colorbox	*/
	$("#gallery .item .img a, #gallery .item .title a").colorbox();

/* Labelify */
	$("#search input:text").labelify();

/* Send to friend */
	$(".quicklinks .friend").click(function () { 
    	  $(".sendtoFriend").show('');
	});
	$(".sendtoFriend .close").click(function () { 
    	  $(".sendtoFriend").hide('');
	});

/* Map */
	$("#viewport").mapbox({
		mousewheel: false
	}); 
	jQuery(".map-control a").click(function() {//control panel 
		var viewport = $("#viewport"); 
		//this.className is same as method to be called 
		if(this.className == "zoom" || this.className == "back") { 
			viewport.mapbox(this.className, 1);//step once
		} 
		else { 
			viewport.mapbox(this.className); 
		} 
		return false; 
	}); 

	/* Center map based on user selection */
	$('.shopselect').change(function() {
		$('.shopinfo').fadeOut(); // Close any open popups
		$('#viewport a').removeClass('selected'); // remove selected from all markers
		
		var selected = $('.shopselect').val(); // Get selected shop name
		var activelayer = $('.current-map-layer').attr('id'); // Find out active map layer
		
		$.getJSON("mapcoords.txt", function(data) {
			var shop = data.shops[selected]; // Find selected shop in json
			if ( shop ) { // on shop selected
				var loc = shop.locations[activelayer]; // Find selected shop layer in json
				if ( loc ) {
					$("#viewport").mapbox("center", { 
						x: loc.x, // insert data
						y: loc.y  // insert data
					});
				}
			}
		});
		$('#' +selected).fadeIn(); // Fade in popup
		$('.' +selected).addClass('selected'); // Add selected class to marker
	});

	/* Center Map based on body class */
	if ($("body").attr('class')) {
		var bodyclass = $('body').attr('class');
		var activelayer = $('.current-map-layer').attr('id'); // Find out active map layer
		$.getJSON("mapcoords.txt", function(data) {
			var shop = data.shops[bodyclass]; // Find selected shop in json
			if ( shop ) { // on shop selected
				var loc = shop.locations[activelayer]; // Find selected shop layer in json
				if ( loc ) {
					$("#viewport").mapbox("center", { 
						x: loc.x, // insert data
						y: loc.y  // insert data
					});
				}
			}
		});
		$('#' +bodyclass).fadeIn(); // Fade in popup
		$('.' +bodyclass).addClass('selected'); // Add selected class to marker
	};
	
	/* Map Popups */
	$('#viewport a').click(function() {
		$('.shopinfo').fadeOut(); // Close any open popups
		$('#viewport a').removeClass('selected'); // remove selected from all markers
		var getmarker = $(this).attr("class"); // Get class of marker clicked
		$('#' + getmarker).fadeIn(); // Find the popup for marker and fade it in.
		$(this).addClass('selected'); // add selected to marker clicked
	});

	$('.shopinfo .close').click(function() {
		$(this).parent().fadeOut(); // hide popup on close
		$('#viewport a').removeClass('selected'); // remove selected class on close
	});




// Use this to grab CSS coords from json
//$('.shopselect').change(function() {
//       
//            // Clear result div
//            $("#result").text('');
//            
//            // Read the value element of the selected option
//            // they should be the same as the shop names in your JSON
//            var selected = $('.shopselect').val();
//
//            // Get JSON from file
//            $.getJSON("mapcoords.txt", function(data) {
//
//                var shop = data.shops[selected];
//                if ( shop ) {
//                        // Loop over all locations
//                        $.each(shop.locations, function(i,item) {
//                            // Dump the locations into the result div, but you would interface with your map here
//                            $("#result").append("." + i + " ." + selected + " { left: " + item.x + "px; top: " + item.y + "px;}<br/>");
//                        });
//                }
//            });
//        });



});