var g_icons = [null, new GIcon(), new GIcon(), new GIcon(), new GIcon()];

g_icons[1].image = "../cmn/img/kizasido10.png";
g_icons[1].iconSize = new GSize(10, 10);
g_icons[1].iconAnchor = new GPoint(5, 5);
g_icons[1].infoWindowAnchor = new GPoint(5, 5);

g_icons[2].image = "../cmn/img/kizasido20.png";
g_icons[2].iconSize = new GSize(20, 20);
g_icons[2].iconAnchor = new GPoint(10, 10);
g_icons[2].infoWindowAnchor = new GPoint(10, 10);

g_icons[3].image = "../cmn/img/kizasido30.png";
g_icons[3].iconSize = new GSize(30, 30);
g_icons[3].iconAnchor = new GPoint(15, 15);
g_icons[3].infoWindowAnchor = new GPoint(15, 15);

g_icons[4].image = "../cmn/img/kizasido40.png";
g_icons[4].iconSize = new GSize(40, 40);
g_icons[4].iconAnchor = new GPoint(20, 20);
g_icons[4].infoWindowAnchor = new GPoint(20, 20);


var g_track_imgs = [];
var g_loaded = false;
var g_slider = null;
var g_slider_clickable = true;

var g_keywords = [
  null,
  "",
  "",
  "",
  "",
  "",
  "",
  "",
  "",
  "",
  "",
  "",
  ""
];

var g_cur_area = "Zen";

var g_map = null;
var g_map_x = 0;
var g_map_y = 0;
var g_markers = [];

function load() {
  if (GBrowserIsCompatible()) {
    g_map = new GMap2(document.getElementById("map"));
    g_map.setCenter(g_LatLngs['Zen']['latlng'], g_LatLngs['Zen']['scale']);
    g_map.addControl(new GLargeMapControl());
    g_map.addControl(new GScaleControl());
    g_map.addControl(new GMapTypeControl());
    g_map.addControl(new GOverviewMapControl());
    g_map.enableContinuousZoom();
    showSpots(g_ym[g_cur_level]);
  }
  changeRankingArea(g_ym[g_cur_level]);
  changeSliderNote(g_cur_level);

//  create_large();

  var offsets = get_map_offset();
  g_map_x = offsets[0];
  g_map_y = offsets[1];

  g_slider = new Control.Slider(
    'handle1', g_track_id,
    { axis:'vertical',
      range: $R(0,12),
      values: [0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12],
      sliderValue: g_cur_level,
      onSlide:  function(v) {
        var prev_level = g_cur_level;
        g_cur_level = parseInt(v, 10);
        flip_track(false, prev_level);
        flip_track(true, g_cur_level);
      },
      onChange: function(v) {
        set_slider(false);
        var prev_level = g_cur_level;
        g_cur_level = parseInt(v, 10);
        flip_track(false, prev_level);
        flip_track(true, g_cur_level);
        urchinTracker('/' + g_pref + '/ajax/slider/' + g_ym[g_cur_level]);
        g_markers = [];
        if (g_map) {
          g_map.clearOverlays();
        }
        changeRankingArea(g_ym[g_cur_level]);
        if (g_map) {
          showSpots(g_ym[g_cur_level]);
        }
        changeSliderNote(g_cur_level);
        setTimeout('set_slider(true)', 350);
      }
    }
  );

  g_ym.each(
    function(ym, i) {
      var month = ym.substr(4, 2);
      var obj = {};
      obj['elem'] = $('img_track_' + i);
      obj['on'] = new Image();
      obj['on'].src = '../cmn/img/slide_' + month + '_ovr.gif';
      obj['off'] = new Image();
      obj['off'].src = '../cmn/img/slide_' + month + '.gif';
      g_track_imgs.push(obj);
      g_track_imgs['_' + ym] = obj;
    });


  g_loaded = true;

  flip_track(true, g_cur_level);
  flip_arealink(true, g_cur_area);
}

function unload() {
//  keep_large();
  GUnload();
}

function set_slider(enable) {
  if (g_slider) {
    if (enable) {
      g_slider.setEnabled();
      g_slider_clickable = true;
    } else {
      g_slider.setDisabled();
      g_slider_clickable = false;
    }
  }
}


function get_map_offset() {
  var offsetTrail = document.getElementById("map");
  if (!offsetTrail) {
    return [0, 0];
  }
  var left = 0;
  var top = 0;
  while(offsetTrail) {
    left += offsetTrail.offsetLeft;
    top += offsetTrail.offsetTop;
    offsetTrail = offsetTrail.offsetParent;
  }
  return [parseInt(left, 10), parseInt(top, 10)];
}

function changeArea(new_area) {
  var prev_area = g_cur_area;
  g_cur_area = new_area;
  flip_arealink(false, prev_area);
  flip_arealink(true, g_cur_area);
  if (g_map) {
    g_map.setCenter(g_LatLngs[new_area]['latlng'], g_LatLngs[new_area]['scale']);
    show_doko_ad_center();
  }
}

function flip_arealink(is_selected, area) {
  var cname = (is_selected) ? 'selArea' : '';
  var id = 'area_' + area;
  var anc = $(id);
  if (anc) {
    anc.className = cname;
  }
}

function showSpots(year_month) {
  var req = new Ajax.Request(
    'xml/' + year_month + '/spots.xml',
    {
      method: 'get',
      parameters: '',
      asynchronous: true, 
      onSuccess: function(orig) {
        var xmlDoc = orig.responseXML;
        if (!xmlDoc.documentElement) {
          return;
        }
        var htmlDoc = xmlDoc.getElementsByTagName('content')[0];
        if (!htmlDoc) {
          return;
        }
        var spotlist = eval(htmlDoc.firstChild.nodeValue);
        spotlist.each(function(v, i) {
          if (i == 0) {
            disableTrack = true;
          } else {
            disableTrack = false;
          }
          var marker = markSpot2(v, year_month, disableTrack);
          g_markers.push(marker);
        });
        if (g_markers.length > 0) {
          openSpotInfo(1, true);
          g_map.removeOverlay(g_markers[0]);
          g_markers[0] = markSpot2(spotlist[0], year_month, false);
          markSpot2(spotlist[0], year_month);
        }
      },
      onFailuer: function(orig) {
        // do nothing
      }
    }
  );
}

function markSpot2(spot, ym, disableTrack) {
  var rank = spot['rank'];
  var size = spot['size'];
  var id = spot['id'];
  var dir_no = id.substr(id.length - 2, 2);

  var title = rank + "位 " + spot['name'];

  var year = parseInt(ym.substr(0, 4), 10);
  var month = parseInt(ym.substr(4, 2), 10);

  var latlng = new GLatLng(spot['lat'], spot['lng']);
  var marker = new GMarker(latlng, {icon: g_icons[size], title: title});
  g_map.addOverlay(marker);
  
  GEvent.addListener(marker, "click", function(){
    var xmlpath = 'xml/spot/' + dir_no +  '/' + id + '.xml';
    var req = new Ajax.Request(
      xmlpath,
      {
        method: 'get',
        parameters: '',
        onSuccess: function(orig) {
          if (!disableTrack) {
            urchinTracker('/' + g_pref + '/' + xmlpath);
          }
          var xmlDoc = orig.responseXML;
          if (!xmlDoc.documentElement) {
            return;
          }
          var htmlDoc = xmlDoc.getElementsByTagName('content')[0];
          if (!htmlDoc) {
            return;
          }
          var htmlStr = htmlDoc.firstChild.nodeValue.replace('__YM__', ym) ;
          htmlStr = htmlStr.replace('__YEAR__', year);
          htmlStr = htmlStr.replace('__MONTH__', month);
          htmlStr = htmlStr.replace('__RANK__', rank);
          marker.openInfoWindowHtml(htmlStr, {maxWidth: 320});
          show_doko_ad_overlay(marker, latlng);
        },
        onFailuer: function(orig) {
          // do nothing
        }
      }
    );
  });

  return marker;
}

function changeSliderNote(level) {
  var month = parseInt(g_ym[level].substr(4, 2), 10);
  var note = ''
  if (0 < month && month < 13) {
    note = g_keywords[month];
  }
  obj = document.getElementById('slider_note');
  if (obj) {
    obj.innerHTML = note;
  }
}

function changeRankingArea(year_month) {
  var req = new Ajax.Request(
    'xml/' + year_month + '/sidebar_top.xml',
    {
      method: 'get',
      parameters: '',
      asynchronous: true, 
      onSuccess: function(orig) {
        var xmlDoc = orig.responseXML;
        if (!xmlDoc.documentElement) {
          return;
        }
        var htmlDoc = xmlDoc.getElementsByTagName('content')[0];
        var rankArea = document.getElementById('topRankArea');
        if (!htmlDoc || !rankArea) {
          return;
        }
        var htmlStr = htmlDoc.firstChild.nodeValue.replace(/__TO_ROOT__/g, g_to_root);
        rankArea.innerHTML = htmlStr;
      },
      onFailuer: function(orig) {
        // do nothing
      }
    }
  );
}

function openSpotInfo(rank, no_move) {
  if (g_map && g_markers && g_markers.length >= rank) {
    var offset = rank - 1;
    var marker = g_markers[offset];
    GEvent.trigger(marker, 'click');
    if (! no_move) {
      window.scroll(g_map_x, g_map_y);
    }
  }      
}

function flip_track(is_over, zidx) {
  if (g_loaded) {
    var stat = (is_over) ? 'on' : 'off';
    var obj = g_track_imgs[zidx];
    if (!is_over && zidx == g_cur_level) {
      return;
    }
    if (obj && obj['elem']) {
      obj['elem'].src = obj[stat].src;
    }
  }
}

function track_mousedown(obj, evt) {
  var evt = (evt) ? evt : ((event) ? event : null);
  if (evt) {
    var elem = (evt.target) ? evt.target : evt.srcElement;
    if (elem == obj) {
      if (evt.preventDefault) {
        evt.preventDefault();
      }
      evt.returnValue = false;
      evt.cancelBubble = true;
      if (g_slider && g_slider_clickable) {
        set_slider(false);
        var level = parseInt(elem.id.split('_')[2], 10);
        g_slider.setValue(level);
      }
    }
  }
}