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

	var imageNumber = 0,
	slider = $('#slider-two');

	$('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
		}
	});

	var i, t = '', len = $('#slider-two .mb-panel').length + 1;
	for ( i=1; i<len; i++ ){
		t += '<a href="#" rel="' + i + '">' + i + '</a> ';
	}
	$('.dlinks')
		.find('span').html(t).end()
		.find('a').click(function(){
			slider.movingBoxes( $(this).attr('rel') );
			return false;
		});

	$('.mb-slider').bind('initialized.movingBoxes initChange.movingBoxes beforeAnimation.movingBoxes completed.movingBoxes',function(e, slider, tar){
		if (window.console && window.console.firebug){
			var txt = slider.$el[0].id + ': ' + e.type + ', now on panel #' + slider.curPanel + ', targeted panel is ' + tar;
			console.debug( txt );
		}
	});

});