window.addEvent('domready', function() {
	var arrBG = [
		'images/showcase/web/binglee-bg.jpg',
		'images/showcase/web/taylors-wines-bg.jpg',
		'images/showcase/web/eighty-acres-bg.jpg',
		'images/showcase/web/holiday-inn-bg.jpg',
		'images/showcase/web/uts-bg.jpg',
		'images/showcase/web/veda-auto-bg.jpg',
		'images/showcase/web/griffith-university-bg.jpg',
		'images/showcase/web/miller-tripods-bg.jpg',
		'images/showcase/web/sahani-bg.jpg',
		'images/showcase/web/desking-systems-bg.jpg',
		'images/showcase/web/nic-forest-bg.jpg'
	];
	var hb = $('hb');
	var table = $('sc-table');
	var width = $('sc-table').clientWidth;
	var widthc = parseInt(table.getParent().getStyle('width'));
	var minLeft = 0;
	if (widthc < width) {
		minLeft = widthc - width;
	}
	var myFx = new Fx.Tween(table, {duration: 1000, transition: Fx.Transitions.linear});
	var scItems = $(document.body).getElements('.sc-item');
	var scwItems = $(document.body).getElements('.scw-item');
	scItems.each(function(item) {
		item.addEvent('click', function(e) {
			e.stop();
			var newItem = 0;
			for (var i = 0; i < scItems.length; i++) {
				if (item == scItems[i]) {
					newItem = i;
					scwItems[newItem].setStyle('visibility', 'visible');
					scItems[newItem].addClass('active');
					var imageFx = new Fx.Tween(hb, {duration: 500, transition: Fx.Transitions.Quad.easeInOut, onComplete: function() {
						hb.set('src', arrBG[newItem]);
						var imageFx2 = new Fx.Tween(hb, {duration: 1000, transition: Fx.Transitions.Quad.easeInOut});
						imageFx2.start('opacity', 1);
					}});
					imageFx.start('opacity', 0);
				}
				else {
					scwItems[i].setStyle('visibility', 'hidden');
					scItems[i].removeClass('active');
				}
			}
		});
	});
	$('sc-right').addEvents({
		'mouseenter': function() {
			var razn = width - widthc + parseInt(table.getStyle('left'));
			myFx.setOptions({duration: razn*6.7, transition: Fx.Transitions.linear})
			myFx.start('left', minLeft);
		},
		'mouseleave': function() {
			myFx.cancel();
		},
		'click': function(e) {
			e.stop();
		}
	});
	$('sc-left').addEvents({
		'mouseenter': function() {
			var razn = -parseInt(table.getStyle('left'));
			myFx.setOptions({duration: razn*6.7, transition: Fx.Transitions.linear})
			myFx.start('left', 0);
		},
		'mouseleave': function() {
			myFx.cancel();
		},
		'click': function(e) {
			e.stop();
		}
	});
});