//=================================================================
// SUMMARY 
//=================================================================
//
// A simple Knockout.js Category viewmodel. Each Category is 1 slide
// of an embedded Twitter Boostrap Carousel. Each Category also lazy
// loads an ObservableArray of Article items, when the Category slide
// becomes active in the Twitter Boostrap Carousel. The lazy loading
// of the Articles is only done once per slide.
var CategoryViewModel = function (parent, jsonCat) {

    this.Id = jsonCat.Id;
    this.Parent = parent;
    this.LoadedArticles = ko.observable(false);
    this.Title = ko.observable(jsonCat.Title);
    this.Description = ko.observable(jsonCat.Description);
    this.Articles = ko.observableArray();
    var context = this;

    this.hasArticles = ko.computed(function() {
        return context.Articles().length > 0;
    }, this);

        
    // Shows a modal dialog of the clicked Article
    this.articleClicked = function (article) {
        context.Parent.SetArticle(article);
    };

    // Do the lazy load of the article. Basically only do it
    // when this fuction is called externally
    this.loadArticles = function () {

            
        if (this.LoadedArticles() == true) {
            return;
        }

        this.LoadedArticles(true);

        // Push stuff to articles
        $.when($.ajax('/api/article/GetAll/' + this.Id))
            .then(function (data, textStatus, jqXHR) {
                for (var i = 0; i < data.length; i++) {
                    context.Articles.push(data[i]);

                    $('#img' + data[i].Id).tooltip({
                        title: data[i].ShortDescription,
                        trigger: 'hover focus'
                    });
                }
        });
    };
};