1
0
Fork 0
mirror of https://github.com/mozilla/pdf.js.git synced 2025-04-20 15:18:08 +02:00

[Editor] Add the possibility to change line opacity in Ink editor

This commit is contained in:
Calixte Denizet 2022-07-24 22:19:09 +02:00
parent 45b9e8417d
commit 7831a100b3
10 changed files with 215 additions and 19 deletions

View file

@ -30,6 +30,7 @@ class AnnotationEditorParams {
editorFreeTextColor,
editorInkColor,
editorInkThickness,
editorInkOpacity,
}) {
editorFreeTextFontSize.addEventListener("input", evt => {
this.eventBus.dispatch("switchannotationeditorparams", {
@ -59,6 +60,13 @@ class AnnotationEditorParams {
value: editorInkThickness.valueAsNumber,
});
});
editorInkOpacity.addEventListener("input", evt => {
this.eventBus.dispatch("switchannotationeditorparams", {
source: this,
type: AnnotationEditorParamsType.INK_OPACITY,
value: editorInkOpacity.valueAsNumber,
});
});
this.eventBus._on("annotationeditorparamschanged", evt => {
for (const [type, value] of evt.details) {
@ -75,6 +83,9 @@ class AnnotationEditorParams {
case AnnotationEditorParamsType.INK_THICKNESS:
editorInkThickness.value = value;
break;
case AnnotationEditorParamsType.INK_OPACITY:
editorInkOpacity.value = value;
break;
}
}
});

View file

@ -171,6 +171,10 @@ See https://github.com/adobe-type-tools/cmap-resources
<label for="editorInkThickness" class="editorParamsLabel" data-l10n-id="editor_ink_line_thickness">Line Thickness</label>
<input type="range" id="editorInkThickness" class="editorParamsSlider" value="1" min="1" max="20" step="1" tabindex="103">
</div>
<div class="editorParamsSetter">
<label for="editorInkOpacity" class="editorParamsLabel" data-l10n-id="editor_ink_line_opacity">Line Opacity</label>
<input type="range" id="editorInkOpacity" class="editorParamsSlider" value="100" min="1" max="100" step="1" tabindex="104">
</div>
</div>
</div>

View file

@ -202,6 +202,7 @@ function getViewerConfiguration() {
editorFreeTextColor: document.getElementById("editorFreeTextColor"),
editorInkColor: document.getElementById("editorInkColor"),
editorInkThickness: document.getElementById("editorInkThickness"),
editorInkOpacity: document.getElementById("editorInkOpacity"),
},
errorWrapper,
printContainer: document.getElementById("printContainer"),