var alpInit = function() {
	
	// variable declarations
	var sliderbar = $('sliderbar'),
		sliderVal = 0,
		thingToScroll = $('hscrolltarget'),
		scrollContainer = $('hscrollable'),
		maxwidth = 100, // default
		minheight = 50, // default
		maxheight = 100, // default
		maxsteps = 100; // default
		
	// only run the remaining code if we have all our proper objects
	if (thingToScroll != null && sliderbar != null && scrollContainer != null){
		minheight = (scrollContainer.get('alpminheight') != null? scrollContainer.get('alpminheight'):minheight);
		var initializeValues = function(){
			// set the container to scroll so we can compute the width
			scrollContainer.setStyle('overflow','scroll');
			
			// get the height of the tallest object
			$each(thingToScroll.getChildren(),function(j){
				maxheight = (maxheight<=j.getSize().y?j.getSize().y:maxheight);
			});
			maxheight = (maxheight<=minheight?minheight:maxheight);
			// set the container to the max height
			scrollContainer.setStyle('height',maxheight);
			
			// compute the width of the inner object
			if (thingToScroll.getChildren().length > 0) {
				var children = thingToScroll.getChildren();
				var lastobject = children[children.length-1];
				maxwidth = lastobject.getPosition(thingToScroll).x // position of last element
					+lastobject.getSize().x // width of last element
					+lastobject.getStyle('margin-right').toInt() // right margin of last element
					+children[0].getStyle('margin-left').toInt() // left margin of first element
					//-children[0].getPosition(thingToScroll).x // position of first element
					-(scrollContainer.getParent().getSize().x*.95); // total width of container
			}
			// now that we've computed the container width, set the overflow to hidden
			scrollContainer.setStyle('overflow','hidden');
		}
		initializeValues();
		
		var updateValue = function(){
			var newmargin = maxwidth*((sliderVal-maxsteps)/maxsteps);
			thingToScroll.setStyle('margin-left',newmargin);
		};
		updateValue();
		
		var slider = new Slider(sliderbar, sliderbar.getElement('.knob'), {
			range: [maxsteps,0],
			steps: maxsteps,  // Steps from 0 to 255
			wheel: true, // Using the mousewheel is possible too
			onChange: function(){
				// Based on the Slider values set an RGB value in the color array
				sliderVal = this.step;
				// and update the output to the new value
				updateValue();
			}
		}).set(maxsteps);
		
		var mousescroll = function(event) {
			if (slider.step > 0 && slider.step < maxsteps) {
				event = new Event(event).stop();
			}
		
			if (event.wheel > 0) {
				slider.set(sliderVal+1);
			}
			if (event.wheel < 0) {
				slider.set(sliderVal-1);
			}
		};

		$('hscrolltarget').addEvent('mousewheel', function(event) { mousescroll(event); });
		$('hscrolltarget').getChildren('img').each(function(i){
			i.addEvent('mousewheel', function(event) { mousescroll(event); });
		});		

		// haven't worked out how to gracefully handle a resize event
		/*
		var resizeWindow = function() {
			initializeValues();
		}
		
		window.addEvent('resize',resizeWindow);
		*/
	};
};


window.addEvent('domready', alpInit);