function doSlidingMovement(elementID, final_height, final_width, interval){
  if (!document.getElementById) return false;
  if (!document.getElementById(elementID)) return false;
  
  var elem = document.getElementById(elementID);
  
  //Stop the repeating events
  if (elem.movement) {
    clearTimeout(elem.movement);
  }
  var ypos = parseInt(elem.style.height);
  var xpos = parseInt(elem.style.width);
  
  if (ypos == final_height && xpos == final_width){
    return true;
  }
  //Height
  if (ypos < final_height) {
    var dist = Math.ceil((final_height - ypos)/5);
    ypos = ypos + dist;
  }
  if (ypos > final_height) {
    var dist = Math.ceil((ypos - final_height)/5);
    ypos = ypos - dist;
  }
  //Width
  if (xpos < final_width) {
    var dist = Math.ceil((final_width - xpos)/5);
    xpos = xpos + dist;
  }
  if (xpos > final_width) {
    var dist = Math.ceil((xpos - final_width)/5);
    xpos = xpos - dist;
  }
  elem.style.height = ypos + "px";
  //elem.style.left = 404 - xpos + "px";
  
  elem.style.width = xpos + "px";
  
  //Call the method recursively
  var repeat = "doSlidingMovement('"+elementID+"',"+final_height+","+final_width+","+interval+")";
  elem.movement = setTimeout(repeat, interval);
}

function doSlidingMovement2(elementID, final_width, interval){
  if (!document.getElementById) return false;
  if (!document.getElementById(elementID)) return false;
  
  var elem = document.getElementById(elementID);
  
  //Stop the repeating events
  if (elem.movement) {
    clearTimeout(elem.movement);
  }
  var xpos = parseInt(elem.style.width);
  
  if (xpos == final_width){
    return true;
  }
  //Width
  if (xpos < final_width) {
    var dist = Math.ceil((final_width - xpos)/5);
    xpos = xpos + dist;
  }
  if (xpos > final_width) {
    var dist = Math.ceil((xpos - final_width)/5);
    xpos = xpos - dist;
  }
  elem.style.width = xpos + "px";
  
  //Call the method recursively
  var repeat = "doSlidingMovement2('"+elementID+"',"+final_width+","+interval+")";
  elem.movement = setTimeout(repeat, interval);
}
function doSlidingMovement22(elementID, elementID2, final_width, interval){
  if (!document.getElementById) return false;
  if (!document.getElementById(elementID)) return false;
  
  var elem = document.getElementById(elementID);
  
  //Stop the repeating events
  if (elem.movement) {  	
    clearTimeout(elem.movement);
  }
  var xpos = parseInt(elem.style.width);
  
  if (xpos == final_width){
		var ele2 = document.getElementById(elementID2);
		ele2.className = "off";
    return true;
  }
  //Width
  if (xpos < final_width) {
    var dist = Math.ceil((final_width - xpos)/5);
    xpos = xpos + dist;
  }
  if (xpos > final_width) {
    var dist = Math.ceil((xpos - final_width)/5);
    xpos = xpos - dist;
  }
  elem.style.width = xpos + "px";
  
  //Call the method recursively
  var repeat = "doSlidingMovement22('"+elementID+"','"+elementID2+"',"+final_width+","+interval+")";
  elem.movement = setTimeout(repeat, interval);
}
function doSlidingMovement23(elementID, elementID2, final_width, interval){
  if (!document.getElementById) return false;
  if (!document.getElementById(elementID)) return false;
  
  var elem = document.getElementById(elementID);
  
  //Stop the repeating events
  if (elem.movement) {  	
    clearTimeout(elem.movement);
  }
  var xpos = parseInt(elem.style.width);
  
  if (xpos == final_width){
		var ele2 = document.getElementById(elementID2);
		ele2.className = "off";
    return true;
  }
  //Width
  if (xpos < final_width) {
    var dist = Math.ceil((final_width - xpos)/5);
    xpos = xpos + dist;
  }
  if (xpos > final_width) {
    var dist = Math.ceil((xpos - final_width)/5);
    xpos = xpos - dist;
  }
  elem.style.width = xpos + "px";
  
  //Call the method recursively
  var repeat = "doSlidingMovement22('"+elementID+"','"+elementID2+"',"+final_width+","+interval+")";
  elem.movement = setTimeout(repeat, interval);
}
//Add event Handler
function addEventHandler(){
	//Javascript Degradation
	if( degradeByScript() ) return false;
	
	//Main Gallery Bubble
	var gallery_info = document.getElementById("gallery_info");
	if(gallery_info){
			gallery_info.onclick = function(){
				var gallery_info_detail = document.getElementById("gallery_info_detail");
				
				if(gallery_info_detail.className == "off"){ //make sure it only executes once
					gallery_info_detail.className = "on";
					var gid2 = document.getElementById("gid2");
					gid2.style.display = "block";
					gid2.style.width = "314px";
					doSlidingMovement2("gid2", 0, 10);
				}
				return false;
			}
	}
	var info_close = document.getElementById("info_close");
	if(info_close){
			info_close.onclick = function(){
				this.blur();
				var gid2 = document.getElementById("gid2");
				if(parseInt(gid2.style.width) == 0){ //make sure it only executes once
					gid2.style.display = "block";
					gid2.style.width = "0px";
					doSlidingMovement22("gid2", "gallery_info_detail", 314, 10);
				}
			}
	}
	//Tableware Bubble 1
	var tableware_info1 = document.getElementById("tableware_info1");
	if(tableware_info1){
			tableware_info1.onclick = function(){
				var tableware_info_detail1 = document.getElementById("tableware_info_detail1");
				
				if(tableware_info_detail1.className == "off"){ //make sure it only executes once
					tableware_info_detail1.className = "on";
					var tid1 = document.getElementById("tid1");
					tid1.style.display = "block";
					tid1.style.width = "365px";
					doSlidingMovement2("tid1", 0, 10);
				}
				return false;
			}
	}
	var info_close2 = document.getElementById("info_close2");
	if(info_close2){
			info_close2.onclick = function(){
				this.blur();
				var tid1 = document.getElementById("tid1");
				if(parseInt(tid1.style.width) == 0){ //make sure it only executes once
					tid1.style.display = "block";
					tid1.style.width = "0px";
					doSlidingMovement22("tid1", "tableware_info_detail1", 365, 10);
				}
			}
	}
	//Tableware Bubble 2
	var tableware_info2 = document.getElementById("tableware_info2");
	if(tableware_info2){
			tableware_info2.onclick = function(){
				var tableware_info_detail2 = document.getElementById("tableware_info_detail2");
				
				if(tableware_info_detail2.className == "off"){ //make sure it only executes once
					tableware_info_detail2.className = "on";
					var tid2 = document.getElementById("tid2");
					tid2.style.display = "block";
					tid2.style.width = "248px";
					doSlidingMovement2("tid2", 0, 10);
				}
				return false;
			}
	}
	var info_close3 = document.getElementById("info_close3");
	if(info_close3){
			info_close3.onclick = function(){
				this.blur();
				var tid2 = document.getElementById("tid2");
				if(parseInt(tid2.style.width) == 0){ //make sure it only executes once
					tid2.style.display = "block";
					tid2.style.width = "0px";
					doSlidingMovement22("tid2", "tableware_info_detail2", 248, 10);
				}
			}
	}
	//Cup
	var cup = document.getElementById("cup");
	if(cup){
			cup.onclick = function(){
				this.blur();
				var picPos = this.style.backgroundImage.substring(this.style.backgroundImage.length-6, this.style.backgroundImage.length-5);
				picPos++;
				if(picPos == 4){
					picPos = 1;
				}
				this.style.backgroundImage = "url(img/tableware/cup"+picPos+".jpg)";
				return false;
			}
	}
	//Jug
	var jug = document.getElementById("jug");
	if(jug){
			jug.onclick = function(){
				this.blur();
				var picPos = this.style.backgroundImage.substring(this.style.backgroundImage.length-6, this.style.backgroundImage.length-5);
				picPos++;
				if(picPos == 5){
					picPos = 1;
				}
				this.style.backgroundImage = "url(img/tableware/jug"+picPos+".jpg)";
				return false;
			}
	}
	//Cushion Bubble
	var cushion_info = document.getElementById("cushion_info");
	if(cushion_info){
			cushion_info.onclick = function(){
				var cushion_info_detail = document.getElementById("cushion_info_detail");
				
				if(cushion_info_detail.className == "off"){ //make sure it only executes once
					cushion_info_detail.className = "on";
					var cid = document.getElementById("cid");
					cid.style.display = "block";
					cid.style.width = "365px";
					doSlidingMovement2("cid", 0, 10);
				}
				return false;
			}
	}
	var info_close4 = document.getElementById("info_close4");
	if(info_close4){
			info_close4.onclick = function(){
				this.blur();
				var cid = document.getElementById("cid");
				if(parseInt(cid.style.width) == 0){ //make sure it only executes once
					cid.style.display = "block";
					cid.style.width = "0px";
					doSlidingMovement22("cid", "cushion_info_detail", 365, 10);
				}
			}
	}
	//Cushion Next
	var cushion_next = document.getElementById("cushion_next");
	if(cushion_next){
			cushion_next.onclick = function(){
				this.blur();
				var cushion_imgHolder = document.getElementById("cushion_imgHolder");			
				var picPos = cushion_imgHolder.style.backgroundImage.substring(cushion_imgHolder.style.backgroundImage.length-6, cushion_imgHolder.style.backgroundImage.length-5);
				picPos++;
				var cushion_previous = document.getElementById("cushion_previous");
				cushion_previous.className = "on";
				if(picPos == 6){
					picPos = 5;
					this.className = "off";
				}
				cushion_imgHolder.style.backgroundImage = "url(img/cushion/cus"+picPos+".jpg)";
				return false;
			}
	}
	//Cushion Previous
	var cushion_previous = document.getElementById("cushion_previous");
	if(cushion_previous){
			cushion_previous.onclick = function(){
				this.blur();
				var cushion_imgHolder = document.getElementById("cushion_imgHolder");			
				var picPos = cushion_imgHolder.style.backgroundImage.substring(cushion_imgHolder.style.backgroundImage.length-6, cushion_imgHolder.style.backgroundImage.length-5);
				picPos--;
				var cushion_next = document.getElementById("cushion_next");
				cushion_next.className = "on";
				if(picPos == 0){
					picPos = 1;
					this.className = "off";
				}
				cushion_imgHolder.style.backgroundImage = "url(img/cushion/cus"+picPos+".jpg)";
				return false;
			}
	}
	//Vase Bubble
	var vase_info = document.getElementById("vase_info");
	if(vase_info){
			vase_info.onclick = function(){
				this.blur();
				var vase_info_detail = document.getElementById("vase_info_detail");
				vase_info_detail.className = "on";
				vase_info_detail.style.width = "0px";
				doSlidingMovement2("vase_info_detail", 330, 10);
				return false;
			}
	}
	var info_close5 = document.getElementById("info_close5");
	if(info_close5){
			info_close5.onclick = function(){
				this.blur();
				var vase_info_detail = document.getElementById("vase_info_detail");
				if(parseInt(vase_info_detail.style.width) == 330){ //make sure it only executes once
					doSlidingMovement23("vase_info_detail", "vase_info_detail", 0, 10);
				}
			}
	}
	//Vase Next
	var vase_next = document.getElementById("vase_next");
	if(vase_next){
			vase_next.onclick = function(){
				this.blur();
				var vase_imgHolder = document.getElementById("vase_imgHolder");			
				var picPos = vase_imgHolder.style.backgroundImage.substring(vase_imgHolder.style.backgroundImage.length-6, vase_imgHolder.style.backgroundImage.length-5);
				picPos++;
				var vase_previous = document.getElementById("vase_previous");
				vase_previous.className = "on";
				if(picPos == 9){
					picPos = 8;
					this.className = "off";
				}
				vase_imgHolder.style.backgroundImage = "url(img/vase/vas"+picPos+".jpg)";
				return false;
			}
	}
	//Vase Previous
	var vase_previous = document.getElementById("vase_previous");
	if(vase_previous){
			vase_previous.onclick = function(){
				this.blur();
				var vase_imgHolder = document.getElementById("vase_imgHolder");			
				var picPos = vase_imgHolder.style.backgroundImage.substring(vase_imgHolder.style.backgroundImage.length-6, vase_imgHolder.style.backgroundImage.length-5);
				picPos--;
				var vase_next = document.getElementById("vase_next");
				vase_next.className = "on";
				if(picPos == 0){
					picPos = 1;
					this.className = "off";
				}
				vase_imgHolder.style.backgroundImage = "url(img/vase/vas"+picPos+".jpg)";
				return false;
			}
	}
}

addLoadEvent(addEventHandler);