// JavaScript Document

$(function() {
	$(".scroll-content").css("width", ( $(".scroll-content table.default").outerWidth(true) ) );	
	$('.scroll-content img').load(function() { 
		$(".scroll-content").css("width", ( $(".scroll-content table.default").outerWidth(true) ) );	
	 });
	//scrollpane parts
	var scrollPane = $( ".scroll-pane" ),
	scrollContent = $( ".scroll-content" );
	
	//build slider
	var scrollbar = $( ".scroll-bar" ).slider({
		slide: function( event, ui ) {
			scrollContent.css( "margin-left", Math.round(
				ui.value / 100 * ( scrollPane.width() - scrollContent.width() )
			) + "px" );
		},
		stop: function( event, ui ) {
			scrollContent.animate( { "margin-left" : Math.round(
				ui.value / 100 * ( scrollPane.width() - scrollContent.width() )
			) + "px" }, 500, 'linear' );
		},
		animate: true 
	});	
	//append icon to handle
	scrollbar.find( ".ui-slider-handle" ).wrap( "<div class='ui-handle-helper-parent'></div>" ).parent();
	
});