jQuery.popup = function(options) {

    var templateHtml = "";
    templateHtml += "<div id=\"__popup\" class=\"popup\">";
    templateHtml += "    <div class=\"popupTitle\"><b>aperion</b>audio</div>";
    templateHtml += "    <div class=\"popupContent\"/>";
    templateHtml += "</div>";

    options = jQuery.extend(true, {
        popupElement: "#__popup",
        rootElement: "body",
        templateHtml: templateHtml,
        overlayOptions: {
            api: true,
            color: "#ccc",
            expose: {
                color: "#000",
                loadSpeed: "fast"
            },
            absolute: false,
            top: "center",
            speed: "fast",
            close: ".close"
        }
    }, options);

    $(options.rootElement).prepend(options.templateHtml);

    var popupCtrl = $(options.popupElement);
    
    options.onLoad(popupCtrl.find(".popupContent"));

    var overlayApi = popupCtrl.overlay(options.overlayOptions);

    overlayApi.load();

}

jQuery.addToCart = function(options) {

    var templateHtml = "";
    templateHtml += "<p><span class=\"productTitle\"></span>&nbsp;has been added to your cart.</p>";
    templateHtml += "<p>";
    templateHtml += "    <img class=\"close\" src=\"/app_themes/aperion/images/buttons/continue_shopping.gif\" />&nbsp;&nbsp;";
    templateHtml += "    <a href=\"/Basket/ShoppingCart.aspx\"><img src=\"/app_themes/aperion/images/buttons/view_cart_btn.gif\" /></a>";
    templateHtml += "</p>";

    options = jQuery.extend(true, {
        qty: 1,
        productNameElement: ".productTitle",
        productName: "The item",
        showPopup: true,
        rootElement: "body",
        onItemAdded: {},
        templateHtml: templateHtml
    }, options);

    $.ajax({
        url: "/ClientServices/Cart.svc/AddToCart",
        data: "skuId=" + options.sku + "&qty=" + options.qty,
        success: function(data) { }
    });

    if (options.showPopup) {

        $.popup({
            onLoad: function(parent) {
                parent.html(templateHtml);
                parent.find(options.productNameElement).text(options.productName);
            }
        });

    }

    if (typeof options.onItemAdded == "function")
        options.onItemAdded(options);

    return this;

};

jQuery.addToWishlist = function(options) {

    var templateHtml = "";
    templateHtml += "<p><span class=\"productTitle\"></span>&nbsp;has been added to your wishlist.</p>";
    templateHtml += "<p>";
    templateHtml += "    <img class=\"close\" src=\"/app_themes/aperion/images/buttons/continue_shopping.gif\" />&nbsp;&nbsp;";
    templateHtml += "    <a href=\"/Profile/AccountInfo.aspx?tabId=3\"><img src=\"/app_themes/aperion/images/buttons/view_wishlist_btn.gif\" class=\"WishlistLink\" /></a>";
    templateHtml += "</p>";

    options = jQuery.extend(true, {
        productNameElement: ".productTitle",
        productName: "The item",
        showPopup: true,
        rootElement: "body",
        onItemAdded: {},
        templateHtml: templateHtml
    }, options);

    $.ajax({
        url: "/ClientServices/Cart.svc/AddToWishlist",
        data: "skuId=" + options.sku,
        success: function(data) { }
    });

    if (options.showPopup) {

        $.popup({
            onLoad: function(parent) {
                parent.html(templateHtml);
                parent.find(options.productNameElement).text(options.productName);
                parent.find("a.WishlistLink").rollover("/app_themes/aperion/images/buttons/view_wishlist_btn_over.gif");
            }
        });

    }

    if (typeof options.onItemAdded == "function")
        options.onItemAdded(options);

    return this;

};

jQuery.fn.hoverClass = function(className) {

    this.each(function() {

        var $this = $(this);

        $this.hover(function() {
            $this.addClass(className);
        },
        function() {
            $this.removeClass(className);
        });

    });

    return this;

}

jQuery.fn.rollover = function(onImage, offImage) {
    return this.each(function() {    
        var currentImage = $(this).attr("src");            
        $(this).hover(function() {
            $(this).attr("src", onImage);
        }, function() {	
            if (offImage && offImage != "")
                $(this).attr("src",offImage);    
            else
                $(this).attr("src", currentImage);    
        });
        
    });
}

jQuery.fn.aperionBox = function() {
    $(this).find(".header .info").wrap("<div class=\"stripe\"><div class=\"west\"><div class=\"east\"></div></div></div>");
    $(this).find(".content .info").wrap("<div class=\"north\"><div class=\"west\"><div class=\"east\"><div class=\"south\"><div class=\"ne\"><div class=\"nw\"><div class=\"se\"><div class=\"sw\"></div></div></div></div></div></div></div></div>");
    $(this).addClass("roundContainer");
}