/*
 * MovingBoxes demo script
 */

$(function(){

	

	$('#slider-two').movingBoxes({
		startPanel   : 2,      // start with this panel
		width        : 330,    // overall width of movingBoxes (not including navigation arrows)
		panelWidth   : .4,     // current panel width adjusted to 70% of overall width
		buildNav     : false,   // if true, navigation links will be added
		//navFormatter : function(index, panel){ return panel.find('p').text(); } // function which gets nav text from span inside the panel header
	});

	// Add a slide
	var imageNumber = 0,
	slider = $('#slider-one'); // $('#slider-two'); // second slider

	$('button.add').click(function(){
		slider
		.append( panel.replace(/\*2/g, ++imageNumber).replace(/\*1/g, (imageNumber%7 + 1)) )
		.movingBoxes(); // update movingBoxes
	});

	// Remove a slide
	$('button.remove').click(function(){
		if (slider.data('movingBoxes').totalPanels > 1) {
			slider.find('.mb-panel:last').remove();
			slider.movingBoxes(); // update the slider
		}
	});

	// Set up demo external navigation links
	// could also set len = $('#slider-one').getMovingBoxes().totalPanels;
	var i, t = '', len = $('#slider-one .mb-panel').length + 1;
	for ( i=1; i<len; i++ ){
		t += '<a href="#" rel="' + i + '">' + i + '</a> ';
	}
	$('.dlinks')
		.find('p').html(t).end()
		.find('a').click(function(){
			slider.movingBoxes( $(this).attr('rel') );
			return false;
		});

});