Implement basic toolbar with Material Design and loading progress.

chrome/browser/resources/pdf/viewport.js

 // Copyright 2014 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.
 
 /**
  * Returns the height of the intersection of two rectangles.
  * @param {Object} rect1 the first rect
  * @param {Object} rect2 the second rect
  * @return {number} the height of the intersection of the rects
  */
 function getIntersectionHeight(rect1, rect2) {
   return Math.max(0,
       Math.min(rect1.y + rect1.height, rect2.y + rect2.height) -
       Math.max(rect1.y, rect2.y));
 }
 
 /**
  * Create a new viewport.
  * @constructor
  * @param {Window} window the window
  * @param {Object} sizer is the element which represents the size of the
  *     document in the viewport
  * @param {Function} viewportChangedCallback is run when the viewport changes
  * @param {Function} beforeZoomCallback is run before a change in zoom
  * @param {Function} afterZoomCallback is run after a change in zoom
  * @param {number} scrollbarWidth the width of scrollbars on the page
+ * @param {number} yPos the offset of the viewport from the top of the window
  */
 function Viewport(window,
                   sizer,
                   viewportChangedCallback,
                   beforeZoomCallback,
                   afterZoomCallback,
-                  scrollbarWidth) {
+                  scrollbarWidth,
+                  yPos) {
   this.window_ = window;
   this.sizer_ = sizer;
   this.viewportChangedCallback_ = viewportChangedCallback;
   this.beforeZoomCallback_ = beforeZoomCallback;
   this.afterZoomCallback_ = afterZoomCallback;
   this.allowedToChangeZoom_ = false;
   this.zoom_ = 1;
   this.documentDimensions_ = null;
   this.pageDimensions_ = [];
   this.scrollbarWidth_ = scrollbarWidth;
   this.fittingType_ = Viewport.FittingType.NONE;
+  this.yPos = yPos;
 
   window.addEventListener('scroll', this.updateViewport_.bind(this));
   window.addEventListener('resize', this.resize_.bind(this));
 }
 
 /**
  * Enumeration of page fitting types.
  * @enum {string}
  */
 Viewport.FittingType = {
@@ skipping 75 matching lines @@
 
   /**
    * @private
    * Helper function called when the zoomed document size changes.
    */
   contentSizeChanged_: function() {
     if (this.documentDimensions_) {
       this.sizer_.style.width =
           this.documentDimensions_.width * this.zoom_ + 'px';
       this.sizer_.style.height =
-          this.documentDimensions_.height * this.zoom_ + 'px';
+          this.documentDimensions_.height * this.zoom_ + this.yPos + 'px';
     }
   },
 
   /**
    * @private
    * Called when the viewport should be updated.
    */
   updateViewport_: function() {
     this.viewportChangedCallback_();
   },
@@ skipping 390 matching lines @@
     spaceOnLeft = Math.max(spaceOnLeft, 0);
 
     return {
       x: x * this.zoom_ + spaceOnLeft - this.window_.pageXOffset,
       y: insetDimensions.y * this.zoom_ - this.window_.pageYOffset,
       width: insetDimensions.width * this.zoom_,
       height: insetDimensions.height * this.zoom_
     };
   }
 };