var JSONList = null;
var MAXCOUNT = 15;
var zoomLevel = [2,3,5,8];
var chosenCompare = null;
var searchComplete = false;

Event.observe(window, 'load', function() {
   initIcon();
   new Ajax.Request('http://www.freshpeaks.com/fresh/resortList', {
      onSuccess: function(transport) {
         var transthing = transport.responseText;
         JSONList = transthing.evalJSON(true);
         
         intiGoogleMaps();
      }
   });
   initButtonActions();
   gSearchInit();
});

/* =============== Google Search =========================== */


function gSearchInit() {
  if (!$("siteSearch")) { return; }
  
  // Create a search control
  searchControl = new google.search.SearchControl();

  // web search, open, alternate root
  var options = new google.search.SearcherOptions();
  options.setExpandMode(google.search.SearchControl.EXPAND_MODE_OPEN);
  options.setRoot($("search_results"));

  // Add in a WebSearch
  var webSearch = new google.search.WebSearch();
  webSearch.setUserDefinedLabel("Fresh Peaks");
  webSearch.setSiteRestriction('www.freshpeaks.com');
  searchControl.addSearcher(webSearch, options);

  // attach "powered by Google" branding
  //google.search.Search.getBranding($("branding"));
  
  searchControl.setSearchCompleteCallback(this, gSearchInit.prototype.OnSearchComplete);
  searchControl.setLinkTarget(google.search.Search.LINK_TARGET_SELF);

  // tell the searcher to draw itself and tell it where to attach
  searchControl.draw($("siteSearch"));
  
  $$('.gsc-search-button .gsc-search-button')[0].value = '';
}

gSearchInit.prototype.OnSearchComplete = function(sc, searcher) {
   if (!searchComplete) {
      searchComplete = true;
      var clrButton = document.createElement("a");
      clrButton.setAttribute("href", "#");
      clrButton.className = "btnClearSearch";
      clrButton.update(new Element('img', {'src':'/assets/images/fm/btn_search_close.gif', 'width':'35', 'height':'35', 'alt':'Close', 'title':'Close'}));
      clrButton.onclick = function () {
         searchControl.clearAllResults();
         $('siteSearch').removeChild(this);
         searchComplete = false;
         return false;
      };
    
      $('siteSearch').appendChild(clrButton);
   }
}

/* =============== Google Maps Implementation ================= */

var map = null;
var geocoder = null;
var address = null;
var addressd = null;
var gMapLargeIcon = null;
var tooltip = null;

function initIcon() {
   gMapLargeIcon = new GIcon(G_DEFAULT_ICON);
   gMapLargeIcon.iconSize = new GSize(49, 60);
   gMapLargeIcon.iconAnchor = new GPoint(24, 60);
   gMapLargeIcon.infoWindowAnchor = new GPoint(1, 60);
   gMapLargeIcon.imageMap = [9,4,13,1,16,0,32,0,34,1,44,9,47,16,47,30,45,34,26,58,22,58,3,34,1,31,1,15,2,12];   
}

function setupMap(mapId, location){
   initIcon();
   
   if (GBrowserIsCompatible()) {
      var newMap = new GMap2(document.getElementById(mapId));
      
      geocoder = new GClientGeocoder();
      
      if (geocoder) {
         geocoder.getLatLng(
            location,
            function(point) {
               if (!point) {
                  //alert(location + " not found");
               } else {    
                  var myIcon = new GIcon(gMapLargeIcon, "http://freshpeaks.com/assets/images/fm/map_pointer.png");
                  var markerOptions = { title: "" }
                  markerOptions['icon'] = myIcon;
               
                  var marker = new GMarker(point, markerOptions);
                  newMap.setCenter(point, zoomLevel[1]/1);
                  newMap.addOverlay(marker);
               }
            }
         );
      }
   }
}

function intiGoogleMaps() {
  if (GBrowserIsCompatible()) {
      map = new GMap2(document.getElementById("compare_map"));        
	  map.addControl(new GSmallMapControl());
      tooltip = new Element('div');
      tooltip.id = "tooltip";
      $('compare_map').appendChild(tooltip);
      tooltip.style.visibility="hidden";

      var myLocLatLng = new GLatLng(1.0, 1.0);
      map.setCenter(myLocLatLng, 1);
    
      var count = 0;
      JSONList.each(function(JSONitem){
         var links = "<ul class='toolOptions'><li><a href=\"javascript: zoomAndPopulate('"+JSONitem.location+"','"+zoomLevel[JSONitem.zoom]+"','"+count+"');\">Zoom Here</a></li>";
         links += "<li><a href='" + JSONitem.page + "'>View info page</a></li></ul>";
         addPoint(JSONitem.location, "<h3>" + JSONitem.title + "</h3><p>" + JSONitem.description + "</p>" + links);
         count ++;
      });
  }
}

function addNewPins(points){
   var levelCheck = points.split(",");
   switch(levelCheck.length){
     case 1:   listToIterate = JSONList[levelCheck[0]].places;
               break;
     case 2:   listToIterate = JSONList[levelCheck[0]].places[levelCheck[1]].places;
               break;
     case 3:   listToIterate = JSONList[levelCheck[0]].places[levelCheck[1]].places[levelCheck[2]].places;
               break;
     case 4:   listToIterate = JSONList[levelCheck[0]].places[levelCheck[1]].places[levelCheck[2]].places[levelCheck[3]].places;
               break;
   }
   
   var count = 0;
   listToIterate.each(function(JSONitem){
      var links;
      if(JSONitem.resortId != null){
         links = "<ul class='toolOptions'><li><a href=\"javascript: selectResort('"+JSONitem.resortId+"');\">Compare this</a></li>";
      }
      else {
         links = "<ul class='toolOptions'><li><a href=\"javascript: zoomAndPopulate('"+JSONitem.location+"','"+zoomLevel[JSONitem.zoom]+"','"+points+","+count+"');\">Zoom Here</a></li>";
      }
      links += "<li><a href='" + JSONitem.page + "'>View info page</a></li></ul>";
	  
	  if(JSONitem.longitude != '' && JSONitem.latitude != '' && JSONitem.longitude != null && JSONitem.latitude != null){
		 var location = new GLatLng(parseFloat(JSONitem.latitude), parseFloat(JSONitem.longitude));
	     addLatLangPoint(location, "<h3>" + JSONitem.title + "</h3><p>" + JSONitem.description + "</p>" + links);
	  }
	  else {
	     addPoint(JSONitem.location, "<h3>" + JSONitem.title + "</h3><p>" + JSONitem.description + "</p>" + links);
	  }
	  count ++;
   });
}

function addPoint(address, displayText){
   geocoder = new GClientGeocoder();
   
   if (geocoder) {
      geocoder.getLatLng(
         address,
         function(point) {
            if (!point) {
               //alert(address + " not found");
            } else {               
               var marker = createMarker(point, displayText);
               map.addOverlay(marker);
            }
         }
      );
   }
}

function addLatLangPoint(point, displayText){
   var marker = createMarker(point, displayText);
   map.addOverlay(marker);
}

function zoomToArea(address, zoom){
   map.clearOverlays();
   tooltip.setStyle({'visibility': 'hidden'});
   
   if (geocoder) {
      geocoder.getLatLng(
         address,
         function(point) {
            if (!point) {
               //alert(address + " not found");
            } else {
               map.setCenter(point, zoom/1);
            }
         }
      );
   }
}

function createMarker(point,html) {   
   var myIcon = new GIcon(gMapLargeIcon, "http://freshpeaks.com/assets/images/fm/map_pointer.png");
   var markerOptions = { title: "" }
   markerOptions['icon'] = myIcon;

   var marker = new GMarker(point, markerOptions);
   marker.tooltip = '<div class="map_tooltip">' + html + '<img src="/assets/images/fm/tooltip_arrow.gif" width="10" height="19" class="arrow" /></div>';
   
   GEvent.addListener(marker,"mouseover", function(e) {
      showToolTip(marker);
   });
   
   tooltip.on("mouseleave", function(){
      tooltip.setStyle({'visibility': 'hidden'});
   });
   
   return marker;
}

function showToolTip(marker){
   tooltip.innerHTML = marker.tooltip;
   var point = map.getCurrentMapType().getProjection().fromLatLngToPixel(map.getBounds().getSouthWest(),map.getZoom());
   var offset = map.getCurrentMapType().getProjection().fromLatLngToPixel(marker.getPoint(),map.getZoom());
   var anchor = marker.getIcon().iconAnchor;
   var xpos = offset.x - point.x - anchor.x;
   xpos = fixxpos(xpos);
   
   var pos = new GControlPosition(G_ANCHOR_TOP_LEFT, new GSize(xpos, $('compare_map').getHeight() - (point.y - offset.y) - 60));
   pos.apply(tooltip);
   tooltip.style.visibility = "visible";
}


function fixxpos(xpos){
	if(xpos > 0){
		return xpos;
	}
	else {
		return fixxpos(xpos + 1024);
	}
}

/* ====== Button Actions ===== */

function initButtonActions() {
   $$('#resort_compare .controls .change').each(function(elm){
      elm.on('click', function(e, elm){
         if(elm.up('#compareItemTwo') != undefined){
            chosenCompare = "Two";
         }
         else {
            chosenCompare = "One";
         }
         $('map_holder').setStyle('visibility: visible');
         $('location_selector').setStyle('visibility: hidden');
      });
   });
   
   $('resortCompareClose').on('click',function(){
      $('map_holder').setStyle('visibility: hidden');
      $('location_selector').setStyle('visibility: hidden');
      if($('map_controls').down('.selected') != undefined){
         $('map_controls').down('.selected').toggleClassName('selected');         
      }
   });
   
   selectorListOnclicks(null);
}

function zoomAndPopulate(zoomTitle, zoomLevel, populateGroup){
   zoomToArea(zoomTitle,zoomLevel);
   addNewPins(populateGroup);
   $('location_selector').setStyle('visibility: hidden');
   if($('map_controls').down('.selected') != undefined){
      $('map_controls').down('.selected').toggleClassName('selected');
   }
   recreateSelectorList(populateGroup);
}

function selectorListOnclicks(group) {
   $$('#map_controls li span').each(function(elm){      
      elm.on('click', function(e, elm){
         
         if(group == null){
            populateSelectorList(group);
         }
         else {
            var groupItems = group.split(",");
            switch(elm.index){
               case 1:   populateSelectorList(null);
                         break;
               case 2:   populateSelectorList(groupItems[0]);
                         break;
               case 3:   populateSelectorList(groupItems[0] + "," + groupItems[1]);
                         break;
               case 4:   populateSelectorList(groupItems[0] + "," + groupItems[1] + "," + groupItems[2]);
                         break;
            }
         }
         
         if(elm.up('li').hasClassName('selected')){
            $('location_selector').setStyle('visibility: hidden');
         }
         else {
            if($('map_controls').down('.selected')){
               $('map_controls').down('.selected').toggleClassName('selected');
            }
            $('location_selector').setStyle('visibility: visible');
         }
         
         elm.up('li').toggleClassName('selected');
      });
   });
}

function recreateSelectorList(group){
   var level = group.split(",");
   
   $$('#map_controls ul li').each(function(elm){
      elm.remove();
   });
   
   for(var i = 0; i < level.length; i ++){
      switch(i){
         case 0:
                  var newElm = new Element('span').update(JSONList[level[0]].title);
                  newElm.index = 1;
                  $$('#map_controls ul')[0].insert(new Element('li').insert(newElm));
                  $$('#map_controls ul li')[0].insert(new Element('img', {'class':'indicator', 'width':'11', 'height':'6', 'title':'', 'alt':'', 'src':'/assets/images/fm/compare_indicator.gif'}));
                  break;
         case 1:  var newElm = new Element('span').update(JSONList[level[0]].places[level[1]].title);
                  newElm.index = 2;
                  $$('#map_controls ul')[0].insert(new Element('li').insert(newElm));
                  $$('#map_controls ul li')[1].insert(new Element('img', {'class':'indicator', 'width':'11', 'height':'6', 'title':'', 'alt':'', 'src':'/assets/images/fm/compare_indicator.gif'}));
                  break;
         case 2:  var newElm = new Element('span').update(JSONList[level[0]].places[level[1]].places[level[2]].title);
                  newElm.index = 3;
                  $$('#map_controls ul')[0].insert(new Element('li').insert(newElm));
                  $$('#map_controls ul li')[2].insert(new Element('img', {'class':'indicator', 'width':'11', 'height':'6', 'title':'', 'alt':'', 'src':'/assets/images/fm/compare_indicator.gif'}));
                  break;
      }
   }
   
   switch(level.length){
     case 1:   var newElm = new Element('span').update("Pick Country");
               newElm.index = 2;
               $$('#map_controls ul')[0].insert(new Element('li').insert(newElm));
               $$('#map_controls ul li')[1].insert(new Element('img', {'class':'indicator', 'width':'11', 'height':'6', 'title':'', 'alt':'', 'src':'/assets/images/fm/compare_indicator.gif'}));
               break;
     case 2:   var newElm = new Element('span').update("Pick Region");
               newElm.index = 3;
               $$('#map_controls ul')[0].insert(new Element('li').insert(newElm));
               $$('#map_controls ul li')[2].insert(new Element('img', {'class':'indicator', 'width':'11', 'height':'6', 'title':'', 'alt':'', 'src':'/assets/images/fm/compare_indicator.gif'}));
               break;
     case 3:   var newElm = new Element('span').update("Pick Resort");
               newElm.index = 4;
               $$('#map_controls ul')[0].insert(new Element('li').insert(newElm));
               $$('#map_controls ul li')[3].insert(new Element('img', {'class':'indicator', 'width':'11', 'height':'6', 'title':'', 'alt':'', 'src':'/assets/images/fm/compare_indicator.gif'}));
               break;
   }
   
   selectorListOnclicks(group);
}

function populateSelectorList(group){
   var count = 1;
   var list = 0;
   
   $$('#location_selector ul').each(function(elm) {
      elm.remove();
   })
   
   if(group == null){
      listToIterate = JSONList;
   }
   else {   
      var levelCheck = group.split(",");
      
      switch(levelCheck.length){
        case 1:   listToIterate = JSONList[levelCheck[0]].places;
                  break;
        case 2:   listToIterate = JSONList[levelCheck[0]].places[levelCheck[1]].places;
                  break;
        case 3:   listToIterate = JSONList[levelCheck[0]].places[levelCheck[1]].places[levelCheck[2]].places;
                  break;
        case 4:   listToIterate = JSONList[levelCheck[0]].places[levelCheck[1]].places[levelCheck[2]].places[levelCheck[3]].places;
                  break;
      }   
   }
   
   listToIterate.each(function(JSONitem){
      var link = new Element('span');
      
      if(((count - 1) % MAXCOUNT) == 0){
         $('location_selector').insert(new Element('ul'));
      }
      
      list = Math.ceil(((count) / MAXCOUNT)) - 1;
      
      if(JSONitem.resortId != null){
         link.on('click', function(){selectResort(JSONitem.resortId);});
      }
      else {
         if(group == null){
            newCount = count - 1;
            link.group = "" + newCount;
         }
         else {
            newCount = count - 1;
            link.group  = group + "," + newCount;
         }
         
         link.on('click', function(){zoomAndPopulate(JSONitem.location,zoomLevel[JSONitem.zoom],link.group)});
      }
      
      $$('#location_selector ul')[list].insert(new Element('li').insert(link.update(JSONitem.title)));
      count ++;
   });
}

function selectResort(id){
   if(chosenCompare == "One"){
      $('resort_compare').down('.potw').hide();
      var mapId = "googleMapLeft";
   }
   else {
      var mapId = "googleMapRight";
   }
   
   $('map_holder').setStyle('visibility: hidden');
   $('location_selector').setStyle('visibility: hidden');
   if($('map_controls').down('.selected') != undefined){
      $('map_controls').down('.selected').toggleClassName('selected');         
   }
   
   new Ajax.Request('http://www.freshpeaks.com/5433?resortId='+id+'&mapId='+mapId, {
      onSuccess: function(transport) {
         var transthing = transport.responseText;
         $('compareItem'+chosenCompare).update(transthing);
         
         $$('#resort_compare .controls .change').each(function(elm){
            elm.on('click', function(e, elm){
               if(elm.up('#compareItemTwo') != undefined){
                  chosenCompare = "Two";
               }
               else {
                  chosenCompare = "One";
               }
               $('map_holder').setStyle('visibility: visible');
               $('location_selector').setStyle('visibility: hidden');
            });
         });
      }
   });   
}
