$(document).ready(function() {
 
    //Speed of the slideshow
    var speed = 2000;
     
    //You have to specify width and height in #slider CSS properties
    //After that, the following script will set the width and height accordingly
    $('.mask-gallery, .gallery li').width($('.slider').width());   
    $('.gallery').width($('.slider').width() * $('.gallery li').length);
    $('.mask-gallery, .gallery li, .mask-excerpt, .excerpt li').height($('.slider').height());
     
    //Assign a timer, so it will run periodically
    var run = setInterval('newsslider(0)', speed); 
     
    $('.gallery li:first, .excerpt li:first').addClass('selected');
 
    //Pause the slidershow with clearInterval
    //$('#btn-pause').click(function () {
        clearInterval(run);
        //return false;
    //});
 
    //Continue the slideshow with setInterval
    /*$('#btn-play').click(function () {
        run = setInterval('newsslider(0)', speed); 
        return false;
    });*/
     
    //Next Slide by calling the function
    /*
	$('#btn-next').click(function () {
        newsslider(0); 
        return false;
    });*/
    //Previous slide by passing prev=1
    /*$('#btn-prev').click(function () {
        newsslider(1); 
        return false;
    });*/
     
    //Mouse over, pause it, on mouse out, resume the slider show
    $('.slider').hover(
        function() {
			run = setInterval('newsslider(0, "' + $(this).attr('id')  + '")', speed);
			newsslider(0, $(this).attr('id'))
        },
        function() {
            clearInterval(run);
        }
    ); 
     
});
 
 
function newsslider(prev, sliderId) {
 
    //alert(sliderId);
 
    //Get the current selected item (with selected class), if none was found, get the first item
    var current_image = $('#' + sliderId +' .gallery li.selected').length ? $('#' + sliderId +' .gallery li.selected') : $('#' + sliderId +'.gallery li:first');
    var current_excerpt = $('#' + sliderId +' .excerpt li.selected').length ? $('#' + sliderId +' .excerpt li.selected') : $('#' + sliderId +' .excerpt li:first');
 
 	//alert($('#' + sliderId +' .gallery li.selected').length);
 
    //if prev is set to 1 (previous item)
    if (prev) {
         
        //Get previous sibling
        var next_image = (current_image.prev().length) ? current_image.prev() : $('#' + sliderId +' .gallery li:last');
        var next_excerpt = (current_excerpt.prev().length) ? current_excerpt.prev() : $('#' + sliderId +' .excerpt li:last');
     
    //if prev is set to 0 (next item)
    } else {
         
        //Get next sibling
        var next_image = (current_image.next().length) ? current_image.next() : $('#' + sliderId +' .gallery li:first');
        var next_excerpt = (current_excerpt.next().length) ? current_excerpt.next() : $('#' + sliderId +' .excerpt li:first');
    }
    themask = $('#' + sliderId + ' .mask-gallery');
    //clear the selected class
    $('#' + sliderId +' .excerpt li, .gallery li').removeClass('selected');
    //alert($('#slider_0 .excerpt li, .gallery li').attr('id')); 
    //reassign the selected class to current items
    next_image.addClass('selected');
    //next_excerpt.addClass('selected');
 	
	
	next_image.fadeIn(1000);
    current_image.fadeOut(1000);
	//Scroll the items
    //themask.scrollTo(next_image, 800);      
    //$('#' + sliderId +' .mask-excerpt').scrollTo(next_excerpt, 800);                
     
}

var src1;
var src2;

function changeMarketPicture(mouseOverpicture){
	// change the two sources:
	src1 = document.getElementById("main-picture").src;
	src2 = mouseOverpicture.src;
	
	document.getElementById("main-picture").src = src2;
	mouseOverpicture.src = src1;
	
}