function VCarousel(obj, w, h)
{
	this.cont = $("<div class='VCarousel_container' style='border:solid 0px green; overflow:hidden; border:solid 0px blue;'></div>");
	this.inner = $("<div class='VCarousel_inner' style='overflow:visible; height:1px; border:solid 0px green;'></div>");
	this.obj = $(obj);
	
	this.onClick = function(e)
	{
		alert(this);
	}
	
	this.onMouseMove = function(e)
	{
		var car = this.carousel;
		
		if (this.offsetHeight > car.inner[0].offsetHeight)return;
		var localY = e.pageY-getTop(this);
		var percent = (localY- this.offsetHeight*0.2)/(this.offsetHeight*0.6);
		percent = (percent>1)?1:percent<0?0:percent;
		car.inner.css("top", percent*(this.offsetHeight - car.inner[0].offsetHeight)+"px");
		$("#debug").text(car.inner[0].offsetHeight+"px");
		
	}
	
	
	this.inner.css("width", this.obj[0].offsetWidth+"px").css("height", this.obj[0].offsetHeight+"px");
	this.obj.wrapInner(this.inner[0]);
	this.inner = $(this.obj[0].firstChild);
	this.cont[0].carousel = this;
	this.inner.prependTo(this.cont);
	this.cont.prependTo(this.obj)
	
	this.cont.css("overflow", "hidden").css("width", w+"px").css("height", h+"px");
	this.cont.bind("mousemove", this.onMouseMove);
	this.cont.css("position", "relative").css("display", "inline-block");
	this.inner.css("position", "relative").css("display", "block");
	//alert(obj.style.border);
	

}

function HCarousel(obj, w, h){
	var delta = 240;
	var object = $(obj).clone().css({position:"relative"});
	var width = w;
	
	//var height = $(obj).outerHeight();
	var height = h;
	var parent = object.parent();
	var mask = $('<div id="images_overlay"></div>').append(object).css({"height":height});
	var btn_left = $('<a id="btn_left" src="/img/carousel_btn_left.png"/></a>').css("visibility", "hidden");
	var btn_right = $('<a id="btn_right" src="/img/carousel_btn_right.jpg"/></a>');
	var wrapper =  $('<div class="hcarousel"></div>')
	.append(btn_left)
	.append(mask)
	.append(btn_right);
	$(obj).replaceWith(wrapper);
	
	this.onRightClick = function(e){	
		var newX =  (parseFloat(object.css("left"))?parseFloat(object.css("left")):0) -delta;
		if (newX < width-object.innerWidth()+10) {
			newX = width-object.innerWidth();
			btn_right.css("visibility", "hidden");
		}
		btn_left.css("visibility", "visible");
		object.animate({"left":newX}, 200);
	}
	
	this.onLeftClick = function(e){
		var newX = (parseFloat(object.css("left"))?parseFloat(object.css("left")):0) +delta;
		if (newX > -10) {
			newX = 0;
			btn_left.css("visibility", "hidden");
		}
		btn_right.css("visibility", "visible");
		object.animate({"left": newX}, 200);
	}
	
	var btnLeft = $("#btn_left").bind("click", this.onLeftClick);
	var btnRight = $("#btn_right").bind("click", this.onRightClick);;/**/
}

function VGalery(obj, w, h){
	var delta = 186;
	var object = $(obj).clone().css({position:"relative"});
	var width = w;
	this.delta = 186;
	
	//var height = $(obj).outerHeight();
	var height = h;
	var parent = object.parent();
	var mask = $('<div id="images_overlay"></div>').append(object).css({"width":width, "height":height});
	var btn_top = $('<a id="btn_top" src="/img/carousel_btn_top.png"/></a>').css("visibility", "hidden");
	var btn_bottom = $('<a id="btn_bottom" src="/img/carousel_btn_bottom.png"/></a>');
	var wrapper =  $('<div class="vgalery"></div>')
	.append(btn_top)
	.append(mask)
	.append(btn_bottom);
	$(obj).replaceWith(wrapper);
	
	this.onBottomClick = function(e){	
		var newY =  (parseFloat(object.css("top"))?parseFloat(object.css("top")):0) -delta;
		if (newY < height-object.innerHeight()+10) {
			newY = height-object.innerHeight();
			btn_bottom.css("visibility", "hidden");
		}
		btn_top.css("visibility", "visible");
		object.animate({"top":newY}, 200);
	}
	
	this.onTopClick = function(e){
		var newY = (parseFloat(object.css("top"))?parseFloat(object.css("top")):0) +delta;
		if (newY > -10) {
			newY = 0;
			btn_top.css("visibility", "hidden");
		}
		btn_bottom.css("visibility", "visible");
		object.animate({"top": newY}, 200);
	}
	
	var btnTop = $("#btn_top").bind("click", this.onTopClick);
	var btnBottom = $("#btn_bottom").bind("click", this.onBottomClick);;/**/
}
