$(document).ready(function() {
new History($('#productsHistoryAdded'),
        $('#searchHistoryAdded'),
        $('#hlViewProducts'),
        $('#hlViewSearches'),
        $('#hlHideProducts'),
        $('#hlHideSearches'));
});

function History(productContainer, searchContainer, linkViewProducts,
 linkViewSearches, linkHideProducts, linkHideSearches) {
    this.productContainer = productContainer;
    this.searchContainer = searchContainer;
    this.linkViewSearches = linkViewSearches;
    this.linkViewProducts = linkViewProducts;
    this.linkHideProducts = linkHideProducts;
    this.linkHideSearches = linkHideSearches;

    this.initializeHistory();
}

History.prototype.initializeHistory = function() {
    var currentHistory = this;
    this.linkViewProducts.click(function(e) { currentHistory.ViewProducts(); e.preventDefault(); });
    this.linkViewSearches.click(function(e) { currentHistory.ViewSearches(); e.preventDefault(); });
    this.linkHideProducts.click(function(e) { currentHistory.HideProducts(); e.preventDefault(); });
    this.linkHideSearches.click(function(e) { currentHistory.HideSearches(); e.preventDefault(); });
};

History.prototype.productsCallback = function(data) {
    var htmlContent = [];

    for (var i = 0; i < data.length; i++) {
        htmlContent.push('<div class="history-product"><span class="illusSmall">',
                        '<a href="', data[i].ProductUrl, '" class="link">',
                            '<img class="imgHistory" src="', data[i].ImageUrl, '" />',
                        '</a></span><p class="bsTitle"><a href="', data[i].ProductUrl, '" CssClass="link">', 
                             data[i].Title,
                        '</a></p><p class="bsAuthor">',
                         data[i].Author, '</p></div>');
    }
    this.productContainer.hide().html(htmlContent.join('')).show('fast');
    this.linkViewProducts.hide();
    this.linkHideProducts.show();
}

History.prototype.searchesCallback = function(data) {
    var htmlContent = [];

    for (var i = 0; i < data.length; i++) {
        htmlContent.push('<div><a class="link" href="', data[i].SearchUrl, '">',
                    data[i].Search, '</a><span>,&nbsp</span>',
                '<span class="source">', data[i].Source, '</span></div>');
    }
    this.searchContainer.hide().html(htmlContent.join('')).show('fast');
    this.linkViewSearches.hide();
    this.linkHideSearches.show();
}

History.prototype.HideProducts = function() {
    this.productContainer.hide('fast', function() { $(this).html('') });
    this.linkViewProducts.show();
    this.linkHideProducts.hide();
}

History.prototype.HideSearches = function() {
    this.searchContainer.hide('fast', function() { $(this).html('') });
    this.linkViewSearches.show();
    this.linkHideSearches.hide();
}

History.prototype.ViewProducts = function() {
    var currentHistory = this;
    $.ajax(
    {
        type: "POST",
        contentType: "application/json; charset=utf-8",
        url: '/WebServices/History.asmx/GetProductsHistory',
        dataType: 'json',
        data: '{skip:5}',
        success: function(data) {
            currentHistory.productsCallback(data);
        }
    });
};

History.prototype.ViewSearches = function() {
    var currentHistory = this;
    $.ajax(
    {
        type: "POST",
        contentType: "application/json; charset=utf-8",
        url: '/WebServices/History.asmx/GetSearchesHistory',
        dataType: 'json',
        data: "{skip:5}",
        success: function(data) {
            currentHistory.searchesCallback(data);
        }
    });
};