This commit is a first step towards #6419, and it can also help with first compute which ops can affect what is visible in that part of the page. This commit adds logic to track operations with their respective bounding boxes. Only operations that actually cause something to be rendered have a bounding box and dependencies. Consider the following example: ``` 0. setFillRGBColor 1. beginText 2. showText "Hello" 3. endText 4. constructPath [...] -> eoFill ``` here we have three rendering operations: the showText op (2) and the path (4). (2) depends on (0), (1) and (3), while (4) only depends on (0). Both (2) and (4) have a bounding box. This tracking happens when first rendering a PDF: we then use the recorded information to optimize future partial renderings of a PDF, so that we can skip operations that do not affected the PDF area on the canvas. All this logic only runs when the new `enableOptimizedPartialRendering` preference, disabled by default, is enabled. The bounding boxes and dependencies are also shown in the pdfBug stepper. When hovering over a step now: - it highlights the steps that they depend on - it highlights on the PDF itself the bounding box
146 lines
2.9 KiB
CSS
146 lines
2.9 KiB
CSS
/* Copyright 2014 Mozilla Foundation
|
|
*
|
|
* Licensed under the Apache License, Version 2.0 (the "License");
|
|
* you may not use this file except in compliance with the License.
|
|
* You may obtain a copy of the License at
|
|
*
|
|
* http://www.apache.org/licenses/LICENSE-2.0
|
|
*
|
|
* Unless required by applicable law or agreed to in writing, software
|
|
* distributed under the License is distributed on an "AS IS" BASIS,
|
|
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
|
|
* See the License for the specific language governing permissions and
|
|
* limitations under the License.
|
|
*/
|
|
|
|
:root {
|
|
--panel-width: 300px;
|
|
}
|
|
|
|
#PDFBug,
|
|
#PDFBug :is(input, button, select) {
|
|
font: message-box;
|
|
}
|
|
#PDFBug {
|
|
color-scheme: only light;
|
|
|
|
background-color: white;
|
|
color: black;
|
|
border: 1px solid rgb(102 102 102);
|
|
position: fixed;
|
|
top: 32px;
|
|
right: 0;
|
|
bottom: 0;
|
|
font-size: 10px;
|
|
padding: 0;
|
|
width: var(--panel-width);
|
|
}
|
|
#PDFBug .controls {
|
|
background: rgb(238 238 238);
|
|
border-bottom: 1px solid rgb(102 102 102);
|
|
padding: 3px;
|
|
}
|
|
#PDFBug .panels {
|
|
inset: 27px 0 0;
|
|
overflow: auto;
|
|
position: absolute;
|
|
}
|
|
#PDFBug .panels > div {
|
|
padding: 5px;
|
|
}
|
|
#PDFBug button.active {
|
|
font-weight: bold;
|
|
}
|
|
.debuggerShowText,
|
|
.debuggerHideText:hover {
|
|
background-color: rgb(255 255 0 / 0.25);
|
|
}
|
|
#PDFBug .stats {
|
|
font-family: courier;
|
|
font-size: 10px;
|
|
white-space: pre;
|
|
}
|
|
#PDFBug .stats .title {
|
|
font-weight: bold;
|
|
}
|
|
#PDFBug table {
|
|
font-size: 10px;
|
|
white-space: pre;
|
|
}
|
|
#PDFBug table.showText {
|
|
border-collapse: collapse;
|
|
text-align: center;
|
|
}
|
|
#PDFBug table.showText,
|
|
#PDFBug table.showText :is(tr, td) {
|
|
border: 1px solid black;
|
|
padding: 1px;
|
|
}
|
|
#PDFBug table.showText td.advance {
|
|
color: grey;
|
|
}
|
|
|
|
#viewer.textLayer-visible .textLayer {
|
|
opacity: 1;
|
|
}
|
|
|
|
#viewer.textLayer-visible .canvasWrapper {
|
|
background-color: rgb(128 255 128);
|
|
}
|
|
|
|
#viewer.textLayer-visible .canvasWrapper canvas {
|
|
mix-blend-mode: screen;
|
|
}
|
|
|
|
#viewer.textLayer-visible .textLayer span {
|
|
background-color: rgb(255 255 0 / 0.1);
|
|
color: rgb(0 0 0);
|
|
border: solid 1px rgb(255 0 0 / 0.5);
|
|
box-sizing: border-box;
|
|
}
|
|
|
|
#viewer.textLayer-visible .textLayer span[aria-owns] {
|
|
background-color: rgb(255 0 0 / 0.3);
|
|
}
|
|
|
|
#viewer.textLayer-hover .textLayer span:hover {
|
|
background-color: rgb(255 255 255);
|
|
color: rgb(0 0 0);
|
|
}
|
|
|
|
#viewer.textLayer-shadow .textLayer span {
|
|
background-color: rgb(255 255 255 / 0.6);
|
|
color: rgb(0 0 0);
|
|
}
|
|
|
|
.pdfBugGroupsLayer {
|
|
position: absolute;
|
|
inset: 0;
|
|
pointer-events: none;
|
|
|
|
> * {
|
|
position: absolute;
|
|
outline-color: red;
|
|
outline-width: 2px;
|
|
|
|
--hover-outline-style: solid !important;
|
|
--hover-background-color: rgb(255 0 0 / 0.2);
|
|
|
|
&:hover {
|
|
outline-style: var(--hover-outline-style);
|
|
background-color: var(--hover-background-color);
|
|
cursor: pointer;
|
|
}
|
|
|
|
.showDebugBoxes & {
|
|
outline-style: dashed;
|
|
}
|
|
}
|
|
}
|
|
|
|
.showDebugBoxes {
|
|
.pdfBugGroupsLayer {
|
|
pointer-events: all;
|
|
}
|
|
}
|