#364 When positioning fixed elements exclude footnote area.

danfickle · Aug 1, 2021 · c134383 · c134383
1 parent d33008f
commit c134383
Show file tree

Hide file tree

Showing 3 changed files with 37 additions and 10 deletions.
diff --git a/openhtmltopdf-core/src/main/java/com/openhtmltopdf/layout/Layer.java b/openhtmltopdf-core/src/main/java/com/openhtmltopdf/layout/Layer.java
@@ -817,7 +817,7 @@ private void paintLayerBackgroundAndBorder(RenderingContext c) {
     }
 
     public void positionFixedLayer(RenderingContext c) {
-        Rectangle rect = c.getFixedRectangle();
+        Rectangle rect = c.getFixedRectangle(true);
 
         Box fixed = getMaster();
 

diff --git a/openhtmltopdf-core/src/main/java/com/openhtmltopdf/render/RenderingContext.java b/openhtmltopdf-core/src/main/java/com/openhtmltopdf/render/RenderingContext.java
@@ -144,7 +144,13 @@ public FSCanvas getCanvas() {
         return sharedContext.getCanvas();
     }
 
-    public Rectangle getFixedRectangle() {
+    /**
+     * Get the document (for non-paged docs) or page rect where
+     * fixed position boxes should be layed out. Generally we want to set
+     * <code>excludeFloatBottomArea</code> true so fixed content doesn't sit
+     * above footnotes.
+     */
+    public Rectangle getFixedRectangle(boolean excludeFloatBottomArea) {
         if (!outputDevice.isPDF() && !isPaged()) {
             return new Rectangle(
                  -this.page.getMarginBorderPadding(this, CalculatedStyle.LEFT),
@@ -162,21 +168,40 @@ public Rectangle getFixedRectangle() {
         if (! isPrint()) {
             result = sharedContext.getFixedRectangle();
         } else {
-            result = new Rectangle(0, -this.page.getTop(), 
+            if (excludeFloatBottomArea &&
+                this.page.getFootnoteAreaHeight() > 0 &&
+                !this.page.isFootnoteReserved(this)) {
+
+                // Generally, with bottom: 0 for fixed content, we do not
+                // want it sitting above the footnotes. The exception is
+                // multi-page footnotes where the entire page is reserved
+                // for footnotes and so we don't have any choice.
+                result = new Rectangle(
+                        0,
+                        -this.page.getTop(),
+                        this.page.getContentWidth(this),
+                        this.page.getBottom(this) - this.page.getTop());
+            } else {
+                result = new Rectangle(0, -this.page.getTop(), 
                     this.page.getContentWidth(this),
                     this.page.getContentHeight(this)-1);
+            }
         }
+
         result.translate(-1, -1);
         return result;
     }
-
+
+    /**
+     * Get the viewport rect, for painting the body or html tag background.
+     */
     public Rectangle getViewportRectangle() {
-        Rectangle result = new Rectangle(getFixedRectangle());
+        Rectangle result = new Rectangle(getFixedRectangle(false));
         result.y *= -1;
-        
+
         return result;
     }
-    
+
     public boolean debugDrawBoxes() {
         return sharedContext.debugDrawBoxes();
     }

diff --git a/...s/src/main/resources/visualtest/html/footnote/issue-364-footnotes-positioned-content.html b/...s/src/main/resources/visualtest/html/footnote/issue-364-footnotes-positioned-content.html
@@ -2,7 +2,7 @@
 <head>
 <style>
 @page {
-    size: 250px 300px;
+    size: 250px 330px;
 }
 @page {
     @footnote {
@@ -14,8 +14,10 @@
     }
 }
 body {
+  background-color: pink;
   margin: 0 10px;
   font-size: 18px;
+  border: 1px solid black;
 
   /* When there is limited space for lines (such as with large footnote area)
      then orphans and widows can create undesirable layout. */
@@ -43,10 +45,10 @@
 </p>
 
 <p style="page-break-before: always;">
-  Footnote numbers. <span id="3" class="footnote">Just to be silly this is a really long footnote that will need wrapping and such.</span>
+  Footnote numbers. <span id="3" class="footnote">Just to be silly this is a really long footnote that will need wrapping and such. This is a multiple page footnote so here we go on and on to get to the next page.</span>
 </p>
 
-<div style="background: blue; position: fixed; bottom: 0; left: 40%; width: 40%; height: 50px;"></div>
+<div style="background: blue; position: fixed; bottom: 0; left: 40%; width: 40%; height: 150px;"></div>
 <div style="background: red; position: absolute; bottom: 0; left: 0; width: 40%; height: 50px;"></div>
 </body>
 </html>