Material PDF: Fix inconsistent behaviour in page selector, update styling

chrome/browser/resources/pdf/pdf.js

 // Copyright 2013 The Chromium Authors. All rights reserved.
 // Use of this source code is governed by a BSD-style license that can be
 // found in the LICENSE file.
 
 'use strict';
 
 /**
  * @return {number} Width of a scrollbar in pixels
  */
 function getScrollbarWidth() {
@@ skipping 34 matching lines @@
 function onNavigateInNewTab(url) {
   // Prefer the tabs API because it guarantees we can just open a new tab.
   // window.open doesn't have this guarantee.
   if (chrome.tabs)
     chrome.tabs.create({ url: url});
   else
     window.open(url);
 }
 
 /**
+ * Whether keydown events should currently be ignored. Events are ignored when
+ * an editable element has focus, to allow for proper editing controls.
+ * @param {HTMLElement} activeElement The currently selected DOM node.
+ * @return {boolean} True if keydown events should be ignored.
+ */
+function shouldIgnoreKeyEvents(activeElement) {
+  while (activeElement.shadowRoot != null &&
+         activeElement.shadowRoot.activeElement != null) {
+    activeElement = activeElement.shadowRoot.activeElement;
+  }
+
+  return (activeElement.isContentEditable ||
+          activeElement.tagName == 'INPUT' ||
+          activeElement.tagName == 'TEXTAREA');
+}
+
+/**
  * The minimum number of pixels to offset the toolbar by from the bottom and
  * right side of the screen.
  */
 PDFViewer.MIN_TOOLBAR_OFFSET = 15;
 
 /**
  * Creates a new PDFViewer. There should only be one of these objects per
  * document.
  * @constructor
  * @param {!BrowserApi} browserApi An object providing an API to the browser.
@@ skipping 134 matching lines @@
    * @private
    * Handle key events. These may come from the user directly or via the
    * scripting API.
    * @param {KeyboardEvent} e the event to handle.
    */
   handleKeyEvent_: function(e) {
     var position = this.viewport_.position;
     // Certain scroll events may be sent from outside of the extension.
     var fromScriptingAPI = e.fromScriptingAPI;
 
+    if (shouldIgnoreKeyEvents(document.activeElement) || e.defaultPrevented)
+      return;
+
     var pageUpHandler = function() {
       // Go to the previous page if we are fit-to-page.
       if (this.viewport_.fittingType == Viewport.FittingType.FIT_TO_PAGE) {
         this.viewport_.goToPage(this.viewport_.getMostVisiblePage() - 1);
         // Since we do the movement of the page.
         e.preventDefault();
       } else if (fromScriptingAPI) {
         position.y -= this.viewport.size.height;
         this.viewport.position = position;
       }
@@ skipping 397 matching lines @@
       // Hide the toolbar if it doesn't fit in the viewport.
       if (this.toolbar_.offsetLeft < 0 || this.toolbar_.offsetTop < 0)
         this.toolbar_.style.visibility = 'hidden';
       else
         this.toolbar_.style.visibility = 'visible';
     }
 
     // Update the page indicator.
     var visiblePage = this.viewport_.getMostVisiblePage();
     if (this.isMaterial_) {
-      this.materialToolbar_.pageIndex = visiblePage;
+      this.materialToolbar_.pageNo = visiblePage + 1;
     } else {
       this.pageIndicator_.index = visiblePage;
       if (this.documentDimensions_.pageDimensions.length > 1 &&
           hasScrollbars.vertical) {
         this.pageIndicator_.style.visibility = 'visible';
       } else {
         this.pageIndicator_.style.visibility = 'hidden';
       }
     }
 
@@ skipping 120 matching lines @@
    * Each bookmark is an Object containing a:
    * - title
    * - page (optional)
    * - array of children (themselves bookmarks)
    * @type {Array} the top-level bookmarks of the PDF.
    */
   get bookmarks() {
     return this.bookmarks_;
   }
 };