function gotoSlide(pos, toSlide){
		if ( !$(toSlide + ' .iphone_slides').is(":animated") ) {
			$(toSlide + ' .slide_ctrl li a').removeClass();
			$(toSlide + ' .slide_ctrl li:eq(' + pos + ') a').addClass('act');
			var shiftX = pos * $('.iphone_slides div').width();
			$(toSlide + ' .iphone_slides').stop().animate({marginLeft:-shiftX+'px'},450);
		}
	}
	
$(document).ready(function(){
	if ($('#demo1_video').length > 0) {
		video = document.getElementById('demo1_video');
		video.addEventListener('ended', function () {
			$('#demo1_screen').fadeOut('slow');
		}, false);
		video = document.getElementById('demo2_video');
		video.addEventListener('ended', function () {
			$('#demo2_screen').fadeOut('slow');
		}, false);
		$('.playVideo').click(function(){
			$('#demo1_stop').hide();
			$('#demo1_button').show();
			$('#demo2_stop').hide();
			$('#demo2_button').show();
			demoName = $(this).attr('rel'); //demo1 or demo2
			$('#'+demoName+'_stop').show();
			$('#'+demoName+'_button').hide();
			//in case a video is already playing:
			if(typeof video != "undefined")
				if(video != null)
					video.pause(); 
			$('#demo1_screen').hide();
			$('#demo2_screen').hide();
			//ok, let's do it:
			video = document.getElementById(demoName + '_video');
			$('#'+demoName+'_screen').fadeIn('slow', function(){
				video.play();
			});
			return false;
		});
		$('.stopVideo').click(function(){
			video.pause();
			$('#demo1_stop').hide();
			$('#demo1_button').show();
			$('#demo2_stop').hide();
			$('#demo2_button').show();
			$('#demo1_screen').fadeOut('slow');
			$('#demo2_screen').fadeOut('slow');
			video=null;
			return false;
		});
	}
	else //flash flowplayer:
	{
		playingDemo = '';
		$('.playVideo').click(function(){
			$('#demo1_stop').hide();
			$('#demo1_button').show();
			$('#demo2_stop').hide();
			$('#demo2_button').show();
			demoName = $(this).attr('rel');
			$(this).hide();
			$('#'+demoName+'_stop').show();
			if(demoName != playingDemo) //if user clicks play on already playing button, ignore.
			{
				if(playingDemo != '') // pressed play while playing another demo
				{
					if(playingDemo == 'demo1')
						$f(0).stop();
					if(playingDemo == 'demo2')
						$f(1).stop();
					$('#demo1_screen').hide();
					$('#demo2_screen').hide();
				}
				$('#'+demoName+'_screen').fadeIn('slow', function(){
					if(demoName == 'demo1')
						$f(0).play();
					if(demoName == 'demo2')
						$f(1).play();
				});
				playingDemo = demoName;
			}
			return false;
		});
		$('.stopVideo').click(function(){
			if(playingDemo == 'demo1')
				$f(0).stop();
			if(playingDemo == 'demo2')
				$f(1).stop();
			$('#'+playingDemo+'_screen').fadeOut('slow');
			$('#demo1_stop').hide();
			$('#demo1_button').show();
			$('#demo2_stop').hide();
			$('#demo2_button').show();
			playingDemo = '';
			return false;
		});
	}
	
	$('.iphone_slideshow').each(function() {
	
	var totWidth=0;
	var positions = new Array();

	$('.iphone_slides div', this).each(function(i){
		/* Loop through all the slides and store their accumulative widths in totWidth */
		positions[i]= totWidth;
		totWidth += $(this).width();

		/* The positions array contains each slide's commulutative offset from the left part of the container */

		if(!$(this).width())
		{
			alert("Please, fill in width & height for all your images!");
			return false;
		}
	});

	$('.iphone_slides', this).width(totWidth);

	/* Change the container div's width to the exact width of all the slides combined */
	
	});
	
	$('.iphone_slides a').click(function(){
		var toSlide = '#' + $(this).closest('.iphone_slideshow').attr('id');
		var pos = Math.abs(parseInt($(toSlide + ' .iphone_slides').css('margin-left')) / $('.iphone_slides div').width());
		if (pos < $(toSlide + ' .iphone_slides div').length-1) {
			gotoSlide(pos+1, toSlide);
		} else {
			gotoSlide(0, toSlide);
		}
		return false;
	});
	
	$('.slide_ctrl li a:not([class*="slide"])').click(function(e){
		var toSlide = '#' + $(this).parent().parent().attr('rel');
		var pos = $(this).parent().prevAll().length;
		gotoSlide(pos, toSlide);
		return false;
		/* Prevent the default action of the link */
	});
	
	$('.slide_left').click(function(){
		var toSlide = '#' + $(this).parent().attr('rel');
		var pos = Math.abs(parseInt($(toSlide + ' .iphone_slides').css('margin-left')) / $('.iphone_slides div').width());
		if (pos > 0) {
			gotoSlide(pos-1, toSlide);
		} else {
			gotoSlide(($(toSlide + ' .iphone_slides div').length-1), toSlide)
		}
		return false;
	});
	
	$('.slide_right').click(function(){
		var toSlide = '#' + $(this).parent().attr('rel');
		var pos = Math.abs(parseInt($(toSlide + ' .iphone_slides').css('margin-left')) / $('.iphone_slides div').width());
		if (pos < $(toSlide + ' .iphone_slides div').length-1) {
			gotoSlide(pos+1, toSlide);
		} else {
			gotoSlide(0, toSlide);
		}
		return false;
	});
	
	
	
});
