//var BannerChanger = {
BannerChanger = function() {this.initialize.apply(this, arguments)}

BannerChanger.prototype = {
	imagePath: '/img/',
	loadingImageName: 'loader.gif',
	shadowImageName: 'shadow.png',
// modify 10.06.29
//	maskImageName: 'mask.png',
	maskImageName: 'btn_top.gif',
	apperDuration: 0.8,
	effectInterval: 15,
	loadComplate: false,
	analysisXml: false,
	rootElem: undefined,
	imageIndex: -1,
	xml_url: undefined,
	basicImage: undefined,
	campImages: undefined,
	initialize : function (name, xml_path, options) {
		this.rootElem = document.getElementById(name);
		if (!this.rootElem) {
			return;
		}
		this.xml_url = xml_path;
		for (var key in options) {
			this[key] = options[key];
		}
		this.effectStep = this.effectInterval / this.apperDuration / 1000;
		var divLoading = document.createElement('div');
		divLoading.id = 'loading';
		divLoading.style.position = 'absolute';
		divLoading.style.zIndex = 1000;
		divLoading.style.width = '100%';
		divLoading.style.height = '100%';
		divLoading.style.marginTop  = this.rootElem.clientHeight / 2 + 'px';
		divLoading.style.textAlign = 'center';
		var loadingImage = new Image();
		loadingImage.src = this.imagePath + this.loadingImageName;
		divLoading.appendChild(loadingImage);
		this.rootElem.appendChild(divLoading);
		var http = new JKL.ParseXML.DOM(this.xml_url + '?t=' + new Date().getTime());
		http.async(VCOMN.bindFunc(this.parseXML, this));
		http.parse();
	},
	parseXML: function (xmlObj) {
		var divs = xmlObj.getElementsByTagName('div');
		for (var i = 0; i < divs.length; i++) {
			switch (divs[i].getAttribute('id')) {
			case 'Basic':
				var bimgs = this.initImages(divs[i].getElementsByTagName('img'));
				this.basicImage = bimgs[0];
				break;
			case 'Campaign':
				var cimages = [];
				var cimgElems = this.getElementsByClassName(divs[i], 'Number');
				for (var j = 0; j < cimgElems.length; j++) {
					var data = {};
					var imgs = this.initImages(cimgElems[j].getElementsByTagName('img'));
					if (imgs[0]) {
						data['main'] = imgs[0];
					}
					if (imgs[1]) {
						data['thumb'] = imgs[1];
					}
					var atag = cimgElems[j].getElementsByTagName('a');
					if (atag.length > 0) {
						if (atag[0].getAttribute('href')) {
							data['href'] = atag[0].getAttribute('href');
							if (atag[0].getAttribute('target')) {
								data['target'] = atag[0].getAttribute('target');
							}
						}
					}
					var time = cimgElems[j].getAttribute('time');
					if (time) {
						data['time_ms'] = time * 1000;
					} else {
						data['time_ms'] = 5000;
					}
					cimages.push(data);
				}
				this.campImages = cimages;
				break;
			}
		}
		// 初期化 
		if (!this.rootElem.style.position) {
			this.rootElem.style.position = 'relative';
		}
		var divMain = document.createElement('div');
		divMain.id = 'mainBase';
		divMain.style.position = 'absolute';
		divMain.style.zIndex = 0;
		if (this.campImages) {
			for (var i = 0; i < this.campImages.length; i++) {
				var div = document.createElement('div');
				div.id = 'image' + (i + 1);
				div.style.display = 'none';
				div.style.position = 'absolute';
				div.style.zIndex = 100 - i;
				if (this.campImages[i].href) {
					div.onmouseover = function () {this.style.cursor	= "pointer";}
					div.onmouseout = function () {this.style.cursor	= "default";}
					div.onmouseup = VCOMN.bindFunc(new Function ('', 'this.jumpHref(' + i + ');'), this);
				}
				div.appendChild(this.campImages[i].main);
				divMain.appendChild(div);
			}
		} else if (this.basicImage) {
			divMain.appendChild(this.basicImage);
		}
		this.rootElem.appendChild(divMain);
		// サムネイルの配置
		{
			var divTumb = document.createElement('div');
			divTumb.id = 'tumbBase';
			divTumb.style.display = 'block';
			divTumb.style.position = 'absolute';
// modify 10.06.29
//			divTumb.style.left = '756px';
			divTumb.style.left = '15px';
// modify 10.06.29
//			divTumb.style.top = '13px';
			divTumb.style.top = '220px';
			divTumb.style.zIndex = 500;
			for (var i = 0; i < this.campImages.length; i++) {
				var shadowImage;
				var thumbImage;

// delete 10.06.29 透過PNGを使用しない場合は不要
//				if (this.isNoTransformPing()) {
//					shadowImage = this.setTransformPing(this.imagePath + this.shadowImageName, this.campImages[i].thumb.width + 5, this.campImages[i].thumb.height + 5);
//					thumbImage = this.setTransformPing(this.campImages[i].thumb.src, this.campImages[i].thumb.width, this.campImages[i].thumb.height);
//				} else {
					shadowImage = new Image();
					shadowImage.src = this.imagePath + this.shadowImageName;
					thumbImage = this.campImages[i].thumb;
//				}
				shadowImage.style.position = 'absolute';
				shadowImage.style.top = '0px';
				shadowImage.style.left = '0px';
				shadowImage.style.zIndex = -1;
				var div = document.createElement('div');
				div.id = 'tumb' + (i + 1);
				div.style.display = 'block';
				div.style.position = 'absolute';
// modify 10.06.29
//				div.style.top  = (64 * i) + 'px';
				div.style.left = (26 * i) + 'px';
				div.onmouseover = VCOMN.bindFunc(new Function ('', 'this.imageShow(' + i + ');'), this);
				div.appendChild(thumbImage);
// delete 10.06.29
//				div.appendChild(shadowImage);
				divTumb.appendChild(div);
			}
			this.rootElem.appendChild(divTumb);
		}
		this.rootElem.removeChild(document.getElementById('loading'));
		this.imageShow(0);
		return false;
	},
	isNoTransformPing: function () {
		var arVersion = navigator.appVersion.split("MSIE")
		var version;
		if (arVersion) {
			version = parseFloat(arVersion[1]);
		}
		if (!version || version < 5.5 || version >= 7) {
//		if (!version) {
			return false;
		}
		return true;
	},
	setTransformPing: function (src, width, height) {
		if (+width == width) {
			width = width + 'px';
		}
		if (+height == height) {
			height = height + 'px';
		}
		var imageElem = document.createElement('div');
		imageElem.style.filter = 'progid:DXImageTransform.Microsoft.AlphaImageLoader(src=' + src + ')';
		imageElem.style.width = width;
		imageElem.style.height = height;
		return imageElem;
	},
	getElementsByClassName: function (elem, name) {
		if (elem.nodeType != 1) {
			return;
		}
		var elements = [];
		if (elem.getAttribute('class') == name) {
			elements.push(elem);
		} else if (elem.hasChildNodes()) {
			for (var i = 0; i < elem.childNodes.length; i++) {
				var elems = this.getElementsByClassName(elem.childNodes[i], name);
				if (elems != undefined && elems.length) {
					elements = elements.concat(elems);
				}
			}
		}
		if (elements.length == 0) {
			return;
		}
		return elements;
	},
	jumpHref: function (index) {
		if (!this.campImages[index].href) return;
		switch (this.campImages[index].target) {
		case '_top':
			top.location.href = this.campImages[index].href;
			break;
		case '_blank':
			window.open(this.campImages[index].href, '');
			break;
		default:
			if (parent[this.campImages[index].target]) {
				eval(
					'parent.' + 
					this.campImages[index].target + 
					'.location.href = "' + 
					this.campImages[index].href + '"');
			} else {
				location.href = this.campImages[index].href;
			}
			break;
		}
	},
	imageShow: function (index) {
		var divMain = document.getElementById('mainBase');
		if (this.imageIndex != index) {
			divMain.childNodes[index].style.display = 'none';
			divMain.childNodes[index].style.zIndex = 210;
			if (this.imageIndex >= 0) {
				divMain.childNodes[this.imageIndex].style.zIndex = 200;
				VCOMN.setOpacity(divMain.childNodes[this.imageIndex], 1.0);
				divMain.childNodes[this.imageIndex].style.display = 'block';
			}
			var id;
			for (var i = 1; i < divMain.childNodes.length; i++) {
				id = (index + i) % divMain.childNodes.length;
				if (id == this.imageIndex) continue;
				divMain.childNodes[id].style.zIndex = 100 + i;
				divMain.childNodes[id].style.display = 'none';
			}
			for (var i = 0; i < document.getElementById('tumbBase').childNodes.length; i++) {
				var tumbNode = document.getElementById('tumbBase').childNodes[i];
				var maskId = tumbNode.id + 'Mask';
				if (index == i) {
					if (document.getElementById(maskId)) {
						tumbNode.removeChild(document.getElementById(maskId));
					}
					continue;
				} else if (document.getElementById(maskId)) {
					continue;
				}
				var divMask = document.createElement('div');
				divMask.id = maskId;
				divMask.style.position = 'absolute';
				divMask.style.top = '0px';
				divMask.style.left = '0px';
				var maskImage;
				var mImageName;		// add 10.06.29
				mImageName = this.maskImageName;
			    mImageName = mImageName.replace(/x/, i+1);
				if (this.isNoTransformPing()) {
// modify 10.06.29
//					maskImage = this.setTransformPing(this.imagePath + this.maskImageName, '100%', '100%');
					maskImage = this.setTransformPing(this.imagePath + mImageName, '100%', '100%');
				} else {
					maskImage = new Image();
// modify 10.06.29
//					maskImage.src = this.imagePath + this.maskImageName;
					maskImage.src = this.imagePath + mImageName;
				}
				divMask.appendChild(maskImage);
				divMask.style.width = '100%';
				divMask.style.height = '100%';
				divMask.style.zIndex = 600;
				tumbNode.appendChild(divMask);
			}
			this.effectCancel();
			this.effectStart(divMain.childNodes[index].id);
			this.imageIndex = index;
		}

		// タイマーを使用しない場合はここをコメントアウトする 10.06.29 start
		if (this.timeoutID) {
			clearTimeout(this.timeoutID);
			this.timeoutID = undefined;
		}
		this.timeoutID = setTimeout(VCOMN.bindFunc(this.nextImage, this), this.campImages[index].time_ms);
		// タイマーを使用しない場合はここをコメントアウトする 10.06.29 end
	},
	effectCancel: function () {
		if (this.effectId) {
			clearInterval(this.effectId);
		}
		this.effectId = null;
	},
	effectStart: function (id) {
		this.effectElem = document.getElementById(id);
		this.effectOpacity = 0.0;
		this.effectId = setInterval(VCOMN.bindFunc(this.effectCB, this), this.effectInterval);
	},
	effectCB: function () {
		this.effectOpacity += this.effectStep;
		if (this.effectOpacity >= 1.0) {
			this.effectOpacity = 1.0;
			this.effectCancel();
		}
		this.effectElem.style.display = 'block';
		VCOMN.setOpacity(this.effectElem, this.effectOpacity);
	},
	nextImage: function () {
		var index = (this.imageIndex + 1) % this.campImages.length;
		this.imageShow(index);
	},
	checkLoadComplate: function () {
		if (this.basicImage) {
			if (this.basicImage.status == 'wait') {
				return false;
			}
		}
		if (this.campImages) {
			for (var i = 0; i < this.campImages.length; i++) {
				if (this.campImages[i].main.status == 'wait' ||
					(this.campImages[i].thumb && this.campImages[i].thumb.status == 'wait')) {
					return false;
				}
			}
		}
		return true;
	},
	initImages: function (xml) {
		var imgs = [];
		for (var i = 0; i < xml.length; i++) {
			if (xml[i].nodeName == 'img') {
				var image = new Image();
				image.src = xml[i].getAttribute('src');
				if (image.width == 0) {
					image.status = 'wait';
					image.onload = function () {this.status = 'loaded';}
					image.onerror = function () {this.status = 'error';}
				} else {
					image.status = 'loaded';
				}
				imgs.push(image);
			} else if (typeof xml[i] == 'object') {
				var b = this.extractImage(xml[i]);
				if (b.length > 0) {
					imgs = imgs.concat(b);
				}
			}
		}
		return imgs;
	}
};

