var mySlide;
var knobRation;
var steps;

function init(width)
{
	var backSize = width;

	function recalcParams()
	{
		var size = $('wrap1').getSize();
		steps = backSize - size.size.x;
		knobRation = backSize / $('area').clientWidth;
	}

	recalcParams();

	mySlide = new Slider($('area'), $('knob'), {
		steps: steps,
		offset: 0,
		onChange: function(pos)
		{
			$('collage').style.left = -pos + 'px';
			$('knob').style.backgroundPosition = -(pos / knobRation) + 'px ' + 'top'
		}
	});

	window.addEvent('resize', function() {
		recalcParams();

		mySlide.options.steps = steps;
		mySlide.max = mySlide.element['offsetWidth'] - mySlide.knob['offsetWidth'] + (mySlide.options.offset * 2);
		mySlide.half = mySlide.knob['offsetWidth'] / 2;

		if (mySlide.drag.options.lim) {
			mySlide.drag.options.lim[mySlide.z] = [-mySlide.options.offset, mySlide.max - mySlide.options.offset];
		} else if (mySlide.drag.options.limit) {
			mySlide.drag.options.limit[mySlide.z] = [-mySlide.options.offset, mySlide.max - mySlide.options.offset];
		}
	});

	$('body').addEvents({
		'wheelup': function(e)
		{
			e = new Event(e).stop();
			mySlide.set(mySlide.step - 100);
		},
		'wheeldown': function(e)
		{
			e = new Event(e).stop();
			mySlide.set(mySlide.step + 100);
		}
	});
}

Element.Events.extend({
	'wheelup':
	{
		type: Element.Events.mousewheel.type,
		map: function(event)
		{
			event = new Event(event);
			if (event.wheel >= 0) this.fireEvent('wheelup', event);
		}
	},
	'wheeldown':
	{
		type: Element.Events.mousewheel.type,
		map: function(event)
		{
			event = new Event(event);
			if (event.wheel <= 0) this.fireEvent('wheeldown', event);
		}
	}
});

function arrowinitStep()
{
	var timer = null;

	document.getElementById('arrow_left_href').onmouseover = function() {
		timer = window.setInterval(function(){ mySlide.set(mySlide.step - 30); }, 50);
	}

	document.getElementById('arrow_left_href').onmouseout = function() {
		window.clearInterval(timer);
	}

	document.getElementById('arrow_right_href').onmouseover = function() {
		timer = window.setInterval(function(){ mySlide.set(mySlide.step + 30); }, 50);
	}

	document.getElementById('arrow_right_href').onmouseout = function() {
		window.clearInterval(timer);
	}

	$('arrow_left_href').addEvent('click', function(){ mySlide.set(mySlide.step - $('knob').clientWidth * knobRation) });
	$('arrow_right_href').addEvent('click', function(){ mySlide.set(mySlide.step + $('knob').clientWidth * knobRation) });
}