diff --git a/CHANGELOG.md b/CHANGELOG.md
index 15494255..203b9e04 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -1,3 +1,17 @@
+# [2.23.0](https://github.com/eeditiones/tei-publisher-components/compare/v2.22.2...v2.23.0) (2024-05-15)
+
+
+### Features
+
+* **pb-facsimile:** added option to add download icon to trigger download of current viewport. Added a demo for the feature ([0233c83](https://github.com/eeditiones/tei-publisher-components/commit/0233c8333e9e78ed529a21361e358974c1cecf46))
+
+## [2.22.2](https://github.com/eeditiones/tei-publisher-components/compare/v2.22.1...v2.22.2) (2024-05-02)
+
+
+### Bug Fixes
+
+* **pb-grid:** emit pb-refresh to configured channel only ([63091ab](https://github.com/eeditiones/tei-publisher-components/commit/63091ab6d509770b8b847fe25fe5a1a2ed7d86e8))
+
## [2.22.1](https://github.com/eeditiones/tei-publisher-components/compare/v2.22.0...v2.22.1) (2024-05-02)
diff --git a/demo/demos.json b/demo/demos.json
index 824631a7..8c8c2aeb 100644
--- a/demo/demos.json
+++ b/demo/demos.json
@@ -40,7 +40,8 @@
},
"pb-facsimile": {
"demo/pb-facsimile.html": "Demo",
- "demo/pb-facsimile-2.html": "Align text page with facsimile"
+ "demo/pb-facsimile-2.html": "Align text page with facsimile",
+ "demo/pb-facsimile-3.html": "With Download Button"
},
"pb-image-strip": {
"demo/pb-image-strip-view.html": "Demo with pb-view",
diff --git a/demo/pb-facsimile-3.html b/demo/pb-facsimile-3.html
new file mode 100644
index 00000000..6ef797b9
--- /dev/null
+++ b/demo/pb-facsimile-3.html
@@ -0,0 +1,82 @@
+
+
+
+
+
+
+ pb-view Demo
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
diff --git a/package-lock.json b/package-lock.json
index e01db3a0..69f4f677 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -1,12 +1,12 @@
{
"name": "@teipublisher/pb-components",
- "version": "2.22.1",
+ "version": "2.23.0",
"lockfileVersion": 2,
"requires": true,
"packages": {
"": {
"name": "@teipublisher/pb-components",
- "version": "2.22.1",
+ "version": "2.23.0",
"license": "GPL-3.0-or-later",
"dependencies": {
"@babel/runtime": "7.11.2",
diff --git a/package.json b/package.json
index 03a04c53..2d14c90b 100644
--- a/package.json
+++ b/package.json
@@ -1,6 +1,6 @@
{
"name": "@teipublisher/pb-components",
- "version": "2.22.1",
+ "version": "2.23.0",
"description": "Collection of webcomponents underlying TEI Publisher",
"repository": "https://github.com/eeditiones/tei-publisher-components.git",
"main": "index.html",
diff --git a/src/pb-facsimile.js b/src/pb-facsimile.js
index 99f90d9d..f33e78ca 100644
--- a/src/pb-facsimile.js
+++ b/src/pb-facsimile.js
@@ -58,6 +58,13 @@ export class PbFacsimile extends pbMixin(LitElement) {
type: Boolean,
attribute: 'show-full-page-control'
},
+ /**
+ * if true shows a 'download' button
+ */
+ showDownloadButton:{
+ type: Boolean,
+ attribute: 'show-download-control'
+ },
/**
* Default zoom between: set to 0 to adjust to viewer size.
*/
@@ -138,6 +145,14 @@ export class PbFacsimile extends pbMixin(LitElement) {
loaded: {
type: Boolean,
reflect: true
+ },
+ /**
+ * CORS (Cross-Origin Resource Sharing) policy - wraps the OSD Viewer option -
+ * only sensible values are 'anonymous' (default) or 'use-credentials'.
+ */
+ crossOriginPolicy:{
+ type: String,
+ attribute: 'cors'
}
};
}
@@ -146,6 +161,7 @@ export class PbFacsimile extends pbMixin(LitElement) {
super();
this._facsimiles = [];
this.baseUri = '';
+ this.crossOriginPolicy = 'anonymous';
this.type = 'iiif';
this.visibilityRatio = 1;
this.defaultZoomLevel = 0;
@@ -155,6 +171,7 @@ export class PbFacsimile extends pbMixin(LitElement) {
this.showNavigationControl = false;
this.showFullPageControl = false;
this.showRotationControl = false;
+ this.showDownloadButton = false;
this.constrainDuringPan = false;
this.referenceStrip = false;
this.referenceStripSizeRatio = 0.2;
@@ -189,22 +206,31 @@ export class PbFacsimile extends pbMixin(LitElement) {
}
firstUpdated() {
- window.ESGlobalBridge.requestAvailability();
- const path = resolveURL('../lib/openseadragon.min.js');
- window.ESGlobalBridge.instance.load("openseadragon", path);
- window.addEventListener(
- "es-bridge-openseadragon-loaded",
- this._initOpenSeadragon.bind(this),
- { once: true }
- );
+ try{
+ window.ESGlobalBridge.requestAvailability();
+ const path = resolveURL('../lib/openseadragon.min.js');
+ window.ESGlobalBridge.instance.load("openseadragon", path);
+ window.addEventListener(
+ "es-bridge-openseadragon-loaded",
+ this._initOpenSeadragon.bind(this),
+ { once: true }
+ );
+ } catch (error){
+ console.error(error.message);
+ }
}
render() {
return html`
+
+ ${this.showDownloadButton ?
+ html`⇤`:''
+ }
+
`;
}
@@ -227,6 +253,26 @@ export class PbFacsimile extends pbMixin(LitElement) {
max-height: var(--pb-facsimile-height, auto);
width: 100%;
}
+ #downloadBtn{
+ position: absolute;
+ z-index: 100;
+ bottom:0.25rem;
+ width:1.35rem;
+ height:1.35rem;
+ transform:rotate(-90deg);
+ cursor: pointer;
+ border: thin solid #D7DDE8;
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ border-radius:0.75rem;
+ background-image:linear-gradient(to left, #fafafa 0%, #D7DDE8 51%, #bbbbbb 100%);
+ font-size:1.2rem;
+ box-shadow: -2px 1px 5px 0px rgba(0,0,0,0.75);
+ }
+ #downloadBtn:hover{
+ background-image:radial-gradient( white, #efefef);
+ }
`;
}
@@ -248,8 +294,10 @@ export class PbFacsimile extends pbMixin(LitElement) {
visibilityRatio: 1,
minZoomLevel: 1,
defaultZoomLevel: this.defaultZoomLevel,
- constrainDuringPan: true
+ constrainDuringPan: true,
+ crossOriginPolicy: this.crossOriginPolicy
};
+
if (this.referenceStrip) {
options.showReferenceStrip = true;
options.referenceStripSizeRatio = this.referenceStripSizeRatio;
@@ -266,6 +314,18 @@ export class PbFacsimile extends pbMixin(LitElement) {
this.emitTo('pb-facsimile-status', { status: 'fail' });
});
+ const download = this.shadowRoot.querySelector('#downloadBtn');
+ if(this.showDownloadButton){
+ download.addEventListener('click', (ev) => {
+ ev.preventDefault();
+ const currentImage = this.viewer.drawer.canvas.toDataURL("image/png");
+ const downloadLink = document.createElement('a');
+ downloadLink.href = currentImage;
+ downloadLink.download = 'download';
+ downloadLink.click();
+ });
+ }
+
/*
handling of full-screen view requires to hide/unhide the content of body to allow full screen viewer
to full-page functionality. Standard OSD completely deletes all body children disconnecting all event-handlers