Bug 22015: Move DataTables CSS to global include
[koha.git] / koha-tmpl / intranet-tmpl / prog / en / modules / common / patron_search.tt
index 1dd4151..54f9899 100644 (file)
+[% USE raw %]
+[% USE Asset %]
 [% USE Koha %]
+[% USE Branches %]
+[% SET footerjs = 1 %]
 [% INCLUDE 'doc-head-open.inc' %]
 <title>Koha &rsaquo; Patron search</title>
 [% INCLUDE 'doc-head-close.inc' %]
-<link rel="stylesheet" type="text/css" href="[% interface %]/[% theme %]/css/datatables.css" />
-[% INCLUDE 'datatables.inc' %]
-
-<script type="text/javascript">
-//<![CDATA[
-
-var search = 1;
-$(document).ready(function(){
-    $("#info").hide();
-    $("#error").hide();
-
-    [% IF view != "show_results" %]
-        $("#searchresults").hide();
-        search = 0;
-    [% END %]
-
-    // Apply DataTables on the results table
-    dtMemberResults = $("#memberresultst").dataTable($.extend(true, {}, dataTablesDefaults, {
-        'bServerSide': true,
-        'sAjaxSource': "/cgi-bin/koha/svc/members/search",
-        'fnServerData': function(sSource, aoData, fnCallback) {
-            if ( ! search ) {
-                return;
-            }
-            aoData.push({
-                'name': 'searchmember',
-                'value': $("#searchmember_filter").val()
-            },{
-                'name': 'firstletter',
-                'value': $("#firstletter_filter").val()
-            },{
-                'name': 'categorycode',
-                'value': $("#categorycode_filter").val()
-            },{
-                'name': 'branchcode',
-                'value': $("#branchcode_filter").val()
-            },{
-                'name': 'name_sorton',
-                'value': 'borrowers.surname borrowers.firstname'
-            },{
-                'name': 'category_sorton',
-                'value': 'categories.description',
-            },{
-                'name': 'branch_sorton',
-                'value': 'branches.branchname'
-            },{
-                'name': 'template_path',
-                'value': '[% json_template %]',
-            },{
-                'name': 'selection_type',
-                'value': '[% selection_type %]',
-            }
-            [% IF patrons_with_acq_perm_only %]
-            ,{
-                'name': 'has_permission',
-                'value': 'acquisition.order_manage',
-            }
-            [% END %]
-            );
-            $.ajax({
-                'dataType': 'json',
-                'type': 'POST',
-                'url': sSource,
-                'data': aoData,
-                'success': function(json){
-                    fnCallback(json);
-                }
-            });
-        },
-        'aoColumns':[
-            [% FOR column IN columns %]
-                [% IF column == 'action' %]
-                    { 'mDataProp': 'dt_action', 'bSortable': false, 'sClass': 'actions' }
-                [% ELSIF column == 'address' %]
-                    { 'mDataProp': 'dt_address', 'bSortable': false }
-                [% ELSE %]
-                    { 'mDataProp': 'dt_[% column %]' }
-                [% END %]
-                [% UNLESS loop.last %],[% END %]
-            [% END %]
-        ],
-        'bAutoWidth': false,
-        [% IF patrons_with_acq_perm_only %]
-            'bPaginate': false,
-        [% ELSE %]
-            'sPaginationType': 'full_numbers',
-            "iDisplayLength": [% Koha.Preference('PatronsPerPage') %],
-        [% END %]
-        'aaSorting': [[[% aaSorting || 0 %], 'asc']],
-        'bFilter': false,
-        'bProcessing': true,
-    }));
-
-    $("#searchform").on('submit', filter);
-    $(".filterByLetter").on("click",function(e){
-        e.preventDefault();
-        filterByFirstLetterSurname($(this).text());
-    });
-    $("body").on("click",".add_user",function(e){
-        e.preventDefault();
-        var borrowernumber = $(this).data("borrowernumber");
-        var firstname = $(this).data("firstname");
-        var surname = $(this).data("surname");
-        add_user( borrowernumber, firstname + " " + surname );
-    });
-
-    $("body").on("click",".select_user",function(e){
-        e.preventDefault();
-        var borrowernumber = $(this).data("borrowernumber");
-        var guarantor_data = $("#guarantor_data"+borrowernumber).val();
-        select_user( borrowernumber, JSON.parse(guarantor_data) );
-    });
-
-});
-
-function filter() {
-    search = 1;
-    $("#firstletter_filter").val('');
-    $("#searchresults").show();
-    dtMemberResults.fnDraw();
-    return false;
-}
-
-// User has clicked on a letter
-function filterByFirstLetterSurname(letter) {
-    $("#firstletter_filter").val(letter);
-    search = 1;
-    $("#searchresults").show();
-    dtMemberResults.fnDraw();
-}
-
-
-    // modify parent window owner element
-    [% IF selection_type == 'add' %]
-        function add_user(borrowernumber, borrowername) {
-            var p = window.opener;
-            // In one place (serials/routing.tt), the page is reload on every add
-            // We have to wait for the page to be there
-            function wait_for_opener () {
-                if ( ! $(opener.document).find('body').size() ) {
-                    setTimeout(wait_for_opener, 500);
-                } else {
-                    [%# Note that add_user could sent data instead of borrowername too %]
-                    $("#info").hide();
-                    $("#error").hide();
-                    if ( p.add_user(borrowernumber, borrowername) < 0 ) {
-                        $("#error").html(_("Patron '%s' is already in the list.").format(borrowername));
-                        $("#error").show();
-                    } else {
-                        $("#info").html(_("Patron '%s' added.").format(borrowername));
-                        $("#info").show();
-                    }
-                }
-            }
-            wait_for_opener();
-        }
-    [% ELSIF selection_type == 'select' %]
-        function select_user(borrowernumber, data) {
-            var p = window.opener;
-            p.select_user(borrowernumber, data);
-            window.close();
-        }
-    [% END %]
-//]]>
-</script>
-
+<style> .modal-body .close { display: none; } </style>
 </head>
+
 <body id="common_patron_search" class="common">
 <div id="patron_search" class="yui-t7">
-  <div id="bd">
-    <div class="yui-g">
+    <div class="container-fluid">
 
         <form id="searchform">
             <fieldset class="brief">
@@ -180,25 +19,26 @@ function filterByFirstLetterSurname(letter) {
                 <ol>
                     <li>
                         <label for="searchmember_filter">Search:</label>
-                        <input type="text" id="searchmember_filter" value="[% searchmember %]"/>
+                        <input type="text" id="searchmember_filter" value="[% searchmember | html %]"/>
                     </li>
                     <li>
                         <label for="categorycode_filter">Category:</label>
                         <select id="categorycode_filter">
                             <option value="">Any</option>
                             [% FOREACH category IN categories %]
-                                <option value="[% category.categorycode %]">[% category.description %]</option>
+                                <option value="[% category.categorycode | html %]">[% category.description | html %]</option>
                             [% END %]
                         </select>
                     </li>
                     <li>
                         <label for="branchcode_filter">Library:</label>
                         <select id="branchcode_filter">
-                            [% IF branches.size != 1 %]
+                            [% SET libraries = Branches.all( only_from_group => 1 ) %]
+                            [% IF libraries.size != 1 %]
                                 <option value="">Any</option>
                             [% END %]
-                            [% FOREACH branch IN branches %]
-                                <option value="[% branch.branchcode %]">[% branch.branchname %]</option>
+                            [% FOREACH l IN libraries %]
+                                <option value="[% l.branchcode | html %]">[% l.branchname | html %]</option>
                             [% END %]
                         </select>
                     </li>
@@ -216,7 +56,7 @@ function filterByFirstLetterSurname(letter) {
         <div class="browse">
             Browse by last name:
             [% FOREACH letter IN alphabet.split(' ') %]
-                <a href="#" class="filterByLetter">[% letter %]</a>
+                <a href="#" class="filterByLetter">[% letter | html %]</a>
             [% END %]
         </div>
 
@@ -247,7 +87,205 @@ function filterByFirstLetterSurname(letter) {
             </table>
         </div>
 
-<div id="closewindow"><a href="#" class="btn btn-default close">Close</a></div>
+<div id="closewindow"><a href="#" class="btn btn-default btn-default close">Close</a></div>
+
+<!-- Patron preview modal -->
+<div class="modal" id="patronPreview" tabindex="-1" role="dialog" aria-labelledby="patronPreviewLabel">
+    <div class="modal-dialog" role="document">
+        <div class="modal-content">
+            <div class="modal-header">
+                <button type="button" class="closebtn" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
+                <h4 class="modal-title" id="patronPreviewLabel"></h4>
+            </div>
+            <div class="modal-body">
+                <div id="loading">
+                    <img src="[% interface | html %]/[% theme | html %]/img/spinner-small.gif" alt="" /> Loading
+                </div>
+            </div>
+            <div class="modal-footer">
+                <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
+            </div>
+        </div>
+    </div>
+</div>
+
 </div>
 </div>
+
+[% MACRO jsinclude BLOCK %]
+    [% INCLUDE 'datatables.inc' %]
+
+    <script type="text/javascript">
+        var search = 1;
+        $(document).ready(function(){
+            $("#info").hide();
+            $("#error").hide();
+
+            [% IF view != "show_results" %]
+                $("#searchresults").hide();
+                search = 0;
+            [% END %]
+
+            // Apply DataTables on the results table
+            dtMemberResults = $("#memberresultst").dataTable($.extend(true, {}, dataTablesDefaults, {
+                'bServerSide': true,
+                'sAjaxSource': "/cgi-bin/koha/svc/members/search",
+                'fnServerData': function(sSource, aoData, fnCallback) {
+                    if ( ! search ) {
+                        return;
+                    }
+                    aoData.push({
+                        'name': 'searchmember',
+                        'value': $("#searchmember_filter").val()
+                    },{
+                        'name': 'firstletter',
+                        'value': $("#firstletter_filter").val()
+                    },{
+                        'name': 'categorycode',
+                        'value': $("#categorycode_filter").val()
+                    },{
+                        'name': 'branchcode',
+                        'value': $("#branchcode_filter").val()
+                    },{
+                        'name': 'name_sorton',
+                        'value': 'borrowers.surname borrowers.firstname'
+                    },{
+                        'name': 'category_sorton',
+                        'value': 'categories.description',
+                    },{
+                        'name': 'branch_sorton',
+                        'value': 'branches.branchname'
+                    },{
+                        'name': 'template_path',
+                        'value': '[% json_template | html %]',
+                    },{
+                        'name': 'selection_type',
+                        'value': '[% selection_type | html %]',
+                    }
+                    [% IF patrons_with_acq_perm_only %]
+                    ,{
+                        'name': 'has_permission',
+                        'value': 'acquisition.order_manage',
+                    }
+                    [% END %]
+                    );
+                    $.ajax({
+                        'dataType': 'json',
+                        'type': 'POST',
+                        'url': sSource,
+                        'data': aoData,
+                        'success': function(json){
+                            fnCallback(json);
+                        }
+                    });
+                },
+                'aoColumns':[
+                    [% FOR column IN columns %]
+                        [% IF column == 'action' %]
+                            { 'mDataProp': 'dt_action', 'bSortable': false, 'sClass': 'actions' }
+                        [% ELSIF column == 'address' %]
+                            { 'mDataProp': 'dt_address', 'bSortable': false }
+                        [% ELSE %]
+                            { 'mDataProp': 'dt_[% column | html %]' }
+                        [% END %]
+                        [% UNLESS loop.last %],[% END %]
+                    [% END %]
+                ],
+                'bAutoWidth': false,
+                [% IF patrons_with_acq_perm_only %]
+                    'bPaginate': false,
+                [% ELSE %]
+                    'sPaginationType': 'full_numbers',
+                    "iDisplayLength": [% Koha.Preference('PatronsPerPage') | html %],
+                [% END %]
+                'aaSorting': [[[% aaSorting || 0 | html %], 'asc']],
+                'bFilter': false,
+                'bProcessing': true,
+            }));
+
+            $("#searchform").on('submit', filter);
+            $(".filterByLetter").on("click",function(e){
+                e.preventDefault();
+                filterByFirstLetterSurname($(this).text());
+            });
+            $("body").on("click",".add_user",function(e){
+                e.preventDefault();
+                var borrowernumber = $(this).data("borrowernumber");
+                var firstname = $(this).data("firstname");
+                var surname = $(this).data("surname");
+                add_user( borrowernumber, firstname + " " + surname );
+            });
+
+            $("body").on("click",".select_user",function(e){
+                e.preventDefault();
+                var borrowernumber = $(this).data("borrowernumber");
+                var borrower_data = $("#borrower_data"+borrowernumber).val();
+                select_user( borrowernumber, JSON.parse(borrower_data) );
+            });
+
+            $("body").on("click",".patron_preview", function( e ){
+                e.preventDefault();
+                var borrowernumber = $(this).data("borrowernumber");
+                var page = "/cgi-bin/koha/members/moremember.pl?print=brief&borrowernumber=" + borrowernumber;
+                $("#patronPreview .modal-body").load( page + " div.container-fluid" );
+                $('#patronPreview').modal({show:true});
+            });
+
+            $("#patronPreview").on('hidden.bs.modal', function (e) {
+                $("#patronPreview .modal-body").html("<img src=\"[% interface | html %]/[% theme | html %]/img/spinner-small.gif\" alt=\"\" /> Loading");
+            });
+
+        });
+
+        function filter() {
+            search = 1;
+            $("#firstletter_filter").val('');
+            $("#searchresults").show();
+            dtMemberResults.fnDraw();
+            return false;
+        }
+
+        // User has clicked on a letter
+        function filterByFirstLetterSurname(letter) {
+            $("#firstletter_filter").val(letter);
+            search = 1;
+            $("#searchresults").show();
+            dtMemberResults.fnDraw();
+        }
+
+        // modify parent window owner element
+        [% IF selection_type == 'add' %]
+            function add_user(borrowernumber, borrowername) {
+                var p = window.opener;
+                // In one place (serials/routing.tt), the page is reload on every add
+                // We have to wait for the page to be there
+                function wait_for_opener () {
+                    if ( ! $(opener.document).find('body').size() ) {
+                        setTimeout(wait_for_opener, 500);
+                    } else {
+                        [%# Note that add_user could sent data instead of borrowername too %]
+                        $("#info").hide();
+                        $("#error").hide();
+                        if ( p.add_user(borrowernumber, borrowername) < 0 ) {
+                            $("#error").html(_("Patron '%s' is already in the list.").format(borrowername));
+                            $("#error").show();
+                        } else {
+                            $("#info").html(_("Patron '%s' added.").format(borrowername));
+                            $("#info").show();
+                        }
+                    }
+                }
+                wait_for_opener();
+            }
+        [% ELSIF selection_type == 'select' %]
+            function select_user(borrowernumber, data) {
+                var p = window.opener;
+                p.select_user(borrowernumber, data);
+                window.close();
+            }
+        [% END %]
+    </script>
+[% END %]
+
+[% SET popup_window = 1 %]
 [% INCLUDE 'intranet-bottom.inc' %]