From cccf14ea4951d10a0c76a7c2cee4f10cff86ffe1 Mon Sep 17 00:00:00 2001 From: claycurran0 Date: Tue, 26 Apr 2022 21:27:24 +0000 Subject: [PATCH 1/5] got some but lost last 20 mins --- app/controllers/comments_controller.rb | 7 +++++++ app/views/comments/_comment.html.erb | 4 ++-- app/views/comments/_form.html.erb | 2 +- app/views/comments/create.js.erb | 1 + app/views/comments/destroy.js.erb | 1 + 5 files changed, 12 insertions(+), 3 deletions(-) create mode 100644 app/views/comments/create.js.erb create mode 100644 app/views/comments/destroy.js.erb diff --git a/app/controllers/comments_controller.rb b/app/controllers/comments_controller.rb index 5b62df9..2aef0ce 100644 --- a/app/controllers/comments_controller.rb +++ b/app/controllers/comments_controller.rb @@ -36,6 +36,9 @@ def create else format.html { render :new, status: :unprocessable_entity } format.json { render json: @comment.errors, status: :unprocessable_entity } + + format.js + end end end @@ -59,6 +62,10 @@ def destroy respond_to do |format| format.html { redirect_back fallback_location: root_url, notice: "Comment was successfully destroyed." } format.json { head :no_content } + + format.js do + render("comments/destroy.js.erb") + end end end diff --git a/app/views/comments/_comment.html.erb b/app/views/comments/_comment.html.erb index 25bdd33..6445fbb 100644 --- a/app/views/comments/_comment.html.erb +++ b/app/views/comments/_comment.html.erb @@ -1,4 +1,4 @@ -
  • +
  • <%= image_tag comment.author.avatar_image, class: "rounded-circle mr-2", width: 36 %>
    @@ -13,7 +13,7 @@ <% end %> - <%= link_to comment, method: :delete, class: "btn btn-link btn-sm text-muted" do %> + <%= link_to comment, method: :delete, class: "btn btn-link btn-sm text-muted", remote: true do %> <% end %> <% end %> diff --git a/app/views/comments/_form.html.erb b/app/views/comments/_form.html.erb index f289224..c65f8ff 100644 --- a/app/views/comments/_form.html.erb +++ b/app/views/comments/_form.html.erb @@ -1,5 +1,5 @@
  • - <%= form_with(model: comment) do |form| %> + <%= form_with(model: comment, local:false) do |form| %> <% if comment.errors.any? %>
      diff --git a/app/views/comments/create.js.erb b/app/views/comments/create.js.erb new file mode 100644 index 0000000..8b13789 --- /dev/null +++ b/app/views/comments/create.js.erb @@ -0,0 +1 @@ + diff --git a/app/views/comments/destroy.js.erb b/app/views/comments/destroy.js.erb new file mode 100644 index 0000000..a4932da --- /dev/null +++ b/app/views/comments/destroy.js.erb @@ -0,0 +1 @@ +$("#comment_<%= @comment.id %>").remove(); From c6d5f787f7959f1af319556d40d2bda1361cebcc Mon Sep 17 00:00:00 2001 From: claycurran0 Date: Mon, 2 May 2022 00:37:53 +0000 Subject: [PATCH 2/5] done with in-class portion --- app/controllers/comments_controller.rb | 2 ++ app/views/comments/_form.html.erb | 2 +- app/views/comments/create.js.erb | 2 ++ app/views/comments/destroy.js.erb | 4 +++- 4 files changed, 8 insertions(+), 2 deletions(-) diff --git a/app/controllers/comments_controller.rb b/app/controllers/comments_controller.rb index 2aef0ce..0ac3666 100644 --- a/app/controllers/comments_controller.rb +++ b/app/controllers/comments_controller.rb @@ -33,6 +33,8 @@ def create if @comment.save format.html { redirect_back fallback_location: root_path, notice: "Comment was successfully created." } format.json { render :show, status: :created, location: @comment } + + format.js { render "create" } else format.html { render :new, status: :unprocessable_entity } format.json { render json: @comment.errors, status: :unprocessable_entity } diff --git a/app/views/comments/_form.html.erb b/app/views/comments/_form.html.erb index c65f8ff..5755abe 100644 --- a/app/views/comments/_form.html.erb +++ b/app/views/comments/_form.html.erb @@ -1,4 +1,4 @@ -
    • +
    • <%= form_with(model: comment, local:false) do |form| %> <% if comment.errors.any? %>
      diff --git a/app/views/comments/create.js.erb b/app/views/comments/create.js.erb index 8b13789..73b23d2 100644 --- a/app/views/comments/create.js.erb +++ b/app/views/comments/create.js.erb @@ -1 +1,3 @@ +$("#<%= dom_id(@comment.photo) %>_comment_form").before("<%= escape_javascript(render("comments/comment", comment: @comment)) %>"); +$("#<%= dom_id(@comment.photo) %>_comment_form #comment_body").val(""); diff --git a/app/views/comments/destroy.js.erb b/app/views/comments/destroy.js.erb index a4932da..978a83c 100644 --- a/app/views/comments/destroy.js.erb +++ b/app/views/comments/destroy.js.erb @@ -1 +1,3 @@ -$("#comment_<%= @comment.id %>").remove(); +console.log("howdy from comments#destroy"); + +$("#comment_<%= @comment.id %>").slideUp(); From 6bc140d4f26baf09fd9374155389211259d60ab9 Mon Sep 17 00:00:00 2001 From: claycurran0 Date: Mon, 2 May 2022 00:56:41 +0000 Subject: [PATCH 3/5] new comment slide down --- app/views/comments/create.js.erb | 7 ++++++- 1 file changed, 6 insertions(+), 1 deletion(-) diff --git a/app/views/comments/create.js.erb b/app/views/comments/create.js.erb index 73b23d2..4e01205 100644 --- a/app/views/comments/create.js.erb +++ b/app/views/comments/create.js.erb @@ -1,3 +1,8 @@ -$("#<%= dom_id(@comment.photo) %>_comment_form").before("<%= escape_javascript(render("comments/comment", comment: @comment)) %>"); +var added_comment = $("<%= escape_javascript(render('comments/comment', comment: @comment)) %>"); + +$("#<%= dom_id(@comment.photo) %>_comment_form").before(added_comment); + +added_comment.hide(); +added_comment.slideDown(); $("#<%= dom_id(@comment.photo) %>_comment_form #comment_body").val(""); From cb7bb742f08630adca88bf055ffe1016ac8b00b1 Mon Sep 17 00:00:00 2001 From: claycurran0 Date: Mon, 2 May 2022 01:51:27 +0000 Subject: [PATCH 4/5] update comment ajax added --- app/controllers/comments_controller.rb | 4 ++++ app/views/comments/_comment.html.erb | 2 +- app/views/comments/_form.html.erb | 2 +- app/views/comments/create.js.erb | 5 +++-- app/views/comments/edit.js.erb | 4 ++++ app/views/comments/update.js.erb | 7 +++++++ 6 files changed, 20 insertions(+), 4 deletions(-) create mode 100644 app/views/comments/edit.js.erb create mode 100644 app/views/comments/update.js.erb diff --git a/app/controllers/comments_controller.rb b/app/controllers/comments_controller.rb index 0ac3666..b7fe8c0 100644 --- a/app/controllers/comments_controller.rb +++ b/app/controllers/comments_controller.rb @@ -21,6 +21,9 @@ def new def edit respond_to do |format| format.html + format.js do + render("comments/edit.js.erb") + end end end @@ -51,6 +54,7 @@ def update if @comment.update(comment_params) format.html { redirect_to root_url, notice: "Comment was successfully updated." } format.json { render :show, status: :ok, location: @comment } + format.js { render("comments/update")} else format.html { render :edit, status: :unprocessable_entity } format.json { render json: @comment.errors, status: :unprocessable_entity } diff --git a/app/views/comments/_comment.html.erb b/app/views/comments/_comment.html.erb index 6445fbb..c4532fa 100644 --- a/app/views/comments/_comment.html.erb +++ b/app/views/comments/_comment.html.erb @@ -9,7 +9,7 @@
      <% if current_user == comment.author %> - <%= link_to edit_comment_path(comment), class: "btn btn-link btn-sm text-muted" do %> + <%= link_to edit_comment_path(comment), class: "btn btn-link btn-sm text-muted", remote:true do %> <% end %> diff --git a/app/views/comments/_form.html.erb b/app/views/comments/_form.html.erb index 5755abe..134a5d6 100644 --- a/app/views/comments/_form.html.erb +++ b/app/views/comments/_form.html.erb @@ -1,4 +1,4 @@ -
    • +
    • _form" class="list-group-item"> <%= form_with(model: comment, local:false) do |form| %> <% if comment.errors.any? %>
      diff --git a/app/views/comments/create.js.erb b/app/views/comments/create.js.erb index 4e01205..b55caf9 100644 --- a/app/views/comments/create.js.erb +++ b/app/views/comments/create.js.erb @@ -1,8 +1,9 @@ var added_comment = $("<%= escape_javascript(render('comments/comment', comment: @comment)) %>"); +var form_id = "#<%= dom_id(@comment.photo) %>_new_comment_form" -$("#<%= dom_id(@comment.photo) %>_comment_form").before(added_comment); +$(form_id).before(added_comment); added_comment.hide(); added_comment.slideDown(); -$("#<%= dom_id(@comment.photo) %>_comment_form #comment_body").val(""); +$(form_id+" #comment_body").val(""); diff --git a/app/views/comments/edit.js.erb b/app/views/comments/edit.js.erb new file mode 100644 index 0000000..5dbeb64 --- /dev/null +++ b/app/views/comments/edit.js.erb @@ -0,0 +1,4 @@ +console.log("<%= @comment.body %>") + +$("#<%= dom_id(@comment) %>").hide(0); +$("#<%= dom_id(@comment) %>").before("<%= escape_javascript(render('comments/form', comment: @comment)) %>"); diff --git a/app/views/comments/update.js.erb b/app/views/comments/update.js.erb new file mode 100644 index 0000000..b04e914 --- /dev/null +++ b/app/views/comments/update.js.erb @@ -0,0 +1,7 @@ +console.log("Let's get updating!") + +var form_id = "#<%= dom_id(@comment.photo) +"_"+ dom_id(@comment) %>_form" +var updated_comment = $("<%= escape_javascript(render('comments/comment', comment: @comment)) %>"); + +$(form_id).hide(0); +$(form_id).before(updated_comment); From eeffdc4b3de123f121388468f1f92367a882a510 Mon Sep 17 00:00:00 2001 From: claycurran0 Date: Mon, 2 May 2022 01:54:14 +0000 Subject: [PATCH 5/5] update comment ajax added v2 --- app/views/comments/edit.js.erb | 2 -- app/views/comments/update.js.erb | 2 -- 2 files changed, 4 deletions(-) diff --git a/app/views/comments/edit.js.erb b/app/views/comments/edit.js.erb index 5dbeb64..7701f06 100644 --- a/app/views/comments/edit.js.erb +++ b/app/views/comments/edit.js.erb @@ -1,4 +1,2 @@ -console.log("<%= @comment.body %>") - $("#<%= dom_id(@comment) %>").hide(0); $("#<%= dom_id(@comment) %>").before("<%= escape_javascript(render('comments/form', comment: @comment)) %>"); diff --git a/app/views/comments/update.js.erb b/app/views/comments/update.js.erb index b04e914..fe91d90 100644 --- a/app/views/comments/update.js.erb +++ b/app/views/comments/update.js.erb @@ -1,5 +1,3 @@ -console.log("Let's get updating!") - var form_id = "#<%= dom_id(@comment.photo) +"_"+ dom_id(@comment) %>_form" var updated_comment = $("<%= escape_javascript(render('comments/comment', comment: @comment)) %>");