Bug 21964: Update two-column templates with Bootstrap grid: Patrons part 2
authorOwen Leonard <oleonard@myacpl.org>
Wed, 2 May 2018 17:56:43 +0000 (17:56 +0000)
committerNick Clemens <nick@bywatersolutions.com>
Mon, 28 Jan 2019 14:34:48 +0000 (14:34 +0000)
This patch modifies several patron templates to use the Bootstrap grid
instead of YUI.

This patch also removes obsolete "text/javascript" attributes from
<script> tags in the modified templates.

To test, apply the patch and view the following pages, confirming that
they look correct at various browser widths:

 - Patrons home page
   - New patron
 - Patron -> Fines -> Create manual invoice
 - Patron -> Set permissions
 - Patron -> Change password
 - Patron -> Edit

Signed-off-by: Claire Gravely <claire.gravely@bsz-bw.de>

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

Signed-off-by: Nick Clemens <nick@bywatersolutions.com>

koha-tmpl/intranet-tmpl/prog/en/modules/members/maninvoice.tt
koha-tmpl/intranet-tmpl/prog/en/modules/members/member-flags.tt
koha-tmpl/intranet-tmpl/prog/en/modules/members/member-password.tt
koha-tmpl/intranet-tmpl/prog/en/modules/members/member.tt
koha-tmpl/intranet-tmpl/prog/en/modules/members/memberentrygen.tt

index 4d1a92f..672c4cb 100644 (file)
 
 <div id="breadcrumbs"><a href="/cgi-bin/koha/mainpage.pl">Home</a> &rsaquo; <a href="/cgi-bin/koha/members/members-home.pl">Patrons</a>  &rsaquo; Manual invoice</div>
 
-<div id="doc3" class="yui-t2">
-   
-   <div id="bd">
-       <div id="yui-main">
-       <div class="yui-b">
+<div class="main container-fluid">
+    <div class="row">
+        <div class="col-sm-10 col-sm-push-2">
+            <main>
+
 [% INCLUDE 'members-toolbar.inc' %]
 
 <!-- The manual invoice and credit buttons -->
 [% END %]
 </div></div>
 
-</div>
-</div>
+            </main>
+        </div> <!-- /.col-sm-10.col-sm-push-2 -->
 
-<div class="yui-b">
-[% INCLUDE 'circ-menu.inc' %]
-</div>
-</div>
+        <div class="col-sm-2 col-sm-pull-10">
+            <aside>
+                [% INCLUDE 'circ-menu.inc' %]
+            </aside>
+        </div> <!-- /.col-sm-2.col-sm-pull-10 -->
+     </div> <!-- /.row -->
 
 [% MACRO jsinclude BLOCK %]
     [% INCLUDE 'str/members-menu.inc' %]
     [% Asset.js("js/members-menu.js") | $raw %]
-    <script type="text/javascript">
+    <script>
         var type_fees = {'L':'','F':'','A':'','N':'','M':''};
         [% FOREACH invoice_types_loo IN invoice_types_loop %]
             type_fees['[% invoice_types_loo.authorised_value | html %]'] = "[% invoice_types_loo.lib | html %]";
index c46e1ff..f4d1c2a 100644 (file)
 
 <div id="breadcrumbs"><a href="/cgi-bin/koha/mainpage.pl">Home</a> &rsaquo; <a href="/cgi-bin/koha/members/members-home.pl">Patrons</a>  &rsaquo; Set permissions for [% patron.surname | html %], [% patron.firstname | html %]</div>
 
-<div id="doc3" class="yui-t2">
-   
-   <div id="bd">
-       <div id="yui-main">
-       <div class="yui-b">
+<div class="main container-fluid">
+    <div class="row">
+        <div class="col-sm-10 col-sm-push-2">
+            <main>
+
 [% INCLUDE 'members-toolbar.inc' %]
 
 <form method="post" action="/cgi-bin/koha/members/member-flags.pl">
 <fieldset class="action"><input type="submit" value="Save" /> <a class="cancel" href="/cgi-bin/koha/members/moremember.pl?borrowernumber=[% patron.borrowernumber | html %]">Cancel</a></fieldset>
 
 </form>
-</div>
-</div>
 
-<div class="yui-b">
-[% INCLUDE 'circ-menu.inc' %]
-</div>
-</div>
+            </main>
+        </div> <!-- /.col-sm-10.col-sm-push-2 -->
+
+        <div class="col-sm-2 col-sm-pull-10">
+            <aside>
+                [% INCLUDE 'circ-menu.inc' %]
+            </aside>
+        </div> <!-- /.col-sm-2.col-sm-pull-10 -->
+    </div> <!-- /.row -->
 
 [% MACRO jsinclude BLOCK %]
     [% INCLUDE 'str/members-menu.inc' %]
     [% Asset.js("js/members-menu.js") | $raw %]
     [% Asset.js("lib/jquery/plugins/jquery.treeview.pack.js") | $raw %]
     <!-- set up tree -->
-    <script type="text/javascript">
+    <script>
         $(document).ready(function() {
             $("#permissionstree").treeview({animated: "fast", collapsed: true});
 
index 1ef3891..f3a77fe 100644 (file)
 
 <div id="breadcrumbs"><a href="/cgi-bin/koha/mainpage.pl">Home</a> &rsaquo; <a href="/cgi-bin/koha/members/members-home.pl">Patrons</a>  &rsaquo; <a href="/cgi-bin/koha/members/moremember.pl?borrowernumber=[% patron.borrowernumber | html %]">[% patron.firstname | html %] [% patron.surname | html %]</a> &rsaquo; [% IF ( newpassword ) %]Password Updated[% ELSE %]Change username and/or password[% END %]</div>
 
-<div id="doc3" class="yui-t2">
+<div class="main container-fluid">
+    <div class="row">
+        <div class="col-sm-10 col-sm-push-2">
+            <main>
 
-   <div id="bd">
-       <div id="yui-main">
-       <div class="yui-b">
 [% INCLUDE 'members-toolbar.inc' %]
 
 [% IF ( newpassword ) %]
     </fieldset>
 </form>[% END %]
 
-</div>
-</div>
+
 <div class="loading hide"><strong>Processing...</strong><img src="[% interface | html %]/[% theme | html %]/img/loading.gif" alt="" /></div>
-<div class="yui-b">
-[% INCLUDE 'circ-menu.inc' %]
-</div>
-</div>
+
+            </main>
+        </div> <!-- /.col-sm-10.col-sm-push-2 -->
+
+        <div class="col-sm-2 col-sm-pull-10">
+            <aside>
+                [% INCLUDE 'circ-menu.inc' %]
+            </aside>
+        </div> <!-- /.col-sm-2.col-sm-pull-10 -->
+    </div> <!-- /.row -->
 
 [% MACRO jsinclude BLOCK %]
-    [% INCLUDE 'str/members-menu.inc' %]
     [% Asset.js("js/members-menu.js") | $raw %]
-    <script type="text/JavaScript">
-
+    <script>
         function generate_password() {
             // Always generate a strong password
             var chars = '0123456789abcdefghijklmnopqrstuvwxyzABCDEFGHIJKLMNOPQRSTUVWXYZ';
index 7ca2d2e..cf98395 100644 (file)
 
 <div id="breadcrumbs"><a href="/cgi-bin/koha/mainpage.pl">Home</a> &rsaquo; [% IF ( searching ) %]<a href="/cgi-bin/koha/members/members-home.pl">Patrons</a>  &rsaquo; Search results[% ELSE %]Patrons[% END %]</div>
 
-<div id="doc3" class="yui-t2">
-  <div id="bd">
-    <div id="yui-main">
-      <div class="yui-b">
-        <div class="yui-g">
+<div class="main container-fluid">
+    <div class="row">
+        <div class="col-sm-10 col-sm-push-2">
+            <main>
+
           [% IF CAN_user_tools_manage_patron_lists %]
             <div id="patron_list_dialog" class="dialog alert">
               Added <span class="patrons-length"></span> patrons to <a></a>.
               <tbody></tbody>
             </table>
           </div>
-        </div>
-      </div>
-    </div>
-    <div class="yui-b">
-      <form method="get" id="searchform">
-        <input type="hidden" id="firstletter_filter" value="" />
-        <fieldset class="brief">
-          <h3>Filters</h3>
-          <ol>
-            <li>
-              <label for="searchmember_filter">Search:</label>
-              <input type="text" id="searchmember_filter" value="[% searchmember | html %]"/>
-            </li>
-            <li>
-              <label for="searchfieldstype_filter">Search fields:</label>
-              <select name="searchfieldstype" id="searchfieldstype_filter">
-                [% IF searchfieldstype == "standard" %]
-                  <option selected="selected" value='standard'>Standard</option>
-                [% ELSE %]
-                  <option value='standard'>Standard</option>
-                [% END %]
-                [% IF searchfieldstype == "surname" %]
-                  <option selected="selected" value='surname'>Surname</option>
-                [% ELSE %]
-                  <option value='surname'>Surname</option>
-                [% END %]
-                [% IF searchfieldstype == "email" %]
-                  <option selected="selected" value='email'>Email</option>
-                [% ELSE %]
-                  <option value='email'>Email</option>
-                [% END %]
-                [% IF searchfieldstype == "borrowernumber" %]
-                  <option selected="selected" value='borrowernumber'>Borrower number</option>
-                [% ELSE %]
-                  <option value='borrowernumber'>Borrower number</option>
-                [% END %]
-                [% IF searchfieldstype == "userid" %]
-                  <option selected="selected" value='userid'>Username</option>
-                [% ELSE %]
-                  <option value='userid'>Username</option>
-                [% END %]
-                [% IF searchfieldstype == "phone" %]
-                  <option selected="selected" value='phone'>Phone number</option>
-                [% ELSE %]
-                  <option value='phone'>Phone number</option>
-                [% END %]
-                [% IF searchfieldstype == "address" %]
-                  <option selected="selected" value='address'>Street address</option>
-                [% ELSE %]
-                  <option value='address'>Street address</option>
-                [% END %]
-                [% IF searchfieldstype == "dateofbirth" %]
-                  <option selected="selected" value='dateofbirth'>Date of birth</option>
-                [% ELSE %]
-                  <option value='dateofbirth'>Date of birth</option>
-                [% END %]
-                [% IF searchfieldstype == "sort1" %]
-                  <option selected="selected" value='sort1'>Sort field 1</option>
-                [% ELSE %]
-                  <option value='sort1'>Sort field 1</option>
-                [% END %]
-                [% IF searchfieldstype == "sort2" %]
-                  <option selected="selected" value='sort2'>Sort field 2</option>
-                [% ELSE %]
-                  <option value='sort2'>Sort field 2</option>
-                [% END %]
-              </select>
-            </li>
-            <li>
-              <label for="searchtype_filter">Search type:</label>
-              <select name="searchtype" id="searchtype_filter">
-                [% IF searchtype == "start_with" %]
-                  <option value='start_with' selected="selected">Starts with</option>
-                  <option value="contain">Contains</option>
-                [% ELSE %]
-                  <option value='start_with'>Starts with</option>
-                  <option value="contain" selected="selected">Contains</option>
-                [% END %]
-              </select>
-            </li>
-            <li>
-              <label for="categorycode_filter">Category:</label>
-              [% SET categories = Categories.all() %]
-              <select id="categorycode_filter">
-                <option value="">Any</option>
-                [% FOREACH cat IN categories %]
-                  [% IF cat.categorycode == categorycode_filter %]
+
+            </main>
+        </div> <!-- /.col-sm-10.col-sm-push-2 -->
+
+        <div class="col-sm-2 col-sm-pull-10">
+            <aside>
+                <form method="get" id="searchform">
+                  <input type="hidden" id="firstletter_filter" value="" />
+                  <fieldset class="brief">
+                    <h3>Filters</h3>
+                    <ol>
+                      <li>
+                        <label for="searchmember_filter">Search:</label>
+                        <input type="text" id="searchmember_filter" value="[% searchmember | html %]"/>
+                      </li>
+                      <li>
+                        <label for="searchfieldstype_filter">Search fields:</label>
+                        <select name="searchfieldstype" id="searchfieldstype_filter">
+                          [% IF searchfieldstype == "standard" %]
+                            <option selected="selected" value='standard'>Standard</option>
+                          [% ELSE %]
+                            <option value='standard'>Standard</option>
+                          [% END %]
+                          [% IF searchfieldstype == "surname" %]
+                            <option selected="selected" value='surname'>Surname</option>
+                          [% ELSE %]
+                            <option value='surname'>Surname</option>
+                          [% END %]
+                          [% IF searchfieldstype == "email" %]
+                            <option selected="selected" value='email'>Email</option>
+                          [% ELSE %]
+                            <option value='email'>Email</option>
+                          [% END %]
+                          [% IF searchfieldstype == "borrowernumber" %]
+                            <option selected="selected" value='borrowernumber'>Borrower number</option>
+                          [% ELSE %]
+                            <option value='borrowernumber'>Borrower number</option>
+                          [% END %]
+                          [% IF searchfieldstype == "userid" %]
+                            <option selected="selected" value='userid'>Username</option>
+                          [% ELSE %]
+                            <option value='userid'>Username</option>
+                          [% END %]
+                          [% IF searchfieldstype == "phone" %]
+                            <option selected="selected" value='phone'>Phone number</option>
+                          [% ELSE %]
+                            <option value='phone'>Phone number</option>
+                          [% END %]
+                          [% IF searchfieldstype == "address" %]
+                            <option selected="selected" value='address'>Street address</option>
+                          [% ELSE %]
+                            <option value='address'>Street address</option>
+                          [% END %]
+                          [% IF searchfieldstype == "dateofbirth" %]
+                            <option selected="selected" value='dateofbirth'>Date of birth</option>
+                          [% ELSE %]
+                            <option value='dateofbirth'>Date of birth</option>
+                          [% END %]
+                          [% IF searchfieldstype == "sort1" %]
+                            <option selected="selected" value='sort1'>Sort field 1</option>
+                          [% ELSE %]
+                            <option value='sort1'>Sort field 1</option>
+                          [% END %]
+                          [% IF searchfieldstype == "sort2" %]
+                            <option selected="selected" value='sort2'>Sort field 2</option>
+                          [% ELSE %]
+                            <option value='sort2'>Sort field 2</option>
+                          [% END %]
+                        </select>
+                      </li>
+                      <li>
+                        <label for="searchtype_filter">Search type:</label>
+                        <select name="searchtype" id="searchtype_filter">
+                          [% IF searchtype == "start_with" %]
+                            <option value='start_with' selected="selected">Starts with</option>
+                            <option value="contain">Contains</option>
+                          [% ELSE %]
+                            <option value='start_with'>Starts with</option>
+                            <option value="contain" selected="selected">Contains</option>
+                          [% END %]
+                        </select>
+                      </li>
+                      <li>
+                        <label for="categorycode_filter">Category:</label>
+                        [% SET categories = Categories.all() %]
+                        <select id="categorycode_filter">
+                          <option value="">Any</option>
+                          [% FOREACH cat IN categories %]
+                            [% IF cat.categorycode == categorycode_filter %]
                     <option selected="selected" value="[% cat.categorycode | html %]">[% cat.description | html %]</option>
-                  [% ELSE %]
+                            [% ELSE %]
                     <option value="[% cat.categorycode | html %]">[% cat.description | html %]</option>
-                  [% END %]
-                [% END %]
-              </select>
-            </li>
-            <li>
-              <label for="branchcode_filter">Library:</label>
-              [% SET branches = Branches.all( selected => branchcode_filter, only_from_group => 1 ) %]
-              <select id="branchcode_filter">
-                [% IF branches.size != 1 %]
-                  <option value="">Any</option>
-                [% END %]
-                [% PROCESS options_for_libraries libraries => branches %]
-              </select>
-            </li>
-          </ol>
-          <fieldset class="action">
-            <input type="submit" value="Search" />
-            <input type="button" value="Clear" id="clear_search" />
-          </fieldset>
-        </fieldset>
-      </form>
-    </div>
-  </div>
-</div>
+
+                            [% END %]
+                          [% END %]
+                        </select>
+                      </li>
+                      <li>
+                        <label for="branchcode_filter">Library:</label>
+                        [% SET branches = Branches.all( selected => branchcode_filter, only_from_group => 1 ) %]
+                        <select id="branchcode_filter">
+                          [% IF branches.size != 1 %]
+                            <option value="">Any</option>
+                          [% END %]
+                          [% PROCESS options_for_libraries libraries => branches %]
+                        </select>
+                      </li>
+                    </ol>
+                    <fieldset class="action">
+                      <input type="submit" value="Search" />
+                      <input type="button" value="Clear" id="clear_search" />
+                    </fieldset>
+                  </fieldset>
+                </form>
+            </aside>
+        </div> <!-- /.col-sm-2.col-sm-pull-10 -->
+    </div> <!-- /.row -->
 
 [% MACRO jsinclude BLOCK %]
     [% INCLUDE 'datatables.inc' %]
     [% INCLUDE 'columns_settings.inc' %]
     [% INCLUDE 'str/members-menu.inc' %]
     [% Asset.js("js/members-menu.js") | $raw %]
-    <script type="text/javascript">
+    <script>
         $(document).ready(function() {
             $('#merge-patrons').prop('disabled', true);
             $('#memberresultst').on('change', 'input.selection', function() {
index fe33188..2cda300 100644 (file)
 <strong>[% IF ( opadd ) %]Add[% ELSIF ( opduplicate ) %]Duplicate[% ELSE %] Modify[% END %] patron ([%IF ( categoryname ) %][% categoryname | html %][% ELSE %][% IF ( I ) %]Organization[% END %][% IF ( A ) %]Adult[% END %][% IF ( C ) %]Child[% END %][% IF ( P ) %]Professional[% END %][% IF ( S ) %]Staff[% END %][% END %])</strong>
     [% END %]
 </div>
-[% IF ( opadd ) %]<div id="doc" class="yui-t7">[% ELSE %]<div id="doc3" class="yui-t2">[% END %]
 
-   <div id="bd">
-       <div id="yui-main">
-       <div class="yui-b">
-    [% INCLUDE 'blocking_errors.inc' %]
+<div class="main container-fluid">
+    <div class="row">
+        [% IF ( opadd ) %]
+            <div class="col-md-10 col-md-offset-1 col-lg-8 col-lg-offset-2">
+        [% ELSE %]
+            <div class="col-sm-10 col-sm-push-2">
+        [% END %]
+            <main class="clearfix">
+                [% INCLUDE 'blocking_errors.inc' %]
+
     [% IF error_alert %]
         [% IF ( error_alert == "no_email" ) %]
             <div class="dialog alert">This member has no email</div>
         [% UNLESS nosms_provider_id %]
         <p>
             <label for="sms_provider_id">SMS provider:</label>
-            <select id="sms_provider_id" name="sms_provider_id"/>
+            <select id="sms_provider_id" name="sms_provider_id">
                 <option value="">Unknown</option>
                 [% FOREACH s IN sms_providers %]
                     [% IF s.id == sms_provider_id %]
         </fieldset>
     </form>
 [% END %]
-</div>
-</div>
 
-[% UNLESS ( opadd ) %]<div class="yui-b">
-[% INCLUDE 'circ-menu.inc' %]
-</div>[% END %]
 [% END %]
-</div>
+            </main>
+        </div> <!-- /.col-sm-10.col-sm-push-2 -->
+
+        [% UNLESS ( opadd ) %]
+            <div class="col-sm-2 col-sm-pull-10">
+                <aside>
+                    [% INCLUDE 'circ-menu.inc' %]
+                </aside>
+            </div> <!-- /.col-sm-2.col-sm-pull-10 -->
+        [% END %]
+     </div> <!-- /.row -->
 
 [% MACRO jsinclude BLOCK %]
     [% Asset.js("lib/jquery/plugins/jquery.fixFloat.js") | $raw %]
     [% INCLUDE 'calendar.inc' %]
     [% INCLUDE 'str/members-menu.inc' %]
     [% Asset.js("js/members-menu.js") | $raw %]
-    <script type="text/javascript">
+    <script>
         $(document).ready(function() {
 
                 $("#saverecord").css({ 'margin-left': 0 });
     </script>
     [% Asset.js("js/members.js") | $raw %]
     [% Asset.js("js/messaging-preference-form.js") | $raw %]
+    [% PROCESS 'password_check.inc' %]
+    [% PROCESS 'add_password_check' new_password => 'password' %]
 [% END %]
 
 [% INCLUDE 'intranet-bottom.inc' %]
-[% PROCESS 'password_check.inc' %]
-[% PROCESS 'add_password_check' new_password => 'password' %]