Bug 16946 [Revised] Remove the use of "onclick" from several serials templates
authorOwen Leonard <oleonard@myacpl.org>
Wed, 20 Jul 2016 14:51:30 +0000 (10:51 -0400)
committerKyle M Hall <kyle@bywatersolutions.com>
Fri, 9 Sep 2016 13:19:17 +0000 (13:19 +0000)
This patch modifies several serials module templates to remove the use
of event attributes. Events will now be defined in JavaScript.

Also changed:

- In Serials -> Check expiration, custom form validation has been
  removed in favor of validation with the plugin.
- In Serials -> Claims, the "Clear filter" button has been replaced with
  a link. Error messages are now styled with the standard "alert" class.
- In Serials -> New subscription -> Search for record, the "choose" link
  is now a Bootstrap button. Pagination links are now styled like other
  similar links. The "Close" button is now styled as in other popup
  windows. The "no results found" messages is styled as an informational
  dialog.
- In Serials -> Subscription -> Edit routing list, the "add recipients"
  and "delete all" controls are now links with Font Awesome icons.

To test, apply the patch and:

- Go to Serials -> Check expiration.
  - Try to submit the form without filling in a date. The form
    validation plugin should warn you that the date field is required.
  - Submit the form using data which will return results.
  - Click the "Renew" button for any result. The subscription renewal
    popup should be triggered for the correct title.

- Go to Serials -> Claims.
  - Select a vendor with missing issues.
  - Confirm that the date filter works correctly, and that the "Clear
    filter" link works.
  - Select one or more result and click the "Send notification" button.
    The notification should be sent.

- Go to Serials -> New subscription.
  - Click the "Search for record" link to trigger the bibliographic
    search popup.
  - Perform a search. Confirm that the "Choose" button selects the
    correct record and populates the fields in the parent window.

- Go to Serials -> Subscription -> Edit routing list.
  - Confirm that the process of adding recipients to the list works
    correctly.
  - Confirm that changing the rank of any recipient works correctly.
  - Save the routing list and click the "Save and preview routing slip"
    button on the confirmation page. The slip preview should open.
  - In the slip preview window, test that the print button works
    correctly.

Signed-off-by: Aleisha <aleishaamohia@hotmail.com>
QA revision: Removed stray '// -->' and corrected clear filter function

Signed-off-by: Jonathan Druart <jonathan.druart@bugs.koha-community.org>
Signed-off-by: Kyle M Hall <kyle@bywatersolutions.com>
koha-tmpl/intranet-tmpl/prog/en/modules/serials/checkexpiration.tt
koha-tmpl/intranet-tmpl/prog/en/modules/serials/claims.tt
koha-tmpl/intranet-tmpl/prog/en/modules/serials/result.tt
koha-tmpl/intranet-tmpl/prog/en/modules/serials/routing-preview-slip.tt
koha-tmpl/intranet-tmpl/prog/en/modules/serials/routing-preview.tt
koha-tmpl/intranet-tmpl/prog/en/modules/serials/routing.tt

index a08e88f..80b8857 100644 (file)
@@ -6,21 +6,13 @@
 [% INCLUDE 'calendar.inc' %]
 <script type="text/javascript" language="JavaScript">
 // <![CDATA[
-    /**
-     *  Function CheckForm
-     *  This function checks the form before submit
-     */
-     function CheckForm(form){
-        if(form.date.value){
-            return true;
-        }
-        else {
-            alert(_("You must enter a date!"));
-            document.f.date.focus();
-            return false;
-        }
-     }
-
+    $(document).ready(function(){
+        $(".renew_subscription").on("click",function(e){
+            e.preventDefault();
+            var subscriptionid = $(this).data("subscriptionid");
+            popup( subscriptionid );
+        });
+    });
        function popup(subscriptionid) {
           newin=window.open("subscription-renew.pl?mode=popup&subscriptionid="+subscriptionid,'popup','width=590,height=440,toolbar=false,scrollbars=yes,resize=yes');
        }
@@ -43,7 +35,7 @@
 
 <h1>Check expiration</h1>
 
-    <form name="f" action="/cgi-bin/koha/serials/checkexpiration.pl" method="post" onsubmit="return CheckForm(this);">
+    <form name="f" action="/cgi-bin/koha/serials/checkexpiration.pl" method="post" class="validated">
 <fieldset class="rows">
     <legend>Filter results:</legend>
     
@@ -62,8 +54,8 @@
         </li>
         [% END %]
 
-        <li><label for="date" class="required" title="Required field">Expiring before:</label>
-        <input id="date" type="text" name="date" size="10" value="[% date | $KohaDates %]" class="focus datepicker" />
+        <li><label for="date" class="required">Expiring before:</label>
+            <input id="date" type="text" name="date" size="10" value="[% date | $KohaDates %]" class="required focus datepicker" required="required" />
         <span class="required">Required</span>
                        <div class="hint">[% INCLUDE 'date-format.inc' %]</div></li>
                        </ol>
             </td>
             <td class="actions">
                 <a href="/cgi-bin/koha/serials/subscription-add.pl?op=modify&amp;subscriptionid=[% subscriptions_loo.subscriptionid %]" class="btn btn-mini"><i class="fa fa-pencil"></i> Edit</a>
-                <a href="/cgi-bin/koha/serials/subscription-renew.pl?subscriptionid=[% subscriptions_loo.subscriptionid %]" onclick="popup([% subscriptions_loo.subscriptionid %]); return false;" class="btn btn-mini"><i class="fa fa-refresh"></i> Renew</a>
+                <a href="/cgi-bin/koha/serials/subscription-renew.pl?subscriptionid=[% subscriptions_loo.subscriptionid %]" data-subscriptionid="[% subscriptions_loo.subscriptionid %]" class="btn btn-mini renew_subscription"><i class="fa fa-refresh"></i> Renew</a>
             </td>
         </tr>
     [% END %]
index 54a5cfb..59beed1 100644 (file)
         location.href = url;
         return false;
         });
-
+        $("#filterByDate").on("click",function(e){
+            e.preventDefault();
+            filterByDate();
+        });
+        $("#clearfilter").on("click",function(e){
+            e.preventDefault();
+            $("#from,#to").val("");
+            $("table#claimst tbody tr").show();
+        });
+        $("#claims_form").on("submit",function(){
+             return checkForm();
+        });
+        $("#filter_claims_form").on("submit",function(){
+            return false;
+        });
         });
 
        // Checks if the form can be sent (at least one checkbox must be checked)
            });
        }
 
-       // Clears filters : shows everything
-       function clearFilters() {
-           $("table#claimst tbody tr").show();
-
-       }
 
 //]]>
 </script>
 
     [% IF error_claim %]
         [% IF error_claim == 'no_vendor_email' %]
-            <div class="error">This vendor has no email defined for late issues.</div>
+            <div class="dialog alert">This vendor has no email defined for late issues.</div>
         [% ELSIF error_claim == 'no_loggedin_user_email' %]
-            <div class="error">No email is configured for your user.</div>
+            <div class="dialog alert">No email is configured for your user.</div>
         [% ELSE %]
-            <div class="error">[% error_claim %]</div>
+            <div class="dialog alert">[% error_claim %]</div>
         [% END %]
     [% END %]
     [% IF info_claim %]
 
    [% IF ( missingissues ) %]  
     <h3>Missing issues</h3>
-    <form action="claims.pl" onsubmit="return false;">
+    <form action="claims.pl" id="filter_claims_form">
        <fieldset class="rows">
        <legend>Filters :</legend>
        
         <label for="to" style="float:none;">To:</label>
         <input type="text" name="enddate" id="to" value="[% enddate %]" size="10" maxlength="10" class="datepickerto" />
         <span class="hint">[% INCLUDE 'date-format.inc' %]</span>
-           <input type="button" value="OK" onclick="filterByDate();" />
+        <input id="filterByDate" type="button" value="OK" />
+        <a href="#" id="clearfilter"><i class="fa fa-remove"></i> Clear filter</a>
     </li>
-
-       <li>
-        <input type="reset" value="Clear filters" onclick="clearFilters();" />
-       </li>
        </ol>
        </fieldset>
     </form>
 
     <fieldset>
-        <form action="claims.pl" method="post" class="checkboxed" onsubmit="return checkForm()">
+        <form action="claims.pl" method="post" id="claims_form">
             <table id="claimst">
                 <thead>
                     <tr>
index 11ecd18..6566893 100644 (file)
@@ -3,13 +3,19 @@
 [% INCLUDE 'doc-head-close.inc' %]
 <script type="text/javascript">
 //<![CDATA[
-function GetIt(bibno,title)
-{
-    title = title.parents('tr').find('.title').text();
-    opener.document.f.biblionumber.value = bibno;
-    opener.document.f.title.value = title;
-    window.close();
-}
+    $(document).ready(function(){
+        $(".select_title").on("click",function(e){
+            e.preventDefault();
+            var biblionumber = $(this).data("biblionumber");
+            GetIt( biblionumber, $(this) );
+        });
+    });
+    function GetIt(bibno,title) {
+        title = title.parents('tr').find('.title').text();
+        opener.document.f.biblionumber.value = bibno;
+        opener.document.f.title.value = title;
+        window.close();
+    }
 //]]>
 </script>
 </head>
@@ -46,22 +52,31 @@ function GetIt(bibno,title)
             <td>
                 [% resultsloo.issn |html %]
             </td>
-
-                       <td><a href="#" onclick="GetIt('[% resultsloo.biblionumber %]',$(this));" title="Choose this record">Choose</a></td>
+            <td><a class="btn btn-mini select_title" data-biblionumber="[% resultsloo.biblionumber %]" href="#" title="Choose this record">Choose</a></td>
         </tr>
     [% END %]
     </table>
 [% ELSE %]
-<h2>No results found for <b>[% query %]</b></h2>
-[% END %]
-[% IF ( displayprev ) %]
-<a href="/cgi-bin/koha/serials/subscription-bib-search.pl?op=do_search&amp;type=intranet&amp;startfrom=[% startfromprev |url %]&amp;q=[% query |url %]">&lt;&lt;</a>
-[% END %]
-[% IF ( displaynext ) %]
-<a href="/cgi-bin/koha/serials/subscription-bib-search.pl?op=do_search&amp;type=intranet&amp;startfrom=[% startfromnext |url %]&amp;q=[% query |url %]">&gt;&gt;</a>
+
+    <div class="dialog message">
+        <p>No results found for <b>[% query %]</b></p>
+    </div>
+
 [% END %]
+
+<div class="pages">
+    [% IF ( displayprev ) %]
+        <a class="nav" href="/cgi-bin/koha/serials/subscription-bib-search.pl?op=do_search&amp;type=intranet&amp;startfrom=[% startfromprev |url %]&amp;q=[% query |url %]">&lt;&lt; Previous</a>
+    [% END %]
+    [% IF ( displaynext ) %]
+        <a class="nav" href="/cgi-bin/koha/serials/subscription-bib-search.pl?op=do_search&amp;type=intranet&amp;startfrom=[% startfromnext |url %]&amp;q=[% query |url %]">Next  &gt;&gt;</a>
+    [% END %]
+</div>
+
 <p><a href="subscription-bib-search.pl">Search for another record</a></p>
-<fieldset class="action"><a class="button close" href="#">Close</a></fieldset>
+
+<div id="closewindow"><a class="btn btn-default close" href="#">Close</a></div>
+
 </div>
 
 [% INCLUDE 'intranet-bottom.inc' %]
index 5a23158..b5bbf24 100644 (file)
@@ -1,7 +1,15 @@
 [% INCLUDE 'doc-head-open.inc' %]
 <title>Koha &rsaquo; Serials  &rsaquo; Routing slip preview</title>
 [% INCLUDE 'doc-head-close.inc' %]
-
+<script type="text/javascript">
+    $(document).ready(function(){
+        $("#print_slip").on("click",function(e){
+            e.preventDefault();
+            window.print();
+            self.close();
+        });
+    });
+</script>
 <style type="text/css">
    #custom-doc { width:38.46em;*width:37.53em;min-width:500px; margin:auto; text-align:left; }
 </style>
@@ -38,9 +46,7 @@
     <p id="routingnote">[% routingnotes %]</p>
 </div>
 
-   <div id="slip-block-links" class="noprint">
-   <a class="button" href="javascript:window.print();self.close()">Print</a> &nbsp; <a class="button" href="javascript:self.close()">Close</a>
-   </div>
+    <div id="closewindow" class="noprint"><a class="btn btn-default" id="print_slip" href="#"><i class="fa fa-print"></i> Print</a> <a class="btn btn-default close" href="#">Close</a></div>
 
    </div>
 
index 6892e1c..7478b11 100644 (file)
@@ -2,14 +2,17 @@
 <title>Koha &rsaquo; Serials &rsaquo; Preview routing list</title>
 [% INCLUDE 'doc-head-close.inc' %]
 <script type="text/javascript">
-<!--
-
+    $(document).ready(function(){
+        $("#save_and_preview").on("click",function(e){
+            e.preventDefault();
+            print_slip( $("#subscriptionid").val(), $("#issue_escaped").val() );
+        });
+    });
 function print_slip(subscriptionid,issue){
     var myurl = 'routing-preview.pl?ok=1&subscriptionid='+subscriptionid+'&issue='+issue;
     window.open(myurl,'PrintSlip','width=500,height=500,toolbar=no,scrollbars=yes');
     window.location.href='subscription-detail.pl?subscriptionid=' + subscriptionid;
 }
-//-->
 </script>
 </head>
 <body id="ser_routing-preview" class="ser">
@@ -27,7 +30,8 @@ function print_slip(subscriptionid,issue){
 <h2>Preview routing list for <i>[% title |html %]</i></h2>
 
 <form method="post" action="routing-preview.pl">
-<input type="hidden" name="subscriptionid" value="[% subscriptionid %]" />
+<input type="hidden" id="subscriptionid" name="subscriptionid" value="[% subscriptionid %]" />
+    <input type="hidden" id="issue_escaped" name="issue_escaped" value="[% issue_escaped %]" />
 <fieldset class="rows">
        <ol>
                <li><span class="label">Issue:</span>[% issue %]</li>
@@ -42,7 +46,7 @@ function print_slip(subscriptionid,issue){
 </fieldset>
 
 <fieldset class="action">
-<input type="submit" name="ok" class="button" value="Save and preview routing slip" onclick="print_slip([% subscriptionid %],'[% issue_escaped %]'); return false" />
+    <input type="submit" name="ok" id="save_and_preview" class="button" value="Save and preview routing slip" />
 <input type="submit" name="edit" class="button" value="Edit" />
 <input type="submit" name="delete" class="button" value="Delete" /></fieldset>
 </form>
index 6fccab8..026682a 100644 (file)
@@ -2,8 +2,17 @@
 <title>Koha &rsaquo; Serials &rsaquo; [% title |html %] &rsaquo; [% IF ( op ) %]Create Routing List[% ELSE %]Edit routing list[% END %]</title>
 [% INCLUDE 'doc-head-close.inc' %]
 <script type="text/javascript">
-<!--
-
+    $(document).ready(function(){
+        $("#add_recipients").on("click",function(e){
+            e.preventDefault();
+            userPopup();
+        });
+        $(".itemrank").on("change",function(){
+            var subscriptionid = $(this).data("subscriptionid");
+            var routingid = $(this).data("routingid");
+            reorder_item( subscriptionid, routingid, $(this).val());
+        });
+    });
 function reorder_item(sid,rid,rank){
     var mylocation = 'reorder_members.pl?subscriptionid='+sid+'&routingid='+rid+'&rank='+rank;
     window.location.href=mylocation; 
@@ -21,8 +30,6 @@ function reorder_item(sid,rid,rank){
         var myurl = "routing.pl?subscriptionid="+[% subscriptionid %]+"&borrowernumber="+borrowernumber+"&op=add";
         window.location.href = myurl;
     }
-
-//-->
 </script>
 </head>
 <body id="ser_routing" class="ser">
@@ -68,7 +75,7 @@ function reorder_item(sid,rid,rank){
             [% FOREACH member IN m_loop %]
             <tr><td>[% member.name %]</td>
                 <td>
-                    <select name="itemrank" onchange="reorder_item([%- subscriptionid -%], [%- member.routingid -%], this.value)">
+                    <select name="itemrank" class="itemrank" data-subscriptionid="[% subscriptionid %]" data-routingid="[% member.routingid %]">
                     [% rankings = [1 .. m_loop.size] %]
                     [% FOREACH r IN rankings %]
                         [% IF r == member.ranking %]
@@ -79,16 +86,16 @@ function reorder_item(sid,rid,rank){
                     [% END %]
                     </select>
                 </td>
-                <td><a href="/cgi-bin/koha/serials/routing.pl?routingid=[% member.routingid %]&amp;subscriptionid=[% subscriptionid %]&amp;op=delete">Delete</a></td>
+                <td><a class="btn btn-mini" href="/cgi-bin/koha/serials/routing.pl?routingid=[% member.routingid %]&amp;subscriptionid=[% subscriptionid %]&amp;op=delete"><i class="fa fa-trash"></i> Delete</a></td>
             </tr>
             [% END %]
         </table>
     [% END %]
 
     <p style="margin-left:10em;">
-        <input type="button" onclick="userPopup()" value="Add recipients" />
+        <a href="#" id="add_recipients"><i class="fa fa-plus"></i> Add recipients</a>
         [% IF memberloop %]
-            <a href="/cgi-bin/koha/serials/routing.pl?subscriptionid=[% subscriptionid %]&amp;op=delete" class="button">Delete all</a>
+            <a href="/cgi-bin/koha/serials/routing.pl?subscriptionid=[% subscriptionid %]&amp;op=delete"><i class="fa fa-trash"></i> Delete all</a>
         [% END %]
     </p>
 </li>