Marmelator/red-ui
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases 1.4k Wiki Activity

RED-9191 & RED-8396.

Browse Source
This commit is contained in:
Nicoleta Panaghiu 2024-06-12 20:17:06 +03:00
parent 3b29c0613a
commit 27597e9a5a
10 changed files with 34 additions and 46 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

19
apps/red-ui/src/app/modules/pdf-viewer/services/layers.service.ts
View File

@ -9,8 +9,7 @@ import { UI_ROOT_PATH_FN } from '@common-ui/utils';
@Injectable()
export class LayersService {
readonly #convertPath = inject(UI_ROOT_PATH_FN);
readonly #enableIcon = this.#convertPath('/assets/icons/general/pdftron-action-disable-layers.svg');
readonly #disableIcon = this.#convertPath('/assets/icons/general/pdftron-action-enable-layers.svg');
readonly #icon = this.#convertPath('/assets/icons/general/pdftron-action-layers.svg');
readonly active = signal(false);
constructor(
@ -31,8 +30,7 @@ export class LayersService {
}
get toggleLayersBtnIcon(): string {
const tooltipsDisabled = this.active();
return tooltipsDisabled ? this.#enableIcon : this.#disableIcon;
return this.#icon;
}
resetLayers() {
@ -47,14 +45,25 @@ export class LayersService {
}
});
this.updateIconState();
this._documentViewer.document.setLayersArray(layers);
this._documentViewer.refreshAndUpdateView();
}
updateIconState() {
const element = this._pdf.instance.UI.iframeWindow.document.querySelector(`[data-element=${HeaderElements.TOGGLE_LAYERS}]`);
if (!element) return;
if (this.active()) {
element.classList.add('active');
} else {
element.classList.remove('active');
}
}
#updateButton() {
this._pdf.instance?.UI.updateElement(HeaderElements.TOGGLE_LAYERS, {
title: this.toggleLayersBtnTitle,
img: this.toggleLayersBtnIcon,
});
}
}

2
apps/red-ui/src/app/modules/pdf-viewer/services/viewer-header.service.ts
View File

@ -322,6 +322,7 @@ export class ViewerHeaderService {
img: this.#convertPath('/assets/icons/general/pdftron-cursor.svg'),
});
this._tooltipsService.updateIconState();
this._layersService.updateIconState();
const closeCompareButton = this._pdf.instance.UI.iframeWindow.document.querySelector(
`[data-element=${HeaderElements.CLOSE_COMPARE_BUTTON}]`,
);
@ -331,6 +332,7 @@ export class ViewerHeaderService {
disableLoadAllAnnotations(): void {
this._pdf.instance.UI.updateElement(HeaderElements.LOAD_ALL_ANNOTATIONS, {
img: this.#convertPath('/assets/icons/general/pdftron-action-load-all-annotations-disabled.svg'),
title: this._translateService.instant('viewer-header.all-annotations-loaded'),
onClick: undefined,
});
}

1
apps/red-ui/src/assets/i18n/redact/de.json
View File

@ -2488,6 +2488,7 @@
"workflow": "Arbeitsablauf"
},
"viewer-header": {
"all-annotations-loaded": "",
"load-all-annotations": "Alle Annotationen laden"
},
"watermark-screen": {

1
apps/red-ui/src/assets/i18n/redact/en.json
View File

@ -2488,6 +2488,7 @@
"workflow": "Workflow"
},
"viewer-header": {
"all-annotations-loaded": "All annotations loaded",
"load-all-annotations": "Load all annotations"
},
"watermark-screen": {

1
apps/red-ui/src/assets/i18n/scm/de.json
View File

@ -2488,6 +2488,7 @@
"workflow": "Arbeitsablauf"
},
"viewer-header": {
"all-annotations-loaded": "",
"load-all-annotations": "Load all annotations"
},
"watermark-screen": {

1
apps/red-ui/src/assets/i18n/scm/en.json
View File

@ -2488,6 +2488,7 @@
"workflow": "Workflow"
},
"viewer-header": {
"all-annotations-loaded": "All annotations loaded",
"load-all-annotations": "Load all annotations"
},
"watermark-screen": {

17
apps/red-ui/src/assets/icons/general/pdftron-action-disable-layers.svg
View File

@ -1,17 +0,0 @@
<?xml version="1.0" encoding="utf-8"?>
<!-- Generator: Adobe Illustrator 28.0.0, SVG Export Plug-In . SVG Version: 6.00 Build 0) -->
<svg version="1.1" id="Ebene_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
viewBox="0 0 22 26" style="enable-background:new 0 0 22 26;" xml:space="preserve">
<style type="text/css">
.st0{fill:#868E96;}
.st1{fill:#FFFFFF;}
</style>
<path id="path1-1-2-2-2" class="st0" d="M0,3v20c0,1.6,1.3,3,3,3h16c1.6,0,3-1.3,3-3V3c0-1.7-1.3-3-3-3H3C1.3,0,0,1.3,0,3z"/>
<rect x="2.8" y="2.6" class="st1" width="16.5" height="20.8"/>
<rect x="4.6" y="4.1" class="st0" width="12.7" height="4"/>
<rect x="4.6" y="9.6" class="st0" width="12.7" height="6.8"/>
<rect x="4.6" y="17.9" class="st0" width="12.7" height="4"/>
<rect x="5.9" y="5.2" class="st1" width="10.2" height="1.8"/>
<rect x="5.9" y="19" class="st1" width="10.2" height="1.9"/>
<rect x="5.9" y="10.8" class="st1" width="10.2" height="4.5"/>
</svg>
Side by Side

Before

Width:  |  Height:  |  Size: 999 B

23
apps/red-ui/src/assets/icons/general/pdftron-action-enable-layers.svg
View File

@ -1,23 +0,0 @@
<?xml version="1.0" encoding="UTF-8"?>
<svg id="Ebene_1" data-name="Ebene 1" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 22 26">
<defs>
<style>
.cls-1 {
fill: #fff;
}
.cls-1, .cls-2 {
stroke-width: 0px;
}
.cls-2 {
fill: #868E96;
}
</style>
</defs>
<path id="path1-1-2-2" class="cls-2" d="m0,2.98v20.04c0,1.65,1.33,2.98,2.98,2.98h16.04c1.65,0,2.98-1.33,2.98-2.98V2.98c0-1.65-1.33-2.98-2.98-2.98H2.98C1.33,0,0,1.33,0,2.98Z"/>
<rect class="cls-1" x="2.75" y="2.6" width="16.5" height="20.8"/>
<rect class="cls-2" x="4.64" y="4.1" width="12.72" height="4.04"/>
<rect class="cls-2" x="4.64" y="9.64" width="12.72" height="6.78"/>
<rect class="cls-2" x="4.64" y="17.92" width="12.72" height="3.94"/>
</svg>
Side by Side

Before

Width:  |  Height:  |  Size: 789 B

13
apps/red-ui/src/assets/icons/general/pdftron-action-layers.svg Normal file
View File

@ -0,0 +1,13 @@
<svg width="22" height="26" viewBox="0 0 22 26" fill="none" xmlns="http://www.w3.org/2000/svg">
<g clip-path="url(#clip0_1_2)">
<path fill-rule="evenodd" clip-rule="evenodd" d="M0 23V3C0 1.3 1.3 0 3 0H19C20.7 0 22 1.3 22 3V23C22 24.7 20.6 26 19 26H3C1.3 26 0 24.6 0 23ZM2.8 2.6H19.3V23.4H2.8V2.6Z" fill="black"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M4.60001 4.1H17.3V8.1H4.60001V4.1ZM5.89999 5.2H16.1V7H5.89999V5.2Z" fill="black"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M4.60001 17.9H17.3V21.9H4.60001V17.9ZM5.89999 19H16.1V20.9H5.89999V19Z" fill="black"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M4.60001 9.6H17.3V16.4H4.60001V9.6ZM5.89999 10.8H16.1V15.3H5.89999V10.8Z" fill="black"/>
</g>
<defs>
<clipPath id="clip0_1_2">
<rect width="22" height="26" fill="white"/>
</clipPath>
</defs>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 828 B

2
apps/red-ui/src/assets/pdftron/stylesheet.css
View File

@ -48,7 +48,7 @@ button.Button[data-element='LOAD_ALL_ANNOTATIONS'] > img[src='/ui/assets/icons/g
cursor: default;
}
.HeaderItems .Button:not(.active):not([data-element='TOGGLE_LAYERS']) > img {
.HeaderItems .Button:not(.active) > img {
filter: brightness(0) saturate(100%) invert(60%) sepia(11%) saturate(294%) hue-rotate(169deg) brightness(91%) contrast(85%);
}