From 8d86d3fe1d71797d671a13a9b10a6141936ed94e Mon Sep 17 00:00:00 2001
From: Dan Wells <dbw2@calvin.edu>
Date: Wed, 27 Feb 2013 09:34:58 -0500
Subject: [PATCH] Tweak Google Book Preview Display, Take 2

After some additional feedback, this commit makes three changes
to the Google Book preview link:

1) As a solution offered by Dan Scott, rather than move the
button, we simply scroll to the preview when the button is clicked.
This effectively makes it impossible to miss. (In the current
code it sometimes loads off the screen.)

2) Make the viewer display in the same style as other added
content.

3) Allow the added content header to function as an additional
toggle to turn the viewer on and off.

Signed-off-by: Dan Wells <dbw2@calvin.edu>
Signed-off-by: Ben Shum <bshum@biblio.org>
---
 .../src/templates/opac/parts/ac_google_books.tt2   | 40 +++++++++++++++++++---
 .../src/templates/opac/parts/record/extras.tt2     | 23 +++++++++++--
 2 files changed, 56 insertions(+), 7 deletions(-)

diff --git a/Open-ILS/src/templates/opac/parts/ac_google_books.tt2 b/Open-ILS/src/templates/opac/parts/ac_google_books.tt2
index 8243fe0738..3dbb5f988e 100644
--- a/Open-ILS/src/templates/opac/parts/ac_google_books.tt2
+++ b/Open-ILS/src/templates/opac/parts/ac_google_books.tt2
@@ -1,5 +1,6 @@
 <script type="text/javascript">
 var GBisbns = Array();
+var GBPreviewShowing = false;
 
 /**
  *
@@ -34,9 +35,11 @@ function GBPreviewCallback(GBPBookInfo) {
     GBPBadge.style.border = 0;
     GBPBadge.style.margin = '0.5em 0 0 0';
     GBPBadgelink = document.createElement('a');
-    GBPBadgelink.href = 'javascript:GBDisplayPreview();';
+    GBPBadgelink.id = 'gbpbadge_link';
+    GBPBadgelink.href = 'javascript:GBDisplayPreview(true);';
     GBPBadgelink.appendChild( GBPBadge );
     dojo.byId('rdetail_title_div').appendChild( GBPBadgelink );
+    unHideMe(dojo.byId('gbp_extra'));
   }
 }
 
@@ -44,7 +47,7 @@ function GBPreviewCallback(GBPBookInfo) {
  *  This is called when the user clicks on the 'Preview' link.  We assume
  *  a preview is available from Google if this link was made visible.
  */
-function GBDisplayPreview() {
+function GBDisplayPreview(scroll_to_div) {
   var GBPreviewPane = document.createElement('div');
   GBPreviewPane.id = 'rdetail_preview_div';
   GBPreviewPane.style.height = '800px';
@@ -52,19 +55,46 @@ function GBDisplayPreview() {
   GBPreviewPane.style.display = 'block';
   var GBClear = document.createElement('div');
   GBClear.style.padding = '1em';
-  dojo.byId('canvas_main').insertBefore(GBPreviewPane, dojo.byId('rdetail_record_details'));
-  dojo.byId('canvas_main').insertBefore(GBClear, dojo.byId('rdetail_record_details'));
+  dojo.byId('gbp_extra_container').appendChild(GBPreviewPane);
+  dojo.byId('gbp_extra_container').appendChild(GBClear);
   if (GBPreviewPane.getAttribute('loaded') == null || GBPreviewPane.getAttribute('loaded') == "false" ) {
      google.load("books", "0", {"callback" : GBPViewerLoadCallback, "language": "[% ctx.locale.substr(0,2) %]"} );
      GBPreviewPane.setAttribute('loaded', 'true');
   }
+  if (scroll_to_div) document.location.hash = '#gbp_extra';
 }
 
 function GBPViewerLoadCallback() {
   var GBPViewer = new google.books.DefaultViewer(dojo.byId('rdetail_preview_div'));
   GBPViewer.load('ISBN:' + GBisbns[0]);
   GBPViewer.resize();
-  dojo.byId('gbpbadge').style.display = 'none';
+  var GBPBadgelink = dojo.byId('gbpbadge_link');
+  GBPBadgelink.href = 'javascript:GBShowHidePreview(true);';
+  dojo.forEach(
+    dojo.byId('gbp_extra_links').getElementsByTagName('a'),
+    function(link) {
+      link.href = 'javascript:GBShowHidePreview();';
+    }
+  );
+  hideMe(dojo.byId('gbp_arrow_link'));
+  unHideMe(dojo.byId('gbp_arrow_down_link'));
+  GBPreviewShowing = true;
+}
+
+function GBShowHidePreview(from_button) {
+  if (!GBPreviewShowing) {
+    dojo.byId('gbp_extra_container').style.display = 'inherit';
+    hideMe(dojo.byId('gbp_arrow_link'));
+    unHideMe(dojo.byId('gbp_arrow_down_link'));
+    GBPreviewShowing = true;
+  } else if (!from_button) { // button can open, but shouldn't close
+    dojo.byId('gbp_extra_container').style.display = 'none';
+    unHideMe(dojo.byId('gbp_arrow_link'));
+    hideMe(dojo.byId('gbp_arrow_down_link'));
+    GBPreviewShowing = false;
+  }
+  // button should always scroll
+  if (from_button) document.location.hash = '#gbp_extra';
 }
 
 dojo.addOnLoad(function() {
diff --git a/Open-ILS/src/templates/opac/parts/record/extras.tt2 b/Open-ILS/src/templates/opac/parts/record/extras.tt2
index 54f36d92c3..a6100f14f2 100644
--- a/Open-ILS/src/templates/opac/parts/record/extras.tt2
+++ b/Open-ILS/src/templates/opac/parts/record/extras.tt2
@@ -1,5 +1,24 @@
+[%
+    arrow_img = ctx.media_prefix _ '/images/rdetail_arrow.png';
+    arrow_down_img = ctx.media_prefix _ '/images/rdetail_arrow_down.png';
+%]
 <div>
     <div id='rdetail_extras_div' style='width: 100%;'> 
+        [%
+            IF ctx.google_books_preview;
+                label = l('Google Preview');
+                name = 'google_preview';
+                href = 'javascript:GBDisplayPreview();';
+        %]
+        <div id="gbp_extra" class="rdetail_extras hide_me">
+            <div class="rdetail_extras_hr"></div>
+            <div id="gbp_extra_links" class="rdetail_extras_link">
+                <a id='gbp_arrow_link' name='[% name %]' href='[% href %]'><img alt='[% label %]' src='[% arrow_img %]'/></a>
+                <a id='gbp_arrow_down_link' name='[% name %]' href='[% href %]' class='hide_me'><img alt='[% label %]' src='[% arrow_down_img %]'/></a>
+                <a name='[% name %]_lbl' href='[% href %]' class="rdetail_extras_lbl">[% label %]</a></div>
+        </div>
+        <div id="gbp_extra_container" class='rdetail_extras_div'></div>
+        [%  END %]
 
         [%  # Hidden extras are not yet implemented.  Some may require JS
 
@@ -56,14 +75,14 @@
                 [%  
                     IF tab_is_active(name);
                         href = mkurl('', {}, ['expand', 'ac']);
-                        img_url = ctx.media_prefix _ '/images/rdetail_arrow_down.png';
+                        img_url = arrow_down_img;
                     ELSE;
                         IF name == 'addedcontent' AND default_ac;
                             href = mkurl('', {expand => name, ac => default_ac}) _ '#' _ name; 
                         ELSE;
                             href = mkurl('', {expand => name}) _ '#' _ name; 
                         END;
-                        img_url = ctx.media_prefix _ '/images/rdetail_arrow.png';
+                        img_url = arrow_img;
                     END;
                 %]
                 <a name='[% name %]' href='[% href %]'><img alt='[% extra.label %]' src='[% img_url %]'/></a>
-- 
2.11.0