function setupRollOverImages() {
	function preloadImage(imageUrl) {
		var d=document; 
		if(!d.MM_p) d.MM_p=new Array();
		var i,j=d.MM_p.length;
		d.MM_p[j]=new Image; 
		d.MM_p[j++].src=imageUrl;
	}
		

	$$('.rollover_image').each(function(imgElement) {
		var dir = imgElement.src.substring(0, imgElement.src.lastIndexOf("/")+1);
		var outImageName = imgElement.src;
		var selectImageName = outImageName;
		var overImageName = imgElement.getAttribute("over");
		preloadImage(dir + overImageName);
		imgElement.observe('mouseover', function() {
			imgElement.src = dir + overImageName;
		});
		imgElement.observe('mouseout', function() {
			imgElement.src = selectImageName;
		});
		imgElement.changeToSelect = function() {
			selectImageName = dir + overImageName;
			imgElement.src = selectImageName;
		}
		imgElement.changeToDeselect = function() {
			selectImageName = outImageName;
			imgElement.src = selectImageName;
		}
	});
	
	document.fire("proguide:rollover_images_loaded");
}

function addMultipleFileFunction() {
	var autoAppendFunction = function(event) {
		var element = event.element();
		var target = element.getAttribute("target");
		var toAppend = true;
		var files = $$('input[target="'+target+'"]');
		files.each(function(fileElement) {
			if(!fileElement.value) {
				toAppend = false;
			}
		});
		if(toAppend) {
			var appendTarget = $$('input[target="'+target+'"]').pop();
			
			var fakeViewId = "fake_view_" + CommonUtils.generateRandomString();
			var sampleDiv = appendTarget.up();
			var viewSampleElement = $(appendTarget.getAttribute("view"));
			var button = appendTarget.up().select("img")[0];
			
			
			var newFileElementId = CommonUtils.generateRandomString();
			var f = Builder.node('input', {type:'file', id:newFileElementId, name:newFileElementId, target:target, className:appendTarget.className, view:fakeViewId, style:appendTarget.style.cssText});
			var newSpan = Builder.node('span', {}, [
					Builder.node('div', {className:sampleDiv.className, style:sampleDiv.style.cssText}, [
							f,
							Builder.node('div', {className:'fakefile'},[
									Builder.node('input', {type:'text', id:fakeViewId, className:viewSampleElement.className, style:viewSampleElement.style.cssText}),
									Builder.node('img', {src:button.src, width:button.width, height:button.height, style:button.style})
								])
						])
				]);
			appendTarget.up('form').insert({'bottom': newSpan});
			Event.observe(f, 'change', autoAppendFunction);
			Event.observe(f, 'change', fakeFunction);
		}
	}
	$$('.multiple_file').each(function(item) {
		item.observe('change', autoAppendFunction);
	});
}

var fakeFunction = function(event) {
	var element = event.element();
	var view = element.getAttribute("view");
	if(view) {
		
		$(view).value = element.value;
	}
}
	
function fakeFileElement() {
	
	$$('input.file').each(function(item) {
		item.observe('change', fakeFunction);
	});
}

function setupToolTips() {
	$$(".tool_tip").each(function(element) {
		element.observe('mouseover', onToolTipOver);
		element.observe('mouseout', onToolTipOut);
	});
}

function onToolTipOver(event) {
	var element = event.element();
	var message = element.getAttribute("tooltip");
	var div = new Element("div", {className:"tool_tip_box"});
	
	/*
	if(element.tiplayer) {
		new Effect.Appear(element.tiplayer);
		return false;
	}
	*/
	element.tiplayer = div;
	element.tiplayer.update(message);
	
	// div.setStyle({left:'0px', top:'0px'});
	element.up().insert({bottom:div});
	
	element.tiplayer = div;
	var positionInfo = element.positionedOffset();
	
	var x = event.pointerX() - element.cumulativeOffset()['left'];
	var y = event.pointerY() - element.cumulativeOffset()['top'];
	
	div.setStyle({
		left: positionInfo['left'] + x + 8 + "px",
		top: positionInfo['top']+ y + 8 + "px"});
	new Effect.Appear(element.tiplayer, {duration:'0.5'});
}

function onToolTipOut(event) {
	var element = event.element();
	if(element.tiplayer) {
		new Effect.Fade(element.tiplayer, {duration:'0.3'});
		if(Prototype.Browser.IE) {
			element.tiplayer.remove();
		}		
	}
}

/**
 * Document Auto Scripting : RollOver Image
 * rollover À̹ÌÁö¿¡ ´ëÇØ ÀÚµ¿À¸·Î rollover, out ¹× select, deselect ¸¦ Áö¿øÇÑ´Ù.
 * 
 * 1. ¼³Á¤¹æ¹ý
 * img ű׸¦ »ç¿ëÇØ¾ß Çϸç, 'rollover_image' class ¸¦ »ç¿ëÇؾßÇÑ´Ù.
 * over À̹ÌÁö´Â out À̹ÌÁö¿Í °°Àº °æ·Î¿¡ À§Ä¡ÇÏ¿©¾ßÇϸç, °ªÀ¸·Î´Â ÆÄÀÏ¸í¸¸ ±â¼úÇÑ´Ù.
 * ex) <img src="/resource/images/bt_out.gif" over="bt_roll.gif" class="rollover_image" />		OK
 * ex) <img src="/resource/images/bt_out.gif" over="bt_roll.gif" class="iwannaberollover" />	Fail. class ¼Ó¼ºÀ¸·Î rollover_image °¡ ÁöÁ¤µÇÁö ¾Ê¾Ò´Ù.
 * ex) <img src="/resource/images/bt_out.gif" over="/resource/images/bt_roll.gif" class="rollover_image" /> Fail. over ¼Ó¼º°ªÀ¸·Î ÆÄÀÏ¸í¸¸ ±â¼úÇؾßÇÑ´Ù. 
 *
 * 2. ±â´É »ç¿ë ¹ý
 * rollover, rollout Àº tag¸¦ ÀÛ¼ºÇÏ´Â °Í¸¸À¸·Î ÆäÀÌÁö ·Îµù½Ã¿¡ µ¿ÀÛÇÑ´Ù.
 * changeToSelect function Àº À̹ÌÁö¸¦ rollover »óÅ·Π°íÁ¤ÇÑ´Ù.
 * changeToDeselect function Àº À̹ÌÁö¸¦ rollout »óÅ·Π°íÁ¤ÇÑ´Ù.
 * ex) 
   <img id="btRoll" src="/rs/bt_out.gif" over="bt_roll.gif" class="rollover_image" />
   <script type="text/javascript">
   $('btRoll').selectToSelect(); // btRoll image ¸¦ rollover ½ÃŲ´Ù.
   $('btRoll').selectToDeselect(); // btroll image ¸¦ rollout ½ÃŲ´Ù.
   </script>
 *
 * @author ÆíÇöÀå
 */
document.observe('dom:loaded', setupRollOverImages);


/**
 * Document Auto Scripting : Auto Append File Field
 * file element ÀÇ class·Î 'multiple_file' ¸¦ °¡Áö¸é ÀÚµ¿ÀûÀ¸·Î Çʵå Ãß°¡¸¦ Áö¿øÇÑ´Ù
 * ex) <input type="file" class="multiple_file" />	OK
 * ex) <input type="file" /> 					Fail. multiple_file Css Ŭ·¡½º¸¦ °¡ÁöÁö ¾ÊÀ¸¹Ç·Î, ÆÄÀÏ Çʵ带 Ãß°¡ÇÏÁö ¾Ê´Â´Ù.
 * @author ÆíÇöÀå
 */
document.observe('dom:loaded', addMultipleFileFunction);

document.observe('dom:loaded', fakeFileElement);

/**
 * Document Auto Scriting : Tool Tip
 * element ÀÇ class ·Î 'tool_tip' À» °¡Áö¸é element ÀÇ 'tooltip' attribute °ªÀ» ÅøÆÁÀ¸·Î º¸¿©ÁØ´Ù.
 */
document.observe('dom:loaded', setupToolTips);