From a5b2d9ef72da062a0a451bd54fc811cd424cea42 Mon Sep 17 00:00:00 2001
From: Terran McCanna <tmccanna@georgialibraries.org>
Date: Tue, 15 Dec 2015 14:38:07 -0500
Subject: [PATCH] Miscellaneous OPAC UI tweaks for spacing / layout.

Signed-off-by: Terran McCanna <tmccanna@georgialibraries.org>
---
 Open-ILS/src/templates/opac/css/style.css.tt2      | 45 +++++++++++++---
 Open-ILS/src/templates/opac/parts/org_selector.tt2 |  7 ++-
 .../src/templates/opac/parts/record/copy_table.tt2 | 61 +++++++++++++---------
 .../src/templates/opac/parts/record/navigation.tt2 | 15 ++++--
 Open-ILS/src/templates/opac/parts/result/table.tt2 |  3 +-
 Open-ILS/src/templates/opac/parts/searchbar.tt2    | 29 +++++-----
 6 files changed, 102 insertions(+), 58 deletions(-)

diff --git a/Open-ILS/src/templates/opac/css/style.css.tt2 b/Open-ILS/src/templates/opac/css/style.css.tt2
index c62832147a..d81cc49d85 100644
--- a/Open-ILS/src/templates/opac/css/style.css.tt2
+++ b/Open-ILS/src/templates/opac/css/style.css.tt2
@@ -290,6 +290,17 @@ for now until a better color is picked - if needed.
 	background-color:#ddd;
 }
 
+#search_box {
+    width:90%;
+	max-width:600px;
+	height:20px;
+	padding:3px;
+}
+
+.org_selector_dropdown {
+    padding:3px;
+}
+
 #adv_search_tabs, #acct_tabs, #acct_fines_tabs, #acct_checked_tabs, #acct_holds_tabs, #acct_prefs_tabs, #results_header_inner{
     margin-left: 2px;
     overflow: auto;
@@ -400,10 +411,9 @@ for now until a better color is picked - if needed.
     border-bottom: 1px dotted [% css_colors.accent_medium %];
 	border-top: 1px dotted [% css_colors.accent_medium %];
 	background-color:#eee;
-	margin-left:-20px;
-	margin-right:-20px;
 	font-weight: bold;
 	text-decoration: none;
+	overflow: hidden;
 }
 
 .rdetail_results a, .rdetail_result_nav a {
@@ -748,12 +758,12 @@ collapse correctly when the window width decreases */
 }
 
 .results_header_nav1 {
-    padding: 10px 7px 10px 7px;
+    padding: 10px 0px 10px 0px;
 	text-align:center;
     border-bottom: 2px dotted [% css_colors.accent_light %];
 	background-color:#eee;
-	margin-left:-20px;
-	margin-right:-20px;
+	margin-left:-13px;
+	margin-right:-14px;
 }
 
 .results_header_nav1 .h1 {
@@ -805,7 +815,8 @@ tr.result_table_row > td.result_table_pic_header {
 }
 
 .result_number {
-    white-space: nowrap;
+    padding-left:10px;
+	padding-right:10px;
 }
 
 .result_count_number {
@@ -1794,6 +1805,14 @@ a.preflib_change {
 	margin-left:40px;
 }
 
+.call_number_box {
+	margin-left:40px;
+}
+
+div.result_table_utils {
+    margin-left:-40px;
+}
+
 .record_title {
     font-size: [% css_fonts.size_bigger %];
 }
@@ -1853,6 +1872,11 @@ a.preflib_change {
     #homesearch_main_logo {
         display:none;
     }
+	.org_selector_dropdown {
+        padding:3px;
+		width:90%;
+		max-width:250px;
+    }
     #format_selector {
         display:none;
     }
@@ -1929,6 +1953,10 @@ a.preflib_change {
     .results_header_lbl {
         display: none;
     }
+	.results_header_nav1 {
+	    margin-left:0px;
+	    margin-right:0px;
+    }
     .results_header_nav1 span.h1 {
         display: none;
     }
@@ -1950,8 +1978,11 @@ a.preflib_change {
     .result_table_pic {
         width: 55px;
         padding: 0px;
-        margin: 0px;
+        margin: 5px;
     }
+	.result_table_title_cell, .call_number_box {
+		margin-left:0px;
+	}
     tr[name=results_isbn_tr], tr[name=results_phys_desc_tr], tr[name=results_pub_tr] strong, .result_count {
          display: none;
     }
diff --git a/Open-ILS/src/templates/opac/parts/org_selector.tt2 b/Open-ILS/src/templates/opac/parts/org_selector.tt2
index ab4d7c91f0..3f83690f22 100644
--- a/Open-ILS/src/templates/opac/parts/org_selector.tt2
+++ b/Open-ILS/src/templates/opac/parts/org_selector.tt2
@@ -29,7 +29,7 @@ BLOCK build_org_selector;
 
     <select [% IF id %] id='[% id %]' [% END -%]
             title='[% arialabel || l("Select Library") %]' 
-            name='[% name %]'>
+            name='[% name %]' class="org_selector_dropdown">
     [%- 
         WHILE node_stack.size > 0; 
             node = node_stack.pop();
@@ -122,8 +122,11 @@ BLOCK build_org_selector;
                 porg = ctx.get_aou(porg.parent_ou);
             END;
 
-            pad_depth = pad_depth * 2;
+            pad_depth = pad_depth * 5;
             display_name = loc_grp ? loc_grp.name : org_unit.name %]
+			[% IF node_value == 1 %]
+			    [% display_name = "All PINES Libraries" %]
+		    [% END %]
 
             <option value='[% node_value %]' [% selected %] [% disabled %] [% css_class %]> 
                 [% '&nbsp;' FOR [0..pad_depth]; display_name | html %]
diff --git a/Open-ILS/src/templates/opac/parts/record/copy_table.tt2 b/Open-ILS/src/templates/opac/parts/record/copy_table.tt2
index c87c27e595..f25e1630e1 100644
--- a/Open-ILS/src/templates/opac/parts/record/copy_table.tt2
+++ b/Open-ILS/src/templates/opac/parts/record/copy_table.tt2
@@ -26,29 +26,33 @@ FOREACH copy_info IN copies;
 END;
 -%]
 [%- IF has_copies; %]
-<table class="table_no_border_space table_no_cell_pad table_no_border" width="100%" id="rdetails_status">
+<table  width="100%" cellpadding="5" style="border:1px #999 solid;">
     <thead>
         <tr>
             [% IF serial_holdings -%]
             <th scope='col'>[% l("Issue Label") %]</th>
             [%- ELSE -%]
-            <th scope='col'>[% l("Location") %]</th>
+            <th scope='col' style="text-align:left;vertical-align:top;">[% l("Library System: Library Branch Name") %]<br/>
+			    <span style="font-size:smaller;font-style:italic;">(Click library name for locations and hours)</span>
+			</th>
             [%- END %]
-            <th scope='col'>[% l("Call Number / Copy Notes") %]</th>
+            <th scope='col' style="text-align:left;vertical-align:top;">[% l("Shelving Location") %]</th>
+            <th scope='col' style="text-align:left;vertical-align:top;">[% l("Call Number / Copy Notes") %]</th>
             [%- IF has_parts == 'true' %]
-            <th scope='col'>[% l("Part") %]</th>
+            <th scope='col' style="text-align:left;vertical-align:top;">[% l("Part") %]</th>
             [%- END %]
-            <th scope='col'>[% l("Barcode") %]</th>
-            <th scope='col'>[% l("Shelving Location") %]</th>
+            <th scope='col' style="text-align:left;vertical-align:top;">[% l("Barcode") %]</th>
             [%- IF ctx.is_staff %]
-            <th scope='col'>[% l("Age Hold Protection") %]</th>
-            <th scope='col'>[% l("Active/Create Date") %]</th>
+            <th scope='col' style="text-align:left;vertical-align:top;">[% l("Age Hold Protection") %]</th>
+            <th scope='col' style="text-align:left;vertical-align:top;">[% l("Active/Create Date") %]</th>
             [%- END %]
             [%- IF ctx.is_staff OR serial_holdings %]
-            <th scope='col'>[% l("Holdable?") %]</th>
+            <th scope='col' style="text-align:left;vertical-align:top;">[% l("Holdable?") %]</th>
             [%- END %]
-            <th scope='col'>[% l("Status") %]</th>
+            <th scope='col' style="text-align:left;vertical-align:top;">[% l("Status") %]</th>
+			[%- IF ctx.is_staff %]
             <th scope='col'>[% l("Due Date") %]</th>
+			[%- END -%]
         </tr>
     </thead>
     <tbody class="copy_details_table">
@@ -65,11 +69,13 @@ END;
             </a>
         </li></ul>
     </td>
+    <td>[% copy_info.copy_location | html %]</td>
     <td>[% bib.target_copy.call_number.label | html %]</td>
     <td>[% bib.target_copy.barcode | html %]</td>
-    <td>[% copy_info.copy_location | html %]</td>
     <td>[% copy_info.copy_status | html %]</td>
+    [%- IF ctx.is_staff %]
     <td>[% copy_info.due_date | html %]</td>
+    [%- END %]
 </tr>
    [%- END; # FOREACH peer
 END; # FOREACH bib
@@ -93,20 +99,22 @@ END; # FOREACH bib
             [%- IF serial_holdings %]<td class='rdetail-issue-issue'>
                 [%- copy_info.holding_label | html; -%]
             </td>
-            [%- ELSE %]<td>
-            [%- INCLUDE "opac/parts/library_name_link.tt2"; -%]
+        [%- ELSE %]
+            <td valign="top" style="background-color:#fff;">
+                [%- INCLUDE "opac/parts/library_name_link.tt2"; -%]
                 <link property="businessFunction" href="http://purl.org/goodrelations/v1#LeaseOut">
                 <meta property="price" content="0.00">
-            </td>[% END %]
-            <td><span property="sku">[% callnum | html %]</span> [% IF ctx.get_org_setting(CGI.param('loc') 
-                OR ctx.aou_tree.id, 'sms.enable') == 1 %](<a href="[% mkurl(ctx.opac_root _ '/sms_cn', 
-               {copy_id => copy_info.id}) %];rec=[%- ctx.bre_id -%]" rel="nofollow" vocab="">Text</a>)[% END %]</td>
+            </td>
+        [% END %]
+            <td property="availableAtOrFrom" valign="top" style="background-color:#fff;">[% copy_info.copy_location | html %]</td>
+            <td valign="top" style="background-color:#fff;"><span property="sku">[% callnum | html %]</span>[% IF ctx.get_org_setting(CGI.param('loc') OR ctx.aou_tree.id, 'sms.enable') == 1 %]<br/>(<a href="[% mkurl(ctx.opac_root 
+			    _ '/sms_cn', {copy_id => copy_info.id}) %];rec=[%- ctx.bre_id -%]">Send Call No. in Text Message</a>)[% END %]</td>
             [%- IF has_parts == 'true' %]
-            <td>[% copy_info.part_label | html %]</td>
+            <td valign="top" style="background-color:#fff;">[% copy_info.part_label | html %]</td>
             [%- END %]
-            <td property="serialNumber">
+            <td property="serialNumber" valign="top" style="background-color:#fff;text-align:left;">
                 [% copy_info.barcode | html -%]
-                [% IF ctx.is_staff %]
+                [% IF ctx.is_staff %]<br/>
                   [%- IF ctx.is_browser_staff %]
                     <a target="_blank" href="[% ctx.base_path %]/staff/cat/item/[% copy_info.id %]">[% l('view') %]</a>
                     [% IF ctx.has_perm('UPDATE_COPY', copy_info.circ_lib) 
@@ -137,13 +145,12 @@ END; # FOREACH bib
                     '<meta property="gtin13" content="' _ attrs.gtin13 _ '" />';
                 END; -%]
             </td>
-            <td property="availableAtOrFrom">[% copy_info.copy_location | html %]</td>
             [%- IF ctx.is_staff %]
-            <td>
+            <td valign="top" style="background-color:#fff;">
                 [% copy_info.age_protect ?
                     ctx.get_crahp(copy_info.age_protect).name : l('None') | html %]
             </td>
-            <td>[% 
+            <td valign="top" style="background-color:#fff;">[% 
                 IF ctx.get_org_setting(copy_info.circ_lib, 'circ.holds.age_protect.active_date') == 1;
                     disp_date = copy_info.active_date ? copy_info.active_date : copy_info.create_date;
                 ELSE;
@@ -161,7 +168,7 @@ END; # FOREACH bib
             %]</td>
             [% END # is_staff %]
             [% IF ctx.is_staff OR serial_holdings %]
-            <td>[%  # Show copy/volume hold links to staff (without
+            <td valign="top" style="background-color:#fff;">[%  # Show copy/volume hold links to staff (without
                 # checking whether they have permissions to do those).
                 overall_holdable = (
                     copy_info.holdable == 't' AND
@@ -209,11 +216,12 @@ END; # FOREACH bib
                     l("Not holdable");
                 END %]</td>
             [%- END %]
-            <td>[%-
+            <td valign="top" style="background-color:#fff;">[%-
                 schema_copy_status.${copy_info.status_code};
                 copy_info.copy_status | html;
             -%]</td>
-            <td>[%
+            [%- IF ctx.is_staff %]
+            <td valign="top" style="background-color:#fff;">[%
                 IF copy_info.due_date;
                     date.format(
                         ctx.parse_datetime(copy_info.due_date),
@@ -222,6 +230,7 @@ END; # FOREACH bib
                 ELSE;
                     '-';
                 END %]</td>
+            [%- END %]
         </tr>
 
         [% IF copy_info.notes; %]
diff --git a/Open-ILS/src/templates/opac/parts/record/navigation.tt2 b/Open-ILS/src/templates/opac/parts/record/navigation.tt2
index b93d6f47ff..55ffd0e770 100644
--- a/Open-ILS/src/templates/opac/parts/record/navigation.tt2
+++ b/Open-ILS/src/templates/opac/parts/record/navigation.tt2
@@ -1,9 +1,10 @@
 [% IF ctx.search_result_index.defined && ctx.search_result_index >= 0 %]
 <div class="rdetail_header">
     <span class="rdetail_results">
-        <a href='[% mkurl(ctx.opac_root _ '/results', {}, stop_parms); %]' rel="nofollow" vocab=""><span class="nav_arrow_fix">&#9668;</span> [% l('Search Results') %]</a>
+        <a href='[% mkurl(ctx.opac_root _ '/results', {}, stop_parms); %]' rel="nofollow" vocab=""><span class="nav_arrow_fix">&#9668;</span> [% l('Return to Search Results') %]</a>
+		&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;
         <span class="rdetail_result_count">
-            [% l('Showing Item [_1] of [_2]', ctx.search_result_index + 1, ctx.hit_count) %]
+            [% l('Now showing item [_1] of about [_2]', ctx.search_result_index + 1, ctx.hit_count) %]
         </span>
     </span>
     [%- INCLUDE "opac/parts/pref_lib_display.tt2" %]
@@ -18,7 +19,7 @@
                 ctx.prev_rec_url = mkurl(ctx.prev_search_record, prev_args, stop_parms);
         %]
         <a class='np_nav_link classic_link' title='[% l("Previous Record") %]'
-            href='[% ctx.prev_rec_url %]' rel="nofollow" vocab=""><span class="nav_arrow_fix">&#9668;</span> [% l('Previous') %]</a>
+            href='[% ctx.prev_rec_url %]' rel="nofollow" vocab=""><span class="nav_arrow_fix">&#9668;</span> [% l('Previous Item') %]</a> &nbsp; &nbsp; &nbsp;
         [% END %]
 
         [% 
@@ -30,9 +31,15 @@
                 ctx.next_rec_url = mkurl(ctx.next_search_record, next_args, stop_parms);
         %]
         <a class='np_nav_link classic_link' title='[% l("Next Record") %]'
-            href='[% ctx.next_rec_url %]' rel="nofollow" vocab="">[% l('Next') %] <span class="nav_arrow_fix">&#9658;</span></a>
+            href='[% ctx.next_rec_url %]' rel="nofollow" vocab="">[% l('Next Item') %] <span class="nav_arrow_fix">&#9658;</span></a>
         [% END %]
 
     </div>
 </div>
+[% ELSE %]
+<div class="rdetail_header">
+    <span class="rdetail_results">
+	    <a href='javascript:history.go(-1)'>[% l('&#9668; Return to Previous Page') %]</a>
+    </span>
+</div>
 [% END %]
diff --git a/Open-ILS/src/templates/opac/parts/result/table.tt2 b/Open-ILS/src/templates/opac/parts/result/table.tt2
index 77ab0e85ab..78da48d35c 100644
--- a/Open-ILS/src/templates/opac/parts/result/table.tt2
+++ b/Open-ILS/src/templates/opac/parts/result/table.tt2
@@ -160,8 +160,7 @@ END;
                                                     <table 
                                                        role="presentation"
                                                        title="[% l('Record Holdings Summary') %]"
-                                                       class="table_no_border_space table_no_cell_pad table_no_border results_info_table"
-													   style="margin-left:40px;">
+                                                       class="table_no_border_space table_no_cell_pad table_no_border results_info_table call_number_box">
                                                         [% UNLESS rec.mmr_id %]
                                                            [% IF args.holdings.size > 0 %]
                                                         <tr name='bib_cn_list' class='result_table_title_cell'>
diff --git a/Open-ILS/src/templates/opac/parts/searchbar.tt2 b/Open-ILS/src/templates/opac/parts/searchbar.tt2
index ac13ce0958..1a3989f1ab 100644
--- a/Open-ILS/src/templates/opac/parts/searchbar.tt2
+++ b/Open-ILS/src/templates/opac/parts/searchbar.tt2
@@ -5,7 +5,7 @@
     <form action="[% ctx.opac_root %]/results" method="get">
     [%- END %]
     <div id="search-box">
-        <span class="search_catalog_lbl mobile_hide">[% l('Search the Catalog') %]</span>
+        <span class="search_catalog_lbl mobile_hide">[% l('Basic Search') %]</span>
         <span class="adv_search_catalog_lbl"><a href="[% mkurl(ctx.opac_root _ '/advanced', {},  expert_search_parms.merge(browse_search_parms, facet_search_parms)) %]"
             id="home_adv_search_link" rel="nofollow" vocab="">[% l('Advanced Search') %]</a></span>
         <span class="browse_the_catalog_lbl"><a href="[% mkurl(ctx.opac_root _ '/browse', {}, expert_search_parms.merge(general_search_parms, facet_search_parms, ['fi:has_browse_entry'])) %]" rel="nofollow" vocab="">[% l('Browse the Catalog') %]</a></span>
@@ -14,7 +14,7 @@
         <span class='search_box_wrapper'>
             [%- # autosuggest breaks accessibility, as the aria-label
                 # attribute is removed when the Dijit is created. :(  %]
-            <label id="search_box_label" for="search_box">[% l('Search: ') %]
+            <label id="search_box_label" for="search_box">[% l('Search for: ') %]</label>
             <input type="text" id="search_box" name="query" aria-label="[%
                     l('Enter search query:');
                 %]" value="[% is_advanced ? ctx.naive_query_scrub(ctx.processed_search_query) : CGI.param('query') | html %]"
@@ -27,17 +27,17 @@
                 [%- ELSE -%]
                     [% IF basic_search != "f" %] autofocus [% END %] x-webkit-speech
                 [%- END # autosuggest enabled %] />
-            </label>
         </span>
-        <label id="search_qtype_label" for="qtype">
+		<br/>
+        <label id="search_qtype_label" for="qtype"></label>
         [%- 
-            l('Type: ');
+            l('Search by:&nbsp;');
             INCLUDE "opac/parts/qtype_selector.tt2" id="qtype";
         -%]
-        </label>
-        <label id="search_itype_label" for="search_itype_selector">
+        &nbsp; &nbsp; 
+        <label id="search_itype_label" for="search_itype_selector"></label>
         [%-
-            l('Format: ');
+            l('Limit to: ');
             IF search.basic_config.type == 'attr';
                 INCLUDE "opac/parts/coded_value_selector.tt2"
                     attr=search.basic_config.group none_ok=1 
@@ -50,25 +50,20 @@
                     none_label=search.basic_config.none_label;
             END;
         -%]
-        </label>
-        <label id="search_locg_label" for="search_org_selector">
+        &nbsp; &nbsp;
+        <label id="search_locg_label" for="search_org_selector"></label>
         [%- 
-            l('Library: ');
+            l('Search within: ');
             select_lib_label = l("Select search library");
             INCLUDE build_org_selector arialabel=select_lib_label 
               id='search_org_selector' show_loc_groups=1
         -%]
-        </label>
     <span>
     [%- IF (show_more_details.default == 'true' OR show_more_details.default == 'hide') AND !CGI.param('detail_record_view') %]
         <input id="detail" type="hidden" name="detail_record_view" value="1"/>
     [%- END %]
         <input id='search-submit-go' type="submit" value="[% l('Search') %]" class="opac-button"
-            onclick='setTimeout(function(){$("search-submit-spinner").className=""; $("search-submit-go").className="hidden";[% IF ctx.depth_sel_button AND NOT took_care_of_form %] $("search-submit-go-depth").className="hidden";[% END %]}, 2000)'/>
-        [%- IF ctx.depth_sel_button AND NOT took_care_of_form %]
-        <button id='search-submit-go-depth' type="submit" value="[% ctx.depth_sel_depth %]" name="depth" class="[% ctx.depth_sel_button_class %]"
-            onclick='setTimeout(function(){$("search-submit-spinner").className=""; $("search-submit-go").className="hidden"; $("search-submit-go-depth").className="hidden";}, 2000)' title="[% ctx.depth_sel_tooltip | html %]">[% ctx.depth_sel_button_label | html %]</button>
-        [%- END %]
+            onclick='setTimeout(function(){$("search-submit-spinner").className=""; $("search-submit-go").className="hidden"}, 2000)'/>
         <img id='search-submit-spinner' src='/opac/images/progressbar_green.gif' style='height:16px;width:16px;' class='hidden' alt='[% l("Search In Progress") %]'/>
     </span>
     </div>
-- 
2.11.0