/*      slideMenu.js
	used for the slide menu of attribute narrawing function for alibaba japan.
	created by Inoue. 2009 .8 .13         */

$().ready(function(){
	// for first window loading
	$("#attrNarrListDisappear").attr("style","display:block;");
	$(".firstSlideButton").attr("style","display:none;");
	var lang="CN";
	if($(".firstSlideButton").hasClass("firstSlideButtonJp")){
		lang="JP";
	}
	// getting height of element
	var targetElm = $("#attrNarrListDisappear").get(0);
	var targetOuterHeight = targetElm.offsetHeight;
	$("#slideArea").slideBox({width: "100%", height: targetOuterHeight + "px", position: "top",language:lang});
});

(function($){
	
	$.fn.slideBox = function(params){
	
		// getting height of element
		var targetElm = $("#attrNarrListDisappear").get(0);
		var targetOuterHeight = targetElm.offsetHeight;
	
		var content = $(this).html();
		var defaults = {
			width: "100%",
			height: targetOuterHeight + "px",
			position: "top"	,		// Possible values : "top", "bottom"
			language:"JP"
		}
		
		// extending the fuction
		if(params) $.extend(defaults, params);
		var divPanel = $("<div class='attrNarrSlidePart'>");
		var divContent = $("<div class='attrNarrContents'>");
	
		$(divContent).html(content);
		$(divPanel).addClass(defaults.position);
		$(divPanel).css("width", defaults.width);
		
		// centering the slide panel
		$(divPanel).css("left", (100 - parseInt(defaults.width))/2 + "%");
	
		// if position is top we're adding 
		if(defaults.position == "top")
			$(divPanel).append($(divContent));
		
		// adding buttons
		if(params.language=="JP"){
			$(divPanel).append("<p class='slideButton slideButtonJp'>open</p>");
			$(divPanel).append("<p style='display:none;' id='closeButton' class='slideButton closeButtonJp'>close</p>");
		}else{
			$(divPanel).append("<p class='slideButton slideButtonCn'>open</p>");
			$(divPanel).append("<p style='display:none;' id='closeButton' class='slideButton closeButtonCn'>close</p>");
		}
		
		if(defaults.position == "bottom")
			$(divPanel).append($(divContent));
		
		$(this).replaceWith($(divPanel));
		
		
		var toggleFlg = 0;

		// Buttons action
		$(".slideButton").click(function(){
			if($(this).attr("id") == "closeButton") {
				$(divContent).animate({height: "0px"}, 200);
				toggleFlg = 0;
			} else {
				$(divContent).animate({height: defaults.height}, 200);
				toggleFlg = 1;
			}
			
			$(".slideButton").toggle();
		});
		
		// besides Buttons action
		$(document).bind('click', function(e) {
		    var $clicked = $(e.target);
		    if (! $clicked.parents().hasClass("categoryBoxSelect")) {
		        $(divContent).animate({height: "0px"}, 200);
		        
		        if(toggleFlg == 1) {
					$(".slideButton").toggle();
					toggleFlg = 0;
				}
			}
		});

	};
	
})(jQuery);