// --------------------------------------------------------------------
// Author  : mashimonator
// Create  : 2010/03/17
// Update  : 2010/03/17
//         : 2010/03/19 ページ印刷に対応
// Description : 画像を遅延ロードする
// --------------------------------------------------------------------

/*@cc_on 
var doc = document;
eval('var document = doc');
@*/
var lazyload = {
	config : {
		cls : '', 
		blank : 'http://blog.koremo.org/images/common/img_blank.gif', 
		outside : true, 
		fade : true, 
		speed : 10, 
		step : 0.4 
	},
	storage : {
		screenHeight : null,
		imgs : []
	},
	initialize : function() {
		var currentTop = window.pageYOffset || document.documentElement.scrollTop || document.body.scrollTop || 0;
		var size = lazyload.getScreenSize();
		lazyload.storage.screenHeight = size.height;
		var imgs = lazyload.getTargetElements('IMG', lazyload.config.cls);
		for (var i = 0, len = imgs.length; i < len; i++) {
			var pos = lazyload.getElementPosition(imgs[i]);
			if ( lazyload.config.outside ) {
				if ( pos.top > (currentTop + lazyload.storage.screenHeight) ) {
					lazyload.setLazy(imgs[i], pos.top, true);
				}
			} else {
				if ( pos.top > (currentTop + lazyload.storage.screenHeight) ) {
					lazyload.setLazy(imgs[i], pos.top, true);
				} else {
					lazyload.setLazy(imgs[i], pos.top, false);
				}
			}
		}
		lazyload.addEvent(window, 'load', lazyload.preLoadImages);
		lazyload.addEvent(window, 'scroll', lazyload.scroll);
	},
	setLazy : function( img, top, outside ) {
		img.orgSrc = img.src;
		img.src = lazyload.config.blank;
		lazyload.storage.imgs[lazyload.storage.imgs.length] = {'img' : img, 'top' : top, 'outside' : outside, 'executed' : false};
		lazyload.setOpacity(img, 0);
	},
	scroll : function() {
		var currentTop = window.pageYOffset || document.documentElement.scrollTop || document.body.scrollTop || 0;
		var imgs = lazyload.storage.imgs;
		for (var i = 0, len = imgs.length; i < len; i++) {
			if ( ((currentTop + lazyload.storage.screenHeight) > imgs[i].top) && !imgs[i].executed ) {
				lazyload.storage.imgs[i].executed = true;
				lazyload.show(imgs[i].img);
			}
		}
	},
	show : function(img) {
		var fadeIn = function(img){
			return function(){
				var opacity = lazyload.getOpacity(img);
				if ( opacity < 10 ) {
					lazyload.setOpacity(img, (opacity + lazyload.config.step));
					window.setTimeout(fadeIn, lazyload.config.speed);
				}
			}
		}(img);
		if ( lazyload.config.fade ) {
			fadeIn();
		} else {
			lazyload.setOpacity(img, 10);
		}
	},
	preLoadImages : function() {
		var imgs = lazyload.storage.imgs;
		for (var i = 0, len = imgs.length; i < len; i++) {
			var d = document;
			d.preLoad = new Image();
			d.preLoad.src = imgs[i].img.orgSrc;
			if ( !lazyload.config.cls || lazyload.config.cls == '' ) {
				imgs[i].img.className += ' lazyLoadPrint';
			}
			imgs[i].img.src = imgs[i].img.orgSrc;
			if ( !lazyload.config.outside && !imgs[i].outside ) {
				lazyload.storage.imgs[i].executed = true;
				lazyload.show(imgs[i].img);
			}
		}
		if ( !lazyload.config.cls || lazyload.config.cls == '' ) {
			lazyload.addPrintCssRule('.lazyLoadPrint', 'filter:alpha(opacity=100)!important; opacity:1.0!important;');
		} else {
			lazyload.addPrintCssRule('.' + lazyload.config.cls, 'filter:alpha(opacity=100)!important; opacity:1.0!important;');
		}
	},
	addPrintCssRule : function ( selector, declarations ) {
		var style = document.createElement('style');
		style.setAttribute('type', 'text/css');
		style.setAttribute('media', 'print');
		document.getElementsByTagName('head')[0].appendChild(style);
		if ( lazyload.isIE() ) {
			style.styleSheet.addRule( selector, declarations );
		} else {
			style.sheet.insertRule(selector + '{' + declarations + '}', 0);
		}
	},
	isIE : function() {
		return IE='\v'=='v';
	},
	getOpacity : function( element ) {
		if ( element.alpha ) {
				return element.alpha / 10;
		} else if ( element.style ) {
			if ( element.style.opacity ) {
				return element.style.opacity * 10;
			}
		} 
		return 0;
	},
	setOpacity : function( element, opacity ) {
		element.style.opacity = opacity / 10;
		element.style.filter = 'alpha(opacity=' + opacity * 10 + ')';
		element.alpha = opacity * 10;
	},
	getScreenSize : function() {
		var w = 0;
		var h = 0;
		if ( window.innerWidth ) {
			w = window.innerWidth;
		} else if ( document.documentElement && document.documentElement.clientWidth != 0 ) {
			w = document.documentElement.clientWidth;
		} else if ( document.body ) {
			w = document.body.clientWidth;
		}
		if ( window.innerHeight ) {
			h = window.innerHeight;
		} else if ( document.documentElement && document.documentElement.clientHeight != 0 ) {
			h = document.documentElement.clientHeight;
		} else if ( document.body ) {
			h = document.body.clientHeight;
		}
		return ({ 'width': w, 'height': h });
	},
	getElementPosition : function( element ) {
		var offsetTrail = (typeof element == 'string') ? document.getElementById(element): element;
		var x = 0;
		var y = 0;
		while (offsetTrail) {
			x += offsetTrail.offsetLeft;
			y += offsetTrail.offsetTop;
			offsetTrail = offsetTrail.offsetParent;
		}
		if ( navigator.userAgent.indexOf('Mac') != -1 && typeof document.body.leftMargin != 'undefined' ) {
			x += document.body.leftMargin;
			y += document.body.topMargin;
		}
		return ({ 'left': x, 'top': y });
	},
	getTargetElements : function( tag, cls ) {
		var elements = new Array();
		var targetElements = document.getElementsByTagName(tag.toUpperCase());
		if ( !cls || cls == '' ) {
			elements = targetElements;
		} else {
			for ( var i = 0, len = targetElements.length; i < len; i++ ) {
				if ( targetElements[i].className.match(cls) ) {
					elements[elements.length] = targetElements[i];
				}
			}
		}
		return elements;
	},
	addEvent : function( target, event, func ) {
		try {
			target.addEventListener(event, func, false);
		} catch (e) {
			target.attachEvent('on' + event, (function(el){return function(){func.call(el);};})(target));
		}
	}
}
var clListener = {
	isAlreadyDetect : false,
	isAlreadyExec : false,
	funcList : [],
	add : function( func ) {
		if ( clListener.isAlreadyExec ) {
			func.call();
		} else {
			clListener.funcList.push( function(){ return func.call(); } );
		}
	},
	detectEvent : function() {
		if ( clListener.isAlreadyDetect ) {
			return;
		} else {
			clListener.isAlreadyDetect = true;
		}
		if ( document.addEventListener ) {
			document.addEventListener('DOMContentLoaded', function(){
				document.removeEventListener('DOMContentLoaded', arguments.callee, false);
				clListener.exec();
			}, false);
		} else if ( document.attachEvent ) {
			document.attachEvent('onreadystatechange', function(){
				if ( document.readyState === 'complete' ) {
					document.detachEvent('onreadystatechange', arguments.callee);
					clListener.exec();
				}
			});
			if ( document.documentElement.doScroll && window == window.top ) (function(){
				if ( clListener.isAlreadyExec ) return;
				try {
					document.documentElement.doScroll('left');
				} catch( error ) {
					setTimeout(arguments.callee, 0);
					return;
				}
				clListener.exec();
			})();
		}
	},
	exec : function() {
		if ( !clListener.isAlreadyExec ) {
			clListener.isAlreadyExec = true;
			if ( clListener.funcList ) {
				for (var i = 0, len = clListener.funcList.length; i < len; i++) {
					clListener.funcList[i].apply();
				}
				clListener.funcList = null;
			}
		}
	}
}
clListener.detectEvent();
clListener.add(lazyload.initialize);
