/*
<html>
<head>
<meta http-equiv=Content-Type content="text/html;charset=euc-kr">
<meta http-equiv=Cache-Control content=No-Cache>
<meta http-equiv=Pragma	content=No-Cache>
<title>::ºñÆÒÀÔ´Ï´Ù::</title>

<script language="JavaScript" src="/common/js/prototype1.5.js"></script>

<script language="JavaScript" src="/common/js/group_scroll.js"></script>

</head>

<body>


<div class="test_div" style="display:none">
  test 1
</div>

<div class="test_div" style="display:none">
  test 2
</div>
<div class="test_div" style="display:none">
  test 3
</div>
<div class="test_div" style="display:none">
  test 4
</div>
<div class="test_div" style="display:none">
  test 5
</div>
<div class="test_div" style="display:none">
  test 6
</div>
<div class="test_div" style="display:none">
  test 7
</div>
<div class="test_div" style="display:none">
  test 8
</div>

<style type="text/css">
<!--
#test{
width:300px;
height:300px;

}
#test2{
width:300px;
height:300px;

}
-->

</style>
<script type="text/javascript">
<!--
var test_A=new Array();


var test_div_A=document.getElementsByClassName("test_div");

for(var i=0;i<test_div_A.length;i++){

	test_A[i]=test_div_A[i].innerHTML;
}
//-->
</script>
<div id="xxx" >
  <script language="JavaScript"> 

  var txt = new group_scroll(test_A,'test','3','top');

  </script>
</div>
<div id="xxxxx" >
  <script language="JavaScript"> 

  var txt2 = new group_scroll(test_A,'test2','3','top');

  </script>
</div>

</body>
</html>

*/
function group_scroll(entity_array,area_div_name,group_cnt,move_type,width,height,waitspeed){
     

	 this.width=null
	 this.height=null
	 this.per_width=null
	 this.per_height=null

	 this.htmlstr_m = "" 
     this.flag=true 
     this.mouse=1 
     this.movespeed=1 
     this.waitspeed=3000 
     this.temp=0

	 this.entity_array= entity_array
	 this.group_cnt=parseInt(group_cnt)
	 this.move_type=move_type
	 this.width=parseInt(width)
	 this.height=parseInt(height)

	 if(waitspeed) this.waitspeed=waitspeed
	 var group_scrollinstance=this
	  
	
	 
	 document.write('<div id="'+area_div_name+'" style="width:'+this.width+'px;height:'+this.height+'px;position: relative; overflow:hidden;"></div>')
	 this.area_div = $(area_div_name);
	


	  this.entity_div = document.createElement('div');
	  with(this.entity_div.style){
		position="absolute";
		padding="0 0 0 0";
		left="0px";
		top="0px";

		
	  }//border="1px solid silver";
	  this.entity_div.className='group_scroll_entity'

		
	if (window.addEventListener) //run onload in DOM2 browsers
		window.addEventListener("load", function(){group_scrollinstance.initialize()}, false)
	else if (window.attachEvent) //run onload in IE5.5+
		window.attachEvent("onload", function(){group_scrollinstance.initialize()})
	else if (document.getElementById) //if legacy DOM browsers, just start scroller after 0.5 sec
		setTimeout(function(){group_scrollinstance.initialize()}, 1)
}
group_scroll.prototype.initialize=function(){


	this.per_width = parseInt(this.width/this.group_cnt)
	this.per_height = parseInt(this.height/this.group_cnt)
	
	if(this.width > 0 && this.height>0){//¼û±èÇÊµåÀÏ¶§´Â ÀÛ¾÷ÁßÁö
		var group_scrollinstance=this

		this.area_div.onmouseover=function(){group_scrollinstance.mouse=0}
		this.area_div.onmouseout=function(){group_scrollinstance.mouse=1}

		if (window.attachEvent) //Clean up loose references in IE
			window.attachEvent("onunload", function(){group_scrollinstance.area_div.onmouseover=group_scrollinstance.area_div.onmouseout=null})
			
		setTimeout(function(){group_scrollinstance.start_scroll()}, 1)
	}
}
group_scroll.prototype.start_scroll=function(){
	var group_scrollinstance=this
	 for (i=0; i<this.entity_array.length; i++) group_scrollinstance.insertentity(i);
	

	if(this.entity_array.length > this.group_cnt){
	 if(this.move_type=='top'){
		
		 setTimeout(function(){group_scrollinstance.scroll_top()},this.waitspeed);
	 }else{
		
		setTimeout(function(){group_scrollinstance.scroll_left()},this.waitspeed);
	 }
	}
}
group_scroll.prototype.insertentity=function(ival){
	  
	  tem_entity_div = this.entity_div.cloneNode(true);
	  if(this.move_type=='top'){
		  tem_entity_div.style.top=((this.per_height)*ival)+'px';
		  tem_entity_div.style.height = this.per_height+'px';
		  tem_entity_div.style.left='0px';
	  }else{
		  tem_entity_div.style.top='0px';
		  tem_entity_div.style.left=((this.per_width)*ival)+'px';
		  tem_entity_div.style.width=this.per_width+'px';
	  }
	  
	  tem_entity_div.innerHTML = this.entity_array[ival];
	  
	 this.area_div.appendChild(tem_entity_div);
}
group_scroll.prototype.scroll_top=function(){
 
  var group_scrollinstance=this

	
  if (this.mouse && this.flag) {
    
	for (i=0;i<this.entity_array.length;i++) {
      
	  this.temp++;
      
	  tmp = this.area_div.getElementsByClassName("group_scroll_entity")[i];
	  tmp.style.top = parseInt(tmp.style.top) - 1;
     


	  if (parseInt(tmp.style.top) <= this.per_height*(-1)) {
         tmp.style.top = this.per_height*(this.entity_array.length-1);
      }

      if (this.temp>(this.height-1)*this.entity_array.length) {
        this.flag=false;
        this.temp=0;
        setTimeout(function(){group_scrollinstance.flag=true;group_scrollinstance.temp=0;},this.waitspeed);
      }

    }

  }
  
  setTimeout(function(){group_scrollinstance.scroll_top()},this.movespeed);
}


group_scroll.prototype.scroll_left=function(){
  var group_scrollinstance=this

	
  if (this.mouse && this.flag) {
    
	for (i=0;i<this.entity_array.length;i++) {
      
	  this.temp++;
      
	  tmp = this.area_div.getElementsByTagName("div")[i];
	  tmp.style.left = parseInt(tmp.style.left) - 1;
     


	  if (parseInt(tmp.style.left) <= this.per_width*(-1)) {
         tmp.style.left = this.per_width*(this.entity_array.length-1);
      }

      if (this.temp>(this.width-1)*this.entity_array.length) {
        this.flag=false;
        this.temp=0;
        setTimeout(function(){group_scrollinstance.flag=true;group_scrollinstance.temp=0;},this.waitspeed);
      }

    }

  }
  
  setTimeout(function(){group_scrollinstance.scroll_left()},this.movespeed);
}


