Refactor nav bar hide/show
authorMichael Ang <mang@archive.org>
Sat, 2 Oct 2010 00:05:02 +0000 (00:05 +0000)
committerMichael Ang <mang@archive.org>
Sat, 2 Oct 2010 00:05:02 +0000 (00:05 +0000)
BookReader/BookReader.js
BookReaderIA/inc/BookReader.inc

index e7f4103..9c430dc 100644 (file)
@@ -157,13 +157,23 @@ BookReader.prototype.init = function() {
     $("#BookReader").empty();
         
     this.initToolbar(this.mode, this.ui); // Build inside of toolbar div
+    
     $("#BookReader").append("<div id='BRcontainer'></div>");
     $("#BRcontainer").append("<div id='BRpageview'></div>");
+    
+    this.initNavbar();
+    this.bindNavigationHandlers();
+    
+    // Autohide nav after showing for awhile
+    var self = this;
+    $(window).bind('load', function() {
+        setTimeout(function() { self.hideNavigation(); }, 3000);
+    });
 
     $("#BRcontainer").bind('scroll', this, function(e) {
         e.data.loadLeafs();
     });
-        
+    
     this.setupKeyListeners();
     this.startLocationPolling();
 
@@ -235,6 +245,8 @@ BookReader.prototype.init = function() {
         
     // Enact other parts of initial params
     this.updateFromParams(params);
+    
+    //XXXmang window.setTimeout(self.hideNavigation, 3000);
 }
 
 BookReader.prototype.setupKeyListeners = function() {
@@ -3526,6 +3538,73 @@ BookReader.prototype.updateToolbarZoom = function(reduce) {
     $('#BRzoom').text(value);
 }
 
+// bindNavigationHandlers
+//______________________________________________________________________________
+// Bind navigation handlers
+BookReader.prototype.bindNavigationHandlers = function() {
+    $('#BookReader').die('mousemove.navigation').live('mousemove.navigation',
+        { 'br': this },
+        this.navigationMousemoveHandler
+    );
+}
+
+// unbindNavigationHandlers
+//______________________________________________________________________________
+// Unbind navigation handlers
+BookReader.prototype.unbindNavigationHandlers = function() {
+    $('#BookReader').die('mousemove.navigation');
+}
+
+// navigationMousemoveHandler
+//______________________________________________________________________________
+// Handle mousemove related to navigation.  Bind at #BookReader level to allow autohide.
+BookReader.prototype.navigationMousemoveHandler = function(event) {
+    // $$$ possibly not great to be calling this for every mousemove
+    var navkey = $(document).height() - 75;
+    if ((event.pageY < 76) || (event.pageY > navkey)) {
+        // inside or near navigation elements
+        event.data['br'].hideNavigation();
+    } else {
+        event.data['br'].showNavigation();
+    }
+}
+
+// navigationIsVisible
+//______________________________________________________________________________
+// Returns true if the navigation elements are currently visible
+BookReader.prototype.navigationIsVisible = function() {
+    // $$$ doesn't account for transitioning states, nav must be fully visible to return true
+    var toolpos = $('#BRtoolbar').offset();
+    var tooltop = toolpos.top;
+    if (tooltop == 0) {
+        return true;
+    }
+    return false;
+}
+
+// hideNavigation
+//______________________________________________________________________________
+// Hide navigation elements, if visible
+BookReader.prototype.hideNavigation = function() {
+    // Check if navigation is showing
+    if (this.navigationIsVisible()) {
+        // $$$ don't hardcode height
+        $('#BRtoolbar').animate({top:-60});
+        $('#BRnav').animate({bottom:-60});
+    }
+}
+
+// showNavigation
+//______________________________________________________________________________
+// Show navigation elements
+BookReader.prototype.showNavigation = function() {
+    // Check if navigation is hidden
+    if (!this.navigationIsVisible()) {
+        $('#BRtoolbar').animate({top:0});
+        $('#BRnav').animate({bottom:0});
+    }
+}
+
 // firstDisplayableIndex
 //______________________________________________________________________________
 // Returns the index of the first visible page, dependent on the mode.
index a0638fd..3547aaf 100644 (file)
@@ -215,61 +215,11 @@ class BookReader
 <!-- The script included below is dynamically generated JavaScript that includes the book metadata and page image access functions -->
 <script type="text/javascript" src="<? echo($metaURL); ?>"></script>
 
-<? if ($uiMode == 'XXXmang was full') { ?>
-<div id="BookReaderSearch" style="width:190px; right:0px; top:10px; bottom:2em;">
-    <form action='javascript:' onsubmit="br.search($('#BookReaderSearchBox').val());">
-        <p style="display: inline">
-            <input id="BookReaderSearchBox" type="text" size="20" value="search..." onfocus="if('search...'==this.value)this.value='';" /><input type="submit" value="go" />
-        </p>
-    </form>
-    <div id="BookReaderSearchResults">
-        Search results
-    </div>
-</div>
-
-
-<div id="BRfooter">
-    <div class="BRlogotype">
-        <a href="http://archive.org/" class="BRblack">Internet Archive</a>
-    </div>
-    <div class="BRnavlinks">
-        <!-- <a class="BRblack" href="http://openlibrary.org/dev/docs/bookreader">About the Bookreader</a> | -->
-        <a class="BRblack" href="http://www.archive.org/about/faqs.php#Report_Item">Content Problems</a> |
-        <a class="BRblack" href="https://bugs.launchpad.net/bookreader/+filebug">Report Bugs</a> |
-        <a class="BRblack" href="http://www.archive.org/details/texts">Texts Collection</a> |
-        <a class="BRblack" href="http://www.archive.org/about/contact.php">Contact Us</a>
-    </div>
-</div>
-<? } /* uiMode */ ?>
-
 <script type="text/javascript">
     // $$$ hack to workaround sizing bug when starting in two-up mode
     $(document).ready(function() {
         $(window).trigger('resize');
-    });
-    
-    //XXXmang
-   function hideFace() {
-        $('#BookReader').die('mousemove').live('mousemove',function(event) {
-            var toolpos = $('#BRtoolbar').offset();
-            var tooltop = toolpos.top;
-            var navkey = $(document).height() - 75;
-            if ((event.pageY < 76) || (event.pageY > navkey)) {
-                if (tooltop == -60) {
-                    $('#BRtoolbar').animate({top:'0'});
-                    $('#BRnav').animate({bottom:'0'});
-                };
-            } else if ($('.bt-wrapper').size() == 0) {
-                if (tooltop == 0) {
-                    $('#BRtoolbar').animate({top:'-60'});
-                    $('#BRnav').animate({bottom:'-60'});
-                }
-            };
-        });
-    };
-    window.onload = function() {
-        window.setTimeout(hideFace, 3000);
-    };
+    });    
 </script>
   <?
     exit;