call ttsStop() when jumpToPageIndex or left/right click handlers are called.
[bookreader.git] / BookReader / BookReader.js
index f5ec49d..e63417d 100644 (file)
@@ -1239,6 +1239,8 @@ BookReader.prototype.jumpToIndex = function(index, pageX, pageY) {
 
     this.willChangeToIndex(index);
 
+    this.ttsStop();
+
     if (this.constMode2up == this.mode) {
         this.autoStop();
         
@@ -1344,8 +1346,6 @@ BookReader.prototype.switchMode = function(mode) {
         this.reduce = this.quantizeReduce(this.reduce, this.onePage.reductionFactors);
         this.prepareOnePageView();
     } else if (3 == mode) {
-        $('button.thumb').hide();
-        $('button.twopg').show();
         this.reduce = this.quantizeReduce(this.reduce, this.reductionFactors);
         this.prepareThumbnailView();
     } else {
@@ -2647,7 +2647,7 @@ BookReader.prototype.search = function(term) {
     this.searchTerm = term;
     
     this.removeSearchResults();
-    this.showProgressPopup();
+    this.showProgressPopup('<img id="searchmarker" src="'+this.imagesBaseURL + 'marker_srch-on.png'+'"> Search results will appear below...');
     this.ttsAjax = $.ajax({url:url, dataType:'jsonp', jsonpCallback:'BRSearchCallback'});    
 }
 
@@ -2660,6 +2660,17 @@ function BRSearchCallback(results) {
     br.removeSearchResults();
     br.searchResults = results; 
     //console.log(br.searchResults);
+    
+    if (0 == results.matches.length) {
+        $(br.popup).text('No matches were found.');
+        setTimeout(function(){
+            $(br.popup).fadeOut('slow', function() {
+                br.removeProgressPopup();
+            })        
+        },1000);
+        return;
+    }
+    
     var i;    
     for (i=0; i<results.matches.length; i++) {        
         br.addSearchResult(results.matches[i].text, br.leafNumToIndex(results.matches[i].par[0].page));
@@ -3362,10 +3373,13 @@ BookReader.prototype.initNavbar = function() {
     .append('<div id="pagenum"><span class="currentpage"></span></div>');
     //.wrap('<div class="ui-handle-helper-parent"></div>').parent(); // XXXmang is this used for hiding the tooltip?
     
+    // $$$mang, why are these set both here and in bindNavigationHandlers?
     $('.BRicon.book_left').bind('click', function() {
+        self.ttsStop();
         self.left();
     });
     $('.BRicon.book_right').bind('click', function() {
+        self.ttsStop();
         self.right();
     });
     
@@ -3414,7 +3428,7 @@ BookReader.prototype.addSearchResult = function(queryString, pageIndex) {
     var re = new RegExp('{{{(.+?)}}}', 'g');    
     queryString = queryString.replace(re, '<a href="#" onclick="br.jumpToIndex('+pageIndex+'); return false;">$1</a>')
 
-    $('<div class="search" style="left:' + percentThrough + ';" title="' + uiStringSearch + '"><div class="query">'
+    var marker = $('<div class="search" style="top:'+(-$('#BRcontainer').height())+'px; left:' + percentThrough + ';" title="' + uiStringSearch + '"><div class="query">'
         + queryString + '<span>' + uiStringPage + ' ' + pageNumber + '</span></div>')
     .data({'self': this, 'pageIndex': pageIndex })
     .appendTo('#BRnavline').bt({
@@ -3460,6 +3474,8 @@ BookReader.prototype.addSearchResult = function(queryString, pageIndex) {
     .bind('click', function() {
         $(this).data('self').jumpToIndex($(this).data('pageIndex'));
     });
+    
+    $(marker).animate({top:'-25px'}, 'slow');
 
 }
 
@@ -3627,8 +3643,9 @@ BookReader.prototype.initToolbar = function(mode, ui) {
     
     // We build in mode 2
     jToolbar.append();
-
-    this.bindToolbarNavHandlers(jToolbar);
+    
+    // Navigation handlers will be bound after all UI is in place -- makes moving icons between
+    // the toolbar and nav bar easier
     
     // Setup tooltips -- later we could load these from a file for i18n
     var titles = { '.logo': 'Go to Archive.org',
@@ -3710,24 +3727,67 @@ BookReader.prototype.switchToolbarMode = function(mode) {
     }
 }
 
-// bindToolbarNavHandlers
+// updateToolbarZoom(reduce)
 //______________________________________________________________________________
-// Binds the toolbar handlers
-BookReader.prototype.bindToolbarNavHandlers = function(jToolbar) {
+// Update the displayed zoom factor based on reduction factor
+BookReader.prototype.updateToolbarZoom = function(reduce) {
+    var value;
+    var autofit = null;
+
+    // $$$ TODO preserve zoom/fit for each mode
+    if (this.mode == this.constMode2up) {
+        autofit = this.twoPage.autofit;
+    } else {
+        autofit = this.onePage.autofit;
+    }
+    
+    if (autofit) {
+        value = autofit.slice(0,1).toUpperCase() + autofit.slice(1);
+    } else {
+        value = (100 / reduce).toFixed(2);
+        // Strip trailing zeroes and decimal if all zeroes
+        value = value.replace(/0+$/,'');
+        value = value.replace(/\.$/,'');
+        value += '%';
+    }
+    $('#BRzoom').text(value);
+}
+
+// bindNavigationHandlers
+//______________________________________________________________________________
+// Bind navigation handlers
+BookReader.prototype.bindNavigationHandlers = function() {
 
     var self = this; // closure
+    jIcons = $('.BRicon');
+
+    jIcons.filter('.onepg').bind('click', function(e) {
+        self.switchMode(self.constMode1up);
+    });
+    
+    jIcons.filter('.twopg').bind('click', function(e) {
+        self.switchMode(self.constMode2up);
+    });
+
+    jIcons.filter('.thumb').bind('click', function(e) {
+        self.switchMode(self.constModeThumb);
+    });
+    
+    jIcons.filter('.fit').bind('fit', function(e) {
+        // XXXmang implement autofit zoom
+    });
 
-    jToolbar.find('.book_left').click(function(e) {
+    jIcons.filter('.book_left').click(function(e) {
         self.left();
         return false;
     });
          
-    jToolbar.find('.book_right').click(function(e) {
+    jIcons.filter('.book_right').click(function(e) {
         self.right();
         return false;
     });
         
-    jToolbar.find('.book_up').bind('click', function(e) {
+    jIcons.filter('.book_up').bind('click', function(e) {
         if ($.inArray(self.mode, [self.constMode1up, self.constModeThumb]) >= 0) {
             self.scrollUp();
         } else {
@@ -3736,7 +3796,7 @@ BookReader.prototype.bindToolbarNavHandlers = function(jToolbar) {
         return false;
     });        
         
-    jToolbar.find('.book_down').bind('click', function(e) {
+    jIcons.filter('.book_down').bind('click', function(e) {
         if ($.inArray(self.mode, [self.constMode1up, self.constModeThumb]) >= 0) {
             self.scrollDown();
         } else {
@@ -3745,103 +3805,71 @@ BookReader.prototype.bindToolbarNavHandlers = function(jToolbar) {
         return false;
     });
 
-    jToolbar.find('.print').click(function(e) {
+    jIcons.filter('.print').click(function(e) {
         self.printPage();
         return false;
     });
         
-    jToolbar.find('.embed').click(function(e) {
+    jIcons.filter('.embed').click(function(e) {
         self.showEmbedCode();
         return false;
     });
 
-    jToolbar.find('.bookmark').click(function(e) {
+    jIcons.filter('.bookmark').click(function(e) {
         self.showBookmarkCode();
         return false;
     });
 
-    jToolbar.find('.play').click(function(e) {
+    jIcons.filter('.play').click(function(e) {
         self.autoToggle();
         return false;
     });
 
-    jToolbar.find('.pause').click(function(e) {
+    jIcons.filter('.pause').click(function(e) {
         self.autoToggle();
         return false;
     });
     
-    jToolbar.find('.book_top').click(function(e) {
+    jIcons.filter('.book_top').click(function(e) {
         self.first();
         return false;
     });
 
-    jToolbar.find('.book_bottom').click(function(e) {
+    jIcons.filter('.book_bottom').click(function(e) {
         self.last();
         return false;
     });
     
-    jToolbar.find('.book_leftmost').click(function(e) {
+    jIcons.filter('.book_leftmost').click(function(e) {
         self.leftmost();
         return false;
     });
   
-    jToolbar.find('.book_rightmost').click(function(e) {
+    jIcons.filter('.book_rightmost').click(function(e) {
         self.rightmost();
         return false;
     });
 
-    jToolbar.find('.read').click(function(e) {
+    jIcons.filter('.read').click(function(e) {
         self.ttsToggle();
         return false;
     });
     
-    // $$$mang cleanup
-    $('#BRpage .zoom_in').bind('click', function() {
+    jIcons.filter('.zoom_in').bind('click', function() {
         self.zoom(1);
         return false;
     });
     
-    $('#BRpage .zoom_out').bind('click', function() {
+    jIcons.filter('.zoom_out').bind('click', function() {
         self.zoom(-1);
         return false;
     });
     
+    // XXX fix integration
     $('#booksearch').bind('submit', function() {
         self.search($('#textSrch').val());
     });
-    
-}
 
-// updateToolbarZoom(reduce)
-//______________________________________________________________________________
-// Update the displayed zoom factor based on reduction factor
-BookReader.prototype.updateToolbarZoom = function(reduce) {
-    var value;
-    var autofit = null;
-
-    // $$$ TODO preserve zoom/fit for each mode
-    if (this.mode == this.constMode2up) {
-        autofit = this.twoPage.autofit;
-    } else {
-        autofit = this.onePage.autofit;
-    }
-    
-    if (autofit) {
-        value = autofit.slice(0,1).toUpperCase() + autofit.slice(1);
-    } else {
-        value = (100 / reduce).toFixed(2);
-        // Strip trailing zeroes and decimal if all zeroes
-        value = value.replace(/0+$/,'');
-        value = value.replace(/\.$/,'');
-        value += '%';
-    }
-    $('#BRzoom').text(value);
-}
-
-// bindNavigationHandlers
-//______________________________________________________________________________
-// Bind navigation handlers
-BookReader.prototype.bindNavigationHandlers = function() {
     $('#BookReader').die('mousemove.navigation').live('mousemove.navigation',
         { 'br': this },
         this.navigationMousemoveHandler
@@ -4407,7 +4435,7 @@ BookReader.util = {
 BookReader.prototype.ttsToggle = function () {
     if (false == this.ttsPlaying) {
         this.ttsPlaying = true;
-        this.showProgressPopup();    
+        this.showProgressPopup('Loading audio...');    
         if(soundManager.supported()) {
             this.ttsStart();            
         } else {               
@@ -4480,7 +4508,7 @@ BookReader.prototype.ttsStartCB = function (data) {
         return;
     }
     
-    this.showProgressPopup();
+    this.showProgressPopup('Loading audio...');
     
     ///// whileloading: broken on safari
     ///// onload fires on safari, but *after* the sound starts playing..
@@ -4500,21 +4528,31 @@ BookReader.prototype.ttsStartCB = function (data) {
 
 // showProgressPopup
 //______________________________________________________________________________
-BookReader.prototype.showProgressPopup = function() {
+BookReader.prototype.showProgressPopup = function(msg) {
     if (soundManager.debugMode) console.log('showProgressPopup index='+this.ttsIndex+' pos='+this.ttsPosition);
     if (this.popup) return;
     
     this.popup = document.createElement("div");
     $(this.popup).css({
-        top:      $('#BRtoolbar').height() + 'px',
-        left:     $('#BookReader').width()-220 + 'px',
-        width:    '220px',
-        height:   '20px',
-    }).attr('className', 'BRprogresspopup').appendTo('#BookReader');
+        top:      ($('#BookReader').height()*0.5-100) + 'px',
+        left:     ($('#BookReader').width()-300)*0.5 + 'px',
+        width:    '300px',
+        border:   '2px solid black'
+    }).attr('className', 'BRprogresspopup');
 
-    htmlStr =  '&nbsp;';
+    var bar = document.createElement("div");
+    $(bar).css({
+        height:   '20px'
+    }).attr('className', 'BRprogressbar');
+    $(this.popup).append(bar);
 
-    this.popup.innerHTML = htmlStr;
+    if (msg) {
+        var msgdiv = document.createElement("div");
+        msgdiv.innerHTML = msg;
+        $(this.popup).append(msgdiv);
+    }
+    
+    $(this.popup).appendTo('#BookReader');
 }
 
 // removeProgressPopup
@@ -4821,21 +4859,21 @@ BookReader.prototype.ttsStartPolling = function () {
     };
     $().ready(function(){
         $('#BRtoolbar').animate({top:0},3000).animate({top:-40});
-        $('#BRnav').animate({bottom:0},3000).animate({bottom:-40});
+        $('#BRnav').animate({bottom:0},3000).animate({bottom:-53});
         changeArrow();
-        $('.BRnavCntl').animate({opacity:1},4000).animate({opacity:.25},1000);
+        $('.BRnavCntl').animate({opacity:1},3000).animate({height:'43px'}).animate({opacity:1},1000).animate({opacity:.25},1000);
         $('.BRnavCntl').click(
             function(){
                 if ($('#BRnavCntlBtm').hasClass('BRdn')) {
                     $('#BRtoolbar').animate({top:-40});
-                    $('#BRnav').animate({bottom:-40});
+                    $('#BRnav').animate({bottom:-53});
                     $('#BRnavCntlBtm').addClass('BRup').removeClass('BRdn');
-                    $('.BRnavCntl').animate({opacity:1},1000).animate({opacity:.25},1000);
+                    $('.BRnavCntl').animate({height:'43px'}).animate({opacity:1},1000).animate({opacity:.25},1000);
                 } else {
                     $('#BRtoolbar').animate({top:0});
                     $('#BRnav').animate({bottom:0});
                     $('#BRnavCntlBtm').addClass('BRdn').removeClass('BRup');
-                    $('.BRnavCntl').animate({opacity:1});
+                    $('.BRnavCntl').animate({opacity:1,height:'30px'});
                 };
             }
         );