/*
 * Androidでposition:fixedを利用する場合は、<meta name="viewport" content="user-scalable=no" />が必要
 * ただし、user-scalable=noとposition: fixedを使用すると、-webkit-transformが動かなくなる
 * version 1.0.4
 */
function  Gallery() {
	this.initialize.apply(this, arguments);
}
Gallery.prototype = {
	initialize:function(propertyList) {
		this._isSupportPositionFixed = this._isSupportPositionFixed();
		this._imageList = new Array();
		this._property = {
			 'Id': 'gallerry'			//ポップアップのID
			,'TargetClass': 'img_link'	//ポップアップ化するaタグに付加したクラス
			,'MaskAlplha': 50			//ポップアップ時マスクアルファ値
			,'FadeCount': 10			//フェード処理分割回数
			,'FadeRefreshTime': 50		//フェード処理更新間隔
			,'IsNextBack': true			//Next/Backを利用するかどうか
			,'Text': {
				 'Next': 'NEXT'
				,'Back': 'PREV'
				,'Close': '閉じる'
			}
		};
		this._doFade = false;
		this._nextBt = null;
		this._backBt = null;

		for(key in propertyList) {
			this._property[key] = propertyList[key];
		}

		var aTagList = document.getElementsByTagName('a');
		if(aTagList.length > 0) {
			for(var i=0; i < aTagList.length; i++) {
				if(aTagList[i].className != ''
				&& aTagList[i].className.indexOf(this._property['TargetClass']) >= 0) {
					var classNameList = aTagList[i].className
						.replace(/(?:^[\x09\x0A\x0C\x0D\x20]+)|(?:[\x09\x0A\x0C\x0D\x20]+$)/g, "")
						.split(/[\x09\x0A\x0C\x0D\x20]+/);
					for(var j=0; j < classNameList.length; j++) {
						if(classNameList[j] == this._property['TargetClass']) {
							var src = aTagList[i].getAttribute('href');
							if(src && src != "") {
								aTagList[i].myObj = this;
								aTagList[i].removeAttribute('target');
								aTagList[i].setAttribute('Index', this._imageList.length);
								aTagList[i].onclick = function() {
									this.myObj.onPopup(this.getAttribute('Index'));
									return false;
								};
								this._imageList.push(src);
								break;
							}
						}
					}
				}
			}
		} else {
			return;
		}


		window.myObj = this;
		window.onresize=function() {
			this.myObj._setPos();
		};

		document.write('<div id="'+this._property['Id']+'Bg" class="Bg"></div>');
		document.write('<div id="'+this._property['Id']+'" class="Popup"></div>');
		this._bg = document.getElementById(this._property['Id']+'Bg');
		if(this._isSupportPositionFixed) {
			this._bg.style.position = 'fixed';
		} else {
			this._bg.style.position = 'absolute';
			window.onscroll=function() {
				this.myObj._setPos();
			};
		}
		this._bg.style.display='none';
		this._bg.style.visibility='hidden';
		this._bg.myObj = this;
		this._bg.onclick = function() {
			this.myObj.closePopup();
			return false;
		};

		this._popup = document.getElementById(this._property['Id']);
		if(this._isSupportPositionFixed) {
			this._popup.style.position = 'fixed';
		} else {
			this._popup.style.position = 'absolute';
			window.onscroll=function() {
				this.myObj._setPos();
			};
		}
		this._popup.style.display='none';
		this._popup.style.visibility='hidden';

		this._imgAreaSrc = '';
		this._imgArea = document.createElement('img');
		this._imgArea.myObj = this;
		this._imgArea.onclick = function() {
			this.myObj.closePopup();
			return false;
		};

		var obj1 = document.createElement('div');
		this._closeBtArea = obj1;
		obj1.id = this._property['Id']+'CloseBtArea';
		obj1.setAttribute('class', 'CloseBtArea');
		obj1.setAttribute('className', 'CloseBtArea');	//IE
		var obj2 = document.createElement('a');
		obj2.myObj = this;
		obj2.onclick = function() {
			this.myObj.closePopup();
			return false;
		};
		obj2.href = 'javascript:void(0);';
		var obj3 = document.createElement('span');
		obj3.id = this._property['Id']+'CloseBt';
		obj3.appendChild(document.createTextNode(this._property['Text']['Close']));
		obj3.setAttribute('class', 'CloseBt');
		obj3.setAttribute('className', 'CloseBt');	//IE
		obj2.appendChild(obj3);
		obj1.appendChild(obj2);
		this._popup.appendChild(obj1);
		var obj4 = document.createElement('div');
		obj4.appendChild(this._imgArea);
		obj4.id = this._property['Id']+'ImageArea';
		obj4.setAttribute('class', 'ImageArea');
		obj4.setAttribute('className', 'ImageArea');	//IE
		this._popup.appendChild(obj4);

		if(this._property['IsNextBack']) {
			this._nowImgId = null;
			this._nextBt = document.createElement('div');
			this._nextBt.id = this._property['Id']+'NextBtArea';
			this._nextBt.setAttribute('class', 'NextBtArea');
			this._nextBt.setAttribute('className', 'NextBtArea');	//IE
			var nextLinkObj = document.createElement('a');
			nextLinkObj.myObj = this;
			nextLinkObj.onclick = function() {
				this.myObj.next();
				return false;
			};
			nextLinkObj.href = 'javascript:void(0);';
			var spanObj = document.createElement('span');
			spanObj.id = this.id+'NextBt';
			spanObj.appendChild(document.createTextNode(this._property['Text']['Next']));
			spanObj.setAttribute('class', 'NextBt');
			spanObj.setAttribute('className', 'NextBt');	//IE
			nextLinkObj.appendChild(spanObj);
			this._nextBt.appendChild(nextLinkObj);
			this._popup.appendChild(this._nextBt);
			this._nextBt.style.display='none';

			this._backBt = document.createElement('div');
			this._backBt.id = this._property['Id']+'BackBtArea';
			this._backBt.setAttribute('class', 'BackBtArea');
			this._backBt.setAttribute('className', 'BackBtArea');	//IE
			var backLinkObj = document.createElement('a');
			backLinkObj.myObj = this;
			backLinkObj.onclick = function() {
				this.myObj.back();
				return false;
			};
			backLinkObj.href = 'javascript:void(0);';
			var spanObj = document.createElement('span');
			spanObj.id = this.id+'BackBt';
			spanObj.appendChild(document.createTextNode(this._property['Text']['Back']));
			spanObj.setAttribute('class', 'BackBt');
			spanObj.setAttribute('className', 'BackBt');	//IE
			backLinkObj.appendChild(spanObj);
			this._backBt.appendChild(backLinkObj);
			this._popup.appendChild(this._backBt);
			this._backBt.style.display='none';
		}
	}
	,_setPos:function() {
		var width = 0;
		var height = 0;
		var scroll = 0;
		if(document.documentElement.clientWidth) {
			width = document.documentElement.clientWidth;
			height = document.documentElement.clientHeight;
		} else if(document.body.clientWidth){
			width = document.body.clientWidth;
			height = document.body.clientHeight;
		} else {
			width = window.innerWidth;
			height = window.innerHeight;
		}

		if(!this._isSupportPositionFixed) {
			scroll = (document.body.scrollTop || document.documentElement.scrollTop);
		}

		var maxHeight = height;
		if (typeof document.documentElement.style.msInterpolationMode != 'undefined') {
			//IE7
			if(document.documentElement.clientHeight && document.documentElement.clientHeight > maxHeight) {
				maxHeight = document.documentElement.clientHeight;
			}
			if(document.body.clientHeight && document.body.clientHeight > maxHeight) {
				maxHeight = document.body.clientHeight;
			}
			if(window.innerWidth && window.innerWidth > maxHeight) {
				maxHeight = window.innerWidth;
			}
			maxHeight -= scroll;
		}

		this._bg.style.width=width+'px';
		if(maxHeight >= 0) {
			this._bg.style.height=maxHeight+'px';
		}
		this._bg.style.left = '0px';
		this._bg.style.top = scroll+'px';

		if(this._popup.offsetWidth > width) {
			this._popup.style.left = '0px';
		} else {
			this._popup.style.left = ((width-this._popup.offsetWidth)/2)+'px';
		}
		if(this._popup.offsetHeight > height) {
			this._popup.style.top = scroll+'px';
		} else {
			this._popup.style.top = scroll+((height-this._popup.offsetHeight)/2)+'px';
		}
	}
	,onPopup:function(imageId) {
		if(this._doFade) {
			return;
		}
		this._doFade = true;

		this._nowImgId = imageId;
		if(!this._isSupportPositionFixed) {
			window.onscroll=function() {
				this.myObj._setPos();
			};
		}
		window.onresize=function() {
			this.myObj._setPos();
		};

		this._popup.style.zIndex = 100;
		this._popup.style.filter = 'alpha(opacity=0)';
		this._popup.style.opacity = 0;

		//消す
		this._bg.style.zIndex = 50;
		this._bg.style.filter = 'alpha(opacity=0)';
		this._bg.style.opacity = 0;

		this._popup.style.visibility='hidden';
		this._popup.style.display='';
		this._bg.style.visibility='hidden';
		this._bg.style.display='';
		this._setPos();

		var myObj = this;
		this._nowImgSet(
			function() {
				myObj._fadeIn(myObj._bg, myObj._property['MaskAlplha'], 0, function() {
					myObj._doFade = false;
				});
				myObj._fadeIn(myObj._popup, 100, 0, null);
				myObj._setPos();
				myObj._setNextBackBt();
			}
		);

	}
	,closePopup:function() {
		if(this._doFade) {
			return;
		}
		this._doFade = true;

		window.onscroll=null;
		window.onresize=null;

		var myObj = this;
		this._fadeOut(this._popup, 0, 100, 100, function() {myObj._doFade = false;});
		this._fadeOut(this._bg, 0, this._property['MaskAlplha'], this._property['MaskAlplha'], null);

	}
	,next:function() {
		if(this._doFade) {
			return;
		}
		this._doFade = true;

		this._nowImgId++;
		if(this._nowImgId >= this._imageList.length) {
			this._nowImgId = 0;
		}
		var myObj = this;
		if(this._property['IsNextBack']) {
			myObj._backBt.style.display='none';
			myObj._nextBt.style.display='none';
		}
		myObj._closeBtArea.style.display='none';
		this._fadeOut(this._imgArea, 0, 100, 100,
			function() {
				myObj._nowImgSet(
					function() {
						myObj._fadeIn(myObj._imgArea, 100, 0, function() {myObj._doFade = false;});
						myObj._setPos();
						myObj._setNextBackBt();
					}
				);
			}
		);
	}
	,back:function() {
		if(this._doFade) {
			return;
		}
		this._doFade = true;

		this._nowImgId--;
		if(this._nowImgId < 0) {
			this._nowImgId = this._imageList.length-1;
		}
		var myObj = this;
		if(this._property['IsNextBack']) {
			myObj._backBt.style.display='none';
			myObj._nextBt.style.display='none';
		}
		myObj._closeBtArea.style.display='none';
		this._fadeOut(this._imgArea, 0, 100, 100,
			function() {
				myObj._nowImgSet(
					function() {
						myObj._fadeIn(myObj._imgArea, 100, 0, function() {myObj._doFade = false;});
						myObj._setPos();
						myObj._setNextBackBt();
					}
				);
			}
		);
	}
	,_fadeIn:function (obj, max, now, callback) {
		obj.style.display='';
		obj.style.visibility='visible';
		if(max > now) {
			var next = now + (max / this._property['FadeCount']);
			obj.style.filter = 'alpha(opacity=' + next + ')';
			obj.style.opacity = next/100;
			var myObj = this;
			setTimeout(
				function() {
					myObj._fadeIn(obj, max, next, callback);
				}
			, this._property['FadeRefreshTime']);
		} else {
			obj.style.filter = 'alpha(opacity=' + max + ')';
			obj.style.opacity = max/100;
			if(callback) {
				callback();
			}
		}
	}
	,_fadeOut:function(obj, min, start, now, callback) {
		if(min < now) {
			var next = now - ((start-min) / this._property['FadeCount']);
			obj.style.filter = 'alpha(opacity=' + next + ')';
			obj.style.opacity = next/100;
			var myObj = this;
			setTimeout(
				function() {
					myObj._fadeOut(obj, min, start, next, callback);
				}
			, this._property['FadeRefreshTime']);
		} else {
			obj.style.filter = 'alpha(opacity=' + min + ')';
			obj.style.opacity = min/100;
			if(min <= 0) {
				obj.style.display='none';
				obj.style.visibility='hidden';
			}
			if(callback) {
				callback();
			}
		}
	}
	,_setNextBackBt:function() {
		if(this._property['IsNextBack']) {
			this._nextBt.style.display='none';
			this._backBt.style.display='none';
			if(this._nowImgId < this._imageList.length-1) {
				this._nextBt.style.display='';
			}
			if(this._nowImgId > 0) {
				this._backBt.style.display='';
			}
		}
		this._closeBtArea.style.display='';
	}
	,_nowImgSet:function(callback) {
		if(this._imgAreaSrc == this._imageList[this._nowImgId]) {
			if(callback) {
				callback();
			} else {
				this._setNextBackBt();
			}
		} else {
			if(callback) {
				this._imgArea.onload = callback;
			} else {
				this._imgArea.onload = function() {};
				this._setNextBackBt();
			}
			this._imgArea.src = this._imageList[this._nowImgId];
			this._imgAreaSrc = this._imageList[this._nowImgId];
		}
	}
	,_isSupportPositionFixed:function() {
		var isSupport = false;
		var obj = document.createElement('div');
		if(obj.getBoundingClientRect) {
			obj.style.top = '50px';
			obj.style.position = 'fixed';
			obj.appendChild(document.createTextNode('Check'));

			var body = document.body;
			body.appendChild(obj);

			var scrollObj = (document.body || document.documentElement);

			var backupScroll = body.scrollTop;
			var backupHeight = body.style.height;
			var backup1 = {
				 'border':document.body.style.border
				,'margin':document.body.style.margin
				,'padding':document.body.style.padding
			};
			var backup2 = {
				 'border':document.documentElement.style.border
				,'margin':document.documentElement.style.margin
				,'padding':document.documentElement.style.padding
			};
			var oldTop = Math.ceil(obj.getBoundingClientRect().top);

			body.scrollTop = 150;
			body.style.height = '2000px';
			document.body.style.border = '0px';
			document.body.style.margin = '0px';
			document.body.style.padding = '0px';
			document.documentElement.style.border = '0px';
			document.documentElement.style.margin = '0px';
			document.documentElement.style.padding = '0px';

			var top = obj.getBoundingClientRect().top;
			isSupport = ((top-oldTop) == 0);
			body.removeChild(obj);
			scrollObj.scrollTop = backupScroll;
			body.style.height = backupHeight;
			document.body.style.border = backup1['border'];
			document.body.style.margin = backup1['margin'];
			document.body.style.padding = backup1['padding'];
			document.documentElement.style.border = backup2['border'];
			document.documentElement.style.margin = backup2['margin'];
			document.documentElement.style.padding = backup2['padding'];
		}

		return isSupport;
	}
};