Restore facet-first loading, add breakpoint for results

Facet first loading should be faster on slow servers, so do that rather
than loading them after the results and forcing a page render when we
dump them into place on wide screens.

Also add an 800px breakpoint to prevent results from getting pushed
underneath the facets; at 800px, we go into "hide facets" mode instead.
This gets picked up by the 600px breakpoint, so it's all good.

Signed-off-by: Dan Scott <dscott@laurentian.ca>
Signed-off-by: Lebbeous Fogle-Weekley <lebbeous@esilibrary.com>
Signed-off-by: Dan Wells <dbw2@calvin.edu>

diff --git a/Open-ILS/src/templates/opac/css/style.css.tt2 b/Open-ILS/src/templates/opac/css/style.css.tt2
index 491802a..95d5568 100644 (file)
--- a/Open-ILS/src/templates/opac/css/style.css.tt2
+++ b/Open-ILS/src/templates/opac/css/style.css.tt2
@@ -1007,9 +1007,6 @@ div.adv_search_available {
 .facetFieldLineValue { overflow: hidden; text-overflow: ellipsis; }
 [%- END -%]
 
-div#result_block {
-    float: left;
-}
 div#facet_sidebar {
     float: left;
     border-right: 1px solid [% css_colors.border_standard %];
@@ -1679,6 +1676,19 @@ a.preflib_change {
     font-size: [% css_fonts.size_bigger %];
 }
 
+@media only screen and (max-width: 800px) {
+    .facet_sidebar_hidden, .result_block_hidden {
+        display: none;
+    }
+    .facet_sidebar_visible, .result_block_visible {
+        display: inline;
+    }
+    #refine_hits, #return_to_hits {
+        display: block;
+        padding-left: 15px;
+    }
+}
+
 @media only screen and (max-width: 600px) {
     input, select {
         font-size: [% css_fonts.size_big %];
@@ -1914,16 +1924,6 @@ a.preflib_change {
     #facet_sidebar {
         margin-top: 0.5em;
     }
-    .facet_sidebar_hidden, .result_block_hidden {
-        display: none;
-    }
-    .facet_sidebar_visible, .result_block_visible {
-        display: visible;
-    }
-    #refine_hits, #return_to_hits {
-        display: block;
-        padding-left: 15px;
-    }
     #adv_search_parent {
         font-size: [% css_fonts.size_smaller %];
     }

diff --git a/Open-ILS/src/templates/opac/parts/result/table.tt2 b/Open-ILS/src/templates/opac/parts/result/table.tt2
index f2bb4b8..4c7f7ed 100644 (file)
--- a/Open-ILS/src/templates/opac/parts/result/table.tt2
+++ b/Open-ILS/src/templates/opac/parts/result/table.tt2
@@ -20,6 +20,11 @@
 </div>
 [% END %]
 <div id="result_table_div">
+    <div class="facet_sidebar_hidden" id="facet_sidebar">
+        <div id="return_to_hits"><a onclick="getResulty();">[% l('Back to results') %]</a></div>
+    [% INCLUDE "opac/parts/staff_saved_searches.tt2" %]
+    [% INCLUDE 'opac/parts/result/facets.tt2' %]
+    </div>
             <div id="result_block" class="result_block_visible">
                 <div id="refine_hits"><a onclick="getFacety();">[% l('Refine these results') %]</a></div>
                 <table cellpadding="0" cellspacing="0"
@@ -354,11 +359,6 @@ END;
                     </tbody>
                 </table>
             </div>
-    <div class="facet_sidebar_hidden" id="facet_sidebar">
-        <div id="return_to_hits"><a onclick="getResulty();">[% l('Back to results') %]</a></div>
-    [% INCLUDE "opac/parts/staff_saved_searches.tt2" %]
-    [% INCLUDE 'opac/parts/result/facets.tt2' %]
-    </div>
 </div>
 <div class="result_footer_nav1">
     [% ctx.results_count_header %]
@@ -376,14 +376,4 @@ function getResulty() {
     facetSidebar.setAttribute('class', 'facet_sidebar_hidden');
     window.location.hash = 'result_block';
 }
-function moveFacets() {
-    var clientWidth = document.documentElement.clientWidth;
-    if (clientWidth >= 600) {
-        if (resultBlock && facetSidebar) {
-            resultBlock.parentNode.insertBefore(facetSidebar, resultBlock);
-        }
-    }
-}
-window.onresize = moveFacets;
-window.onload = moveFacets;
 </script>