diff --git a/wagtail/admin/static_src/wagtailadmin/scss/components/_listing.scss b/wagtail/admin/static_src/wagtailadmin/scss/components/_listing.scss index 042fd7cae..b77325cc0 100644 --- a/wagtail/admin/static_src/wagtailadmin/scss/components/_listing.scss +++ b/wagtail/admin/static_src/wagtailadmin/scss/components/_listing.scss @@ -99,6 +99,14 @@ ul.listing { background-color: #fcfcfc; } } + + tr.selected { + background-color: #c8eae9; + + &:hover { + background-color: #b5e3e2; + } + } } &.full-width tbody { diff --git a/wagtail/snippets/static_src/wagtailsnippets/js/snippet-multiple-select.js b/wagtail/snippets/static_src/wagtailsnippets/js/snippet-multiple-select.js new file mode 100644 index 000000000..c3f2e1b4a --- /dev/null +++ b/wagtail/snippets/static_src/wagtailsnippets/js/snippet-multiple-select.js @@ -0,0 +1,103 @@ +var updateRow = function(id, newValue) { + $row = $('table.listing tr#snippet-row-' + id); + $checklist = $row.find('input[type=checkbox].toggle-select-row'); + $checklist.prop('checked', newValue); + if (newValue) { + $row.addClass('selected'); + } else { + $row.removeClass('selected'); + } +}; + +var updateDeleteButton = function(anySelected, newState) { + var $deleteButton = $('a.button.delete-button'); + var ids = []; + $.each(newState, function(id, newValue) { + if (newValue) { + ids.push(id); + } + }); + if (anySelected) { + // enable button and add url + $deleteButton.removeClass('disabled'); + var url = $deleteButton.data('url'); + url = url + $.param({id: ids}, true); + $deleteButton.attr('href', url); + } else { + // disable button and remove url + $deleteButton.addClass('disabled'); + $deleteButton.attr('href', null); + } +}; + +var updateSelectAllCheckbox = function(value) { + var $selectAllCheckbox = $('table.listing input[type=checkbox].toggle-select-all'); + $selectAllCheckbox.prop('checked', value); +}; + +var buildSelectedState = function() { + // prepare the selected state -- {3: true, 4: false} + state = {}; + $rows = $('table.listing tbody tr input[type=checkbox].toggle-select-row'); + $.each($rows, function (index, row) { + var $row = $(row); + var selected = $row.prop('checked'); + var id = $row.attr('value'); + state[id] = selected; + }); + return state; +}; + +var updateSelectedState = function(state, newValue, idToUpdate) { + if (idToUpdate === null) { + // update all rows + $.each(state, function (id, currentValue) { + state[id] = newValue; + }); + } else { + // update single row + state[idToUpdate] = newValue; + } + return state; +}; + +var updateView = function(newState) { + var allSelected = true; + var anySelected = false; + var countOfUnselected = 0; + var countOfSelected = 0; + + // update each row with the new value (selected or not) + $.each(newState, function (id, newValue) { + updateRow(id, newValue); + if (newValue === false) { + countOfUnselected += 1; + } else { + countOfSelected += 1; + } + }); + + // update the main checkbox for select all (if all are true) + if (countOfUnselected >= 1) { allSelected = false; } + updateSelectAllCheckbox(allSelected); + + // update the delete button + if (countOfSelected >= 1) { anySelected = true; } + updateDeleteButton(anySelected, newState); +}; + +var onListingCheckboxClick = function() { + $('table.listing input[type="checkbox"]').on('click', function(event) { + var $target = $(event.target); + var setToValue = $target.prop('checked'); + var currentState = buildSelectedState(); + var id = null; + if ( $target.hasClass('toggle-select-row') ) { + id = $target.attr('value'); + } + var newState = updateSelectedState(currentState, setToValue, id); + updateView(newState); + }); +}; + +$( document ).ready(onListingCheckboxClick); diff --git a/wagtail/snippets/templates/wagtailsnippets/snippets/list.html b/wagtail/snippets/templates/wagtailsnippets/snippets/list.html index 80f203fd0..6e51a0dc2 100644 --- a/wagtail/snippets/templates/wagtailsnippets/snippets/list.html +++ b/wagtail/snippets/templates/wagtailsnippets/snippets/list.html @@ -1,16 +1,21 @@ {% load i18n wagtailadmin_tags %} + {% if can_delete_snippets %}{% endif %} + - + {% if can_delete_snippets %}{% endif %} {% for snippet in items %} - + + {% if can_delete_snippets %} + + {% endif %}
{% trans "Title" %}
{% if choosing %}

{{ snippet }}

diff --git a/wagtail/snippets/templates/wagtailsnippets/snippets/type_index.html b/wagtail/snippets/templates/wagtailsnippets/snippets/type_index.html index 80d398315..d9590a420 100644 --- a/wagtail/snippets/templates/wagtailsnippets/snippets/type_index.html +++ b/wagtail/snippets/templates/wagtailsnippets/snippets/type_index.html @@ -1,5 +1,5 @@ {% extends "wagtailadmin/base.html" %} -{% load i18n %} +{% load i18n static %} {% block titletag %}{% blocktrans with snippet_type_name_plural=model_opts.verbose_name_plural|capfirst %}Snippets {{ snippet_type_name_plural }}{% endblocktrans %}{% endblock %} {% block extra_js %} @@ -11,13 +11,16 @@ targetOutput: "#snippet-results" } + {% if can_delete_snippets %} + + {% endif %} {% endblock %} {% block content %}
-
+

{% blocktrans with snippet_type_name_plural=model_opts.verbose_name_plural|capfirst %}Snippets {{ snippet_type_name_plural }}{% endblocktrans %}

@@ -32,7 +35,10 @@ {% endif %}
-
+
+ {% if can_delete_snippets %} + {% blocktrans with snippet_type_name=model_opts.verbose_name_plural %}Delete {{ snippet_type_name }}{% endblocktrans %} + {% endif %} {% if can_add_snippet %} {% blocktrans with snippet_type_name=model_opts.verbose_name %}Add {{ snippet_type_name }}{% endblocktrans %} {# TODO: figure out a way of saying "Add a/an [foo]" #} diff --git a/wagtail/snippets/views/snippets.py b/wagtail/snippets/views/snippets.py index c4c6e4f63..c41223db2 100644 --- a/wagtail/snippets/views/snippets.py +++ b/wagtail/snippets/views/snippets.py @@ -115,6 +115,7 @@ def list(request, app_label, model_name): 'model_opts': model._meta, 'items': paginated_items, 'can_add_snippet': request.user.has_perm(get_permission_name('add', model)), + 'can_delete_snippets': request.user.has_perm(get_permission_name('delete', model)), 'is_searchable': is_searchable, 'search_form': search_form, 'is_searching': is_searching,