// JavaScript Document

var j$ = jQuery;

	j$(document).ready(init);
	j$(window).load(loaded);


/********* DEFAULTS ********************************************************/
var def_zoomLevel 		= 4;
var def_jsonFile 		= '/assets/templates/mm/js/locations.json';
var def_maxDistance 	= 100; 					// the maximum distance from any of the points
var def_LatLng			= new GLatLng(38.899, -77.036);

/********* END DEFAULTS ****************************************************/
/********* MAP VARS ********************************************************/
var map;
var baseIcon;
var searchPoint = "fudd";
var qParam = "1600 Pennsylvania Ave., Washington DC"
var pointsArray = [];
var markersArray = [];
/********* END MAP VARS ********************************************************/

var windowWidth = 400;
var windowHeight = 400;
var contentHeight = 0;
var pageWidth= 0;
var lcHeight = 0;
var rcHeight = 0;
var lcTop = 0;
var rcTop = 0;
var lBgOffset = 'foo';

var mainNavWidth = 0;

var ii = 0;
var sections = 0;

function init()
{

	if(j$.browser.msie && j$.browser.version<8)
	{
		var $rightCol = j$('.rightCol').remove();
		$rightCol.css({'top':140});
		j$('.wrapper_outer').append($rightCol);
		
		
	}

	windowWidth = j$(window).width();
	windowHeight = j$(window).height();
	pageWidth = j$('.wrapper_inner').width();
	
	j$('table').attr({'cellspacing':0, 'width':'100%'});
	
////////////////////////////////////////////////////////////////////////////
	//SET UP DROP DOWN MENUS
	//strip away title tags so drop-downs work smoothly
	j$('#main_nav a').attr({'title':''});
	//set position for menus while at rest
//	j$('.mainNav li ul').css({'top':'1.3em'});
	//add class to submenus
//	j$('.mainNav li ul').parents('li').addClass('hasSubmenu');
	//apply nmcDropDown plugin
//	j$('.mainNav').nmcDropDown({submenu_selector: 'ul',
//							   show:{opacity:'show',top:'1.05em'},
//							   show_speed:300,
//							   hide:{opacity:'hide',top:'1.3em'},
//							   hide_speed:100});
	j$('#main_nav ul').nmcDropDown({hide_speed:0});
////////////////////////////////////////////////////////////////////////////
	
	
	j$('#index #section2').html('<form id="searchLocations" name="searchLocations" action="#" method="post"> 	<h4 id="mapInstructions">Enter your location to find a Marvelous Market near you. <span class="smaller">(Example: "1600 Pennsylvania Ave., Washington, DC" or "20006")</span>	</h4> <fieldset> <input type="text" id="addressInput" size="40" /><input id="locationSearchButton" type="submit" value="Search Locations"/> </fieldset></form>').addClass('locationSearch');
	j$('#locations #section2').html('<form id="searchLocations" name="searchLocations" action="#" method="post"> 	<h4 id="mapInstructions">Enter your location to find a Marvelous Market near you. <span class="smaller">(Example: "1600 Pennsylvania Ave., Washington, DC" or "20006")</span>	</h4> <fieldset> <input type="text" id="addressInput" size="40" /><input id="locationSearchButton" type="submit" value="Search Locations"/> </fieldset></form>').addClass('locationSearch');
	
	
	j$('#index #searchLocations').submit(function(){
			var addy = j$.URLEncode(j$('#addressInput').val());
			var goto = '/locations?address='+addy;
			location.href =  goto;
			return false;
		});


	if(j$('body').hasClass('mapPage'))
	{
	/********* MAP PAGE ********************************************************/
		// Initialize the map
		map = new GMap2(document.getElementById("map"));
		map.setCenter(def_LatLng, def_zoomLevel);
		j$('body').append('<div id="message">here</div>');
		j$('#message').hide();
	
		geocoder = new GClientGeocoder();


		// set the map controls
		map.addControl(new GSmallMapControl());
		map.addControl(new GMapTypeControl());
	
		// Create a base icon for all of our markers that specifies the
		// shadow, icon dimensions, etc.
		baseIcon = new GIcon();
		baseIcon.image = "/assets/images/locations/mm_locations.png";
		baseIcon.shadow = "/assets/images/locations/mm_locations_shadow.png";
		baseIcon.iconSize = new GSize(38, 36);
		baseIcon.shadowSize = new GSize(60, 38);
		baseIcon.iconAnchor = new GPoint(18, 38);
		baseIcon.infoWindowAnchor = new GPoint(19, 2);
		baseIcon.infoShadowAnchor = new GPoint(0, 2);
		
		
		
		j$('#locations #searchLocations').submit(function() {
			var address = j$('#addressInput').val();
			geocoder.getLatLng(address, function(latlng) {
				if (!latlng) {
					alert(address + ' not found');
				} else {
					map.clearOverlays();
					pointsArray = [];
					markersArray = [];
					searchPoint = latlng;
					searchLocationsNear(latlng);
					}
			});
			return false;
		});
		
		qParam = j$(document).getUrlParam("address");
		if(qParam != null){
			qParam = qParam.replace(/\%20/gi, ' ');
			geocoder.getLatLng(qParam, function(latlng) {
				if (!latlng) {
					alert(qParam + ' not found');
					get_points('');
				} else {
					
					searchPoint = latlng;
					searchLocationsNear(latlng);
					}
			});
		}
		else {
	//		 get_points('');
					searchPoint = def_LatLng;
					searchLocationsNear(def_LatLng);
		}
	}else
	{
	j$('.content .center .middle').jScrollPane({
	   scrollbarWidth:24,
	   reinitialiseOnImageLoad:true,
	   scrollbarMargin:0,
	   animateTo:true,
	   dragMaxHeight:24,
	   showArrows:true,
	   arrowSize:24
	   });
	}
	
	var mainNavPad = 0;
//	j$('.mainNav').css({'padding-left': mainNavPad});
//	j$('.mainNav:last').addClass('lowerMenu');
	j$('.mainNav').each(function(){
			mainNavWidth = j$(this).width();
			mainNavPad = Math.floor((pageWidth - mainNavWidth) * 0.5);
			j$(this).css({'padding-left': mainNavPad});
			
		});
	
	
	//FLASHEMBED CODE
	flashembed("flashHeader","/assets/flash/header.swf");
	
	
	if(j$('#section2').text() == "")
	{
		j$('#section2').remove();
	}
	

}

function loaded()
{
	j$('.couponBlock').click(function(){
		j$(this).printArea({mode : 'popup'});
	 });

	if(j$.browser.msie && j$.browser.version<8)
	{
		var paneHeight = j$('.jScrollPaneContainer .middle').css('height')
		if(paneHeight == "auto")
		{
			j$('body').addClass('scrollBar');
		}
	}

	//apply target="blank" to OUTGOING LINKS
	j$('a').each(function(i){
			var h=j$(this).attr('href');
			if(h.indexOf('http://')>-1 || h.indexOf('https://')>-1)
			{
				var cI = h.indexOf('marvelousmarket.com');
				if(cI<0 || cI>12)
				{
					j$(this).attr({'target':'_blank'});
				}
			}
		});

}


function addMarkers()
{
	j$("#message").appendTo(map.getPane(G_MAP_FLOAT_SHADOW_PANE));
	
	
	
	var marker;
	var iconNum = 0;
	var newItem =""
	var o = "";
	for(var i in pointsArray)
	{
			iconNum = parseInt(i)+1;
			baseIcon.image = "/assets/images/locations/mm_locations_" + iconNum.toString() + ".png";
			marker = new GMarker(pointsArray[i],{icon:baseIcon});
		
		o = "<h4>"+pointsArray[i].store+"</h4>";
//		o += "<p>"+pointsArray[i].addressLine1+"<br/>"+pointsArray[i].city+",&nbsp;"+pointsArray[i].state+"&nbsp;"+pointsArray[i].zip+"</p>";
		
		marker.overlay = o;
		map.addOverlay(marker);
		markersArray.push(marker);
		
		
		newItem = '<li id="sidebar_' + i + '" class="sidebarItem">';
		newItem += '<a href="/'+pointsArray[i].alias+'"><strong>' +pointsArray[i].store+ '</strong></a>';
		if(pointsArray[i].icons != "")
		{
			newItem += '<br />' + pointsArray[i].icons;
		}
		newItem += '<br />' + pointsArray[i].addressLine1;
		newItem += '<br />' + pointsArray[i].city + ', ' + pointsArray[i].state + ' ' + pointsArray[i].zip;
		newItem += '<br />' + pointsArray[i].phone;
		newItem += '<br /><a href="mailto:'+pointsArray[i].email+'">' + pointsArray[i].email+'</a>';
		newItem += '</li>';
		j$('#sidebarLocations ol').append(newItem);
	}

	j$('#sidebarLocations ol li:even').addClass('even');
	
	j$(markersArray).each(function(i,marker){
		  GEvent.addListener(marker, "mouseover", function(){
			displayPoint(marker,i);
		});
		  GEvent.addListener(marker, "click", function(){
			  map.panTo(marker.getLatLng());
		});
	});
	
	j$('.content .center .middle').jScrollPane({
	   scrollbarWidth:24,
	   reinitialiseOnImageLoad:true,
	   scrollbarMargin:0,
	   animateTo:true,
	   dragMaxHeight:24,
	   showArrows:true,
	   arrowSize:24
	   });
}




function displayPoint(marker, i)
{
	var contents = marker.overlay;
	
	
	var markerOffset = map.fromLatLngToDivPixel(marker.getPoint());
	j$("#message").show().css({ top:markerOffset.y, left:markerOffset.x }).html(contents);
}		  

//function get_points(filter)
//{
//	// get the addresses from the json file
//	j$.getJSON(def_jsonFile,function(data){
//		// loop through each of the markers in the json file
//		j$.each(data.locations, function(i,loc)
//		{
//			// check for the lat and lng in the database -- if present use it to create the marker
//		});
//	});
//	
//	// reset the center of the map and zoom out
//	map.setCenter(def_LatLng,def_zoomLevel);
//}

function searchLocationsNear(center)
{
	
	j$.getJSON(def_jsonFile, function(json) {

	j$('#sidebarLocations ol').html('');
		
		if (json.locations.length == 0)
		{
			j$('#leftSidebar').html('Error getting results.');
			return;
		}
		var bounds = new GLatLngBounds();
		j$.each(json.locations,function(i,loc)
		{
			var point = new GLatLng(parseFloat(loc.geo_lat),parseFloat(loc.geo_lng));
			
			var d=point.distanceFrom(center);
			d = d * 0.000621371192;
			
			point.store = loc.store;
			point.alias = loc.Alias;
			point.addressLine1 = loc.AddressLine1;
			point.addressLine2 = loc.AddressLine2;
			point.city = loc.City;
			point.state = loc.State;
			point.zip = loc.Zip;
			point.phone = loc.Phone;
			point.email = loc.Email;
			point.icons = loc.Icons;
			point.distance = d;
			
			pointsArray.push(point);
			if(json.locations.length <= i+1)
			{
				function compareDistance(a,b){
					return b.distance - a.distance
				}
				pointsArray.sort(compareDistance);
				pointsArray.reverse();
				addMarkers();
			}
			
			bounds.extend(point);
		});
		map.setCenter(bounds.getCenter(), map.getBoundsZoomLevel(bounds));
	});
}