var siteUrl = 'http://cocoro88.jp/maplogcms/';
var themeUrl = 'http://cocoro88.jp/maplogcms/themes/cocoro88/';

var mlMaps = [];
var mlIcons = [];
var mlPoints = [];

function mapInit(){
    for(var i=0; i<mlMaps.length; i++){
        mlInitMap(mlMaps[i].id, mlMaps[i].longitude, mlMaps[i].latitude, mlMaps[i].zoom, mlMaps[i].type);
        mlIcons[1] = mlCreateIcon('http://cocoro88.jp/maplogcms/icons/default.png',27,24,3,23);
        mlIcons[12] = mlCreateIcon('http://cocoro88.jp/maplogcms/icons/88002.gif',22,20,11,10);

        var points = mlPoints[mlMaps[i].id];
        var lngMin = 180;
        var lngMax = -180;
        var latMin = 90;
        var latMax = -90;
        for(var j=0; j<points.length; j++){
            points[j].marker = mlAddMarker(points[j].longitude, points[j].latitude, points[j].popup, mlIcons[points[j].iconId]);
            
            lngMin = Math.min(lngMin, points[j].longitude);
            lngMax = Math.max(lngMax, points[j].longitude);
            latMin = Math.min(latMin, points[j].latitude);
            latMax = Math.max(latMax, points[j].latitude);
        }
        
        if(points.length>0 && mlMaps[i].autozoom==1){
            mlShowArea(lngMin, lngMax, latMin, latMax);
        }
    }
    
    mlLoadPngs();
}


function load(){
	
	// TODO: 整理
	initLayout();
	window.onresize=resizeContent;
	resizeContent();
	resumeMapSize();
	
	mapInit();
}

//--------------------------------------------------------------------------------
// Splitter control
//--------------------------------------------------------------------------------
var leftMargin = 10;
var mlMapBorder = 1;

function Splitter(owner) {
  var topFrame = mlGetEl('top-frame');
  this.topFrameHeight=topFrame.offsetHeight;
  
  var mapFrame = mlGetEl('map-frame');
  mapFrame.style.paddingTop=this.topFrameHeight+'px';
  
  var contentFrame = mlGetEl('content-frame');
  contentFrame.style.marginTop=this.topFrameHeight+'px';
  
  topFrame.style.zIndex=9999;
  this._createSplitter(owner);
  this.spDrag = false;
}

Splitter.prototype._createSplitter = function(owner) {
  this.imgSpace  = this._addImage(themeUrl + "images/splitter/sp_s.gif",0,this.topFrameHeight+3  ,8,350,owner);
  this.imgTop    = this._addImage(themeUrl + "images/splitter/sp_t.gif",0,this.topFrameHeight    ,8,3,  owner);
  this.imgCenter = this._addImage(themeUrl + "images/splitter/sp_c.gif",0,this.topFrameHeight+180,8,16, owner);
  this.imgBottom = this._addImage(themeUrl + "images/splitter/sp_b.gif",0,this.topFrameHeight+360,8,3,  owner);
}

Splitter.prototype._addImage = function(src, x, y, w, h, owner) {
  var div = document.createElement('img');
  div.setAttribute('unselectable','on');
  div.setAttribute('galleryimg','no');
  div.setAttribute('onselectstart','return false');
  div.style.position = 'absolute';
  div.style.zIndex   = 99999;
  div.style.left     = mlPx(x);
  div.style.top      = mlPx(y);
  div.style.width    = mlPx(w);
  div.style.height   = mlPx(h);
  div.style.border   = '0px none';
  div.style.MozUserSelect="none";
  div.style.cursor   = "w-resize";
  div.setAttribute('src',src);
  div.onmousedown = this.onMouseDown;
  div.splitter = this;
  owner.appendChild(div);
  return div;
}

Splitter.prototype.move = function(size) {
  size+=mlMapBorder;
  
  this.imgSpace.style.height = mlPx(size-6);
  this.imgCenter.style.top   = mlPx(size/2-5 + this.topFrameHeight);
  this.imgBottom.style.top   = mlPx(size-3 + this.topFrameHeight);
  this.imgSpace.style.left   = mlPx(size + leftMargin);
  this.imgTop.style.left     = mlPx(size + leftMargin);
  this.imgCenter.style.left  = mlPx(size + leftMargin);
  this.imgBottom.style.left  = mlPx(size + leftMargin);
}

var _draggingSplitter=null;

Splitter.prototype.onMouseDown = function(e) {
  mlStopEvent(e);
  var splitter =  this.splitter; 
  splitter.spDrag = true;
  _draggingSplitter = splitter;
  
  splitter.onMouseMoveBuf = document.onmousemove;
  splitter.onMouseUpBuf   = document.onmouseup;
  
  document.onmousemove = splitter.onMouseMove;
  document.onmouseup = splitter.onMouseUp;
}

Splitter.prototype.onMouseMove = function(e) {
  var splitter =  _draggingSplitter;
  if(splitter.spDrag) {
    e = (e) ? e : event;
    coords = mlGetPageEventCoords(e);
    size = coords.left-leftMargin - 3 - 10;
    size = size>=240 ? size : 240;
    splitter.move(size+8);
  }
}

Splitter.prototype.onMouseUp = function(e) {
  var splitter =  _draggingSplitter;
  if(splitter.spDrag) {
    splitter.spDrag=false;
    document.onmousemove =  splitter.onMouseMoveBuf;
    document.onmouseup =  splitter.onMouseUpBuf;
    
    size = parseInt(splitter.imgSpace.style.left)-leftMargin - mlMapBorder;
    resize(size, size)
  }
}

//--------------------------------------------------------------------------------
// fake frame
//--------------------------------------------------------------------------------
var DEFAULT_MAP_SIZE = 300;

function resumeMapSize() {
  var size = parseInt(getCookie("size"));
  if(isNaN(size)) {
    size = DEFAULT_MAP_SIZE;
  }
  resize(size, size);
}

function resize(w,h) {
  var splitterWidth=8;
  mlGetEl('map-frame').style.width= (w + splitterWidth - mlMapBorder) + 'px';
  mlGetEl('content-frame').style.marginLeft= (w + splitterWidth + leftMargin) + 'px';
  resizeContent();
  
  mlGetEl('map').style.width = w+'px';
  mlGetEl('map').style.height = h+'px';
  if(mlMap){
    mlSetMapSize(w, h);
  }
  
  splitter.move(w);
  setCookie("size", w, getExpDate(180,0,0), '/');
}

function resizeContent(){
  var p = 2;
  var c = mlGetEl('content-frame');
  
  var w=0;
  if(document.body.offsetWidth){
    w=document.body.offsetWidth;
  } else {
    w=window.innerWidth;
  }
  w = w-parseInt(c.offsetLeft)-p;
  
  var h=0;
  if(window.innerHeight){
    h=window.innerHeight;
  } else {
    h=document.body.parentElement.clientHeight;
  }
  h = h-parseInt(c.offsetTop)-p;
  
  mlGetEl('content-frame').style.width = mlPx(w);
  mlGetEl('content-frame').style.height = mlPx(h);
}

var splitter;

function initLayout(){
  splitter = new Splitter(mlGetEl('map-frame'));
  resumeMapSize();
}