Bug 9916 - Use DataTables in the OPAC
[koha-ffzg.git] / koha-tmpl / opac-tmpl / prog / en / modules / opac-user.tt
index 6de2a81..31d6c32 100644 (file)
@@ -1,31 +1,32 @@
+[% USE Koha %]
 [% USE KohaDates %]
-
 [% INCLUDE 'doc-head-open.inc' %]
 [% IF ( LibraryNameTitle ) %][% LibraryNameTitle %][% ELSE %]Koha online[% END %] catalog › Your library home
 [% INCLUDE 'doc-head-close.inc' %]
 [% INCLUDE 'calendar.inc' %]
-<script type="text/javascript" src="[% themelang %]/lib/jquery/plugins/jquery.metadata.min.js"></script>
-<script type="text/javascript" src="[% themelang %]/lib/jquery/plugins/jquery.tablesorter.min.js"></script>
+[% INCLUDE 'datatables.inc' %]
 <script type="text/JavaScript">
 //<![CDATA[
-var MSG_CONFIRM_DELETE_HOLD = _("Are you sure you want to cancel this hold?");
-$.tablesorter.addParser({
-    id: 'articles', 
-    is: function(s) {return false;  }, 
-    format: function(s) { return s.toLowerCase().replace(/^(the|an|a) /,''); }, 
-    type: 'text' 
-});
+var MSG_CONFIRM_DELETE_HOLD   = _("Are you sure you want to cancel this hold?");
+var MSG_CONFIRM_SUSPEND_HOLDS = _("Are you sure you want to suspend all holds?");
+var MSG_CONFIRM_RESUME_HOLDS  = _("Are you sure you want to resume all suspended holds?");
+
             $(function() {
-            $('#opac-user-views > ul').tabs();
-            $.tablesorter.defaults.widgets = ['zebra'];
-            [% IF ( dateformat == 'metric' ) %]$.tablesorter.defaults.dateFormat = ['uk'];[% END %]
-                       $("#holdst").tablesorter({
-                               sortList: [[0,0]]
-                       }); 
-                       $("#checkoutst").tablesorter({
-                [% IF ( JacketImages ) %]sortList: [[2,0]][% ELSE %]sortList: [[1,0]][% END %]
-            }); 
-                       $("#overduest").tablesorter();
+            $('#opac-user-views').tabs();
+
+        var dTables = $("#checkoutst,#holdst,#overduest");
+        dTables.each(function(){
+            var thIndex = $(this).find("th.psort").index();
+            $(this).dataTable($.extend(true, {}, dataTablesDefaults, {
+                "aaSorting" : [[ thIndex, 'asc' ]],
+                "aoColumnDefs": [
+                    { "aTargets": [ "nosort" ],"bSortable": false,"bSearchable": false },
+                    { "sType": "anti-the", "aTargets" : [ "anti-the" ] },
+                    { "sType": "title-string", "aTargets" : [ "title-string" ] }
+                ]
+            }));
+        });
+
 [% IF ( GoogleJackets ) %]KOHA.Google.GetCoverFromIsbn();[% END %]
         [% IF ( OpacRenewalAllowed && canrenew && !userdebarred ) %]$("#renewselected").submit(function(){
             valid = false;
@@ -46,6 +47,7 @@ $.tablesorter.addParser({
             $("#renewall").submit();
         });
         $("#checkoutst caption").append("<div id=\"renewcontrols\"><a id=\"renewselected_link\" href=\"#\">"+_("Renew selected")+"</a> <a id=\"renewall_link\" href=\"#\">"+_("Renew all")+"</a></div>");[% END %]
+        $( "#suspend_until" ).datepicker({ minDate: 1 }); // Require that "until date" be in the future
             });
 //]]>
 </script>
@@ -83,11 +85,17 @@ $.tablesorter.addParser({
                
         [% IF ( BORROWER_INF.warndeparture ) %]
         <div class="dialog alert" id="warndeparture">
-                <strong>Please note:</strong><span> Your card will expire on <span id="warndeparture_date">[% BORROWER_INF.warndeparture %]</span>. Please contact the library for more information.</span>
+                <strong>Please note:</strong><span> Your card will expire on <span id="warndeparture_date">[% BORROWER_INF.warndeparture | $KohaDates %]</span>. Please contact the library for more information.</span>
                 [% IF ( BORROWER_INF.returnbeforeexpiry ) %]<span id="warndeparture_returnbeforeexpiry"> Also note that you must return all checked out items before your card expires.</span>[% END %]
         </div>
         [% END %]
 
+        [% IF ( BORROWER_INF.warnexpired ) %]
+        <div class="dialog alert" id="warnexpired">
+            <strong>Please note:</strong><span> Your card has expired. Please contact the library for more information.</span>
+        </div>
+        [% END %]
+
         [% IF ( patron_flagged ) %]
                <div class="dialog alert">
         <ul>
@@ -95,30 +103,28 @@ $.tablesorter.addParser({
                 <span id="userdebarred"><li><strong>Please note:</strong> Your account has been frozen[% IF ( BORROWER_INF.userdebarreddate ) %] until <span id="userdebarred_date">[% BORROWER_INF.userdebarreddate | $KohaDates %]</span>[% END %][% IF ( BORROWER_INF.debarredcomment ) %] with the comment <span id="userdebarred_comment">"[% BORROWER_INF.debarredcomment %]"</span>[% END %]. Usually the reason for freezing an account is old overdues or damage fees. If <a href="/cgi-bin/koha/opac-user.pl">your account page</a> shows your account to be clear, please contact the library.</li></span>
             [% END %]
             [% IF ( BORROWER_INF.gonenoaddress ) %]
-                <span id="gonenoaddress"><li><strong>Please note:</strong> According to our records, we don't have up-to-date [% UNLESS ( BORROWER_INF.OPACPatronDetails ) %]<a href="/cgi-bin/koha/opac-userupdate.pl">contact information</a>[% ELSE %]contact information[% END %] on file.  Please contact the library[% IF ( BORROWER_INF.OPACPatronDetails ) %] or use the <a href="/cgi-bin/koha/opac-userupdate.pl">online update form</a> to submit current information (<em>Please note:</em> there may be a delay in restoring your account if you submit online)[% END %].</li></span>
+                <span id="gonenoaddress"><li><strong>Please note:</strong> According to our records, we don't have up-to-date [% UNLESS ( BORROWER_INF.OPACPatronDetails ) %]<a href="/cgi-bin/koha/opac-memberentry.pl">contact information</a>[% ELSE %]contact information[% END %] on file.  Please contact the library[% IF ( BORROWER_INF.OPACPatronDetails ) %] or use the <a href="/cgi-bin/koha/opac-memberentry.pl">online update form</a> to submit current information (<em>Please note:</em> there may be a delay in restoring your account if you submit online)[% END %].</li></span>
             [% END %]
             [% IF ( BORROWER_INF.lost ) %]
                 <span id="lost"><li><strong>Please note: </strong> Your library card has been marked as lost or stolen. If this is an error, please contact the library.</li></span>
             [% END %]
             [% IF ( renewal_blocked_fines ) && ( OpacRenewalAllowed ) %]
-                <span id="renewal_blocked_fines"><li><strong>Please note: </strong> Since you have <a href="/cgi-bin/koha/opac-account.pl">more than <span id="renewal_blocked_fines_amount">[% renewal_blocked_fines %]</span></a> in fines, you cannot renew your books online. Please pay your fines if you wish to renew your books.</li></span>
-            [% ELSIF ( renewal_blocked_fines ) %]
-        <span id="renewal_blocked_fines"><li><strong>Please note: </strong> You have <a href="/cgi-bin/koha/opac-account.pl">more than <span id="renewal_blocked_fines_amount">[% renewal_blocked_fines %]</span></a> in fines. </li></span>
+                <span id="renewal_blocked_fines"><li><strong>Please note: </strong> Since you have <a href="/cgi-bin/koha/opac-account.pl">[% IF renewal_blocked_fines != "0.00" %] more than <span id="renewal_blocked_fines_amount">[% renewal_blocked_fines %]</span> in [% END %] fines</a>, you cannot renew your books online. Please pay your fines if you wish to renew your books.</li></span>
             [% END %]
         </ul></div>
         [% END %]
         
 <div id="opac-user-views" class="toptabs">
         <ul>
-            <li><a href="/cgi-bin/koha/opac-user.pl#opac-user-checkouts">Checked out</a></li>
-            [% IF ( overdues_count ) %]<li><a href="/cgi-bin/koha/opac-user.pl#opac-user-overdues">Overdue</a></li>[% END %]
+            <li><a href="#opac-user-checkouts">Checked out</a></li>
+            [% IF ( overdues_count ) %]<li><a href="#opac-user-overdues">Overdue</a></li>[% END %]
 [% IF ( OPACFinesTab ) %]
-            [% IF ( BORROWER_INF.amountoverfive ) %]<li><a href="/cgi-bin/koha/opac-user.pl#opac-user-fines">Fines</a></li>[% END %]
-            [% IF ( BORROWER_INF.amountoverzero ) %]<li><a href="/cgi-bin/koha/opac-user.pl#opac-user-fines">Fines</a></li>[% END %]
-            [% IF ( BORROWER_INF.amountlessthanzero ) %]<li><a href="/cgi-bin/koha/opac-user.pl#opac-user-fines">Credits</a></li>[% END %]
+            [% IF ( BORROWER_INF.amountoverfive ) %]<li><a href="#opac-user-fines">Fines</a></li>[% END %]
+            [% IF ( BORROWER_INF.amountoverzero ) %]<li><a href="#opac-user-fines">Fines</a></li>[% END %]
+            [% IF ( BORROWER_INF.amountlessthanzero ) %]<li><a href="#opac-user-fines">Credits</a></li>[% END %]
 [% END %]
-            [% IF ( waiting_count ) %][% IF ( BORROWER_INF.atdestination ) %]<li><a href="/cgi-bin/koha/opac-user.pl#opac-user-waiting">Waiting</a></li>[% END %][% END %]
-            [% IF ( reserves_count ) %]<li><a href="/cgi-bin/koha/opac-user.pl#opac-user-holds">Holds</a></li>[% END %]
+            [% IF ( waiting_count ) %][% IF ( BORROWER_INF.atdestination ) %]<li><a href="#opac-user-waiting">Waiting</a></li>[% END %][% END %]
+            [% IF ( reserves_count ) %]<li><a href="#opac-user-holds">Holds</a></li>[% END %]
         </ul>
 
     <div id="opac-user-checkouts">[% IF ( issues_count ) %]
@@ -128,20 +134,20 @@ $.tablesorter.addParser({
         <table id="checkoutst">
         <caption>[% issues_count %] Item(s) checked out</caption>
        <thead><tr>
-        [% IF ( JacketImages ) %]<th class="{sorter: false}">&nbsp;</th>[% END %]
-        <th class="{sorter:'articles'}">Title</th>
-        <th>Due</th>
+        [% IF ( JacketImages ) %]<th class="nosort">&nbsp;</th>[% END %]
+        <th class="anti-the">Title</th>
+        <th class="title-string psort">Due</th>
         [% UNLESS ( item_level_itypes ) %]<th>Item type</th> [% END %]
         [% IF ( show_barcode ) %]<th>Barcode</th>[% END %]
         <th>Call No.</th>
         [% IF ( OpacRenewalAllowed ) %]
-        <th class="{sorter: false}">Renew</th>
+        <th class="nosort">Renew</th>
         [% END %]
 [% IF ( OPACFinesTab ) %]
         <th>Fines</th>
 [% END %]
         [% IF ( OPACMySummaryHTML ) %]
-        <th class="{sorter: false}">Links</th>
+        <th class="nosort">Links</th>
         [% END %]
         </tr></thead>
         <tbody>
@@ -171,28 +177,28 @@ $.tablesorter.addParser({
 
 </td>[% END %]
 
-                <td><a href="/cgi-bin/koha/opac-detail.pl?biblionumber=[% ISSUE.biblionumber %]">[% ISSUE.title |html %]</a><span class="item-details">
+                <td class="title"><a href="/cgi-bin/koha/opac-detail.pl?biblionumber=[% ISSUE.biblionumber %]">[% ISSUE.title |html %]</a><span class="item-details">
                         [% ISSUE.author %]
                     </span></td>
                 [% IF ( ISSUE.overdue ) %]
-                    <td class="overdue">[% ISSUE.date_due | $KohaDates %]</td>
+                    <td class="date_due overdue"><span title="[% ISSUE.date_due %]">[% ISSUE.date_due | $KohaDates %]</span></td>
                 [% ELSE %]
-                    <td>[% ISSUE.date_due | $KohaDates %]</td>
+                    <td class="date_due"><span title="[% ISSUE.date_due %]">[% ISSUE.date_due | $KohaDates %]</span></td>
                 [% END %]
-                [% UNLESS ( item_level_itypes ) %]<td>[% IF ( ISSUE.imageurl ) %]<img src="[% ISSUE.imageurl %]" title="[% ISSUE.description %]" alt="[% ISSUE.description %]" />[% END %] [% ISSUE.description %]</td>[% END %]
-                [% IF ( show_barcode ) %]<td>[% ISSUE.barcode %]</td>[% END %]
-                <td>[% ISSUE.itemcallnumber %]</td>
+                [% UNLESS ( item_level_itypes ) %]<td class="itype">[% IF ( ISSUE.imageurl ) %]<img src="[% ISSUE.imageurl %]" title="[% ISSUE.description %]" alt="[% ISSUE.description %]" />[% END %] [% ISSUE.description %]</td>[% END %]
+                [% IF ( show_barcode ) %]<td class="barcode">[% ISSUE.barcode %]</td>[% END %]
+                <td class="call_no">[% ISSUE.itemcallnumber %]</td>
                 [% IF ( OpacRenewalAllowed ) %]
-                    <td>[% IF ( ISSUE.status ) %][% IF ( canrenew ) %]<input type="checkbox" name="item" value="[% ISSUE.itemnumber %]"/> <a href="/cgi-bin/koha/opac-renew.pl?from=opac_user&amp;item=[% ISSUE.itemnumber %]&amp;borrowernumber=[% ISSUE.borrowernumber %]">Renew</a>[% END %] <span class="renewals">([% ISSUE.renewsleft %] of [% ISSUE.renewsallowed %] renewals remaining)</span>
+                    <td class="renew">[% IF ( ISSUE.status ) %][% IF ( canrenew ) %]<input type="checkbox" name="item" value="[% ISSUE.itemnumber %]"/> <a href="/cgi-bin/koha/opac-renew.pl?from=opac_user&amp;item=[% ISSUE.itemnumber %]&amp;borrowernumber=[% ISSUE.borrowernumber %]">Renew</a>[% END %] <span class="renewals">([% ISSUE.renewsleft %] of [% ISSUE.renewsallowed %] renewals remaining)</span>
                         [% ELSE %]
                         Not renewable[% IF ( ISSUE.too_many ) %] <span class="renewals">([% ISSUE.renewsleft %] of [% ISSUE.renewsallowed %] renewals remaining)</span>[% ELSE %][% IF ( ISSUE.on_reserve ) %] <span class="renewals">(On hold)</span>[% END %][% END %] 
                         [% END %]</td>
                 [% END %]
 [% IF ( OPACFinesTab ) %]
-                <td>[% IF ( ISSUE.charges ) %]Yes[% ELSE %]No[% END %]</td>
+                <td class="fines">[% IF ( ISSUE.charges ) %]Yes[% ELSE %]No[% END %]</td>
 [% END %]
             [% IF ( OPACMySummaryHTML ) %]
-                <td>[% ISSUE.MySummaryHTML %]</td>
+                <td class="links">[% ISSUE.MySummaryHTML %]</td>
             [% END %]
             </tr>
         [% END %]</tbody>
@@ -256,7 +262,7 @@ $.tablesorter.addParser({
         <table id="waitingt">
             <caption>Holds waiting</caption>
            <thead> <tr>
-                <th colspan="2" class="{sorter:'articles'}">Title</th>
+                <th>Title</th>
                 <th>Hold date</th>
                 <th>Pick up library</th>
             </tr></thead>
@@ -284,14 +290,14 @@ $.tablesorter.addParser({
 <caption>Overdues <span class="count">([% overdues_count %] total)</span></caption>
 <!-- OVERDUES TABLE ROWS -->
 <thead><tr>
-[% IF ( JacketImages ) %]<th class="{sorter: false}">&nbsp;</th>[% END %]
-<th class="{sorter:'articles'}">Title</th>
+[% IF ( JacketImages ) %]<th class="nosort">&nbsp;</th>[% END %]
+<th>Title</th>
 [% UNLESS ( item_level_itypes ) %]<th>Item type</th> [% END %]
 [% IF ( show_barcode ) %]<th>Barcode</th>[% END %]
 <th>Call no.</th>
-<th>Due</th>
+<th class="psort">Due</th>
 [% IF ( OpacRenewalAllowed ) %]
-                    <th class="{sorter: false}">Renew</th>
+                    <th class="nosort">Renew</th>
 [% END %]
 [% IF ( OPACFinesTab ) %]
 <th>Fines</th>
@@ -322,7 +328,7 @@ $.tablesorter.addParser({
 [% UNLESS ( item_level_itypes ) %]<td>[% IF ( OVERDUE.imageurl ) %]<img src="[% OVERDUE.imageurl %]" title="[% OVERDUE.description %]" alt="[% OVERDUE.description %]" />[% END %] [% OVERDUE.description %]</td>[% END %]
 [% IF ( show_barcode ) %]<td>[% OVERDUE.barcode %]</td>[% END %]
 <td>[% OVERDUE.itemcallnumber %]</td>
-<td>[% OVERDUE.date_due | $KohaDates %]</td>
+<td><span title="[% OVERDUE.date_due %]">[% OVERDUE.date_due | $KohaDates %]</span></td>
                 [% IF ( OpacRenewalAllowed ) %]
 <td>
 [% IF ( OVERDUE.debarred ) %]Account frozen
@@ -347,15 +353,16 @@ $.tablesorter.addParser({
         <caption>Holds <span class="count">([% reserves_count %] total)</span></caption>
             <!-- RESERVES TABLE ROWS -->
             <thead><tr>
-                <th class="{sorter:'articles'}">Title</th>
-                <th>Placed on</th>
+                <th>Title</th>
+                <th class="psort">Placed on</th>
+                [% IF OpacHoldNotes %]<th>Notes</th>[% END %]
         <th>Expires on</th>
                 <th>Pick up location</th>
                [% IF ( showpriority ) %]
                        <th>Priority</th>
                [% END %]
                 <th>Status</th>
-               <th class="{sorter: false}">Modify</th>
+        <th class="nosort">Modify</th>
             </tr></thead>
                        <tbody>
             [% FOREACH RESERVE IN RESERVES %]
@@ -372,16 +379,23 @@ $.tablesorter.addParser({
                     [% ELSE %]
                             <tr>
                     [% END %]
-                <td><a href="/cgi-bin/koha/opac-detail.pl?biblionumber=[% RESERVE.biblionumber %]">[% RESERVE.reserves_title %]</a>
+                <td class="title"><a href="/cgi-bin/koha/opac-detail.pl?biblionumber=[% RESERVE.biblionumber %]">[% RESERVE.reserves_title %]</a>
                     [% RESERVE.author %]
                 </td>
-                <td>[% RESERVE.reservedate | $KohaDates %]</td>
-        <td>[% IF ( RESERVE.expirationdate ) %][% RESERVE.expirationdate | $KohaDates %][% ELSE %]Never expires[% END %]</td>
-                <td>[% RESERVE.branch %]</td>
+                <td class="reservedate"><span title="[% RESERVE.reservedate %]">[% RESERVE.reservedate | $KohaDates %]</span></td>
+                [% IF OpacHoldNotes %]<td class="reservenotes">[% RESERVE.reservenotes %]</td>[% END %]
+                <td class="expirationdate">
+                    [% IF ( RESERVE.expirationdate ) %]
+                        <span title="[% RESERVE.expirationdate %]">[% RESERVE.expirationdate | $KohaDates %]</span>
+                    [% ELSE %]
+                        Never expires
+                    [% END %]
+                </td>
+                <td class="branch">[% RESERVE.branch %]</td>
                                [% IF ( showpriority ) %]
-                               <td>[% RESERVE.priority %] </td>
+                             <td class="priority">[% RESERVE.priority %] </td>
                                [% END %]
-                <td>
+                <td class="status">
                     [% IF ( RESERVE.wait ) %]
                         [% IF ( RESERVE.atdestination ) %]
                             [% IF ( RESERVE.found ) %]
@@ -404,12 +418,12 @@ $.tablesorter.addParser({
                             [% END %]
                     [% END %]
                 </td>
-               <td>
+              <td class="modify">
                [% IF ( RESERVE.cancelable ) %]
                        <form action="/cgi-bin/koha/opac-modrequest.pl" method="post">
                        <input type="hidden" name="biblionumber" value="[% RESERVE.biblionumber %]" />
-               <input type="hidden" name="reservenumber" value="[% RESERVE.reservenumber %]" />
-                       <input type="submit" name="submit" class="icon delete cancel" value="Cancel" onclick="return confirmDelete('Are you sure you want to cancel this hold?');" /></form>
+          <input type="hidden" name="reserve_id" value="[% RESERVE.reserve_id %]" />
+                       <input type="submit" name="submit" class="icon delete cancel" value="Cancel" onclick="return confirmDelete(MSG_CONFIRM_DELETE_HOLD);" /></form>
                [% ELSE %]
                [% END %]
                </td>
@@ -423,52 +437,19 @@ $.tablesorter.addParser({
         [% IF SuspendHoldsOpac %]
        <div>
             <form action="/cgi-bin/koha/opac-modrequest-suspend.pl" method="post">
-              <input type="submit" name="submit" class="icon delete cancel" value="Suspend all holds" onclick="return confirmDelete('Are you sure you want to suspend all holds?');" />
+              <input type="submit" name="submit" class="icon delete cancel" value="Suspend all holds" onclick="return confirmDelete(MSG_CONFIRM_SUSPEND_HOLDS);" />
               <input type="hidden" name="suspend" value="1" />
 
              [% IF AutoResumeSuspendedHolds %]
              <label for="suspend_until"> until </label>
-              <input name="suspend_until" id="suspend_until" readonly="readonly" size="10">
-              <script language="JavaScript" type="text/javascript">
-              //<![CDATA[
-
-              var cal_img = document.createElement('img');
-              cal_img.src = "[% themelang %]/lib/calendar/cal.gif";
-              cal_img.alt = "Show Calendar";
-              cal_img.border = "0";
-              cal_img.id = "CalendarSuspendUntil";
-              cal_img.style.cursor = "pointer";
-              document.getElementById("suspend_until").parentNode.appendChild( cal_img );
-
-              function validate(date) {
-                  var today = new Date();
-                        if ( (date > today) ||
-                                ( date.getDate() == today.getDate() &&
-                                  date.getMonth() == today.getMonth() &&
-                                  date.getFullYear() == today.getFullYear() ) ) {
-                            return false;
-                        } else {
-                            return true;
-                        }
-              };
-              Calendar.setup(
-              {
-                inputField : "suspend_until",
-                ifFormat : "[% DHTMLcalendar_dateformat %]",
-                button : "CalendarSuspendUntil",
-                disableFunc : validate,
-                dateStatusFunc : validate
-              }
-              );
-              //]]>
-              </script>
+              <input name="suspend_until" id="suspend_until" readonly="readonly" size="10" />
               <a href="#" style="font-size:85%;text-decoration:none;" onclick="document.getElementById('suspend_until').value='';return false;">Clear date</a></p>
               [% END %]
             </form>
        </div>
        <div>
             <form action="/cgi-bin/koha/opac-modrequest-suspend.pl" method="post">
-              <input type="submit" name="submit" class="icon delete cancel" value="Resume all suspended holds" onclick="return confirmDelete('Are you sure you want to resume all suspended holds?');" />
+              <input type="submit" name="submit" class="icon delete cancel" value="Resume all suspended holds" onclick="return confirmDelete(MSG_CONFIRM_RESUME_HOLDS);" />
               <input type="hidden" name="suspend" value="0" />
             </form>
        </div>