// jquery sliding funtions
var $webservicePath = "http://www.maestro-uk.com/Webservices/";
var $pageSize = 12;

jQuery(function ($) {


    //Most jQuery.localScroll's settings, actually belong to jQuery.ScrollTo, check it's demo for an example of each option.
    //@see http://www.freewebs.com/flesler/jQuery.ScrollTo/
    //You can use EVERY single setting of jQuery.ScrollTo, in the settings hash you send to jQuery.LocalScroll.


    var target = $('#photos').get(0); //the scrolled div

    // restart the scroll position to ( 0, 0 ) (Firefox doesn't reset it)
    // could use $(target).scrollTo( 0, {axis:'xy'));
    //but this needs to be quick(synchronous), to reset before $.localScroll.hash() begins

    //target.scrollLeft = target.scrollTop = 0;

    //scroll initially if there's a hash (#something) in the url 
//    $.localScroll.hash({
//        target: target, //could be a selector or a jQuery object too.
//        axis: 'xy', //the default is 'y'
//        queue: true,
//        duration: 1500
//    });

    //do some rounded corner stuff
    function hasBorderRadius() {
        var d = document.createElement("div").style;
        if (typeof d.borderRadius !== "undefined") return true;
        if (typeof d.WebkitBorderRadius !== "undefined") return true;
        if (typeof d.MozBorderRadius !== "undefined") return true;
        return false;
    };

    if (hasBorderRadius()) { // 1
        $("img.roundedCorners").each(function () { // 2
            $(this).wrap('<div class="roundedCorners" />'); // 3
            var imgSrc = $(this).attr("src"); // 4
            var imgHeight = $(this).height(); // 4
            var imgWidth = $(this).width(); // 4
            $(this).parent()
            .css("background-image", "url(" + imgSrc + ")")
            .css("background-repeat", "no-repeat")
            .css("height", imgHeight + "px")
            .css("width", imgWidth + "px"); // 5
            $(this).remove(); // 6
        });
    }

    var $last = $([]); //save the last link

    //Target examples bindings
    var $paneTarget = $('.layerTran');

    $("#catContainer").delegate(".content_products", "click", function () {
        var $Id = $.tmplItem(this).data.Id;
        PopulateProducts($Id, 1, $pageSize);
        $paneTarget.stop().scrollTo('530px', 1000, {
            onAfter: function () {
                $("#framesShop").hide();
            }
        });
    });

    $("#productsContainer").delegate(".gallery", "click", function () {
        var $Id = $.tmplItem(this).data.Id;
        PopulateImages($Id, 1, $pageSize);
        $paneTarget.stop().scrollTo('1060px', 1000, {
            onAfter: function () {
                $("#framesShop").hide();
            }
        });
    });

    function PopulateProducts(id, pageNumber, pageSize) {
        $("#makeId").val(id);
        $.WebServiceCall({
            url: $webservicePath + "Gallery.asmx/GetProducts",
            data: "{makeId: " + id + ", pageNumber: " + pageNumber + ", pageSize: " + pageSize + "}"
        }, function (json) {
            $.SetHtml({ control: $("#productsContainer"), html: "" });
            $('#productTemplate').tmpl(json.d.Results).appendTo('#productsContainer');
            ConstructPager(json.d.TotalItemCount, pageNumber, pageSize, $(".pagerDiv2"));
        });
    }

    function PopulateImages(id, pageNumber, pageSize) {
        $("#productId").val(id);
        $.WebServiceCall({
            url: $webservicePath + "Gallery.asmx/GetImages",
            data: "{productId: " + id + ", pageNumber: " + pageNumber + " ,pageSize: " + pageSize + "}"
        }, function (json) {
            $.SetHtml({ control: $("#imageContainer"), html: "" });
            $('#imageTemplate').tmpl(json.d.Results).appendTo('#imageContainer');
            ConstructPager(json.d.TotalItemCount, pageNumber, pageSize, $(".pagerDiv3"));
            $("a[rel='gallery']").colorbox();
        });
    }






    //inforamtion section

    $(".layerTranInformation div").css({ opacity: 0 });
    $(".layerTranInformation h3 a").click(
		function () {
		    $(this).addClass("information_active");
		    $(this).parent().next("div").removeClass("hide");
		    $(this).parent().siblings("h3").children("a").removeClass("information_active");
		    $(this).parent().siblings("div").animate({ opacity: 0 }, 100);
		    $("#infoPicture").addClass("hide");
		    $(this).parent().next("div").animate({ opacity: 0.8 }, 400);
		    return false;
		}
	);



});

//$('.clearme').example(function () {
//    return $(this).attr('title');
//});