/**
 * 已加截的图片
 */
var loaded_image_idx = 1,
/**
 * 图片节点
 */
image_node = 0,
/**
 * 图片目录
 */
image_did = 0,
/**
 * 图片总数
 */
image_count = 0,
/**
 * 加载图片使用时间
 */
load_img_used_time = 0,
/**
 * 定时器变量
 */
timeVar = null,
/**
 * 图片盒子
 */
loaded_image_box = {};

/**
 * 加载图片计时器
 */
function load_img_used_time_counter()
{
	load_img_used_time++;
	if(loaded_image_idx > image_count)
	{
		clearInterval(timeVar);
		load_img_used_time = 0;
	}
	else if(load_img_used_time > 6)
	{
		var obj = "image-"+loaded_image_idx;
		obj = document.getElementById(obj);
		show_image_error(obj);
	}
	console.log(load_img_used_time);
}

/**
 * 分屏加载图片
 * @DIR 图片目录对象
 */
function limit_to_load_image (DIR)
{
	var s_top = document.documentElement.scrollTop || document.body.scrollTop;
	var pNow = DIR['pidx'] - 1 * DIR['pSize'];
	if(pNow > DIR['fcount'] || typeof loaded_images[ DIR['pidx'] ] != 'undefined')
	{
		return;
	}
		
	s_top += document.documentElement.clientHeight;
	console.log (s_top);
	console.log(document.documentElement.scrollHeight);
	if (s_top >= document.documentElement.scrollHeight )
	{				
		var DIV = document.getElementsByTagName('DIV'),tpl =  null;
		for(var i in DIV)
		{
			if(DIV[i].getAttribute("name") == 'preview-box')
			{
				tpl = DIV[i].cloneNode(true);
				break;
			}
		}
		loaded_images[ DIR['pidx'] ] = 1;
		++DIR['pidx'];
	}
}

/**
 * 显示加载完成的漫画图片
 * @Obj 图片对象
 */
function show_loaded_image(Obj)
{
	var DIV = Obj.parentNode.parentNode.getElementsByTagName("DIV");
	load_img_used_time = 0;
	clearInterval(timeVar);
	
	for(var i = 0; i < DIV.length; i++)
	{
		if(typeof(DIV[i]) != 'object')
		{
			return;
		}
		
		switch(DIV[i].getAttribute("name"))
		{
			case "loading":
				DIV[i]['style']['display'] = 'none';
				break;
			
			case "preview":
				DIV[i]['style']['display'] = 'block';
				if(Obj.width < 1200)
				{
					DIV[i]['style']['width'] = Obj.width+'px';
					DIV[i]['style']['margin'] = '0 auto';
					DIV[i]['style']['float'] = 'none';
				}
				else
				{
					Obj['style']['width'] = '100%';
				}
				
				var imageBoxHeight = parseInt(document.getElementById("image-box")['style']['height'].replace('px',''));
				if( isNaN(imageBoxHeight) )
				{
					imageBoxHeight = 0;
				}
				console.log(Obj.height);
				document.getElementById("image-box")['style']['height'] = imageBoxHeight + (DIV[i].parentNode.clientHeight - 340) + 'px';
				break;
		}		
	}

	++loaded_image_idx;
	if(loaded_image_idx <= image_count)
	{
		if(loaded_image_idx > 1 && loaded_image_idx < image_count && ((loaded_image_idx - 1) % 2) == 0)
		{
			DIV = document.getElementById('loading-more');
			if( typeof DIV != 'object' || DIV == null)
			{
				DIV = document.createElement('DIV');
				DIV.setAttribute("id","loading-more");
				DIV['style']['cssText'] = "display:none;height:50px;width:400px;margin:0 auto;cursor:pointer;text-align:center;background-color:#e9e9e9;line-height:45px;font-size:20px;color:#222;";
				DIV.innerHTML = "&gt;&gt;&gt;手机向上拉加载&gt;&gt;&gt;";
				DIV.onclick = function(){
					DIV["style"]["display"] = "none";
					loadIMG();
				}
				document.getElementById("loading-more-box").appendChild(DIV);
			}
			else
			{
				DIV["style"]["display"] = "none";
			}
		}
		else
		{
			loadIMG();
		}
	}
}

function scroll_to_load_image()
{
	if(loaded_image_idx == 1 || loaded_image_idx > image_count)
	{
		return;
	}
	
	var s_top = document.documentElement.scrollTop || document.body.scrollTop;
	var DIV = document.getElementById("image-box").lastChild;
	if(typeof DIV != 'object' || DIV == null)
	{
		return;
	}
	s_top += DIV.clientHeight;
	console.log ("s_top => "+ s_top );
	console.log (DIV.offsetTop );
	if(s_top >= DIV.offsetTop)
	{
		loadIMG()
	}
}

function show_image_error(obj)
{
	var DIV = document.getElementById('img-err-tip-box'),W = 0,H = 0,T=0;
	if( typeof DIV == 'undefined' || DIV == null)
	{
		DIV = document.createElement("DIV");
		DIV.setAttribute("id","img-err-tip-box");
		DIV['style']['display'] = 'none';
		DIV.setAttribute("class","img-err-tip-box");
		DIV.innerHTML = '<div class="title">图片加载失败了！你可以点击<span>这里</span>重新加载</div><div class="qq-group">如果问题仍未解决，请加漫画讨论群(129602305)报错</div>';
		obj.parentNode.parentNode.parentNode.appendChild(DIV);
	}
	clearInterval(timeVar);
	load_img_used_time = 0;	
	DIV['style']['display'] = "block";
	W = DIV.parentNode.parentNode.clientWidth;
	H = obj.parentNode.parentNode.clientHeight;
	T = obj.parentNode.parentNode.offsetTop;

	DIV['style']['left'] = (W-DIV.clientWidth)/2 + 'px';
	DIV['style']['top'] = T + (H-DIV.clientHeight)/2 + 'px';
	DIV.getElementsByTagName("SPAN")[0].onclick=function()
	{
		var SRC = obj.getAttribute("src").split("?")[0];
		SRC += "?" + new Date().getTime();
		obj.setAttribute("src",SRC);
		DIV['style']['display'] = "none";
		timeVar = setInterval(load_img_used_time_counter,1000);
	}
}

/**
 * 加载图片
 */
function loadIMG()
{
	var imageIdx = 0
	,divIdx = "preview-box-"+loaded_image_idx
	,IMG = null
	,uri = null
	,DIV = document.getElementById(divIdx);
	if(typeof DIV == 'object' && DIV != null)
	{
		return;
	}
	DIV = document.getElementById("preview-box-0").cloneNode(true);
	image_count = parseInt(DIV.getAttribute("count"));
	
	uri = [
		loaded_image_idx,
		DIV.getAttribute("did"),
		DIV.getAttribute("node")
	].join("-");
	uri = "/image/"+uri+".htm";
	
	DIV.removeAttribute("count");
	DIV.removeAttribute("did");
	DIV.removeAttribute("node");
		
	IMG = DIV.getElementsByTagName('img')[0];
	imageIdx = "image-"+loaded_image_idx;
	IMG.setAttribute("id",imageIdx);
	
	DIV.getElementsByTagName('DIV')[0].innerHTML = loaded_image_idx+'/'+image_count;
	DIV.setAttribute("id",divIdx);
	document.getElementById("image-box").appendChild(DIV);
	
	DIV["style"]["display"] = "block";
	IMG.setAttribute("src",uri);
	timeVar = setInterval(load_img_used_time_counter,1000);
	
	var imageBoxHeight = parseInt(document.getElementById("image-box")['style']['height'].replace('px',''));
	if( isNaN(imageBoxHeight) )
	{
		imageBoxHeight = 0;
	}
	document.getElementById("image-box")['style']['height'] = imageBoxHeight + DIV.clientHeight + 'px';
}

(function(){
	/*var tpl = document.getElementById("preview-box-0");
	var DIV = tpl.cloneNode(true);
	image_count = parseInt(tpl.getAttribute("count"));
	image_node = parseInt(tpl.getAttribute("node"));
	image_did = parseInt(tpl.getAttribute("did"));
	console.log(image_count);
	console.log(image_node);
	console.log(image_did);
	return;
	DIV.setAttribute("id",

	DIV = document.getElementById();
	DIV["style"]["display"] = "block";
	var IMG = document.getElementById("image-"+loaded_image_idx);
	IMG.setAttribute("src",DIV.getAttribute("image-uri") );
	timeVar = setInterval(load_img_used_time_counter,1000);*/
	window.onscroll=function()
	{
		scroll_to_load_image();
	}
	loadIMG();
})();