From 0c476f15082893cb2ee66271009fb09d3f698c23 Mon Sep 17 00:00:00 2001
From: Owen Leonard <oleonard@myacpl.org>
Date: Thu, 19 May 2016 09:41:24 -0400
Subject: [PATCH] Bug 16557 - Remove the use of "onclick" from several include
 files

This patch modifies several include files, removing "onclick" attributes
in favor of defining events in JavaScript.

A reusable "toggle" function has been added to the global JS file so
that clicking elements with the class "toggle_element" will toggle the
display of elements as defined in the click target's "data-element"
attribute.

Also changed: In subtypes_unimarc.inc some capitalization errors have
been fixed and label/id pairs corrected.

To test, apply the patch and clear your browser cache if necessary.

- On the Acquisitions home page, click the "Orders search" header search
  tab. Clicking the [+] link should expand and collapse the additional
  search fields.

- On the checkout or patron detail page, view the "Restrictions" tab.
  Click to add a restriction and use the datepicker to select a date.
  Clicking the "Clear date" link should clear the date.

- Trigger the help window on any page. Clicking the "close window"
  button should work correctly.

- Go to Administration -> Patron categories -> Edit. Checking and
  unchecking messaging preference options should work correctly. The "do
  not notify" checkbox should clear other checkboxes in that row and
  vice versa.

- In Serials, from a subscription detail page, clicking the "Renew"
  button should trigger the renew popup.

- Go to Acquisitions -> Vendor -> Add to basket -> From a subscription.
  Clicking the "Advanced search" link in the left hand sidebar should
  toggle the sidebar search form.

- In a UNIMARC system, view the advanced search page. Clicking the "Show
  coded information filters" link should show additional search fields.
  (I tested in my MARC21 system by temporarily moving line 174 of
  advsearch.tt to line 172).

Signed-off-by: Claire Gravely <c.gravely@arts.ac.uk>

Signed-off-by: Jonathan Druart <jonathan.druart@bugs.koha-community.org>

Signed-off-by: Kyle M Hall <kyle@bywatersolutions.com>
---
 .../prog/en/includes/acquisitions-search.inc  |  4 +-
 .../prog/en/includes/borrower_debarments.inc  |  7 +-
 .../prog/en/includes/help-bottom.inc          |  2 +-
 .../en/includes/messaging-preference-form.inc | 26 ++++---
 .../prog/en/includes/serials-toolbar.inc      |  2 +-
 .../prog/en/includes/subscriptions-search.inc |  2 +-
 .../prog/en/includes/subtypes_unimarc.inc     | 73 ++++++++++---------
 .../intranet-tmpl/prog/js/staff-global.js     |  6 ++
 8 files changed, 72 insertions(+), 50 deletions(-)

diff --git a/koha-tmpl/intranet-tmpl/prog/en/includes/acquisitions-search.inc b/koha-tmpl/intranet-tmpl/prog/en/includes/acquisitions-search.inc
index 5aebf54b73..26ab7f1c70 100644
--- a/koha-tmpl/intranet-tmpl/prog/en/includes/acquisitions-search.inc
+++ b/koha-tmpl/intranet-tmpl/prog/en/includes/acquisitions-search.inc
@@ -14,8 +14,8 @@
         <label for="title">Title: </label> <input type="text" id="title" name="title" size="15" value="[% title %]" />
         <label for="searchsupplier">Vendor:</label> <input type="text" id="searchsupplier" name="name" size="15" value="[% name|html %]" />
         <input type="hidden" id="do_search" name="do_search" value="do" />
-        <span class="filteraction" id="filteraction_off" style="display:none"> <a href="#" onclick="$('#filters,.filteraction').toggle();">[-]</a></span>
-        <span class="filteraction" id="filteraction_on"> <a href="#" onclick="$('#filters,.filteraction').toggle();">[+]</a></span>
+        <span class="filteraction" id="filteraction_off" style="display:none"> <a href="#" class="toggle_element" data-element="#filters,.filteraction">[-]</a></span>
+        <span class="filteraction" id="filteraction_on"> <a href="#" class="toggle_element" data-element="#filters,.filteraction">[+]</a></span>
     <input value="Submit" class="submit" type="submit" /> <a href="/cgi-bin/koha/acqui/histsearch.pl">Advanced search</a>
     <p id="filters" style="display:none">
       <label for="basket">Basket: </label><input type="text" name="basket" id="basket" />
diff --git a/koha-tmpl/intranet-tmpl/prog/en/includes/borrower_debarments.inc b/koha-tmpl/intranet-tmpl/prog/en/includes/borrower_debarments.inc
index aea088950d..e3adea0070 100644
--- a/koha-tmpl/intranet-tmpl/prog/en/includes/borrower_debarments.inc
+++ b/koha-tmpl/intranet-tmpl/prog/en/includes/borrower_debarments.inc
@@ -17,6 +17,11 @@
                 mrform.hide();
                 e.preventDefault();
             });
+            $(".clear-date").on("click",function(e){
+                e.preventDefault();
+                var fieldID = this.id.replace("clear-date-","");
+                $("#" + fieldID).val("");
+            });
         })
     //]]>
 </script>
@@ -75,7 +80,7 @@
                 <ol>
                     <li><label for="rcomment">Comment:</label> <input type="text" id="rcomment" name="comment" /></li>
                     <li><label for="rexpiration">Expiration:</label> <input name="expiration" id="rexpiration" size="10" readonly="readonly" value="" class="datepicker" />
-                        <a href='#' onclick="document.getElementById('expiration').value='';">Clear date</a></li>
+                        <a href="#" class="clear-date" id="clear-date-rexpiration">Clear date</a></li>
                 </ol>
             <fieldset class="action"><input type="submit" value="Add restriction" /> <a href="#" class="cancel" id="cancel_manual_restriction">Cancel</a></fieldset>
             </fieldset>
diff --git a/koha-tmpl/intranet-tmpl/prog/en/includes/help-bottom.inc b/koha-tmpl/intranet-tmpl/prog/en/includes/help-bottom.inc
index b7b72c7cc7..9a2fb5af6d 100644
--- a/koha-tmpl/intranet-tmpl/prog/en/includes/help-bottom.inc
+++ b/koha-tmpl/intranet-tmpl/prog/en/includes/help-bottom.inc
@@ -1,5 +1,5 @@
 <form action="/cgi-bin/koha/edithelp.pl" method="post">
-  <fieldset class="action"><input type="button" class="submit" onclick="window.close(); return false;" value="Close help window" />
+  <fieldset class="action"><input type="button" class="close" value="Close help window" />
   <input type="hidden" name="type" value="modify" />
   <input type="hidden" name="referer" value="[% referer %]" />
   <input type="submit" class="submit" value="Edit help" /></fieldset>
diff --git a/koha-tmpl/intranet-tmpl/prog/en/includes/messaging-preference-form.inc b/koha-tmpl/intranet-tmpl/prog/en/includes/messaging-preference-form.inc
index 953b9ef388..a5da438d7c 100644
--- a/koha-tmpl/intranet-tmpl/prog/en/includes/messaging-preference-form.inc
+++ b/koha-tmpl/intranet-tmpl/prog/en/includes/messaging-preference-form.inc
@@ -5,7 +5,7 @@ $(document).ready(function(){
     $(".none").click(function(){
         if($(this).prop("checked")){
             var rowid = $(this).attr("id");
-            newid = Number(rowid.replace("none",""))
+            newid = Number(rowid.replace("none",""));
             $("#sms"+newid).prop("checked", false);
             $("#email"+newid).prop("checked", false);
             $("#phone"+newid).prop("checked", false);
@@ -13,6 +13,12 @@ $(document).ready(function(){
             $("#rss"+newid).prop("checked", false);
         }
     });
+    $(".active_notify").on("change",function(){
+        var attr_id = $(this).data("attr-id");
+        if( $(this).prop("checked") ){
+            $("#none" + attr_id ).prop("checked", false);
+        }
+    });
     $("#info_digests").tooltip();
 });
 //]]>
@@ -75,12 +81,12 @@ $(document).ready(function(){
                  <input type="checkbox"
                  id="sms[% messaging_preference.message_attribute_id %]"
                  name="[% messaging_preference.message_attribute_id %]"
-                 value="sms" checked="checked" onclick = "$('#none'+'[% messaging_preference.message_attribute_id %]').prop('checked', false);" />
+                 value="sms" checked="checked" class="active_notify" data-attr-id="[% messaging_preference.message_attribute_id %]" />
               [% ELSE %]
                  <input type="checkbox"
                  id="sms[% messaging_preference.message_attribute_id %]"
                  name="[% messaging_preference.message_attribute_id %]"
-                 value="sms" onclick = "$('#none'+'[% messaging_preference.message_attribute_id %]').prop('checked', false);" />
+                 value="sms" class="active_notify" data-attr-id="[% messaging_preference.message_attribute_id %]" />
               [% END %]
           [% END %]
       </td>[% END %]
@@ -103,12 +109,12 @@ $(document).ready(function(){
                  <input type="checkbox"
                  id="phone[% messaging_preference.message_attribute_id %]"
                  name="[% messaging_preference.message_attribute_id %]"
-                 value="phone" checked="checked" onclick = "$('#none'+'[% messaging_preference.message_attribute_id %]').prop('checked', false);" />
+                 value="phone" checked="checked" class="active_notify" data-attr-id="[% messaging_preference.message_attribute_id %]" />
               [% ELSE %]
                  <input type="checkbox"
                  id="phone[% messaging_preference.message_attribute_id %]"
                  name="[% messaging_preference.message_attribute_id %]"
-                 value="phone" onclick = "$('#none'+'[% messaging_preference.message_attribute_id %]').prop('checked', false);" />
+                 value="phone" class="active_notify" data-attr-id="[% messaging_preference.message_attribute_id %]" />
               [% END %]
           [% END %]
       </td>[% END %]
@@ -132,12 +138,12 @@ $(document).ready(function(){
             <input type="checkbox"
                  id="email[% messaging_preference.message_attribute_id %]"
                  name="[% messaging_preference.message_attribute_id %]"
-                 value="email" checked="checked" onclick = "$('#none'+'[% messaging_preference.message_attribute_id %]').prop('checked', false);" />
+                 value="email" checked="checked" class="active_notify" data-attr-id="[% messaging_preference.message_attribute_id %]" />
               [% ELSE %]
             <input type="checkbox"
                  id="email[% messaging_preference.message_attribute_id %]"
                  name="[% messaging_preference.message_attribute_id %]"
-                 value="email" onclick = "$('#none'+'[% messaging_preference.message_attribute_id %]').prop('checked', false);" />
+                 value="email" class="active_notify" data-attr-id="[% messaging_preference.message_attribute_id %]" />
               [% END %]
           [% END %]
       </td>
@@ -164,12 +170,12 @@ $(document).ready(function(){
                 <input type="checkbox"
                      id="digest[% messaging_preference.message_attribute_id %]"
                      value="[% messaging_preference.message_attribute_id %]"
-                     name="digest" checked="checked" onclick = "$('#none'+'[% messaging_preference.message_attribute_id %]').prop('checked', false);" />
+                     name="digest" checked="checked" class="active_notify" data-attr-id="[% messaging_preference.message_attribute_id %]" />
               [% ELSE %]
                 <input type="checkbox"
                      id="digest[% messaging_preference.message_attribute_id %]"
                      value="[% messaging_preference.message_attribute_id %]"
-                     name="digest" onclick = "$('#none'+'[% messaging_preference.message_attribute_id %]').prop('checked', false);" />
+                     name="digest" class="active_notify" data-attr-id="[% messaging_preference.message_attribute_id %]" />
               [% END %]
           [% END %]
       </td>
@@ -188,7 +194,7 @@ $(document).ready(function(){
             <input type="checkbox"
                  id="rss[% messaging_preference.message_attribute_id %]"
                  name="[% messaging_preference.message_attribute_id %]"
-                 value="rss"   [% messaging_preference.transport_rss %] onclick = "$('#none'+'[% messaging_preference.message_attribute_id %]').prop('checked', false);" />
+                 value="rss"   [% messaging_preference.transport_rss %] class="active_notify" data-attr-id="[% messaging_preference.message_attribute_id %]" />
           [% END %]
       </td>
       [% ELSE %]
diff --git a/koha-tmpl/intranet-tmpl/prog/en/includes/serials-toolbar.inc b/koha-tmpl/intranet-tmpl/prog/en/includes/serials-toolbar.inc
index 729d2eed01..02348b2868 100644
--- a/koha-tmpl/intranet-tmpl/prog/en/includes/serials-toolbar.inc
+++ b/koha-tmpl/intranet-tmpl/prog/en/includes/serials-toolbar.inc
@@ -67,7 +67,7 @@
 
         [% IF not cannotedit or CAN_user_serials_receive_serials %]
             [% IF CAN_user_serials_renew_subscription and not closed %]
-                <div class="btn-group"><a id="renew" class="btn btn-small" href="#" onclick="popup([% subscriptionid %])"><i class="fa fa-refresh"></i> Renew</a></div>
+                <div class="btn-group"><a id="renew" class="btn btn-small" href="#"><i class="fa fa-refresh"></i> Renew</a></div>
             [% END %]
             [% IF CAN_user_serials_receive_serials and not closed %]
                 <div class="btn-group"><a id="receive" class="btn btn-small" href="/cgi-bin/koha/serials/serials-edit.pl?subscriptionid=[% subscriptionid %]&amp;serstatus=1,3"><i class="fa fa-inbox"></i> Receive</a></div>
diff --git a/koha-tmpl/intranet-tmpl/prog/en/includes/subscriptions-search.inc b/koha-tmpl/intranet-tmpl/prog/en/includes/subscriptions-search.inc
index 4f6f1caed1..9d6abd7040 100644
--- a/koha-tmpl/intranet-tmpl/prog/en/includes/subscriptions-search.inc
+++ b/koha-tmpl/intranet-tmpl/prog/en/includes/subscriptions-search.inc
@@ -1,7 +1,7 @@
 <div id="advsearch">
     <form action="" method="get">
         <fieldset class="brief">
-            <a id="unfold_advsearch" style="cursor:pointer" onclick="$('#advsearch_form').slideToggle(400);">Advanced search</a>
+        <a href="#" class="toggle_element" data-element="#advsearch_form">Advanced search</a>
             <div id="advsearch_form" style="display:none">
             <ol>
               <li>
diff --git a/koha-tmpl/intranet-tmpl/prog/en/includes/subtypes_unimarc.inc b/koha-tmpl/intranet-tmpl/prog/en/includes/subtypes_unimarc.inc
index 02f146ffbe..d564f7803f 100644
--- a/koha-tmpl/intranet-tmpl/prog/en/includes/subtypes_unimarc.inc
+++ b/koha-tmpl/intranet-tmpl/prog/en/includes/subtypes_unimarc.inc
@@ -1,11 +1,14 @@
-<a onclick="javascript:if (document.getElementsByName('Coded_Fields')[0].style.display=='none'){document.getElementsByName('Coded_Fields')[0].style.display='block';} else {document.getElementsByName('Coded_Fields')[0].style.display='none';}">Coded information filters</a>
-<div id="yui-b" style="display:none;" name="Coded_Fields" >
+<p>
+    <a id="show_coded_fields" class="toggle_element" data-element="#Coded_Fields,#show_coded_fields,#hide_coded_fields" href="#"><i class="fa fa-plus-square-o"></i> Show coded information filters</a>
+    <a id="hide_coded_fields" class="toggle_element" data-element="#Coded_Fields,#show_coded_fields,#hide_coded_fields" href="#" style="display:none;"><i class="fa fa-minus-square-o"></i> Hide coded information filters</a>
+</p>
+<div style="display:none;" id="Coded_Fields">
 <!-- SUBTYPE LIMITS -->
-		<fieldset>
-		<legend>Coded Fields</legend>
-		<p>
-		<label>Audience</label>
-		<select name="limit" class="subtype">
+        <fieldset>
+        <legend>Coded fields</legend>
+        <p>
+        <label for="audience">Audience: </label>
+        <select id="audience" name="limit" class="subtype">
             <option value="" selected="selected" >Any</option>
             <option value="ta:a">juvenile, general</option>
             <option value="ta:b">pre-primary (0-5)</option>
@@ -16,10 +19,10 @@
             <option value="ta:m">adult, General</option>
             <option value="ta:u">unknown</option>
 		</select>
-		</p>
+        </p>
 		<p>
-        <label>Physical presentation</label>
-        <select name="limit" class="subtype">
+        <label for="physical_presentation">Physical presentation: </label>
+        <select id="physical_presentation" name="limit" class="subtype">
             <option value="" selected="selected" >Any</option>
             <option value="ff8-23:r">regular print</option>
             <option value="ff8-23:d">large print</option>
@@ -33,10 +36,10 @@
             <option value="ff8-23:t">microform</option>
             <option value="ff8-23:z">other form of textual material</option>
 		</select>
-		</p>
+        </p>
 		<p>
-        <label>Literary genre</label>
-		<select name="limit" class="subtype">
+            <label for="literary_genre">Literary genre: </label>
+            <select id="literary_genre" name="limit" class="subtype">
 			<option value="" selected="selected" >Any</option>
             <option value="lf:a">fiction</option>
             <option value="lf:b">drama</option>
@@ -52,8 +55,8 @@
     </select>
     </p>
         <p>
-		<label>Biography</label>
-        <select name="limit" class="subtype" size="1">
+            <label for="biography">Biography: </label>
+            <select id="biography" name="limit" class="subtype">
             <option value="">Any</option>
                 <option value="bio:y">not a biography</option>
                 <option value="bio:a">autobiography</option>
@@ -63,8 +66,8 @@
 		</select>
         </p>
         <p>
-		<label>Illustration</label>
-        <select name="limit" class="subtype" size="1">
+            <label for="illustration">Illustration: </label>
+            <select id="illustration" name="limit" class="subtype">
             <option value="">Any</option>
                 <option value="ff8-18-21:a">illustrations</option>
                 <option value="ff8-18-21:b">maps</option>
@@ -85,8 +88,8 @@
         </select>
         </p>
 		<p>
-		<label>Content</label>
-		<select name="limit" class="subtype">
+            <label for="content">Content: </label>
+            <select id="content" name="limit" class="subtype">
 			<option value="" >Any</option>
             <option value="ctype:a" >bibliography</option>
             <option value="ctype:b" >catalogue</option>
@@ -114,8 +117,8 @@
 		</select>
         </p>
         <p>
-		<label>Video Types</label>
-		<select name="limit" class="subtype">
+            <label for="video_types">Video types: </label>
+            <select id="video_types" name="limit" class="subtype">
             <option value="">Any</option>
 			<option value="Video-mt:a">motion picture</option>
 			<option value="Video-mt:b">visual projection</option>
@@ -123,11 +126,12 @@
 		</select>
         </p>
 		</fieldset>
+
 		<fieldset>
-		<legend>Serials</legend><p>
+        <legend>Serials</legend>
 		<p>
-		<label>Serial Type</label>
-		<select name="limit" class="subtype">
+            <label for="serial_type">Serial type: </label>
+            <select id="serial_type" name="limit" class="subtype">
            <option value="">Any type</option>
             <option value="ff8-21:a">Periodical</option>
             <option value="ff8-21:b">Monographic series</option>
@@ -137,10 +141,10 @@
             <option value="ff8-21:g">Updating website</option>
             <option value="ff8-21:z">Other</option>
 		</select>
-		</p>
-		<p>
-		<label>Periodicity</label>
-		<select name="limit" class="subtype">
+        </p>
+        <p>
+            <label for="periodicity">Periodicity: </label>
+            <select id="periodicity" name="limit" class="subtype">
 			<option value="">Any</option>
             <option value="ff8-18:a">Daily</option>
             <option value="ff8-18:b">Semiweekly</option>
@@ -161,10 +165,10 @@
             <option value="ff8-18:u">Unknown</option>
             <option value="ff8-18:z">Other</option>
 		</select>
-		</p>
-		<p>
-		<label>Regularity</label>
-		<select name="limit" class="subtype">
+        </p>
+        <p>
+            <label for="regularity">Regularity: </label>
+            <select id="regularity" name="limit" class="subtype">
             <option value="">Any regularity</option>
             <option value="ff8-19:a">regular</option>
             <option value="ff8-19:b">normalised irregular</option>
@@ -172,10 +176,11 @@
             <option value="ff8-19:u">unknown</option>
 		</select>
         </p>
-
         </fieldset>
+
 		<fieldset>
-		<legend>Picture</legend><p>
+        <legend>Picture</legend>
+        <p>
 		<select name="limit" class="subtype">
 				<option value="">Any</option>
 				<option value="Graphics-type:a">collage</option>
diff --git a/koha-tmpl/intranet-tmpl/prog/js/staff-global.js b/koha-tmpl/intranet-tmpl/prog/js/staff-global.js
index 5f9ed72177..90fb09588b 100644
--- a/koha-tmpl/intranet-tmpl/prog/js/staff-global.js
+++ b/koha-tmpl/intranet-tmpl/prog/js/staff-global.js
@@ -52,10 +52,16 @@ $.fn.selectTabByID = function (tabID) {
     $("body").on("keypress", ".noEnterSubmit", function(e){
         return checkEnter(e);
     });
+
     $(".keep_text").on("click",function(){
         var field_index = $(this).parent().index();
         keep_text( field_index );
     });
+
+    $(".toggle_element").on("click",function(e){
+        e.preventDefault();
+        $( $(this).data("element") ).toggle();
+    });
 });
 
 // http://jennifermadden.com/javascript/stringEnterKeyDetector.html
-- 
2.39.5