Merge pull request #47 from AyuntamientoMadrid/ajax-47

Mejorar usabilidad con AJAX
This commit is contained in:
Raimond Garcia
2015-07-30 18:55:31 +02:00
12 changed files with 97 additions and 51 deletions

View File

@@ -0,0 +1 @@
window.App = {}

View File

@@ -15,6 +15,16 @@
//= require foundation
//= require turbolinks
//= require ckeditor/init
//= require app
//= require_tree .
$(function(){ $(document).foundation(); });
var initialize_modules = function() {
App.Comments.initialize();
};
$(function(){
$(document).foundation();
$(document).ready(initialize_modules)
$(document).on('page:load', initialize_modules)
});

View File

@@ -1,13 +1,20 @@
jQuery ->
App.Comments =
toggle_comment = (id) ->
add_response: (parent_id, response_html) ->
$(response_html).insertAfter($("#js-comment-form-#{parent_id}"))
reset_and_hide_form: (id) ->
form = $("#js-comment-form-#{id}")
form.val('')
form.hide()
toggle_form: (id) ->
$("#js-comment-form-#{id}").toggle()
ready = ->
$('.js-add-comment-link').click ->
initialize: ->
$('body').on 'click', '.js-add-comment-link', ->
id = $(this).data().id
toggle_comment(id)
App.Comments.toggle_form(id)
false
$(document).ready(ready)
$(document).on('page:load', ready)

View File

@@ -1,12 +1,13 @@
class CommentsController < ApplicationController
before_action :authenticate_user!
before_action :set_debate, :set_parent
respond_to :html, :js
def create
comment = Comment.build(@debate, current_user, params[:comment][:body])
comment.save!
comment.move_to_child_of(@parent) if reply?
redirect_to @debate, notice: "Comentario guardado"
@comment = Comment.build(@debate, current_user, params[:comment][:body])
@comment.save!
@comment.move_to_child_of(@parent) if reply?
respond_with @comment
end
private

View File

@@ -1,11 +1,12 @@
class VotesController < ApplicationController
before_action :set_debate
before_action :authenticate_user!
respond_to :html, :js
def create
register_vote
notice = @debate.vote_registered? ? I18n.t("votes.notice_thanks") : I18n.t("votes.notice_already_registered")
redirect_to @debate, notice: notice
respond_with @debate
end
private

View File

@@ -1,7 +1,7 @@
<%= link_to comment_link_text(parent), "", class: "js-add-comment-link", data: {'id': dom_id(parent)} %>
<div id="js-comment-form-<%= dom_id(parent) %>" style="display:none">
<%= form_for [@debate, Comment.new] do |f| %>
<%= form_for [@debate, Comment.new], remote: true do |f| %>
<%= f.text_area :body %>
<%= f.hidden_field :commentable_type, value: parent.class %>
<%= f.hidden_field :commentable_id, value: parent.id %>

View File

@@ -0,0 +1,3 @@
var parent_id = '<%= dom_id(@parent) %>';
App.Comments.reset_and_hide_form(parent_id);
App.Comments.add_response(parent_id, "<%= j(render @comment) %>");

View File

@@ -17,32 +17,8 @@
<p><%= render 'shared/tags', debate: @debate %></p>
</div>
<div class="small-12 medium-3 column votes">
<div class="small-12 column text-center">
<div id="in_favor" class="inline-block">
<%= link_to debate_votes_path(@debate, value: 'yes'), class: 'in-favor', method: "post" do %>
<i class="fi-like"></i>
<span><%= percentage('likes', @debate) %></span>
<% end %>
</div>
<span class="divider"></span>
<div id="against" class="inline-block">
<%= link_to debate_votes_path(@debate, value: 'no'), class: 'against', method: "post" do %>
<i class="fi-dislike"></i>
<span><%= percentage('dislikes', @debate) %></span>
<% end %>
</div>
</div>
<div class="small-12 column text-center">
<p class="total-votes"><%= pluralize(@debate.total_votes, t("debates.debate.vote"), t("debates.debate.votes")) %></p>
</div>
</div>
<div class="small-12 medium-3 column text-center publish-comment">
<%= link_to t("debates.show.leave_comment"), "#comments", :class => 'button radius expand' %>
<div id="votes" class="votes small-12 medium-3 column">
<%= render 'votes/votes' %>
</div>
</div>
</section>

View File

@@ -0,0 +1,23 @@
<div class="small-12 column text-center">
<div id="in_favor" class="inline-block">
<%= link_to debate_votes_path(@debate, value: 'yes'), class: 'in-favor', method: "post", remote: true do %>
<i class="fi-like"></i>
<span><%= percentage('likes', @debate) %></span>
<% end %>
</div>
<span class="divider"></span>
<div id="against" class="inline-block">
<%= link_to debate_votes_path(@debate, value: 'no'), class: 'against', method: "post", remote: true do %>
<i class="fi-dislike"></i>
<span><%= percentage('dislikes', @debate) %></span>
<% end %>
</div>
</div>
<div class="small-12 column text-center">
<p class="total-votes">
<%= pluralize(@debate.total_votes, t("debates.debate.vote"), t("debates.debate.votes")) %>
</p>
</div>

View File

@@ -0,0 +1 @@
$("#votes").html("<%= j render('votes') %>");

View File

@@ -31,8 +31,6 @@ feature 'Comments' do
fill_in 'comment_body', with: '¿Has pensado en esto...?'
click_button 'Publicar comentario'
expect(page).to have_content 'Comentario guardado'
within "#comments" do
expect(page).to have_content '¿Has pensado en esto...?'
end
@@ -53,7 +51,6 @@ feature 'Comments' do
click_button 'Publicar respuesta'
end
expect(page).to have_content 'Comentario guardado'
within "#comment-#{comment.id}" do
expect(page).to have_content 'La semana que viene está hecho.'
end

View File

@@ -28,21 +28,47 @@ feature 'Votes' do
end
end
scenario 'Create' do
scenario 'Create', :js do
find('#in_favor a').click
expect(page).to have_content "Thanks for voting."
within('#in_favor') do
expect(page).to have_content "100%"
end
scenario 'Update' do
within('#against') do
expect(page).to have_content "0%"
end
expect(page).to have_content "1 vote"
end
scenario 'Update', :js do
find('#in_favor a').click
find('#against a').click
expect(page).to have_content "Thanks for voting."
within('#in_favor') do
expect(page).to have_content "0%"
end
scenario 'Trying to vote multiple times' do
within('#against') do
expect(page).to have_content "100%"
end
expect(page).to have_content "1 vote"
end
scenario 'Trying to vote multiple times', :js do
find('#in_favor a').click
find('#in_favor a').click
expect(page).to have_content "Your vote is already registered."
within('#in_favor') do
expect(page).to have_content "100%"
end
within('#against') do
expect(page).to have_content "0%"
end
expect(page).to have_content "1 vote"
end