/* 
ターゲットをaタグのhrefの値で置き換える。
スワップイメージさせたいaタグのclassに指定したclass名を割り当てる。
aタグのclassに変更したいターゲットのidを割り当てる。
@ matsuo

サンプルコード
<img src="example_base.jpg" id="targetId1" />
<img src="example_base.jpg" id="targetId2" />
<a href="example1.jpg" class="ImgSrcChanges" target="targetId1">サンプル1</a>
<a href="example2.jpg" class="ImgSrcChanges" target="targetId1">サンプル2</a>
<a href="example1.jpg" class="ImgSrcChanges" target="targetId2">サンプル3</a>
<a href="example2.jpg" class="ImgSrcChanges" target="targetId2">サンプル4</a>
*/

var ImgSrcChanges={

	varsion:"1.0.1",

	set:function(){
		//対象となるAタグのクラス名
		this.set_class="ImgSrcChanges";
		
		//対象を切り替えるボタンアクション(onclick or onmouseover)
		this.bt_action="onclick";
		
		//ボタンからマウスアウトした際に、対象を元の画像に戻すか true or false
		this.bt_mouseout_back=false;
		
		//プリロードイメージを仕様するか
		this.preloadImgFlag=true;
		
		//border
		this.borderDefaultColor = "1px solid #DED9D0";
		
		this.borderSelectColor = "1px solid #61AEDC";
		
		this.targetIds=new Array();
		
		this.window_load();
	},
	
	execute:function(){
		ImgSrcChanges.btaction();
		if(ImgSrcChanges.bt_mouseout_back){
			ImgSrcChanges.targetDefaltImgSet();
		}
	},
	
	btaction:function(){
		var cnt = 0;
		var a=document.getElementsByTagName("a");
		var act=this.bt_action;
		for(var i=0; i<a.length; i++){
			if(a[i].className == this.set_class){
				cnt++;
				if(cnt == 1){
					this.borderConts(a[i]);					
				}
				if(this.bt_action == "onmouseover"){
					a[i].onmouseover=function(){
						var target=document.getElementById(this.target);
						if(target){
							target.src=this.href;						
						}
					};
				}
				if(this.bt_action == "onclick"){
					a[i].onclick=function(){
						var target=document.getElementById(this.target);
						if(target){
							target.src=this.href;
							ImgSrcChanges.borderConts(this);
						}
						return false;
					};
				}else{
					a[i].onclick=function(){
						return false;
					}
				}
				if(this.bt_mouseout_back){
					a[i].onmouseout=function(){
						var target=document.getElementById(this.target);
						if(target){
							target.src=target.lowsrc;
						}
					};
				}
				if(this.preloadImgFlag){
					this.preload(a[i].href);
				}
				this.targetIds.push(a[i].target);
			}
		}
	},
	
	targetDefaltImgSet:function(){
		var es={};
		var ids= this.targetIds;
		for(var i=0; i<ids.length; i++){
			if(es[ids[i]]){
				ids[i]=null;
			}else{
				es[ids[i]]=true;
				var tarObj=document.getElementById(ids[i]);
				if(tarObj){
					tarObj.lowsrc=tarObj.src;
				}
			}
		}
	},
	
	preload:function(img){
		this.preloadnum=(this.preloadnum >= 0)?this.preloadnum+1:0;
		if(this.preloadnum == 0){
			this.preloadimgs=new Array();
		}
		this.preloadimgs[this.preloadnum]=new Image();
		this.preloadimgs[this.preloadnum].src=img;
	},

	window_load:function(){
		if(window.addEventListener) {
			window.addEventListener("load", this.execute, false);
		}
		else if(window.attachEvent) {
			window.attachEvent("onload", this.execute);
		}
	},
	
	borderConts:function(elm){
		this.borderReset();
		var e = this.getImgElm(elm);
		if(e != ""){
			e.style.border = this.borderSelectColor;
		}
	},
	
	borderReset:function(){
		var a=document.getElementsByTagName("a");
		for(var i=0; i<a.length; i++){
			if(a[i].className == this.set_class){
				var e = a[i];
				var im = this.getImgElm(e);
				im.style.border = this.borderDefaultColor;
			}
		}
	},
	
	getImgElm:function(elm){
		var im = elm.getElementsByTagName("img");
		var e = "";
		if(im.length > 0){
			e = im[0];
		}
		return e;
	}
};
ImgSrcChanges.set();