From 2fc2ab65d2bec10df6fc5c8eb0c5328f2c1660d5 Mon Sep 17 00:00:00 2001 From: whw-baird Date: Mon, 2 May 2022 22:26:56 +0000 Subject: [PATCH 1/5] Comments ajaxified --- app/controllers/comments_controller.rb | 7 +++++-- app/views/comments/_comment.html.erb | 7 +++++-- app/views/comments/destroy.js.erb | 5 +++++ 3 files changed, 15 insertions(+), 4 deletions(-) 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..9a3f746 100644 --- a/app/controllers/comments_controller.rb +++ b/app/controllers/comments_controller.rb @@ -57,8 +57,11 @@ def update def destroy @comment.destroy respond_to do |format| - format.html { redirect_back fallback_location: root_url, notice: "Comment was successfully destroyed." } - format.json { head :no_content } + #format.html { redirect_back fallback_location: root_url, notice: "Comment was successfully destroyed." } + #format.json { head :no_content } + format.js do + render template: "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..3e64698 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,10 @@ <% 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/destroy.js.erb b/app/views/comments/destroy.js.erb new file mode 100644 index 0000000..a918ccf --- /dev/null +++ b/app/views/comments/destroy.js.erb @@ -0,0 +1,5 @@ +$("#<%= dom_id(@comment) %>").fadeOut(500, function() { + $(this).remove(); +}); + +console.log("Comment destroyed."); From c0e2b7bc1b9c7cc81fd1fc056306f1cd72a140de Mon Sep 17 00:00:00 2001 From: whw-baird Date: Mon, 2 May 2022 22:45:57 +0000 Subject: [PATCH 2/5] new comment ajaxified --- app/controllers/comments_controller.rb | 3 +++ app/views/comments/_form.html.erb | 4 ++-- app/views/comments/create.js.erb | 17 +++++++++++++++++ 3 files changed, 22 insertions(+), 2 deletions(-) create mode 100644 app/views/comments/create.js.erb diff --git a/app/controllers/comments_controller.rb b/app/controllers/comments_controller.rb index 9a3f746..66517bd 100644 --- a/app/controllers/comments_controller.rb +++ b/app/controllers/comments_controller.rb @@ -33,6 +33,9 @@ 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 do + render template: "comments/create.js.erb" + end 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 f289224..bc2f727 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..3b65ada --- /dev/null +++ b/app/views/comments/create.js.erb @@ -0,0 +1,17 @@ +console.log("New comment: '<%= @comment.body %>'") + +$("#<%= dom_id(@comment.photo) %>_form").before(added_comment); + +var added_comment = $("<%= escape_javascript(render 'comments/comment', comment: @comment) %>"); + +$("#<%= dom_id(@comment.photo) %>_form #comment_body").val(""); + +var added_comment = $("<%= j(render @comment) %>"); + +added_comment.hide(); + +$("#<%= dom_id(@comment.photo) %>_form").before(added_comment); + +added_comment.slideDown(500); + +$("#<%= dom_id(@comment.photo) %>_form #comment_body").val(""); From 3563df6b1cb98ca8331b272f2233d337c6106342 Mon Sep 17 00:00:00 2001 From: whw-baird Date: Mon, 2 May 2022 23:59:35 +0000 Subject: [PATCH 3/5] edit button ajaxified --- app/controllers/comments_controller.rb | 3 +++ app/views/comments/_comment.html.erb | 2 +- app/views/comments/edit.html.erb | 2 +- app/views/comments/edit.js.erb | 3 +++ 4 files changed, 8 insertions(+), 2 deletions(-) create mode 100644 app/views/comments/edit.js.erb diff --git a/app/controllers/comments_controller.rb b/app/controllers/comments_controller.rb index 66517bd..4d93643 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 template: "comments/edit.js.erb" + end end end diff --git a/app/views/comments/_comment.html.erb b/app/views/comments/_comment.html.erb index 3e64698..a4a8165 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/edit.html.erb b/app/views/comments/edit.html.erb index 607e32e..dbdb60c 100644 --- a/app/views/comments/edit.html.erb +++ b/app/views/comments/edit.html.erb @@ -4,4 +4,4 @@ <%= render 'form', comment: @comment %>
      -
    \ No newline at end of file + diff --git a/app/views/comments/edit.js.erb b/app/views/comments/edit.js.erb new file mode 100644 index 0000000..97a3614 --- /dev/null +++ b/app/views/comments/edit.js.erb @@ -0,0 +1,3 @@ +console.log("Editor opened for '<%= @comment.body %>'.") + +$("#<%= dom_id(@comment) %>").replaceWith("<%= j(render "comments/form", comment: @comment) %>"); From ff3b161bee01eb7fe776dcf2d40e93a483094be1 Mon Sep 17 00:00:00 2001 From: whw-baird Date: Tue, 3 May 2022 00:03:30 +0000 Subject: [PATCH 4/5] Ajaxified updates --- app/controllers/comments_controller.rb | 3 +++ app/views/comments/update.js.erb | 1 + 2 files changed, 4 insertions(+) create mode 100644 app/views/comments/update.js.erb diff --git a/app/controllers/comments_controller.rb b/app/controllers/comments_controller.rb index 4d93643..ba4f6ac 100644 --- a/app/controllers/comments_controller.rb +++ b/app/controllers/comments_controller.rb @@ -52,6 +52,9 @@ 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 do + render template: "comments/update.js.erb" + end else format.html { render :edit, status: :unprocessable_entity } format.json { render json: @comment.errors, status: :unprocessable_entity } diff --git a/app/views/comments/update.js.erb b/app/views/comments/update.js.erb new file mode 100644 index 0000000..92bc786 --- /dev/null +++ b/app/views/comments/update.js.erb @@ -0,0 +1 @@ +$("#<%= dom_id(@comment.photo) %>_form").replaceWith("<%= j(render @comment) %>"); From 3361c33cbc271fdd21dc7bf7321382f21b6a32a5 Mon Sep 17 00:00:00 2001 From: whw-baird Date: Tue, 3 May 2022 00:23:27 +0000 Subject: [PATCH 5/5] trying to Ajaxify likes --- app/controllers/likes_controller.rb | 1 + app/views/likes/_form.html.erb | 2 +- app/views/likes/create.js.erb | 3 +++ 3 files changed, 5 insertions(+), 1 deletion(-) create mode 100644 app/views/likes/create.js.erb diff --git a/app/controllers/likes_controller.rb b/app/controllers/likes_controller.rb index 49affd3..67d45f9 100644 --- a/app/controllers/likes_controller.rb +++ b/app/controllers/likes_controller.rb @@ -27,6 +27,7 @@ def create if @like.save format.html { redirect_back fallback_location: root_url, notice: "Like was successfully created." } format.json { render :show, status: :created, location: @like } + format.js else format.html { render :new, status: :unprocessable_entity } format.json { render json: @like.errors, status: :unprocessable_entity } diff --git a/app/views/likes/_form.html.erb b/app/views/likes/_form.html.erb index eff47d7..70efde7 100644 --- a/app/views/likes/_form.html.erb +++ b/app/views/likes/_form.html.erb @@ -1,4 +1,4 @@ -<%= form_with(model: like, class: "d-inline-block") do |form| %> +<%= form_with(model: like, class: "d-inline-block", local: false) do |form| %> <%= form.hidden_field :fan_id %> <%= form.hidden_field :photo_id %> diff --git a/app/views/likes/create.js.erb b/app/views/likes/create.js.erb new file mode 100644 index 0000000..9c709fd --- /dev/null +++ b/app/views/likes/create.js.erb @@ -0,0 +1,3 @@ +console.log("New like.") + +var new_like = $("<%= escape_javascript(render 'likes/create', like: @like) %>");