JSFiddle - React, Tailwind, and code Playground

by Mohamed Farouk

HTML

<script src="http://underscorejs.org/underscore-min.js"></script>
<script src="http://backbonejs.org/backbone-min.js"></script>

JavaScript

var Project = Backbone.Model.extend({});

var ProjectCollection = Backbone.Collection.extend({

    url: '/projects',
    model: Project,
    sort_key: "finish_date",
    sort_order: 1,
    parent_filter: false,

    initialize: function () {

    },

    comparator: function (item1, item2) {
        var val1 = item1.get(this.sort_key);
        var val2 = item2.get(this.sort_key);
    if (typeof (val1) === "string") {
        val1 = val1.toLowerCase();
        val2 = val2.toString().toLowerCase();
    }

    var sortValue = val1 > val2 ? 1 : -1;
    return sortValue * this.sort_order;
},

sortByField: function (fieldName, orderType) {
    this.sort_key = fieldName;
    this.sort_order = orderType == "desc" ? -1 : 1;
    console.log(this.sort_order);
    this.sort();
},
});

var projects = new ProjectCollection({});

projects.add({
    name: 'Windows',
    cost: 100,
    startDate: new Date('2012/01/01').getTime()
});
projects.add({
    name: 'iPhone',
    cost: 20,
    startDate: new Date('2014/01/01').getTime()
});
projects.add({
    name: 'Java Application',
    cost: 300,
    startDate: new Date('2015/01/01').getTime()
});
projects.add({
    name: 'Android Application',
    cost: 43,
    startDate: new Date('2011/01/01').getTime()
});

projects.sortByField('name', 'asc');
console.log(projects.toJSON());
projects.sortByField('cost', 'asc');
console.log(projects.toJSON());
projects.sortByField('startDate', 'desc');
console.log(projects.toJSON());