Marmelator/pdf.js.mirror
1
0
Fork 0
mirror of https://github.com/mozilla/pdf.js.git synced 2026-04-11 07:44:04 +02:00
Code Issues Packages Projects Releases Wiki Activity

Merge pull request #20889 from calixteman/debugger_search_btns

Browse Source 
(Debugger) Replace checkboxes in the search bar by toggle buttons
This commit is contained in:
Tim van der Meij 2026-03-16 20:35:17 +01:00 committed by GitHub
commit 481a0cbe62
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
4 changed files with 42 additions and 40 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
web/internal/canvas_context_details_view.js
View File

@ -228,7 +228,7 @@ class CanvasContextDetailsView {
const prevBtn = document.createElement("button");
prevBtn.className = "gfx-state-stack-button";
prevBtn.ariaLabel = "View older saved state";
prevBtn.title = "View older saved state";
prevBtn.textContent = "←";
const pos = document.createElement("span");
@ -236,7 +236,7 @@ class CanvasContextDetailsView {
const nextBtn = document.createElement("button");
nextBtn.className = "gfx-state-stack-button";
nextBtn.ariaLabel = "View newer saved state";
nextBtn.title = "View newer saved state";
nextBtn.textContent = "→";
navContainer.append(prevBtn, pos, nextBtn);

10
web/internal/debugger.html
View File

@ -57,12 +57,12 @@ limitations under the License.
</div>
<div id="canvas-panel">
<div id="canvas-toolbar" role="toolbar" aria-label="Zoom controls">
<button id="zoom-out-button" aria-label="Zoom out">−</button>
<button id="zoom-out-button" title="Zoom out">−</button>
<span id="zoom-level" aria-live="polite"></span>
<button id="zoom-in-button" aria-label="Zoom in">+</button>
<button id="redraw-button" aria-label="Redraw page">Redraw</button>
<button id="step-button" aria-label="Step one instruction" disabled><u>S</u>tep</button>
<button id="continue-button" aria-label="Continue to next breakpoint" disabled><u>C</u>ontinue</button>
<button id="zoom-in-button" title="Zoom in">+</button>
<button id="redraw-button" title="Redraw page">Redraw</button>
<button id="step-button" title="Step one instruction" disabled><u>S</u>tep</button>
<button id="continue-button" title="Continue to next breakpoint" disabled><u>C</u>ontinue</button>
</div>
<div id="canvas-scroll">
<div id="canvas-wrapper">

9
web/internal/multiline_view.css
View File

@ -145,15 +145,6 @@
white-space: nowrap;
min-width: 4ch;
}
.mlc-check-label {
display: flex;
align-items: center;
gap: 3px;
font-size: 0.85em;
cursor: pointer;
white-space: nowrap;
}
}
.mlc-num-item {

59
web/internal/multiline_view.js
View File

@ -75,9 +75,9 @@ class MultilineView {
#matchInfo;
#ignoreCaseCb;
#ignoreCaseBtn;
#regexCb;
#regexBtn;
/**
* @param {object} opts
@ -362,32 +362,32 @@ class MultilineView {
const prevButton = (this.#prevButton = document.createElement("button"));
prevButton.className = "mlc-nav-button";
prevButton.textContent = "↑";
prevButton.ariaLabel = "Previous match";
prevButton.title = "Previous match";
prevButton.disabled = true;
const nextButton = (this.#nextButton = document.createElement("button"));
nextButton.className = "mlc-nav-button";
nextButton.textContent = "↓";
nextButton.ariaLabel = "Next match";
nextButton.title = "Next match";
nextButton.disabled = true;
const matchInfo = (this.#matchInfo = document.createElement("span"));
matchInfo.className = "mlc-match-info";
const { label: ignoreCaseLabel, cb: ignoreCaseCb } =
this.#makeCheckboxLabel("Ignore case");
const { label: regexLabel, cb: regexCb } = this.#makeCheckboxLabel("Regex");
this.#ignoreCaseCb = ignoreCaseCb;
this.#regexCb = regexCb;
const ignoreCaseBtn = (this.#ignoreCaseBtn = this.#makeToggleButton(
"Aa",
"Ignore case"
));
const regexBtn = (this.#regexBtn = this.#makeToggleButton(".*", "Regex"));
searchGroup.append(
searchInput,
searchError,
prevButton,
nextButton,
matchInfo,
ignoreCaseLabel,
regexLabel
ignoreCaseBtn,
regexBtn,
matchInfo
);
const gotoInput = document.createElement("input");
@ -412,8 +412,16 @@ class MultilineView {
});
prevButton.addEventListener("click", () => this.#navigateMatch(-1));
nextButton.addEventListener("click", () => this.#navigateMatch(1));
this.#ignoreCaseCb.addEventListener("change", () => this.#runSearch());
this.#regexCb.addEventListener("change", () => this.#runSearch());
this.#ignoreCaseBtn.addEventListener("click", () => {
this.#ignoreCaseBtn.ariaPressed =
this.#ignoreCaseBtn.ariaPressed === "true" ? "false" : "true";
this.#runSearch();
});
this.#regexBtn.addEventListener("click", () => {
this.#regexBtn.ariaPressed =
this.#regexBtn.ariaPressed === "true" ? "false" : "true";
this.#runSearch();
});
gotoInput.addEventListener("keydown", ({ key }) => {
if (key !== "Enter") {
@ -432,13 +440,13 @@ class MultilineView {
return bar;
}
#makeCheckboxLabel(text) {
const label = document.createElement("label");
label.className = "mlc-check-label";
const cb = document.createElement("input");
cb.type = "checkbox";
label.append(cb, ` ${text}`);
return { label, cb };
#makeToggleButton(text, title) {
const btn = document.createElement("button");
btn.className = "mlc-nav-button";
btn.textContent = text;
btn.title = title;
btn.ariaPressed = "false";
return btn;
}
#updateMatchInfo() {
@ -466,9 +474,12 @@ class MultilineView {
}
let test;
if (this.#regexCb.checked) {
if (this.#regexBtn.ariaPressed === "true") {
try {
const re = new RegExp(query, this.#ignoreCaseCb.checked ? "i" : "");
const re = new RegExp(
query,
this.#ignoreCaseBtn.ariaPressed === "true" ? "i" : ""
);
test = str => re.test(str);
this.#searchInput.removeAttribute("aria-invalid");
this.#searchError.textContent = "";
@ -479,7 +490,7 @@ class MultilineView {
return false;
}
} else {
const ignoreCase = this.#ignoreCaseCb.checked;
const ignoreCase = this.#ignoreCaseBtn.ariaPressed === "true";
const needle = ignoreCase ? query.toLowerCase() : query;
test = str => (ignoreCase ? str.toLowerCase() : str).includes(needle);
}