Implement basic toolbar with Material Design and loading progress.

chrome/browser/resources/pdf/viewport.js

Index: chrome/browser/resources/pdf/viewport.js
diff --git a/chrome/browser/resources/pdf/viewport.js b/chrome/browser/resources/pdf/viewport.js
index 6fac2f197695eeb12c21173835d54cb814dfe3a6..68c9cb33bb800b3307282a2abe63237007aabe4e 100644
--- a/chrome/browser/resources/pdf/viewport.js
+++ b/chrome/browser/resources/pdf/viewport.js
@@ -41,6 +41,8 @@ function Viewport(window,
   this.pageDimensions_ = [];
   this.scrollbarWidth_ = scrollbarWidth;
   this.fittingType_ = Viewport.FittingType.NONE;
+  var toolbar = $('pdf-toolbar');
+  this.toolbarHeight_ = (toolbar) ? toolbar.clientHeight : 0;

[raymes, 2015/01/09 04:15:10]

Can we pass the toolbar height into the viewport. Don't call it toolbarHeight
though, maybe call it yPos or something.

[Alexandre Carlton, 2015/01/12 06:33:57]

Done.

 
   window.addEventListener('scroll', this.updateViewport_.bind(this));
   window.addEventListener('resize', this.resize_.bind(this));
@@ -134,9 +136,11 @@ Viewport.prototype = {
   contentSizeChanged_: function() {
     if (this.documentDimensions_) {
       this.sizer_.style.width =
-          this.documentDimensions_.width * this.zoom_ + 'px';
+          this.documentDimensions_.width * this.zoom_ +
+          this.toolbarHeight_ + 'px';

[raymes, 2015/01/09 04:15:10]

We shouldn't need to adjust the width

[Alexandre Carlton, 2015/01/12 06:33:57]

Done.

       this.sizer_.style.height =
-          this.documentDimensions_.height * this.zoom_ + 'px';
+          this.documentDimensions_.height * this.zoom_ +
+          this.toolbarHeight_ + 'px';
     }
   },