Grid.js

var logs = [{"id":2,"user_id":1,"kind":2,"description":"300g de Linguiça","logged_at":"2015-01-28T22:00:00.000-03:00","created_at":"2015-01-29T21:39:58.180-03:00","updated_at":"2015-01-29T21:39:58.180-03:00","deleted_at":null},{"id":1,"user_id":1,"kind":1,"description":"84.9","logged_at":"2015-01-29T06:00:41.000-03:00","created_at":"2015-01-29T21:36:41.986-03:00","updated_at":"2015-01-29T21:37:28.428-03:00","deleted_at":null},{"id":5,"user_id":1,"kind":1,"description":"84.8","logged_at":"2015-01-29T19:00:00.000-03:00","created_at":"2015-01-30T08:43:39.528-03:00","updated_at":"2015-01-30T08:43:39.528-03:00","deleted_at":null},{"id":3,"user_id":1,"kind":2,"description":"1kg de Pizza 4 queijos/Peperoni","logged_at":"2015-01-29T22:00:00.000-03:00","created_at":"2015-01-30T08:41:45.404-03:00","updated_at":"2015-01-30T08:41:45.404-03:00","deleted_at":null},{"id":4,"user_id":1,"kind":3,"description":"300ml de água","logged_at":"2015-01-29T22:40:00.000-03:00","created_at":"2015-01-30T08:43:03.179-03:00","updated_at":"2015-01-30T08:43:03.179-03:00","deleted_at":null},{"id":6,"user_id":1,"kind":1,"description":"86","logged_at":"2015-01-29T22:45:00.000-03:00","created_at":"2015-01-30T08:43:59.222-03:00","updated_at":"2015-01-30T08:43:59.222-03:00","deleted_at":null},{"id":12,"user_id":1,"kind":8,"description":"Turvo","logged_at":"2015-01-29T22:50:00.000-03:00","created_at":"2015-01-30T08:47:03.113-03:00","updated_at":"2015-01-30T08:47:03.113-03:00","deleted_at":null},{"id":9,"user_id":1,"kind":6,"description":"","logged_at":"2015-01-29T23:00:00.000-03:00","created_at":"2015-01-30T08:45:46.067-03:00","updated_at":"2015-01-30T08:45:46.067-03:00","deleted_at":null},{"id":8,"user_id":1,"kind":7,"description":"5:25","logged_at":"2015-01-30T05:25:00.000-03:00","created_at":"2015-01-30T08:45:09.802-03:00","updated_at":"2015-01-30T08:45:09.802-03:00","deleted_at":null},{"id":7,"user_id":1,"kind":1,"description":"84.8","logged_at":"2015-01-30T05:30:00.000-03:00","created_at":"2015-01-30T08:44:24.569-03:00","updated_at":"2015-01-30T08:44:24.569-03:00","deleted_at":null},{"id":10,"user_id":1,"kind":9,"description":"","logged_at":"2015-01-30T05:34:00.000-03:00","created_at":"2015-01-30T08:46:14.620-03:00","updated_at":"2015-01-30T08:46:14.620-03:00","deleted_at":null},{"id":11,"user_id":1,"kind":8,"description":"Claro","logged_at":"2015-01-30T05:34:00.000-03:00","created_at":"2015-01-30T08:46:37.704-03:00","updated_at":"2015-01-30T08:46:37.704-03:00","deleted_at":null},{"id":13,"user_id":1,"kind":4,"description":"Jiujitsu NOGI","logged_at":"2015-01-30T12:20:00.000-03:00","created_at":"2015-01-30T17:06:07.478-03:00","updated_at":"2015-01-30T17:06:07.478-03:00","deleted_at":null},{"id":14,"user_id":1,"kind":11,"description":"#noshampoo","logged_at":"2015-01-30T13:50:00.000-03:00","created_at":"2015-01-30T17:08:05.903-03:00","updated_at":"2015-01-30T17:08:05.903-03:00","deleted_at":null},{"id":15,"user_id":1,"kind":5,"description":"#soft","logged_at":"2015-01-30T15:24:00.000-03:00","created_at":"2015-01-30T18:24:16.489-03:00","updated_at":"2015-01-30T18:24:16.489-03:00","deleted_at":null},{"id":24,"user_id":1,"kind":2,"description":"Carne e linguiça #rodizio","logged_at":"2015-02-03T14:00:00.000-03:00","created_at":"2015-02-05T12:06:13.032-03:00","updated_at":"2015-02-05T12:06:13.032-03:00","deleted_at":null},{"id":22,"user_id":1,"kind":1,"description":"85.8","logged_at":"2015-02-04T06:00:00.000-03:00","created_at":"2015-02-05T11:59:24.208-03:00","updated_at":"2015-02-05T11:59:24.208-03:00","deleted_at":null},{"id":20,"user_id":1,"kind":3,"description":"#coffee","logged_at":"2015-02-04T07:00:00.000-03:00","created_at":"2015-02-05T11:58:44.501-03:00","updated_at":"2015-02-05T11:58:44.501-03:00","deleted_at":null},{"id":19,"user_id":1,"kind":2,"description":"180g de Geléia de Mocotó","logged_at":"2015-02-04T14:20:00.000-03:00","created_at":"2015-02-05T11:58:10.068-03:00","updated_at":"2015-02-05T11:58:10.068-03:00","deleted_at":null},{"id":23,"user_id":1,"kind":1,"description":"85.6","logged_at":"2015-02-04T20:30:00.000-03:00","created_at":"2015-02-05T11:59:38.797-03:00","updated_at":"2015-02-05T11:59:38.797-03:00","deleted_at":null},{"id":18,"user_id":1,"kind":2,"description":"meia pizza 4 queijos e pepperoni e 6 esfihas de carne #carb","logged_at":"2015-02-04T21:00:00.000-03:00","created_at":"2015-02-05T11:57:38.883-03:00","updated_at":"2015-02-05T11:57:38.883-03:00","deleted_at":null},{"id":16,"user_id":1,"kind":7,"description":"","logged_at":"2015-02-05T05:00:00.000-03:00","created_at":"2015-02-05T11:55:49.405-03:00","updated_at":"2015-02-05T11:55:49.405-03:00","deleted_at":null},{"id":21,"user_id":1,"kind":3,"description":"#coffee","logged_at":"2015-02-05T07:00:00.000-03:00","created_at":"2015-02-05T11:58:49.901-03:00","updated_at":"2015-02-05T11:58:49.901-03:00","deleted_at":null},{"id":17,"user_id":1,"kind":2,"description":"1 pão com gordura de porco e manteiga da terra #carb","logged_at":"2015-02-05T07:00:00.000-03:00","created_at":"2015-02-05T11:56:26.011-03:00","updated_at":"2015-02-05T11:56:26.011-03:00","deleted_at":null},{"id":30,"user_id":1,"kind":3,"description":"#coffee","logged_at":"2015-02-05T10:53:18.000-03:00","created_at":"2015-02-05T10:53:27.766-03:00","updated_at":"2015-02-05T10:53:27.766-03:00","deleted_at":null},{"id":32,"user_id":1,"kind":11,"description":"teste","logged_at":"2015-07-22T13:04:00.000-03:00","created_at":"2015-07-22T13:05:14.896-03:00","updated_at":"2015-07-22T13:05:14.896-03:00","deleted_at":null},{"id":33,"user_id":1,"kind":9,"description":"sim, defequei","logged_at":"2015-07-22T13:06:00.000-03:00","created_at":"2015-07-22T13:06:47.625-03:00","updated_at":"2015-07-22T13:06:47.625-03:00","deleted_at":null},{"id":34,"user_id":1,"kind":11,"description":"de novo","logged_at":"2015-07-22T13:08:00.000-03:00","created_at":"2015-07-22T13:08:21.959-03:00","updated_at":"2015-07-22T13:08:21.959-03:00","deleted_at":null},{"id":43,"user_id":1,"kind":11,"description":"Outro teste","logged_at":"2015-08-29T15:11:11.890-03:00","created_at":"2015-08-29T15:11:11.921-03:00","updated_at":"2015-08-29T16:19:03.880-03:00","deleted_at":null},{"id":31,"user_id":1,"kind":11,"description":null,"logged_at":null,"created_at":"2015-07-22T12:50:37.043-03:00","updated_at":"2015-07-22T12:50:37.043-03:00","deleted_at":null}];

var KIND = {
  11: "BATH",
  9: "DEFECATE",
  3: "DRINK",
  2: "EAT",
  5: "HUNGRY",
  10: "SEX",
  6: "SLEEP",
  8: "URINATE",  
  7: "WAKEUP",    
  1: "WEIGHT",
  4: "WORKOUT"
};

var Biohacking = {};

Biohacking.Grid = function(area){

  this.uncamelize = function(value){
    value = value.substring(0,1).toLowerCase() + value.substring(1);
    value.replace(" ", "");
    return value;
  };

  var createRow = function(type, log){
    var row = document.createElement(type);
    this.columns.forEach(function(item){
      var column = document.createElement("td");
      if(typeof item === "string") {
        column.innerHTML = log[ this.uncamelize(item) ];
      } else {
        var value = log[ this.uncamelize(item.title) ];
        column.innerHTML = 
          (item.formatter)? item.formatter(value): value;
      }
      row.appendChild(column);
    }, this);
    return row;
  }.bind(this);

  this.columns = [];
  this.table = document.createElement("table");
  this.tbody = document.createElement("tbody");
  
  this.load = function(data){
    data.forEach(function(log){
      this.tbody.appendChild(createRow("td", log));
    }, this);
  };

  this.render = function(columns){
    this.columns = columns;

    var row = document.createElement("th");
    this.columns.forEach(function(item){
      var column = document.createElement("td");
      column.innerHTML = (typeof item === "string")? item:item.title;
      row.appendChild(column);
    });

    this.tbody.appendChild(row);
    this.table.appendChild(this.tbody);
  }
  
};

var columns = [
  {
    title: "Kind",
    formatter: function(value){ return KIND[value]; }
  },
  "Description",
  {
    title: "Logged At",
    formatter: function(value){ 
      return moment( value ).format('MMMM Do YYYY, h:mm:ss a');
    }
  }
];

var grid = new Biohacking.Grid("logs");
grid.render(columns);
grid.load(logs);