MaazAli/phanime

View on GitHub
client/components/animeExplore/animeExplore.js

Summary

Maintainability
B
5 hrs
Test Coverage
Template.animeExplore.created = function() {

    // Initialize reactive variables
    this.loaded = new ReactiveVar(0);
    this.limit = new ReactiveVar(24);
    this.ready = new ReactiveVar(false);
    this.filterObject = new ReactiveVar({});
    this.sortObject = new ReactiveVar({canonicalTitle: 1});

    // Display purposes
    this.dateCurrentlyActive = new ReactiveVar("None");

    var self = this;

    this.autorun(function() {
        var limit = self.limit.get();
        var filterObject = self.filterObject.get();
        var sortObject = self.sortObject.get();

        console.log("Asking for " + limit + " activities");

        var subscription = Meteor.subscribe('animeExplore', limit, filterObject, sortObject);

        // We wait until we've got the subscription to be ready
        if (subscription.ready()) {
            self.loaded.set(limit);
            self.ready.set(true);
        } else {
            self.ready.set(false);
        }
    });


    // This will be our activity cursor
    this.anime = function() {
        return Anime.find(self.filterObject.get(), {sort: self.sortObject.get(), limit: self.loaded.get()});
    }

}

Template.animeExplore.rendered = function() {
    // Initialize the selectize plugin
    var self = this;

    $("#selectGenre").selectize({
        valueField: "name",
        labelField: "name",
        searchField: "name",
        sortField: "name",
        create: false,
        onChange: function(value) {
            var filterObject = self.filterObject.get();

            if (!value) {
                if (filterObject.genres) {
                    delete filterObject.genres;
                }
            } else {
                filterObject.genres = {
                    $all: value
                };
            }

            self.filterObject.set(filterObject);
        },
        load: function(query, callback) {
            if (!query) {
                // Only make the call if query is empty.. so essentially on initialization
                Meteor.call('getGenres', function(error, result) {
                    if (!error) {
                        callback(result);
                    }
                });
            }

        },
        preload: true
    });

}

Template.animeExplore.events({
    'click #loadMore' : function(event, template) {

        var limit = template.limit.get();
        var increment = 18;

        console.log('Clicked');
        // Let's increment limit by our increment amount, so we can grab the next amount of activities
        template.limit.set(limit + increment);
    },
    'click #upcomingAnime' : function(event, template) {
        // Upcoming anime should have their start date be greater than today's date
        var filterObject = template.filterObject.get();

        // We'll remove the $or because it's for currently airing
        if (filterObject.$and)
            delete filterObject.$and;

        filterObject.startDate = {
            $gte: new Date()
        };

        template.dateCurrentlyActive.set("Upcoming");

        template.filterObject.set(filterObject);
    },
    'click #currentlyAiring' : function(event, template) {
        // Currently airing anime would either not have endDate field or it's value will be greater than
        // today's date and will have their start date before today's value
        var filterObject = template.filterObject.get();
        // We'll have to remove any other date conditions on here first
        if (filterObject.startDate)
            delete filterObject.startDate;

        filterObject.$and = [{
            $or: [{
                endDate: {$gte: new Date()}
            },
            {
                endDate: {$exists: false}
            },
            {
                endDate: "0000-00-00" // For the dates that are still represented as strings
            }]
        },
        {
            startDate: {
                $lt: new Date()
            }
        }];


        template.dateCurrentlyActive.set("Currently Airing");
        template.filterObject.set(filterObject);
    },
    'click #noneDate' : function(event, template) {
        // This method essentially resets and date restrictions we had
        // like upcoming or currentlyAiring
        var filterObject = template.filterObject.get();

        if (filterObject.startDate)
            delete filterObject.startDate;

        if (filterObject.$and)
            delete filterObject.$and;

        template.dateCurrentlyActive.set("None");
        template.filterObject.set(filterObject);
    }
});


Template.animeExplore.helpers({

    anime: function() {
        return Template.instance().anime();
    },
    isReady: function() {
        return Template.instance().ready.get();
    },
    hasMoreAnime: function() {
        return Template.instance().anime().count() >= Template.instance().limit.get();
    },
    dateCurrentlyActive: function(type) {
        if (type === Template.instance().dateCurrentlyActive.get()) {
            return 'active';
        } else {
            return '';
        }
    }
});