//拡大画像を格好良く表示させる。


var objImage = new Image();
var marginw = 1;
var loopeDisable = false;
var _mesh;
var _largeImage;
var _document;
var _loope;
var _rightInfo;

function initializeLoope(){
	_mesh = $('#mesh');
	_largeImage = $('#largeimage');
	_loope = $('#loope');
	_rightInfo = $('#rightinfo');
	_document = document;
}

/*
var _mousex;
var _mousey;
var _imagew;
var _imageh;
var _meshw;
var _meshh;
var _meshx;
var _meshy;
function calclate(absolute_mousex,absolute_mousey){
	_mousex = absolute_mousex - _largeImage.offset().left;
	_mousey = absolute_mousey - _largeImage.offset().top;
	imagew = _largeImage.width();
	imageh = _largeImage.height();
	_meshw = _mesh.width();
	_meshh = _mesh.height();
	_meshx = _mousex - (_meshw/2);
	_meshy = _mousey - (_meshh/2);

}
*/
// 画像の上にメッシュを表示する
function showMesh(absolute_mousex, absolute_mousey){
	_mesh.show();
	var mousex = absolute_mousex - _largeImage.offset().left;
	var mousey = absolute_mousey - _largeImage.offset().top;
	var imagew = _largeImage.width();
	var imageh = _largeImage.height();
	var meshw = _mesh.width();
	var meshh = _mesh.height();
	var meshx = mousex - (meshw/2);
	var meshy = mousey - (meshh/2);
	
	meshx = meshx < marginw ? marginw : meshx;
	meshy = meshy < marginw ? marginw : meshy;
	meshx = meshx > imagew-meshw-marginw ? imagew-meshw-marginw : meshx;
	meshy = meshy > imageh-meshh-marginw ? imageh-meshh-marginw : meshy;

	_mesh.css("left",Math.round(meshx));
	_mesh.css("top", Math.round(meshy));
}

// 拡大画像を表示する
function showLoope(){
	var srcImagew = objImage.width;
	var srcImageh = objImage.height;
	var imagew = _largeImage.width();
	var imageh = _largeImage.height();
	var ratex = srcImagew/imagew;
	var ratey = srcImageh/imageh;
	var meshx = _mesh.position().left;
	var meshy = _mesh.position().top;
	var srcx = meshx*ratex;
	var srcy = meshy*ratey;
	var canvasw = _rightInfo.width();
	var canvash = _rightInfo.height();

	_rightInfo.hide();
	_loope.css('background-image','url('+objImage.src+')');
	_loope.css("background-repeat","no-repeat");
	_loope.css('background-position','-'+Math.round(srcx)+'px '+'-'+Math.round(srcy)+'px');
	_loope.width(Math.round(canvasw));
	_loope.height(Math.round(canvash));
	_loope.show();
}

// onmousemoveイベント
function loopeMove(e){
	if(loopeDisable){return;}
	showMesh(e.pageX,e.pageY);
	showLoope();
}

// onmouseoverイベント
function loopeIn(e){
	if(loopeDisable){return;}
	objImage.src = _largeImage.attr('src');
	var srcImagew = objImage.width;
	var srcImageh = objImage.height;
	var imagew = _largeImage.width();
	var imageh = _largeImage.height();
	var canvasw = _rightInfo.width();
	var canvash = _rightInfo.height();
	var meshw = (imagew*canvasw)/srcImagew;
	var meshh = (imageh*canvash)/srcImageh;

	_mesh.width(Math.round(meshw));
	_mesh.height(Math.round(meshh));
	_mesh.css("z-index",500);
	showMesh(e.pageX,e.pageY);
	showLoope();
}

// onmouseoutイベント
function loopeOut(){
	_mesh.hide();
	_loope.hide();
	_rightInfo.show();
}

function change(image) {
	var imgbox = _document.getElementById("largeimage");
	image = image.replace("/thumb/","/");
	imgbox.src = image;
//	$('#loope').css("backgound-image",image);
//	loopeDisable = (image.search(/03\.jpe?g/i) != -1);
}

