From 1ecfa92c9edd93d12273e25c07b691df0ba2278a Mon Sep 17 00:00:00 2001
From: danielgrippi <danielgrippi@gmail.com>
Date: Thu, 8 Dec 2011 18:25:04 -0800
Subject: [PATCH] DH DG; create comments via backbone

---
 app/controllers/comments_controller.rb        |  2 +-
 app/views/comments/create.js.erb              |  2 +-
 app/views/layouts/application.html.haml       |  3 ++
 .../shared/_comment_stream.html.underscore    | 27 ++++++++++++
 .../shared/_stream_element.html.underscore    | 32 +-------------
 public/javascripts/models/comment.js          |  3 ++
 public/javascripts/models/post.js             |  2 +-
 public/javascripts/views/comment-stream.js    | 42 +++++++++++++++----
 public/javascripts/views/comment.js           |  2 -
 public/javascripts/views/post.js              | 12 ++++--
 10 files changed, 80 insertions(+), 47 deletions(-)
 create mode 100644 app/views/shared/_comment_stream.html.underscore

diff --git a/app/controllers/comments_controller.rb b/app/controllers/comments_controller.rb
index ac406e773..98930ccca 100644
--- a/app/controllers/comments_controller.rb
+++ b/app/controllers/comments_controller.rb
@@ -26,7 +26,7 @@ class CommentsController < ApplicationController
         Postzord::Dispatcher.build(current_user, @comment).post
 
         respond_to do |format|
-          format.js{ render(:create, :status => 201)}
+          format.json  { render :json => @comment.as_api_response(:backbone) }
           format.html{ render :nothing => true, :status => 201 }
           format.mobile{ render :partial => 'comment', :locals => {:post => @comment.post, :comment => @comment} }
         end
diff --git a/app/views/comments/create.js.erb b/app/views/comments/create.js.erb
index aaee57e03..8473159fe 100644
--- a/app/views/comments/create.js.erb
+++ b/app/views/comments/create.js.erb
@@ -1,4 +1,4 @@
-var post = App.stream.collection.get(<%= @comment.post.id %>);
+App.stream.collection.get(<%= @comment.post.id %>);
 
 console.log(post);
 
diff --git a/app/views/layouts/application.html.haml b/app/views/layouts/application.html.haml
index ceac7bc1b..20ae83bbd 100644
--- a/app/views/layouts/application.html.haml
+++ b/app/views/layouts/application.html.haml
@@ -80,6 +80,9 @@
     %script{:id => "comment-template", :type => 'text/template'}
       != File.read("#{Rails.root}/app/views/shared/_comment.html.underscore")
 
+    %script{:id => "comment-stream-template", :type => 'text/template'}
+      != File.read("#{Rails.root}/app/views/shared/_comment_stream.html.underscore")
+
     .container{:style=> "#{yield(:break_the_mold)}"}
       - if @aspsect == :getting_started || @page == :logged_out
         = yield
diff --git a/app/views/shared/_comment_stream.html.underscore b/app/views/shared/_comment_stream.html.underscore
new file mode 100644
index 000000000..d98721534
--- /dev/null
+++ b/app/views/shared/_comment_stream.html.underscore
@@ -0,0 +1,27 @@
+<div class="comment_stream">
+  <ul class="show_comments <%= comments_count <= 3 ? 'hidden' : '' %>">
+    <li>
+      <a href="/posts/<%= id %>/comments" class="toggle_post_comments">
+        Show <%= comments_count - 3 %> more comments
+      </a>
+    </li>
+  </ul>
+
+  <ul class="comments"> </ul>
+
+  <div class="new_comment_form_wrapper <%= comments_count > 0 ? '' : 'hidden' %>">
+    <form accept-charset="UTF-8" action="/posts/<%= id %>/comments" class="new_comment" id="new_comment_on_<%= id %>" method="post">
+      <a href="/people/<%= current_user.id %>">
+        <img src="<%= current_user.avatar.small %>" class="avatar" data-person-id="<%= current_user.id %>"/>
+      </a>
+
+      <p>
+        <label for="comment_text_on_<%= id %>">Comment</label>
+        <textarea class="comment_box" id="comment_text_on_<%= id %>" name="text" rows="2" />
+      </p>
+      <div class="submit_button">
+        <input class="comment_submit button creation" id="comment_submit_<%= id %>" name="commit" type="submit" value="Comment" />
+      </div>
+    </form>
+  </div>
+</div>
diff --git a/app/views/shared/_stream_element.html.underscore b/app/views/shared/_stream_element.html.underscore
index ff9c3e63c..6b7ea2f6e 100644
--- a/app/views/shared/_stream_element.html.underscore
+++ b/app/views/shared/_stream_element.html.underscore
@@ -67,37 +67,7 @@
           </div>
         </div>
 
-        <div class="comments">
-          <div class="comment_stream">
-
-            <ul class="show_comments <%= comments_count <= 3 ? 'hidden' : '' %>">
-              <li>
-                <a href="/posts/<%= id %>/comments" class="toggle_post_comments">
-                  Show <%= comments_count - 3 %> more comments
-                </a>
-              </li>
-            </ul>
-
-            <ul class="comments"> </ul>
-
-            <div class="new_comment_form_wrapper <%= comments_count > 0 ? '' : 'hidden' %>">
-              <form accept-charset="UTF-8" action="/posts/<%= id %>/comments" class="new_comment" data-remote="true" id="new_comment_on_<%= id %>" method="post">
-                <a href="/people/<%= current_user.id %>">
-                  <img src="<%= current_user.avatar.small %>" class="avatar" data-person-id="<%= current_user.id %>"/>
-                </a>
-
-                <p>
-                  <label for="comment_text_on_<%= id %>">Comment</label>
-                  <textarea class="comment_box" id="comment_text_on_<%= id %>" name="text" rows="2" />
-                </p>
-                <div class="submit_button">
-                  <input class="comment_submit button creation" data-disable-with="Commenting..." id="comment_submit_<%= id %>" name="commit" type="submit" value="Comment" />
-                </div>
-              </form>
-            </div>
-
-          </div>
-        </div>
+        <div class="comments"> </div>
 
       </div>
     </div>
diff --git a/public/javascripts/models/comment.js b/public/javascripts/models/comment.js
index df76c6f72..4c2f3fe95 100644
--- a/public/javascripts/models/comment.js
+++ b/public/javascripts/models/comment.js
@@ -1,2 +1,5 @@
 App.Models.Comment = Backbone.Model.extend({
+  url: function() {
+    return "/posts/" + this.get("post_id") + "/comments";
+  }
 });
diff --git a/public/javascripts/models/post.js b/public/javascripts/models/post.js
index eb204b86b..806af2e97 100644
--- a/public/javascripts/models/post.js
+++ b/public/javascripts/models/post.js
@@ -1,5 +1,5 @@
 App.Models.Post = Backbone.Model.extend({
-  url: "/posts/:id",
+  url: "/posts",
 
   initialize: function() {
     this.comments = new App.Collections.Comments(this.get("last_three_comments"));
diff --git a/public/javascripts/views/comment-stream.js b/public/javascripts/views/comment-stream.js
index e0e79f24f..7c9931912 100644
--- a/public/javascripts/views/comment-stream.js
+++ b/public/javascripts/views/comment-stream.js
@@ -1,17 +1,45 @@
 App.Views.CommentStream = Backbone.View.extend({
+  events: {
+    "submit form": "createComment"
+  },
+
   initialize: function(options) {
-    this.collection = options.collection;
+    this.model = options.model;
+    this.template = _.template($("#comment-stream-template").html());
+
+    _.bindAll(this, "appendComment");
+    this.model.comments.bind("add", this.appendComment);
   },
 
   render: function() {
     var self = this;
-    
-    this.collection.each(function(comment) {
-      $(self.el).append(new App.Views.Comment({
-        model: comment
-      }).render());
-    });
+
+    $(this.el).html(this.template($.extend(
+      this.model.toJSON(),
+      App.user()
+    )));
+
+    this.model.comments.each(this.appendComment);
 
     return this.el;
+  },
+
+  createComment: function(evt) {
+    evt.preventDefault();
+
+    this.model.comments.create({
+      "text" : this.$(".comment_box").val(),
+      "post_id" : this.model.id
+    });
+
+    this.$(".comment_box").val("");
+    return this;
+  },
+
+  appendComment: function(comment) {
+    this.$("ul.comments").append(new App.Views.Comment({
+      model: comment
+    }).render());
   }
+
 });
diff --git a/public/javascripts/views/comment.js b/public/javascripts/views/comment.js
index e3e4024d2..a5685cf4e 100644
--- a/public/javascripts/views/comment.js
+++ b/public/javascripts/views/comment.js
@@ -10,8 +10,6 @@ App.Views.Comment = Backbone.View.extend({
       App.user()
     )));
 
-    console.log(this.el);
-
     return this.el;
   }
 });
diff --git a/public/javascripts/views/post.js b/public/javascripts/views/post.js
index 6dac59635..12a325b62 100644
--- a/public/javascripts/views/post.js
+++ b/public/javascripts/views/post.js
@@ -1,22 +1,26 @@
 App.Views.Post = Backbone.View.extend({
+
   initialize: function(options) {
     this.model = options.model;
     this.template = _.template($("#stream-element-template").html());
   },
 
   render: function() {
+    var self = this;
     this.el = $(this.template($.extend(
       this.model.toJSON(),
       App.user()
-    )));
+    )))[0];
 
-    this.$("ul.comments").html(new App.Views.CommentStream({
-      collection: this.model.comments
+    this.$(".comments").html(new App.Views.CommentStream({
+      model: this.model
     }).render());
 
     this.$(".details time").timeago();
     this.$("label").inFieldLabels();
-    
+
+    Diaspora.BaseWidget.instantiate("StreamElement", $(this.el));
+
     return this.el;
   }
 });