Fix buttons visability on protocols page according to new styleguide

This commit is contained in:
Mojca Lorber 2020-09-03 17:05:25 +02:00
parent 4c1e120f23
commit 24745203e1
2 changed files with 92 additions and 95 deletions

View file

@ -439,79 +439,78 @@ function updateButtons() {
var archiveBtn = $("[data-action='archive']"); var archiveBtn = $("[data-action='archive']");
var restoreBtn = $("[data-action='restore']"); var restoreBtn = $("[data-action='restore']");
var exportBtn = $("[data-action='export']"); var exportBtn = $("[data-action='export']");
var row = $("tr[data-row-id='" + rowsSelected[0] + "']");
var rows = [];
if (rowsSelected.length == 1) { if (rowsSelected.length === 1) {
// 1 ROW SELECTED // 1 ROW SELECTED
var row = $("tr[data-row-id='" + rowsSelected[0] + "']"); if (row.is('[data-can-edit]')) {
editBtn.removeClass('disabled hidden');
if (row.is("[data-can-edit]")) { editBtn.off('click').on('click', function() { editSelectedProtocol(); });
editBtn.removeAttr("disabled");
editBtn.off("click").on("click", function() { editSelectedProtocol(); });
} else { } else {
editBtn.attr("disabled", "disabled"); editBtn.addClass('disabled hidden');
editBtn.off("click"); editBtn.off('click');
} }
if (row.is("[data-can-clone]")) { if (row.is('[data-can-clone]')) {
cloneBtn.removeAttr("disabled"); cloneBtn.removeClass('disabled hidden');
cloneBtn.off("click").on("click", function() { cloneSelectedProtocol(); }); cloneBtn.off('click').on('click', function() { cloneSelectedProtocol(); });
} else { } else {
cloneBtn.attr("disabled", "disabled"); cloneBtn.addClass('disabled hidden');
cloneBtn.off("click"); cloneBtn.off('click');
} }
if (row.is("[data-can-make-private]")) { if (row.is('[data-can-make-private]')) {
makePrivateBtn.removeAttr("disabled"); makePrivateBtn.removeClass('disabled hidden');
makePrivateBtn.off("click").on("click", function() { processMoveButtonClick($(this)); }); makePrivateBtn.off('click').on('click', function() { processMoveButtonClick($(this)); });
} else { } else {
makePrivateBtn.attr("disabled", "disabled"); makePrivateBtn.addClass('disabled hidden');
makePrivateBtn.off("click"); makePrivateBtn.off('click');
} }
if (row.is("[data-can-publish]")) { if (row.is('[data-can-publish]')) {
publishBtn.removeAttr("disabled"); publishBtn.removeClass('disabled hidden');
publishBtn.off("click").on("click", function() { processMoveButtonClick($(this)); }); publishBtn.off('click').on('click', function() { processMoveButtonClick($(this)); });
} else { } else {
publishBtn.attr("disabled", "disabled"); publishBtn.addClass('disabled hidden');
publishBtn.off("click"); publishBtn.off('click');
} }
if (row.is("[data-can-archive]")) { if (row.is('[data-can-archive]')) {
archiveBtn.removeAttr("disabled"); archiveBtn.removeClass('disabled hidden');
archiveBtn.off("click").on("click", function() { processMoveButtonClick($(this)); }); archiveBtn.off('click').on('click', function() { processMoveButtonClick($(this)); });
} else { } else {
archiveBtn.attr("disabled", "disabled"); archiveBtn.addClass('disabled hidden');
archiveBtn.off("click"); archiveBtn.off('click');
} }
if (row.is("[data-can-restore]")) { if (row.is('[data-can-restore]')) {
restoreBtn.removeAttr("disabled"); restoreBtn.removeClass('disabled hidden');
restoreBtn.off("click").on("click", function() { processMoveButtonClick($(this)); }); restoreBtn.off('click').on('click', function() { processMoveButtonClick($(this)); });
} else { } else {
restoreBtn.attr("disabled", "disabled"); restoreBtn.addClass('disabled hidden');
restoreBtn.off("click"); restoreBtn.off('click');
} }
if (row.is("[data-can-export]")) { if (row.is('[data-can-export]')) {
exportBtn.removeAttr("disabled"); exportBtn.removeClass('disabled hidden');
exportBtn.off("click").on("click", function() { exportProtocols(rowsSelected); }); exportBtn.off('click').on('click', function() { exportProtocols(rowsSelected); });
} else { } else {
exportBtn.attr("disabled", "disabled"); exportBtn.addClass('disabled hidden');
exportBtn.off("click"); exportBtn.off('click');
} }
} else if (rowsSelected.length === 0) { } else if (rowsSelected.length === 0) {
// 0 ROWS SELECTED // 0 ROWS SELECTED
editBtn.attr("disabled", "disabled"); editBtn.addClass('disabled hidden');
editBtn.off("click"); editBtn.off('click');
cloneBtn.attr("disabled", "disabled"); cloneBtn.addClass('disabled hidden');
cloneBtn.off("click"); cloneBtn.off('click');
makePrivateBtn.attr("disabled", "disabled"); makePrivateBtn.addClass('disabled hidden');
makePrivateBtn.off("click"); makePrivateBtn.off('click');
publishBtn.attr("disabled", "disabled"); publishBtn.addClass('disabled hidden');
publishBtn.off("click"); publishBtn.off('click');
archiveBtn.attr("disabled", "disabled"); archiveBtn.addClass('disabled hidden');
archiveBtn.off("click"); archiveBtn.off('click');
restoreBtn.attr("disabled", "disabled"); restoreBtn.addClass('disabled hidden');
restoreBtn.off("click"); restoreBtn.off('click');
exportBtn.attr("disabled", "disabled"); exportBtn.addClass('disabled hidden');
exportBtn.off("click"); exportBtn.off('click');
} else { } else {
// > 1 ROWS SELECTED // > 1 ROWS SELECTED
var rows = [];
_.each(rowsSelected, function(rowId) { _.each(rowsSelected, function(rowId) {
rows.push($("tr[data-row-id='" + rowId + "']")[0]); rows.push($("tr[data-row-id='" + rowId + "']")[0]);
}); });
@ -519,44 +518,44 @@ function updateButtons() {
// Only enable button if all selected rows can // Only enable button if all selected rows can
// be published/archived/restored/exported // be published/archived/restored/exported
editBtn.attr("disabled", "disabled"); editBtn.removeClass('hidden').addClass('disabled');
editBtn.off("click"); editBtn.off('click');
cloneBtn.attr("disabled", "disabled"); cloneBtn.removeClass('hidden').addClass('disabled');
cloneBtn.off("click"); cloneBtn.off('click');
if (!rows.is(":not([data-can-make-private])")) { if (!rows.is(':not([data-can-make-private])')) {
makePrivateBtn.removeAttr("disabled"); makePrivateBtn.removeClass('disabled hidden');
makePrivateBtn.off("click").on("click", function() { processMoveButtonClick($(this)); }); makePrivateBtn.off('click').on('click', function() { processMoveButtonClick($(this)); });
} else { } else {
makePrivateBtn.attr("disabled", "disabled"); makePrivateBtn.removeClass('hidden').addClass('disabled');
makePrivateBtn.off("click"); makePrivateBtn.off('click');
} }
if (!rows.is(":not([data-can-publish])")) { if (!rows.is(':not([data-can-publish])')) {
publishBtn.removeAttr("disabled"); publishBtn.removeClass('disabled hidden');
publishBtn.off("click").on("click", function() { processMoveButtonClick($(this)); }); publishBtn.off('click').on('click', function() { processMoveButtonClick($(this)); });
} else { } else {
publishBtn.attr("disabled", "disabled"); publishBtn.removeClass('hidden').addClass('disabled');
publishBtn.off("click"); publishBtn.off('click');
} }
if (!rows.is(":not([data-can-archive])")) { if (!rows.is(':not([data-can-archive])')) {
archiveBtn.removeAttr("disabled"); archiveBtn.removeClass('disabled hidden');
archiveBtn.off("click").on("click", function() { processMoveButtonClick($(this)); }); archiveBtn.off('click').on('click', function() { processMoveButtonClick($(this)); });
} else { } else {
archiveBtn.attr("disabled", "disabled"); archiveBtn.removeClass('hidden').addClass('disabled');
archiveBtn.off("click"); archiveBtn.off('click');
} }
if (!rows.is(":not([data-can-restore])")) { if (!rows.is(':not([data-can-restore])')) {
restoreBtn.removeAttr("disabled"); restoreBtn.removeClass('disabled hidden');
restoreBtn.off("click").on("click", function() { processMoveButtonClick($(this)); }); restoreBtn.off('click').on('click', function() { processMoveButtonClick($(this)); });
} else { } else {
restoreBtn.attr("disabled", "disabled"); restoreBtn.removeClass('hidden').addClass('disabled');
restoreBtn.off("click"); restoreBtn.off('click');
} }
if (!rows.is(":not([data-can-export])")) { if (!rows.is(':not([data-can-export])')) {
exportBtn.removeAttr("disabled"); exportBtn.removeClass('disabled hidden');
exportBtn.off("click").on("click", function() { exportProtocols(rowsSelected); }); exportBtn.off('click').on('click', function() { exportProtocols(rowsSelected); });
} else { } else {
exportBtn.attr("disabled", "disabled"); exportBtn.removeClass('hidden').addClass('disabled');
exportBtn.off("click"); exportBtn.off('click');
} }
} }
} }

View file

@ -33,32 +33,31 @@
<span class="fas fa-plus"></span> <span class="fas fa-plus"></span>
<span class="hidden-xs">&nbsp;<%= t("protocols.index.create_new") %></span> <span class="hidden-xs">&nbsp;<%= t("protocols.index.create_new") %></span>
</button> </button>
<button class="btn btn-secondary" data-action="edit" disabled> <button class="btn btn-light disabled hidden" data-action="edit">
<span class="fas fa-pencil-alt"></span> <span class="fas fa-pencil-alt"></span>
<span class="hidden-xs">&nbsp;<%= t("protocols.index.edit") %></span> <span class="hidden-xs">&nbsp;<%= t("protocols.index.edit") %></span>
</button> </button>
<button class="btn btn-secondary" data-action="clone" disabled> <button class="btn btn-light disabled hidden" data-action="clone">
<span class="fas fa-copy"></span> <span class="fas fa-copy"></span>
<span class="hidden-xs">&nbsp;<%= t("protocols.index.clone_btn") %></span> <span class="hidden-xs">&nbsp;<%= t("protocols.index.clone_btn") %></span>
</button> </button>
<% if @type == :public %> <% if @type == :public %>
<button class="btn btn-secondary" data-action="make-private" data-url="<%= make_private_protocols_path %>" disabled> <button class="btn btn-light disabled hidden" data-action="make-private" data-url="<%= make_private_protocols_path %>">
<span class="fas fa-eye-slash"></span> <span class="fas fa-eye-slash"></span>
<span class="hidden-xs">&nbsp;<%= t("protocols.index.make_private") %></span> <span class="hidden-xs">&nbsp;<%= t("protocols.index.make_private") %></span>
</button> </button>
<% elsif @type == :private %> <% elsif @type == :private %>
<button class="btn btn-secondary" data-action="publish" data-url="<%= publish_protocols_path %>" disabled> <button class="btn btn-light disabled hidden" data-action="publish" data-url="<%= publish_protocols_path %>">
<span class="fas fa-eye"></span> <span class="fas fa-eye"></span>
<span class="hidden-xs">&nbsp;<%= t("protocols.index.publish") %></span> <span class="hidden-xs">&nbsp;<%= t("protocols.index.publish") %></span>
</button> </button>
<% end %> <% end %>
</div> </div>
<div id="import-export-protocols" class="sci-btn-group" role="group"> <div id="import-export-protocols" class="sci-btn-group" role="group">
<button class="btn btn-secondary btn-open-file" <button class="btn btn-light btn-open-file <%= 'disabled hidden' unless can_create_protocols_in_repository?(@current_team) %>"
data-toggle="dropdown" data-toggle="dropdown"
aria-haspopup="true" aria-haspopup="true"
aria-expanded="false" aria-expanded="false">
<%= 'disabled' unless can_create_protocols_in_repository?(@current_team) %>>
<span class="fas fa-download"></span><span class="hidden-xs">&nbsp;<%= t("protocols.index.import") %></span></button> <span class="fas fa-download"></span><span class="hidden-xs">&nbsp;<%= t("protocols.index.import") %></span></button>
<% if can_create_protocols_in_repository?(@current_team) %> <% if can_create_protocols_in_repository?(@current_team) %>
<ul class="dropdown-menu"> <ul class="dropdown-menu">
@ -80,14 +79,14 @@
</li> </li>
</ul> </ul>
<% end %> <% end %>
<button class="btn btn-secondary" data-action="export" data-export-url="<%= export_protocols_path() %>" disabled> <button class="btn btn-light disabled hidden" data-action="export" data-export-url="<%= export_protocols_path() %>">
<span class="fas fa-upload"></span> <span class="fas fa-upload"></span>
<span class="hidden-xs">&nbsp;<%= t("protocols.index.export") %></span> <span class="hidden-xs">&nbsp;<%= t("protocols.index.export") %></span>
</button> </button>
</div> </div>
<div class="sci-btn-group" role="group"> <div class="sci-btn-group" role="group">
<button class="btn btn-secondary" data-action="archive" data-url="<%= archive_protocols_path %>" disabled> <button class="btn btn-light disabled hidden" data-action="archive" data-url="<%= archive_protocols_path %>">
<span class="fas fa-archive"></span> <span class="fas fa-archive"></span>
<span class="hidden-xs">&nbsp;<%= t("protocols.index.archive_action") %></span> <span class="hidden-xs">&nbsp;<%= t("protocols.index.archive_action") %></span>
</button> </button>
@ -97,7 +96,7 @@
<%= t("protocols.index.archive.description") %> <%= t("protocols.index.archive.description") %>
</div> </div>
<div class="sci-btn-group" role="group"> <div class="sci-btn-group" role="group">
<button class="btn btn-secondary" data-action="restore" data-url="<%= restore_protocols_path %>" disabled> <button class="btn btn-light disabled hidden" data-action="restore" data-url="<%= restore_protocols_path %>">
<span class="fas fa-sync-alt"></span> <span class="fas fa-sync-alt"></span>
<span class="hidden-xs">&nbsp;<%= t("protocols.index.restore") %></span> <span class="hidden-xs">&nbsp;<%= t("protocols.index.restore") %></span>
</button> </button>
@ -140,4 +139,3 @@
<%= javascript_include_tag "assets/wopi/create_wopi_file" %> <%= javascript_include_tag "assets/wopi/create_wopi_file" %>
<%= javascript_include_tag "protocols/index" %> <%= javascript_include_tag "protocols/index" %>
<%= javascript_include_tag "protocols/steps" %> <%= javascript_include_tag "protocols/steps" %>