Merge pull request #1883 from xarlybovi/switch-flags-ajax

Switch flag/unflag buttons on use via ajax
This commit is contained in:
Raimond Garcia
2017-09-20 12:21:56 +02:00
committed by GitHub
6 changed files with 55 additions and 21 deletions

View File

@@ -60,6 +60,7 @@
//= require legislation_annotatable
//= require watch_form_changes
//= require followable
//= require flaggable
//= require documentable
//= require tree_navigator
//= require custom

View File

@@ -0,0 +1,4 @@
App.Flaggable =
update: (resource_id, button) ->
$("#" + resource_id + " .js-flag-actions").html(button).foundation()

View File

@@ -1,21 +1,19 @@
<span class="js-flag-actions">
<span class="flag-content">
<% if show_flag_action? proposal %>
<a id="flag-expand-proposal-<%= proposal.id %>" data-toggle="flag-drop-proposal-<%= proposal.id %>" title="<%= t('shared.flag') %>">
<span class="icon-flag flag-disable"></span>
</a>
<span class="dropdown-pane" id="flag-drop-proposal-<%= proposal.id %>" data-dropdown data-auto-focus="true">
<%= link_to t('shared.flag'), flag_proposal_path(proposal), method: :put, remote: true, id: "flag-proposal-#{ proposal.id }" %>
</span>
<% end %>
<span class="flag-content">
<% if show_flag_action? proposal %>
<a id="flag-expand-proposal-<%= proposal.id %>" data-toggle="flag-drop-proposal-<%= proposal.id %>" title="<%= t('shared.flag') %>">
<span class="icon-flag flag-disable"></span>
</a>
<span class="dropdown-pane" id="flag-drop-proposal-<%= proposal.id %>" data-dropdown data-auto-focus="true">
<%= link_to t('shared.flag'), flag_proposal_path(proposal), method: :put, remote: true, id: "flag-proposal-#{ proposal.id }" %>
</span>
<% end %>
<% if show_unflag_action? proposal %>
<a id="unflag-expand-proposal-<%= proposal.id %>" data-toggle="unflag-drop-proposal-<%= proposal.id %>" title="<%= t('shared.unflag') %>">
<span class="icon-flag flag-active"></span>
</a>
<span class="dropdown-pane" id="unflag-drop-proposal-<%= proposal.id %>" data-dropdown data-auto-focus="true">
<%= link_to t('shared.unflag'), unflag_proposal_path(proposal), method: :put, remote: true, id: "unflag-proposal-#{ proposal.id }" %>
</span>
<% end %>
</span>
<% if show_unflag_action? proposal %>
<a id="unflag-expand-proposal-<%= proposal.id %>" data-toggle="unflag-drop-proposal-<%= proposal.id %>" title="<%= t('shared.unflag') %>">
<span class="icon-flag flag-active"></span>
</a>
<span class="dropdown-pane" id="unflag-drop-proposal-<%= proposal.id %>" data-dropdown data-auto-focus="true">
<%= link_to t('shared.unflag'), unflag_proposal_path(proposal), method: :put, remote: true, id: "unflag-proposal-#{ proposal.id }" %>
</span>
<% end %>
</span>

View File

@@ -1 +1,2 @@
$("#<%= dom_id(@proposal) %> .js-flag-actions").html('<%= j render("proposals/flag_actions", proposal: @proposal) %>');
App.Flaggable.update("<%= dom_id(@proposal) %>",
"<%= j render("proposals/flag_actions", proposal: @proposal) %>")

View File

@@ -41,7 +41,9 @@
<% if current_user %>
<span class="bullet">&nbsp;&bull;&nbsp;</span>
<%= render 'proposals/flag_actions', proposal: @proposal %>
<span class="js-flag-actions">
<%= render 'proposals/flag_actions', proposal: @proposal %>
</span>
<% end %>
</div>

View File

@@ -1244,6 +1244,34 @@ feature 'Proposals' do
expect(Flag.flagged?(user, proposal)).to_not be
end
scenario 'Flagging/Unflagging AJAX', :js do
user = create(:user)
proposal = create(:proposal)
login_as(user)
visit proposal_path(proposal)
# Flagging
within "#proposal_#{proposal.id}" do
page.find("#flag-expand-proposal-#{proposal.id}").click
page.find("#flag-proposal-#{proposal.id}").click
expect(page).to have_css("#unflag-expand-proposal-#{proposal.id}")
end
expect(Flag.flagged?(user, proposal)).to be
# Unflagging
within "#proposal_#{proposal.id}" do
page.find("#unflag-expand-proposal-#{proposal.id}").click
page.find("#unflag-proposal-#{proposal.id}").click
expect(page).to have_css("#flag-expand-proposal-#{proposal.id}")
end
expect(Flag.flagged?(user, proposal)).to_not be
end
it_behaves_like "followable", "proposal", "proposal_path", { "id": "id" }
it_behaves_like "documentable", "proposal", "proposal_path", { "id": "id" }