From 3352ca6a70c92c2a41a5007016e5ac721b567d16 Mon Sep 17 00:00:00 2001 From: Owen Leonard Date: Tue, 23 Feb 2016 12:07:17 -0500 Subject: [PATCH] Bug 15886 - Revise layout and behavior of audio alerts management This patch changes the behavior of the audio alerts management page so that sections of the page are shown or hidden based on what the current task is. Other changes include: - Moving JavaScript to a separate file - Adding a toolbar with a "New alert" button. - Enabling or disabling the "play sound" button based on the value of the sound file field. - Enabling or disabling the "delete" button based on whether there are checkboxes checked. - Switching the patron category administration header search form for the "generic" catalog search one. - Adding "Required" classes to required fields so that the staff client's built-in JS validation library can be used. - Styling the add/edit form in a way which is consistent with other interfaces in Koha. - Removing the invalid "border" attribute from images. - Adding better alt attributes to images. To test, the AudioAlerts system preference must be enabled. Apply the patch and go to Administration -> Audio alerts. - Confirm that the add/edit form is hidden initially. A toolbar with a "New" button should appear with existing audio alerts in a table below. - Confirm that the "New alert" button works: - The table should be hidden and an empty "add" form displayed. - Confirm that an empty form cannot be submitted. - Confirm that typing or selecting a sound enables the "Play sound" button and that it works to play the sound. - Confirm that adding valid data works. - Confirm that clicking the "Cancel" button hides the form and redisplays the table. - Test the "edit" button for an existing sound: - Confirm that the edit form is displayed and populated with the correct data. - Confirm that edits are saved correctly. - When viewing the table of existing alerts, confirm that checking one of the checkboxes "enables" the delete button. - With one or more checkboxes checked, test that clicking the delete button triggers a deletion confirmation. Test both confirm and cancel operations. - With no checkboxes checked, test that clicking the delete button triggers an alert that checkboxes must be checked. - Ponder whether all this is an improvement or not. Signed-off-by: Kyle M Hall Signed-off-by: Jonathan Druart Signed-off-by: Brendan Gallagher brendan@bywatersolutions.com --- .../intranet-tmpl/prog/en/js/audio_alerts.js | 89 +++++++++ .../prog/en/modules/admin/audio_alerts.tt | 169 +++++++----------- 2 files changed, 151 insertions(+), 107 deletions(-) create mode 100644 koha-tmpl/intranet-tmpl/prog/en/js/audio_alerts.js diff --git a/koha-tmpl/intranet-tmpl/prog/en/js/audio_alerts.js b/koha-tmpl/intranet-tmpl/prog/en/js/audio_alerts.js new file mode 100644 index 0000000000..154c33a407 --- /dev/null +++ b/koha-tmpl/intranet-tmpl/prog/en/js/audio_alerts.js @@ -0,0 +1,89 @@ +$( document ).ready(function() { + var checkboxes = $("#delete-alert-form input[type='checkbox']"); + var checkedcheckboxes = 0; + checkboxes.on("change",function(){ + if( $(checkboxes+":checked").length > 0){ + checkedcheckboxes = 1; + $("#delete-alerts").removeClass("disabled"); + } else { + checkedcheckboxes = 0; + $("#delete-alerts").addClass("disabled"); + } + }); + + var soundfield = $("#sound"); + var playsound = $('#play-sound'); + + soundfield.on("change",function(){ + enablePlayButton($(this).val(),playsound); + }); + + $(".edit-alert").hide(); + $("#new-alert-form").hide(); + + $("#newalert").on("click",function(e){ + e.preventDefault(); + $("#new-alert-form").show(); + $("#toolbar, #delete-alert-form").hide(); + }); + + $('#koha-sounds').on('change', function() { + soundfield.val( this.value ); + enablePlayButton($(this).val(),playsound); + }); + + playsound.on('click', function(e) { + e.preventDefault(); + if( soundfield.val() !== '' ){ + playSound( soundfield.val() ); + } else { + alert( MSG_AUDIO_EMPTY_SOUND ); + } + }); + + $('#cancel-edit').on('click', function(e) { + e.preventDefault(); + + enablePlayButton("",playsound); + $("#id").val(""); + $("#selector").val(""); + soundfield.val(""); + $("#koha-sounds").val(""); + + $("#toolbar").show(); + $(".edit-alert").hide(); + $(".create-alert").show(); + $("#new-alert-form").hide(); + $("#delete-alert-form").show(); + }); + + $('#delete-alert-form').on('submit', function() { + if( checkedcheckboxes == 1 ){ + return confirm( MSG_AUDIO_CONFIRM_DELETE ); + } else { + alert( MSG_AUDIO_CHECK_CHECKBOXES ); + return false; + } + }); +}); + +function enablePlayButton(sound_field_value,playbutton){ + if( sound_field_value !== '' ){ + playbutton.removeClass("disabled"); + } else { + playbutton.addClass("disabled"); + } +} + +function EditAlert( elt, id, precedence, selector, sound ) { + $("#new-alert-form").show(); + $("#delete-alert-form").hide(); + $("#toolbar").hide(); + $(".create-alert").hide(); + $(".edit-alert").show(); + $("#id").val(id); + $("#selector").val(selector); + $("#sound").val(sound); + $("#koha-sounds").val(sound); + enablePlayButton(sound,$('#play-sound')); +} \ No newline at end of file diff --git a/koha-tmpl/intranet-tmpl/prog/en/modules/admin/audio_alerts.tt b/koha-tmpl/intranet-tmpl/prog/en/modules/admin/audio_alerts.tt index 434716c45e..69b0aa2ab2 100644 --- a/koha-tmpl/intranet-tmpl/prog/en/modules/admin/audio_alerts.tt +++ b/koha-tmpl/intranet-tmpl/prog/en/modules/admin/audio_alerts.tt @@ -1,76 +1,17 @@ [% INCLUDE 'doc-head-open.inc' %] Koha › Administration › Audio alerts [% INCLUDE 'doc-head-close.inc' %] - - + + [% INCLUDE 'header.inc' %] -[% INCLUDE 'patrons-admin-search.inc' %] +[% INCLUDE 'cat-search.inc' %] @@ -78,49 +19,62 @@ function EditAlert( elt, id, precedence, selector, sound ) {
-
-
- Add new alertEdit alert - - - - - - -
+ - + +
+ Add new alertEdit alert -

- - - Cancel edit -

+ +
    +
  1. + + + Required +
    2. +
  2. + + + + Required +
    3. +
  3. + + +
    4. +
+
+
+ + Cancel
+

Audio alerts

@@ -140,19 +94,19 @@ function EditAlert( elt, id, precedence, selector, sound ) { @@ -163,8 +117,9 @@ function EditAlert( elt, id, precedence, selector, sound ) {
[% a.precedence %] - Go up + Move alert up - Go top + Move alert to top - Go bottom + Move alert to bottom - Go down + Move alert down [% a.selector %]
-

- +

+ +

-- 2.39.5