/*
* Google Mapsの生成
* @param string id マップを埋め込むdivのid要素
* @param double latitude 緯度
* @param double longitude 経度
* @author $Author: yayoi $
* @version $Rev: 7623 $
* @date $Date: 2008-07-04 14:29:45 +0900 (金, 04 7 2008) $
*
*/

var map;
var markers = [];
var commentVote = [];
var open_marker = false;
var voteLabel = 'すげぇ!';

function loadMap(id, latitude, longitude) {
  if (GBrowserIsCompatible()) {
    //初期化処理
    map = new GMap2(document.getElementById(id));
    //スケールコントローラ表示
    map.addControl(new GSmallZoomControl());
    //デフォルト中心地の設定
    map.setCenter(new GLatLng(35.00205426142815, 134.99770939350128), 5);

    if(!latitude || !longitude) {
      window.alert('NO FOOTPRINT');
      return;
    }

    var pos = new GLatLng(latitude, longitude);
    map.setCenter(pos, 15);

    var marker = new GMarker(pos);
    map.addOverlay(marker);
    GEvent.addListener(marker, "click", function(){
      map.panTo(marker.getPoint());
    });
  }
}

function loadThemeMap(id, data) {
  if (GBrowserIsCompatible()) {
    //初期化処理
    map = new GMap2(document.getElementById(id));
    //デフォルト中心地の設定
    map.setCenter(new GLatLng(35.00205426142815, 134.99770939350128), 5);
    //スケールコントローラ表示
    map.addControl(new GLargeMapControl());
    //マップモード(地図・衛星・ハイブリッド)コントローラ表示
    map.addControl(new GMapTypeControl());
    //縮尺表示
    map.addControl(new GScaleControl());
    //俯瞰地図表示
    var overviewMap = new GOverviewMapControl();
    map.addControl(overviewMap);
    //overviewMap.hide(true);
    // 地図dclick時にズームインする設定を無効化
    map.disableDoubleClickZoom();
  }
}

function getInfoWindowHtml(json) {
  var point_name = json['Comment'].point_name;
  var comment = json['Comment'].comment;
  var comment_id = json['Comment'].id;
  var user = json['User'].nick_name;
  var date = json['Comment'].created;
  var image_id = json['Image'].id;
  var theme_id = json['Comment'].theme_id;
  var display_id = json['Comment'].display_id;

  var vote_allow_user = json['Comment'].vote_allow_user;
  var login_user = json['Comment'].login_user;
  var mikke_title = json['Comment'].mikke_title;

  if(mikke_title == '') {
    mikke_title = 'みっけ';
  }

  var point_part = '';
  if(point_name) {
    point_part = '<li><a href="/zensen/comments/theme/'+theme_id+'/'+display_id+'#'+display_id+'">' + point_name + 'で' + mikke_title+ '</a></li>';
  }

  var vote_count = 0;
  var vote_count_decoration = 0;
  if(commentVote[comment_id]) {
    vote_count = commentVote[comment_id];
    vote_count_decoration = decorateVoteCount(commentVote[comment_id]);
  }
  
  // すげぇ可能ユーザーの場合にのみボタン表示
  var vote_button;
  
  if(vote_allow_user == '' || (vote_allow_user != '' && vote_allow_user == login_user)) {
    vote_button = '<a href="javascript:void(0)" onclick="baloonClick('+comment_id+')"><span>'+voteLabel+'</span></a>';
  } else {
    vote_button = '<span>'+decorateVoteCount(voteLabel)+'</span>';
  }
  
  var html = ['<dl class="GMapBalloonType1">',
              '<dt>',user,'</dt>',
              '<dd>',
              '<ul>',
              point_part,
              '<li>',date,'</li>',
              '</ul>',
              '<p class="Txt">',comment,'</p>',
              '<p class="Img">',
              '<a rel="lightbox" href="/zensen/images/thumb/image/'+image_id+'/800" onclick="myLightbox.start(this); return false;">',
              '<img src="/zensen/images/thumb/image/'+image_id+'/120/clip" width="120" height="120"/></a>',
              '</p>',
              '<p class="Vote">',
              '<span id="baloon_vote_'+comment_id+'" count="'+vote_count+'">',
              vote_count_decoration,
              '</span>',
              vote_button,
              '</p>',
              '</dd>',
              '</dl>'].join('');
  return html;
}



function createMarker(json){
  var lat = json['Comment'].latitude;
  var lng = json['Comment'].longitude;
  var image_id = json['Image'].id;
  var frame_color = json['Comment'].area_color;

  if(markers[image_id]) {
    return null;
  }

  var myicon = new GIcon();
  myicon.image="/zensen/images/thumb/image/"+image_id+"/50/frameclip/" + frame_color;
  myicon.iconSize = new GSize(50,50);
  myicon.iconAnchor = new GPoint(25,25);
  myicon.infoWindowAnchor = new GPoint(25,0);
  var marker = new GMarker(new GLatLng(lat, lng), myicon);
  marker.truePoint = new GLatLng(lat, lng);
  marker.image_id = image_id;
  marker.json = json;
  commentVote[json['Comment'].id] = json['Comment'].vote;
  markers[image_id] = marker;

  GEvent.addListener(marker, "click", function(){
    marker.openInfoWindowHtml(getInfoWindowHtml(marker.json));
  });
  GEvent.addListener(marker, 'infowindowopen', function(){
    open_marker = marker.image_id;
  });
  GEvent.addListener(marker, 'infowindowclose', function(){
    open_marker = false;
  });
  
  return marker;
}


function setMarker(jsonData, statusCode){
  var json = eval(jsonData);

  for (var i = 0, len = json.length; i < len; i++) {
    var marker = createMarker(json[i]);
    if(marker) {
      map.addOverlay(marker);
    }
  }

  GEvent.addListener(map, 'zoomend', refreshMarker);
  setDefaultCenter(json);
}

function setAdditionalMarker(jsonData, statusCode){
  var json = eval(jsonData);

  for (var i = 0, len = json.length; i < len; i++) {
    var marker = createMarker(json[i]);
    if(marker) {
      map.addOverlay(marker);
    }
  }
}

/* 地図のデフォルトを最初の30個のミッケが収まるように調整 */
function setDefaultCenter(data) {
  var gb;
  for(var i=0; i< data.length; i++) {
    if(i > 30) {
      break;
    }
    if(gb == null) {
      var dummy = new GLatLng(data[i]['Comment'].latitude, data[i]['Comment'].longitude);
      gb = new GLatLngBounds(dummy, dummy);
    }else {
      gb.extend(new GLatLng(data[i]['Comment'].latitude, data[i]['Comment'].longitude));
    }
  }
  if(gb) {
    var zoom = map.getBoundsZoomLevel(gb);
    map.setCenter(gb.getCenter(), zoom);
  }
}

function mikkeDitect() {
  var els = document.getElementsByClassName('mikkeEntry');
  if(!els) return;
  for(var i=0, len=els.length; i<len; i++) {
    Event.observe(els[i], 'click', popup);
  }
}

function popup(event) {
  var element = Event.element(event);
  
  //投票ボタンが押された場合,カウントアップを重なるため吹き出し表示のタイミングをずらす
  var elementClass = element.getAttribute('class');
  if(elementClass && elementClass == 'voteBtn' && !element.delay) {
    element.delay = 1;
    setTimeout( function(){ popup(event); }, 100);
    return;
  }
  element.delay = 0;
  
  var refer_id = element.getAttribute('ref');
  while(!refer_id && element.parentNode) {
    element = element.parentNode;
    refer_id =element.getAttribute('ref');
  }
  if(!refer_id) {
    return;
  }
  if(markers[refer_id]) {
    //クリック状態か確認
    if(!markers[refer_id].click) {
      GEvent.trigger(markers[refer_id], 'click');
    }
    //他のマーカのクリック状態を解除
    for(var i=0, len = markers.length; i<len; i++) {
      if(!markers[i])continue;
      markers[i].click = 0;
    }
    //クリック状態設定
    markers[refer_id].click = 1;
  }
}

/* 重なるマーカーをバラす */
function getZoomLength(level) {
  var zoom_level = map.getZoom();
  if(level) {
    zoom_level = level;
  }

  if(zoom_level % 3 == 2) {
    var p = parseInt((14 - zoom_level) / 3);
    var r = 500*Math.pow(10, p);
  }else if(zoom_level % 3 == 1) {
    var p = parseInt((16 - zoom_level) / 3);
    var r = 100*Math.pow(10, p);
  }else {
    var p = parseInt((15 - zoom_level) / 3);
    var r = 200*Math.pow(10, p);
  }
  
  return r;
}

var MARK_MODE_CHANGE_LEVEL = 7;
function refreshMarker() {
  for(var i = 0, len = markers.length; i< len; i++) {
    if(!markers[i]) continue;
    markers[i].plot = false;
  }
  
  if(map.getZoom() < MARK_MODE_CHANGE_LEVEL) {
    singleMarker();
  }else {
    scatterMarker();
  }

  if(open_marker) {
    GEvent.trigger(markers[open_marker], 'click');
  }

}

var SUMARIZE_SEED = 0.2;
function singleMarker() {
  var zoom_level = map.getZoom();

  var area_r = getZoomLength() * SUMARIZE_SEED;
  
  for(var i = 0, len = markers.length; i < len; i++) {
    if(!markers[i]) continue;
    if(markers[i].plot) continue;

    markers[i].setPoint(markers[i].truePoint);
    var scatter_num = 0;
    var t = 1;
    for(var j = i+1; j < len; j++) {
      if(!markers[j]) continue;
      if(markers[j].plot) continue;
      if(markers[i].truePoint.distanceFrom(markers[j].truePoint) > area_r) continue;
      markers[j].setPoint( markers[i].truePoint );
      markers[j].plot = true;
      scatter_num++;
    }
  }
}

var FIRST_RING_NUM = 6;
var MAX_RING_COUNT = 2;
var SCATTER_SEED = 0.55;
function scatterMarker() {
  var zoom_level = map.getZoom();
  
  var k = 2;
  if(zoom_level < 9) {
    k = 1;
  }
  var area_r = getZoomLength() * k;
  
  var scatter_len = Math.pow(SCATTER_SEED, zoom_level-5);
  
  for(var i = 0, len = markers.length; i < len; i++) {
    if(!markers[i]) continue;
    if(markers[i].plot) continue;

    markers[i].setPoint(markers[i].truePoint);
    var scatter_num = 0;
    var t = 1;
    for(var j = i+1; j < len; j++) {
      if(!markers[j]) continue;
      if(markers[j].plot) continue;
      if(markers[i].truePoint.distanceFrom(markers[j].truePoint) > area_r) continue;
      var ring_max = FIRST_RING_NUM / 2 * t* (t +1);
      if(scatter_num > ring_max) {
        t++;
        if(t > MAX_RING_COUNT+1) {
          t = 1;
        }
      }
      markers[j].setPoint( new GLatLng(markers[i].truePoint.lat() + Math.cos(scatter_num*Math.PI/(FIRST_RING_NUM/2*t) + Math.PI/7*t)* scatter_len  * t, 
                                      markers[i].truePoint.lng() + Math.sin(scatter_num*Math.PI/(FIRST_RING_NUM/2*t) + Math.PI/7*t)* scatter_len * t));
      markers[j].plot = true;
      scatter_num++;
    }
  }
}

var Pager = function(uri) {
  this.pageUri = uri;
  this.page_nums = 1;
  this.content = 'global';
  this.current_page = 1;
  
  this.showPage = function(pg) {
    var current_element = $(this.content+'_mikke_'+this.current_page);
    this.current_page+=pg;
    if($(this.content+'_mikke_'+this.current_page)) {
      current_element.style.display = 'none';
      $(this.content+'_mikke_'+this.current_page).style.display = '';
      mikkeDitect();
      return;
    }

    var target_element_name = this.content+'_mikke';
    new Ajax.Request(
      this.pageUri,
      {
        method: 'get',
        parameters: 'page='+this.current_page+'&content='+this.content,
        onSuccess: function(obj){
          if(current_element)
            current_element.style.display = 'none';
          new Insertion.Bottom(target_element_name, obj.responseText);
          mikkeDitect();
        }
       }
    );
  }
  this.showPrev = function() {
    if(this.current_page > 1) {
      this.showPage(-1);
    }
  }
  this.showNext = function() {
    if(this.current_page < this.page_nums) {
      this.showPage(1);
    }
  }
}

function baloonClick(id){
  var form = $('baloonform');
  form.id.value = id;
  vote(form);
}


function vote(form) {
  //カウンターをポップアップ
  var popCounter = function(element) {
    if(!element.oldStyle) {
      element.oldStyle = {
        top: element.getStyle('top'),
        left: element.getStyle('left')};
    }

    var distance = 3;
    var duration = 0.2;
    new Effect.Move(element, 
      {x:0, y:-distance, duration:duration/2, afterFinishInternal: function(effect){
          new Effect.Move(effect.element, 
            {x:0, y:distance, duration:duration/2, afterFinishInternal: function(effect){
                effect.element.undoPositioned().setStyle(element.oldStyle);
              }});
        }});
  };

  //マーカー用カウントアップ
  if(commentVote) {
    if(!commentVote[form.id.value]) {
      commentVote[form.id.value] = 0;
    }
    commentVote[form.id.value]++;
  }

  //カウントアップ効果
  var countUp = function(element) {
    var vote_count = parseInt(element.getAttribute('count'))+1;
    element.setAttribute('count', vote_count);

    element.innerHTML = decorateVoteCount(vote_count);
    //popCounter(element);
  };
  if($('weekly_most_vote_'+form.id.value)) {
    countUp($('weekly_most_vote_'+form.id.value));
  }
  if($('most_vote_'+form.id.value)) {
    countUp($('most_vote_'+form.id.value));
  }
  if($('vote_'+form.id.value)) {
    countUp($('vote_'+form.id.value));
  }
  if($('personal_vote_'+form.id.value)) {
    countUp($('personal_vote_'+form.id.value));
  }
  if($('baloon_vote_'+form.id.value)) {
    countUp($('baloon_vote_'+form.id.value));
  }

  form.vote_count.value = parseInt(form.vote_count.value) + 1;
  setTimeout( function(){ sendVote(form); }, 1000);
}

function sendVote(form) {
  if(form.vote_count.value > 0) {
    new Ajax.Request(
      '/zensen/comments/vote',
      {
        method: 'post',
        parameters: Form.serialize(form)
        }
    );
    form.vote_count.value = 0;
  }
}

function decorateVoteCount(vote_count) {
  var innerSpan = '';
  if(vote_count > 10) {
    var x = [];
    var y = vote_count
    while(y > 10) {
      var yy = Math.floor(y / 10);
      x.push(y - yy*10);
      y = yy;
    }
    x.push(y);
    x.reverse();
    var zorome = x[0];
    var renban = x[0];
    for(var i=1, len=x.length; i < len; i++) {
      if(zorome != x[i]) zorome = -2;
      if(++renban != x[i]) renban = -2;
    }
    if(zorome > 0) {
      innerSpan = '<span class="VoteCntPair">'+vote_count+'</span>';
    }else if(renban > 0 && renban < 10) {
      for(var i=0, len=x.length; i<len; i++) {
        innerSpan += '<span class="VoteCntSeq'+x[i]+'">'+x[i]+'</span>';
      }
    }else {
      innerSpan = '<span class="VoteCnt">'+vote_count+'</span>';
    }
  }else {
    innerSpan = '<span class="VoteCnt">'+vote_count+'</span>';
  }
  return innerSpan;
}