Merge pull request #14788 from Snuffleupagus/debugger-separate-css
Move the `PDFBug`-related CSS from `viewer.css` and into its own file
This commit is contained in:
commit
cf320f8fa3
@ -64,7 +64,10 @@ const DIST_DIR = BUILD_DIR + "dist/";
|
||||
const TYPES_DIR = BUILD_DIR + "types/";
|
||||
const TMP_DIR = BUILD_DIR + "tmp/";
|
||||
const TYPESTEST_DIR = BUILD_DIR + "typestest/";
|
||||
const COMMON_WEB_FILES = ["web/images/*.{png,svg,gif}", "web/debugger.js"];
|
||||
const COMMON_WEB_FILES = [
|
||||
"web/images/*.{png,svg,gif}",
|
||||
"web/debugger.{css,js}",
|
||||
];
|
||||
const MOZCENTRAL_DIFF_FILE = "mozcentral.diff";
|
||||
|
||||
const REPO = "git@github.com:mozilla/pdf.js.git";
|
||||
|
42
web/app.js
42
web/app.js
@ -330,11 +330,15 @@ const PDFViewerApplication = {
|
||||
if (!hash) {
|
||||
return;
|
||||
}
|
||||
const params = parseQueryString(hash),
|
||||
waitOn = [];
|
||||
const { mainContainer, viewerContainer } = this.appConfig,
|
||||
params = parseQueryString(hash);
|
||||
|
||||
if (params.get("disableworker") === "true") {
|
||||
waitOn.push(loadFakeWorker());
|
||||
try {
|
||||
await loadFakeWorker();
|
||||
} catch (ex) {
|
||||
console.error(`_parseHashParameters: "${ex.message}".`);
|
||||
}
|
||||
}
|
||||
if (params.has("disablerange")) {
|
||||
AppOptions.set("disableRange", params.get("disablerange") === "true");
|
||||
@ -368,8 +372,13 @@ const PDFViewerApplication = {
|
||||
case "visible":
|
||||
case "shadow":
|
||||
case "hover":
|
||||
const viewer = this.appConfig.viewerContainer;
|
||||
viewer.classList.add(`textLayer-${params.get("textlayer")}`);
|
||||
viewerContainer.classList.add(`textLayer-${params.get("textlayer")}`);
|
||||
try {
|
||||
await loadPDFBug(this);
|
||||
this._PDFBug.loadCSS();
|
||||
} catch (ex) {
|
||||
console.error(`_parseHashParameters: "${ex.message}".`);
|
||||
}
|
||||
break;
|
||||
}
|
||||
}
|
||||
@ -378,7 +387,12 @@ const PDFViewerApplication = {
|
||||
AppOptions.set("fontExtraProperties", true);
|
||||
|
||||
const enabled = params.get("pdfbug").split(",");
|
||||
waitOn.push(initPDFBug(enabled));
|
||||
try {
|
||||
await loadPDFBug(this);
|
||||
this._PDFBug.init({ OPS }, mainContainer, enabled);
|
||||
} catch (ex) {
|
||||
console.error(`_parseHashParameters: "${ex.message}".`);
|
||||
}
|
||||
}
|
||||
// It is not possible to change locale for the (various) extension builds.
|
||||
if (
|
||||
@ -388,15 +402,6 @@ const PDFViewerApplication = {
|
||||
) {
|
||||
AppOptions.set("locale", params.get("locale"));
|
||||
}
|
||||
|
||||
if (waitOn.length === 0) {
|
||||
return;
|
||||
}
|
||||
try {
|
||||
await Promise.all(waitOn);
|
||||
} catch (reason) {
|
||||
console.error(`_parseHashParameters: "${reason.message}".`);
|
||||
}
|
||||
},
|
||||
|
||||
/**
|
||||
@ -2120,15 +2125,14 @@ async function loadFakeWorker() {
|
||||
await loadScript(PDFWorker.workerSrc);
|
||||
}
|
||||
|
||||
async function initPDFBug(enabledTabs) {
|
||||
const { debuggerScriptPath, mainContainer } = PDFViewerApplication.appConfig;
|
||||
async function loadPDFBug(self) {
|
||||
const { debuggerScriptPath } = self.appConfig;
|
||||
const { PDFBug } =
|
||||
typeof PDFJSDev === "undefined" || !PDFJSDev.test("PRODUCTION")
|
||||
? await import(debuggerScriptPath) // eslint-disable-line no-unsanitized/method
|
||||
: await __non_webpack_import__(debuggerScriptPath); // eslint-disable-line no-undef
|
||||
PDFBug.init({ OPS }, mainContainer, enabledTabs);
|
||||
|
||||
PDFViewerApplication._PDFBug = PDFBug;
|
||||
self._PDFBug = PDFBug;
|
||||
}
|
||||
|
||||
function reportPageStatsPDFBug({ pageNumber }) {
|
||||
|
103
web/debugger.css
Normal file
103
web/debugger.css
Normal file
@ -0,0 +1,103 @@
|
||||
/* 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.
|
||||
*/
|
||||
|
||||
#PDFBug {
|
||||
background-color: rgba(255, 255, 255, 1);
|
||||
border: 1px solid rgba(102, 102, 102, 1);
|
||||
position: fixed;
|
||||
top: 32px;
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
font-size: 10px;
|
||||
padding: 0;
|
||||
width: 300px;
|
||||
}
|
||||
#PDFBug .controls {
|
||||
background: rgba(238, 238, 238, 1);
|
||||
border-bottom: 1px solid rgba(102, 102, 102, 1);
|
||||
padding: 3px;
|
||||
}
|
||||
#PDFBug .panels {
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
overflow: auto;
|
||||
position: absolute;
|
||||
right: 0;
|
||||
top: 27px;
|
||||
}
|
||||
#PDFBug .panels > div {
|
||||
padding: 5px;
|
||||
}
|
||||
#PDFBug button.active {
|
||||
font-weight: bold;
|
||||
}
|
||||
.debuggerShowText,
|
||||
.debuggerHideText:hover {
|
||||
background-color: rgba(255, 255, 0, 1);
|
||||
}
|
||||
#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 tr,
|
||||
#PDFBug table.showText 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: rgba(128, 255, 128, 1);
|
||||
}
|
||||
|
||||
#viewer.textLayer-visible .canvasWrapper canvas {
|
||||
mix-blend-mode: screen;
|
||||
}
|
||||
|
||||
#viewer.textLayer-visible .textLayer span {
|
||||
background-color: rgba(255, 255, 0, 0.1);
|
||||
color: rgba(0, 0, 0, 1);
|
||||
border: solid 1px rgba(255, 0, 0, 0.5);
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
#viewer.textLayer-hover .textLayer span:hover {
|
||||
background-color: rgba(255, 255, 255, 1);
|
||||
color: rgba(0, 0, 0, 1);
|
||||
}
|
||||
|
||||
#viewer.textLayer-shadow .textLayer span {
|
||||
background-color: rgba(255, 255, 255, 0.6);
|
||||
color: rgba(0, 0, 0, 1);
|
||||
}
|
@ -531,6 +531,7 @@ const PDFBug = (function PDFBugClosure() {
|
||||
}
|
||||
},
|
||||
init(pdfjsLib, container, ids) {
|
||||
this.loadCSS();
|
||||
this.enable(ids);
|
||||
/*
|
||||
* Basic Layout:
|
||||
@ -579,6 +580,15 @@ const PDFBug = (function PDFBugClosure() {
|
||||
}
|
||||
this.selectPanel(0);
|
||||
},
|
||||
loadCSS() {
|
||||
const { url } = import.meta;
|
||||
|
||||
const link = document.createElement("link");
|
||||
link.rel = "stylesheet";
|
||||
link.href = url.replace(/.js$/, ".css");
|
||||
|
||||
document.head.appendChild(link);
|
||||
},
|
||||
cleanup() {
|
||||
for (const tool of this.tools) {
|
||||
if (tool.enabled) {
|
||||
|
@ -1346,95 +1346,6 @@ dialog :link {
|
||||
clear: both;
|
||||
}
|
||||
|
||||
#PDFBug {
|
||||
background-color: rgba(255, 255, 255, 1);
|
||||
border: 1px solid rgba(102, 102, 102, 1);
|
||||
position: fixed;
|
||||
top: 32px;
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
font-size: 10px;
|
||||
padding: 0;
|
||||
width: 300px;
|
||||
}
|
||||
#PDFBug .controls {
|
||||
background: rgba(238, 238, 238, 1);
|
||||
border-bottom: 1px solid rgba(102, 102, 102, 1);
|
||||
padding: 3px;
|
||||
}
|
||||
#PDFBug .panels {
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
overflow: auto;
|
||||
position: absolute;
|
||||
right: 0;
|
||||
top: 27px;
|
||||
}
|
||||
#PDFBug .panels > div {
|
||||
padding: 5px;
|
||||
}
|
||||
#PDFBug button.active {
|
||||
font-weight: bold;
|
||||
}
|
||||
.debuggerShowText,
|
||||
.debuggerHideText:hover {
|
||||
background-color: rgba(255, 255, 0, 1);
|
||||
}
|
||||
#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 tr,
|
||||
#PDFBug table.showText 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: rgba(128, 255, 128, 1);
|
||||
}
|
||||
|
||||
#viewer.textLayer-visible .canvasWrapper canvas {
|
||||
mix-blend-mode: screen;
|
||||
}
|
||||
|
||||
#viewer.textLayer-visible .textLayer span {
|
||||
background-color: rgba(255, 255, 0, 0.1);
|
||||
color: rgba(0, 0, 0, 1);
|
||||
border: solid 1px rgba(255, 0, 0, 0.5);
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
#viewer.textLayer-hover .textLayer span:hover {
|
||||
background-color: rgba(255, 255, 255, 1);
|
||||
color: rgba(0, 0, 0, 1);
|
||||
}
|
||||
|
||||
#viewer.textLayer-shadow .textLayer span {
|
||||
background-color: rgba(255, 255, 255, 0.6);
|
||||
color: rgba(0, 0, 0, 1);
|
||||
}
|
||||
|
||||
.grab-to-pan-grab {
|
||||
cursor: grab !important;
|
||||
}
|
||||
|
Loading…
x
Reference in New Issue
Block a user