﻿$(function() {
		$('.popup').fancybox(); 
		//var image = $('.image:first').attr("rel");
		//var bigpic = $('.image:first').attr("bigpic");
		//var title = $('.image:first').attr("title");
		//$("#image").html('<a class="popup" target="_blank" href="' + bigpic + '"><img src="../../../Upload/Design/big_pic_bg.gif" width="328" height="407" style=" background-image:url(' + image + ') ;  background-repeat:no-repeat;" /><a><p>' + title + '</p><br />');

    $(".image").click(function() {

        clearInterval(stop_interval);

        $("#image").stop();
        var image = $(this).attr("rel");
		var bigpic = $(this).attr("bigpic");
        var title = $(this).attr("title");
        $("#image").animate({ opacity: "0.0" }, 700, function() {
        $("#image").html('<a class="popup" target="_blank" href="' + bigpic + '"><img src="../../../Upload/Design/big_pic_bg.gif" width="328" height="407" style=" background-image:url(' + image + ')" ;  background-repeat:no-repeat; /></a><p>' + title + '</p><br />');
        });
        $("#image").animate({ opacity: "1.0" }, 700);
        

        return false;
    });
});

function slideSwitch() {
    var $active = $('.gallery_images a.active');

    if ($active.length == 0) $active = $('.gallery_images a:last');

    var $next = $active.next().length ? $active.next()
        : $('.gallery_images a:first');

    $active.addClass('last-active');

    $next.addClass('active');
    $active.removeClass('active last-active');
    
    var image = $next.attr("rel");
	var bigpic = $next.attr("bigpic");
    var title = $next.attr("title");
    $("#image").addClass('active').animate({ opacity: "0.0" }, 1000, function() {

    $("#image").html('<a class="popup" target="_blank" href="' + bigpic + '"><img src="../../../Upload/Design/big_pic_bg.gif" width="328" height="407" style=" background-image:url(' + image + ')" ;  background-repeat:no-repeat; /></a><p>' + title + '</p><br />');
        $active.removeClass('active last-active');
    });
    $("#image").animate({ opacity: "1.0" }, 1000);    
    
}

$(function() {
    var $first = $('.gallery_images a:last');
    $first.addClass('active');
	slideSwitch();
    stop_interval = setInterval("slideSwitch()", 4000);
});

