comments.js: fix forms flickering on page load.
Mark the edit form, new comment form, and unvote links as hidden in html, instead of showing them by default then hiding them later in Javascript. This eliminates flickering on page load.
This commit is contained in:
@@ -8,7 +8,6 @@ Comment.initialize_all = function() {
|
||||
this.initialize_response_link();
|
||||
this.initialize_reply_links();
|
||||
this.initialize_expand_links();
|
||||
this.initialize_vote_links();
|
||||
|
||||
if (!$("#a-edit").length) {
|
||||
this.initialize_edit_links();
|
||||
@@ -27,7 +26,6 @@ Comment.initialize_all = function() {
|
||||
}
|
||||
Comment.initialize_reply_links(current_comment_section);
|
||||
Comment.initialize_edit_links(current_comment_section);
|
||||
Comment.initialize_vote_links(current_comment_section);
|
||||
Dtext.initialize_expandables(current_comment_section);
|
||||
});
|
||||
}
|
||||
@@ -74,13 +72,10 @@ Comment.initialize_response_link = function() {
|
||||
Utility.scroll_to($form);
|
||||
e.preventDefault();
|
||||
});
|
||||
|
||||
$("div.new-comment form").hide();
|
||||
}
|
||||
|
||||
Comment.initialize_edit_links = function($parent) {
|
||||
$parent = $parent || $(document);
|
||||
$parent.find(".edit_comment").hide();
|
||||
$parent.find(".edit_comment_link").click(function(e) {
|
||||
var link_id = $(this).attr("id");
|
||||
var comment_id = link_id.match(/^edit_comment_link_(\d+)$/)[1];
|
||||
@@ -111,11 +106,6 @@ Comment.hide_threshold_comments = function(post_id) {
|
||||
});
|
||||
}
|
||||
|
||||
Comment.initialize_vote_links = function($parent) {
|
||||
$parent = $parent || $(document);
|
||||
$parent.find(".unvote-comment-link").hide();
|
||||
}
|
||||
|
||||
$(document).ready(function() {
|
||||
Comment.initialize_all();
|
||||
});
|
||||
|
||||
@@ -1,6 +1,6 @@
|
||||
<%= error_messages_for :comment %>
|
||||
|
||||
<%= simple_form_for(comment, :html => {:class => "edit_comment"}) do |f| %>
|
||||
<%= simple_form_for(comment, :html => {:style => ("display: none;" if local_assigns[:hidden]), :class => "edit_comment"}) do |f| %>
|
||||
<%= f.hidden_field :post_id %>
|
||||
<%= dtext_field "comment", "body", :classes => "autocomplete-mentions", :value => comment.body, :input_id => "comment_body_for_#{comment.id}", :preview_id => "dtext-preview-for-#{comment.id}" %>
|
||||
<%= f.button :submit, "Submit" %>
|
||||
|
||||
@@ -2,7 +2,7 @@
|
||||
<div id="a-edit">
|
||||
<h1>Edit Comment</h1>
|
||||
|
||||
<%= render "comments/form", :post => @comment.post, :comment => @comment %>
|
||||
<%= render "comments/form", comment: @comment %>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
@@ -28,7 +28,7 @@
|
||||
<% if CurrentUser.is_member? %>
|
||||
<div class="new-comment">
|
||||
<p><%= link_to "Post comment", new_comment_path, :class => "expand-comment-response" %></p>
|
||||
<%= render "comments/form", :post => post, :comment => post.comments.new %>
|
||||
<%= render "comments/form", comment: post.comments.new, hidden: true %>
|
||||
</div>
|
||||
<% end %>
|
||||
</div>
|
||||
|
||||
@@ -35,7 +35,7 @@
|
||||
<% end %>
|
||||
<li id="comment-vote-up-link-for-<%= comment.id %>"><%= link_to "Vote up", comment_votes_path(:comment_id => comment.id, :score => "up"), :method => :post, :remote => true %></li>
|
||||
<li id="comment-vote-down-link-for-<%= comment.id %>"><%= link_to "Vote down", comment_votes_path(:comment_id => comment.id, :score => "down"), :method => :post, :remote => true %></li>
|
||||
<li id="comment-unvote-link-for-<%= comment.id %>" class="unvote-comment-link"><%= link_to "Unvote", comment_votes_path(:comment_id => comment.id), :method => :delete, :remote => true %></li>
|
||||
<li style="display: none;" id="comment-unvote-link-for-<%= comment.id %>" class="unvote-comment-link"><%= link_to "Unvote", comment_votes_path(:comment_id => comment.id), :method => :delete, :remote => true %></li>
|
||||
<% if CurrentUser.is_moderator? %>
|
||||
<li>|</li>
|
||||
<li>
|
||||
@@ -46,7 +46,7 @@
|
||||
<% end %>
|
||||
</menu>
|
||||
<% if comment.editable_by?(CurrentUser.user) %>
|
||||
<%= render "comments/form", :post => comment.post, :comment => comment %>
|
||||
<%= render "comments/form", comment: comment, hidden: true %>
|
||||
<% end %>
|
||||
<% end %>
|
||||
</div>
|
||||
|
||||
Reference in New Issue
Block a user