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 TYPES_DIR = BUILD_DIR + "types/";
|
||||||
const TMP_DIR = BUILD_DIR + "tmp/";
|
const TMP_DIR = BUILD_DIR + "tmp/";
|
||||||
const TYPESTEST_DIR = BUILD_DIR + "typestest/";
|
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 MOZCENTRAL_DIFF_FILE = "mozcentral.diff";
|
||||||
|
|
||||||
const REPO = "git@github.com:mozilla/pdf.js.git";
|
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) {
|
if (!hash) {
|
||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
const params = parseQueryString(hash),
|
const { mainContainer, viewerContainer } = this.appConfig,
|
||||||
waitOn = [];
|
params = parseQueryString(hash);
|
||||||
|
|
||||||
if (params.get("disableworker") === "true") {
|
if (params.get("disableworker") === "true") {
|
||||||
waitOn.push(loadFakeWorker());
|
try {
|
||||||
|
await loadFakeWorker();
|
||||||
|
} catch (ex) {
|
||||||
|
console.error(`_parseHashParameters: "${ex.message}".`);
|
||||||
|
}
|
||||||
}
|
}
|
||||||
if (params.has("disablerange")) {
|
if (params.has("disablerange")) {
|
||||||
AppOptions.set("disableRange", params.get("disablerange") === "true");
|
AppOptions.set("disableRange", params.get("disablerange") === "true");
|
||||||
@ -368,8 +372,13 @@ const PDFViewerApplication = {
|
|||||||
case "visible":
|
case "visible":
|
||||||
case "shadow":
|
case "shadow":
|
||||||
case "hover":
|
case "hover":
|
||||||
const viewer = this.appConfig.viewerContainer;
|
viewerContainer.classList.add(`textLayer-${params.get("textlayer")}`);
|
||||||
viewer.classList.add(`textLayer-${params.get("textlayer")}`);
|
try {
|
||||||
|
await loadPDFBug(this);
|
||||||
|
this._PDFBug.loadCSS();
|
||||||
|
} catch (ex) {
|
||||||
|
console.error(`_parseHashParameters: "${ex.message}".`);
|
||||||
|
}
|
||||||
break;
|
break;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
@ -378,7 +387,12 @@ const PDFViewerApplication = {
|
|||||||
AppOptions.set("fontExtraProperties", true);
|
AppOptions.set("fontExtraProperties", true);
|
||||||
|
|
||||||
const enabled = params.get("pdfbug").split(",");
|
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.
|
// It is not possible to change locale for the (various) extension builds.
|
||||||
if (
|
if (
|
||||||
@ -388,15 +402,6 @@ const PDFViewerApplication = {
|
|||||||
) {
|
) {
|
||||||
AppOptions.set("locale", params.get("locale"));
|
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);
|
await loadScript(PDFWorker.workerSrc);
|
||||||
}
|
}
|
||||||
|
|
||||||
async function initPDFBug(enabledTabs) {
|
async function loadPDFBug(self) {
|
||||||
const { debuggerScriptPath, mainContainer } = PDFViewerApplication.appConfig;
|
const { debuggerScriptPath } = self.appConfig;
|
||||||
const { PDFBug } =
|
const { PDFBug } =
|
||||||
typeof PDFJSDev === "undefined" || !PDFJSDev.test("PRODUCTION")
|
typeof PDFJSDev === "undefined" || !PDFJSDev.test("PRODUCTION")
|
||||||
? await import(debuggerScriptPath) // eslint-disable-line no-unsanitized/method
|
? await import(debuggerScriptPath) // eslint-disable-line no-unsanitized/method
|
||||||
: await __non_webpack_import__(debuggerScriptPath); // eslint-disable-line no-undef
|
: await __non_webpack_import__(debuggerScriptPath); // eslint-disable-line no-undef
|
||||||
PDFBug.init({ OPS }, mainContainer, enabledTabs);
|
|
||||||
|
|
||||||
PDFViewerApplication._PDFBug = PDFBug;
|
self._PDFBug = PDFBug;
|
||||||
}
|
}
|
||||||
|
|
||||||
function reportPageStatsPDFBug({ pageNumber }) {
|
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) {
|
init(pdfjsLib, container, ids) {
|
||||||
|
this.loadCSS();
|
||||||
this.enable(ids);
|
this.enable(ids);
|
||||||
/*
|
/*
|
||||||
* Basic Layout:
|
* Basic Layout:
|
||||||
@ -579,6 +580,15 @@ const PDFBug = (function PDFBugClosure() {
|
|||||||
}
|
}
|
||||||
this.selectPanel(0);
|
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() {
|
cleanup() {
|
||||||
for (const tool of this.tools) {
|
for (const tool of this.tools) {
|
||||||
if (tool.enabled) {
|
if (tool.enabled) {
|
||||||
|
@ -1346,95 +1346,6 @@ dialog :link {
|
|||||||
clear: both;
|
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 {
|
.grab-to-pan-grab {
|
||||||
cursor: grab !important;
|
cursor: grab !important;
|
||||||
}
|
}
|
||||||
|
Loading…
x
Reference in New Issue
Block a user