2 files changed, 49 insertions, 0 deletions
diff --git a/public/assets/js/lib/views/index/hootbox.js b/public/assets/js/lib/views/index/hootbox.js
new file mode 100644
index 0000000..43c4fe9
--- /dev/null
+++ b/public/assets/js/lib/views/index/hootbox.js
@@ -0,0 +1,37 @@
+var HootboxView = FormView.extend({
+  
+  el: "#hootbox",
+  
+  events: {
+  },
+  
+  initialize: function(){
+    this.__super__.initialize.call(this)
+    this.template = this.$(".template").html()
+    this.$hoots = this.$("#hoots")
+  },
+  
+  load: function(comments){
+    comments.forEach(this.prependComment.bind(this))
+  },
+  
+  parse: function(comment){
+    var t = this.template.replace(/{{username}}/g, comment.username)
+                    .replace(/{{comment}}/g, comment.comment)
+    return t
+  },
+  
+  prependComment: function(comment){
+    var $el = $( this.parse(comment) )
+    this.$hoots.prepend($el)
+  },
+
+  appendComment: function(comment){
+    var $el = $( this.parse(comment) )
+    this.$hoots.append($el)
+  },
+  
+  success: function(){
+    this.prependComment(comment)
+  }
+})
+\ No newline at end of file
diff --git a/public/assets/js/lib/views/index/index.js b/public/assets/js/lib/views/index/index.js
index 095909d..cb648fa 100644
--- a/public/assets/js/lib/views/index/index.js
+++ b/public/assets/js/lib/views/index/index.js
@@ -3,8 +3,20 @@ var IndexView = View.extend({
   events: {
   },
   
+  action: "/api/index",
+  
   initialize: function(opt){
     // opt.parent = parent
+    this.hootbox = new HootboxView ({ parent: this })
+    this.load()
+  },
+  
+  load: function(){
+    $.get(this.action, this.populate.bind(this))
+  },
+  
+  populate: function(data){
+    this.hootbox.load(data.hootbox)
   },
   
   success: function(){