Lines 2-24
Link Here
|
2 |
<!-- Begin Main page Resident Search Box --> |
2 |
<!-- Begin Main page Resident Search Box --> |
3 |
|
3 |
|
4 |
<div id="containersearch" class="fold"> |
4 |
<div id="containersearch" class="fold"> |
5 |
[% IF (CAN_user_borrowers) %] |
5 |
|
6 |
<div id="checkout_search" class="residentsearch"> |
6 |
[% INCLUDE 'patron-search-box.inc' %] |
7 |
<form action="/cgi-bin/koha/circ/circulation.pl" id="patronsearch" method="post"> |
|
|
8 |
<input id="inputsearch" class="inpu" type="text" autocomplete="off" placeholder="Enter patron card number or partial name" /> |
9 |
<input type="hidden" name="quicksearch" value="1" /> |
10 |
<input value="" type="submit" id="submitsearch" /> |
11 |
</form> |
12 |
</div> |
13 |
[% END %] |
14 |
|
7 |
|
15 |
[% IF ( CAN_user_circulate_circulate_remaining_permissions ) %] |
8 |
[% IF ( CAN_user_circulate_circulate_remaining_permissions ) %] |
16 |
<div id="checkin_search" class="residentsearch"> |
9 |
<div id="checkin_search" class="residentsearch"> |
17 |
<form action="/cgi-bin/koha/members/member.pl" id="patronsearch" method="post"> |
10 |
<form action="/cgi-bin/koha/members/member.pl" id="patronsearch" method="post"> |
18 |
[% IF ( PatronAutoComplete ) %] |
11 |
[% IF ( PatronAutoComplete ) %] |
19 |
<div class="autocomplete"> |
12 |
<div class="autocomplete"> |
20 |
<input autocomplete="off" class="inpu" id="inputsearch" name="findborrower" class="head-searchbox" type="text" placeholder="Scan a barcode to check in" /> |
13 |
<input name="barcode" id="ret_barcode" class="head-searchbox" accesskey="r" type="text" placeholder="Scan a barcode to check in" /> |
21 |
<input value="" id="submitsearch" type="submit"/> |
14 |
<input value="" id="submit" type="submit"/> |
22 |
|
15 |
|
23 |
[% IF ( stickyduedate ) %] |
16 |
[% IF ( stickyduedate ) %] |
24 |
<input type="hidden" name="duedatespec" value="[% duedatespec | html %]" /> |
17 |
<input type="hidden" name="duedatespec" value="[% duedatespec | html %]" /> |
Lines 27-85
Link Here
|
27 |
</div> |
20 |
</div> |
28 |
|
21 |
|
29 |
[% ELSE %] |
22 |
[% ELSE %] |
30 |
<input id="inputsearch" name="findborrower" class="inpu head-searchbox" type="text" autocomplete="off" placeholder=Scan a barcode to check in" /> |
23 |
<input name="barcode" id="ret_barcode" class="head-searchbox" accesskey="r" type="text" placeholder="Scan a barcode to check in" /> |
31 |
[% IF ( stickyduedate ) %] |
24 |
[% IF ( stickyduedate ) %] |
32 |
<input type="hidden" name="duedatespec" value="[% duedatespec | html %]" /> |
25 |
<input type="hidden" name="duedatespec" value="[% duedatespec | html %]" /> |
33 |
<input type="hidden" name="stickyduedate" value="[% stickyduedate | html %]" /> |
26 |
<input type="hidden" name="stickyduedate" value="[% stickyduedate | html %]" /> |
34 |
[% END %] |
27 |
[% END %] |
35 |
<input value="" id="submitsearch" type="submit" /> |
28 |
<input value="" id="submit" type="submit" /> |
36 |
[% END %] |
29 |
[% END %] |
37 |
</form> |
30 |
</form> |
38 |
</div> |
31 |
</div> |
39 |
|
32 |
|
40 |
<div id="renew_search" class="residentsearch"> |
33 |
<div id="renew_search" class="residentsearch"> |
41 |
<form method="post" action="/cgi-bin/koha/circ/returns.pl" autocomplete="off"> |
|
|
42 |
<input name="barcode" id="inputsearch" class="inpu" accesskey="r" type="text" placeholder="Scan a barcode to renew" /> |
43 |
<input value="" type="submit" id="submitsearch" /> |
44 |
</form> |
45 |
</div> |
46 |
<div id="search_search" class="residentsearch"> |
47 |
<form method="post" action="/cgi-bin/koha/circ/renew.pl" autocomplete="off"> |
34 |
<form method="post" action="/cgi-bin/koha/circ/renew.pl" autocomplete="off"> |
48 |
<input name="barcode" id="inputsearch" class="inpu" type="text" placeholder="Enter search keyords" /> |
35 |
<input name="barcode" id="ren_barcode" class="head-searchbox" accesskey="r" type="text" placeholder="Scan a barcode to renew" /> |
49 |
<input value="" type="submit" id="submitsearch" /> |
36 |
<input value="" type="submit" id="submit" /> |
50 |
</form> |
37 |
</form> |
51 |
</div> |
38 |
</div> |
52 |
[% END %] |
|
|
53 |
|
39 |
|
54 |
[% IF ( CAN_user_catalogue ) %] |
|
|
55 |
<div id="search_search" class="residentsearch"> |
40 |
<div id="search_search" class="residentsearch"> |
56 |
<form method="post" action="/cgi-bin/koha/catalogue/search.pl" autocomplete="off" method="get" id="cat-search-block"> |
41 |
<form method="post" action="/cgi-bin/koha/circ/renew.pl" autocomplete="off"> |
57 |
[% IF ( Koha.Preference('IntranetCatalogSearchPulldown') ) %] |
42 |
<input name="barcode" id="inputsearch" class="inpu" type="text" placeholder="Enter search keyords" /> |
58 |
[% INCLUDE 'search_indexes.inc' %] |
43 |
<input value="" type="submit" id="submit" /> |
59 |
[% END %] |
|
|
60 |
<input name="barcode" class="inpu" id="inputsearch focus" type="text" placeholder="Enter search keyords" /> |
61 |
<input value="" type="submit" id="submitsearch" /> |
62 |
</form> |
44 |
</form> |
63 |
</div> |
45 |
</div> |
64 |
[% END %] |
46 |
[% END %] |
65 |
|
47 |
|
66 |
<ul> |
48 |
[% INCLUDE 'catalogue-search-box.inc' %] |
67 |
<span id="buttonssearch"> |
49 |
|
68 |
<span id="button_1" title="Check out" onclick="clique(this)" class="iconsearch"><i class="fa fa-upload"></i></span> <span id="button_2" title="Check in" onclick="clique(this)" class="iconsearch"><i class="fa fa-download"></i></span> <span id="icon_3" title="Renew" onclick="clique(this)" class="iconsearch"><i class="fa fa-retweet"></i></span> <span id="icon_4" title="Search catalog" onclick="clique(this)" class="iconsearch"><i class="fa fa-fw fa-search"></i></span> |
50 |
<ul id="taille"> |
69 |
[% IF ( CAN_user_circulate_circulate_remaining_permissions ) %]<span id="button_1" onclick="toggle(this)" class="buttonsearch" href="#circ_search">Check-out</span>[% END %] |
51 |
[% IF ( CAN_user_circulate_circulate_remaining_permissions ) %]<li><a id="icon_1" title="Check out" onclick="clique(this)" href="#circ_search" class="iconsearch"><i class="fa fa-upload"></i></a></li>[% END %] |
70 |
[% IF ( CAN_user_circulate_circulate_remaining_permissions ) %]<span id="button_2" onclick="toggle(this)" class="buttonsearch" href="#checkin_search">Check-in</span>[% END %] |
52 |
[% IF ( CAN_user_circulate_circulate_remaining_permissions ) %]<li><a id="icon_2" title="Check in" onclick="clique(this)" href="#checkin_search" class="iconsearch"><i class="fa fa-download"></i></a></li>[% END %] |
71 |
[% IF ( CAN_user_circulate_circulate_remaining_permissions ) %]<span id="button_3" onclick="toggle(this)" class="buttonsearch" href="#renew_search">Renew</span>[% END %] |
53 |
[% IF ( CAN_user_circulate_circulate_remaining_permissions ) %]<li><a id="icon_3" title="Renew" onclick="clique(this)" href="#renew_search" class="iconsearch"><i class="fa fa-retweet"></i></a></li>[% END %] |
72 |
[% IF ( CAN_user_catalogue ) %]<span id="button_5" onclick="toggle(this)" class="buttonsearch active" href="#catalog_search">Search catalog</span>[% END %] |
54 |
[% IF ( CAN_user_catalogue ) %]<li><a id="icon_4" title="Search catalog" onclick="clique(this)" href="#catalog_search" class="iconsearch"><i class="fa fa-fw fa-search"></i></a></li>[% END %] |
73 |
</span> |
55 |
|
|
|
56 |
<span id="button_1" class="buttonsearch active">Check-out</span> |
57 |
<span id="button_2" class="buttonsearch">Check-in</span> |
58 |
<span id="button_3" class="buttonsearch">Renew</span> |
59 |
<span id="button_5" class="buttonsearch active">Search catalog</span> |
74 |
</ul> |
60 |
</ul> |
75 |
</div> |
61 |
</div> |
76 |
|
62 |
|
77 |
<script type="text/javascript"> |
63 |
<script type="text/javascript"> |
78 |
function focusInput(){ |
64 |
function focusInput(){ |
79 |
document.getElementById('inputsearch').focus(); |
65 |
document.getElementsByClassName('head-searchbox').focus(); |
80 |
} |
66 |
} |
81 |
|
67 |
|
82 |
function toggle(elem){ |
68 |
function toggle(elem){style="width: calc(301px);" |
83 |
var buttonssearch = document.getElementsByClassName('active'); |
69 |
var buttonssearch = document.getElementsByClassName('active'); |
84 |
for (var i = buttonssearch.length - 1; i >= 0; i--) { |
70 |
for (var i = buttonssearch.length - 1; i >= 0; i--) { |
85 |
buttonssearch[i].classList.remove('active'); |
71 |
buttonssearch[i].classList.remove('active'); |
Lines 90-107
Link Here
|
90 |
fold(); |
76 |
fold(); |
91 |
}else{//Back |
77 |
}else{//Back |
92 |
document.getElementById('button_1').classList.add('active'); |
78 |
document.getElementById('button_1').classList.add('active'); |
93 |
document.getElementById('containersearch').classList.remove('fold'); |
79 |
document.getElementById('header_search').classList.remove('fold'); |
94 |
document.getElementById('inputsearch').style = ''; |
80 |
document.getElementsByClassName('head-searchbox').style = ''; |
95 |
} |
81 |
} |
96 |
|
82 |
|
97 |
focusInput(); |
83 |
focusInput(); |
98 |
} |
84 |
} |
99 |
|
85 |
|
100 |
|
|
|
101 |
function clique(elem){ |
86 |
function clique(elem){ |
102 |
var buttonssearch = document.getElementsByClassName('buttonsearch'); |
87 |
var buttonssearch = document.getElementsByClassName('buttonsearch'); |
103 |
var iconssearch = document.getElementsByClassName('iconsearch'); |
88 |
var iconssearch = document.getElementsByClassName('iconsearch'); |
104 |
var inputssearch = document.getElementsByClassName('inpu'); |
89 |
var inputssearch = document.getElementsByClassName('head-searchbox'); |
105 |
for (var i = buttonssearch.length - 1; i >= 0; i--) { |
90 |
for (var i = buttonssearch.length - 1; i >= 0; i--) { |
106 |
buttonssearch[i].classList.remove('active'); |
91 |
buttonssearch[i].classList.remove('active'); |
107 |
if (elem == iconssearch[i]){ |
92 |
if (elem == iconssearch[i]){ |
Lines 114-138
Link Here
|
114 |
|
99 |
|
115 |
if (elem == iconssearch[i]){ |
100 |
if (elem == iconssearch[i]){ |
116 |
inputssearch[i].classList.add('focus'); |
101 |
inputssearch[i].classList.add('focus'); |
|
|
102 |
|
103 |
taille(inputssearch[i]) |
117 |
} |
104 |
} |
118 |
} |
105 |
} |
119 |
|
106 |
|
120 |
fold(); |
|
|
121 |
focusInput(); |
107 |
focusInput(); |
|
|
108 |
fold(); |
122 |
} |
109 |
} |
123 |
|
110 |
|
124 |
function fold(){ |
111 |
function fold(){ |
125 |
|
112 |
document.getElementById('header_search').classList.add('fold'); |
126 |
document.getElementById('containersearch').classList.add('fold'); |
113 |
// document.getElementsByClassName('head-searchbox').style = "width:calc(500px - 100px)"; |
127 |
// document.getElementById('inputsearch').style = "width:calc(500px - 100px)"; |
|
|
128 |
setTimeout( |
114 |
setTimeout( |
129 |
function(){ |
115 |
function(){ |
130 |
var offsetWidth = document.getElementById('buttonssearch').offsetWidth +5; |
116 |
var offsetWidth = document.getElementById('taille').offsetWidth +5; |
131 |
document.getElementById('inputsearch').style = "width:calc(500px - "+offsetWidth+"px)"; |
117 |
document.getElementsByClassName('head-searchbox').style = "width:calc(500px - "+offsetWidth+"px)"; |
132 |
} |
118 |
} |
133 |
, 250); |
119 |
, 250); |
134 |
} |
120 |
} |
135 |
|
121 |
|
|
|
122 |
function taille(el){ |
123 |
var offsetWidth = document.getElementById('taille').offsetWidth +5; |
124 |
el.style = "width:calc(500px - "+offsetWidth+"px)"; |
125 |
} |
126 |
|
127 |
$('.btn').click(function(){ |
128 |
if($(this).hasClass('active')){ |
129 |
$(this).removeClass('active') |
130 |
} else { |
131 |
$(this).addClass('active') |
132 |
} |
133 |
}); |
134 |
|
135 |
|
136 |
|
136 |
|
137 |
</script> |
137 |
</script> |
138 |
|
138 |
|