diff --git a/packages/knowledge-base-web-page-element-view/README.md b/packages/knowledge-base-web-page-element-view/README.md
index 93086003f1770e11bf3634dedee9dd9b6f73a80e..82a96017d95f50635d4e0afdd2edc721cce6a0d6 100644
--- a/packages/knowledge-base-web-page-element-view/README.md
+++ b/packages/knowledge-base-web-page-element-view/README.md
@@ -23,6 +23,8 @@ npm i @dbp-toolkit/knowledge-base-web-page-element-view
- example `<dbp-knowledge-base-web-page-element-view entry-point-url="http://127.0.0.1:8000"></dbp-knowledge-base-web-page-element-view>`
- `text` (optional): text to click to show the information loaded from the webpage
- example `<dbp-knowledge-base-web-page-element-view text="Click me to show more information"></dbp-knowledge-base-web-page-element-view>`
+- `auth` object: you need to set that object property for the auth token
+ - example auth property: `{token: "THE_BEARER_TOKEN"}`
## Local development
diff --git a/packages/knowledge-base-web-page-element-view/assets/index.html b/packages/knowledge-base-web-page-element-view/assets/index.html
index bc9b5c5d0ba29a1303eb817e5a93d12be3fe3a76..bd187181e4406404da0690ae98840c453a63a1b1 100644
--- a/packages/knowledge-base-web-page-element-view/assets/index.html
+++ b/packages/knowledge-base-web-page-element-view/assets/index.html
@@ -14,7 +14,7 @@
</style>
<body>
-<dbp-knowledge-base-web-page-element-view-demo lang="de" entry-point-url="http://127.0.0.1:8000"></dbp-knowledge-base-web-page-element-view-demo>
+<dbp-knowledge-base-web-page-element-view-demo auth lang="de" entry-point-url="http://127.0.0.1:8000"></dbp-knowledge-base-web-page-element-view-demo>
</body>
</html>
diff --git a/packages/knowledge-base-web-page-element-view/src/dbp-knowledge-base-web-page-element-view-demo.js b/packages/knowledge-base-web-page-element-view/src/dbp-knowledge-base-web-page-element-view-demo.js
index d72d83d88b3e1cc7aafbb2c73386c6c2eddd4571..d4ad245daff9437dceee12f1be1df30d8eaba783 100644
--- a/packages/knowledge-base-web-page-element-view/src/dbp-knowledge-base-web-page-element-view-demo.js
+++ b/packages/knowledge-base-web-page-element-view/src/dbp-knowledge-base-web-page-element-view-demo.js
@@ -86,23 +86,23 @@ export class KnowledgeBaseWebPageElementViewDemo extends ScopedElementsMixin(DBP
<div class="container">
<h2 class="subtitle">Deutsch</h2>
<p>Ein erster Schritt</p>
- <dbp-knowledge-base-web-page-element-view lang="de" entry-point-url="${this.entryPointUrl}" value="bedienstete/bibliothek/buch-ausleihen" text="Ein Buch ausleihen"></dbp-knowledge-base-web-page-element-view>
+ <dbp-knowledge-base-web-page-element-view subscribe="auth:auth" lang="de" entry-point-url="${this.entryPointUrl}" value="bedienstete/bibliothek/buch-ausleihen" text="Ein Buch ausleihen"></dbp-knowledge-base-web-page-element-view>
</div>
<div class="container">
<h2 class="subtitle">Englisch</h2>
<p>A first step</p>
- <dbp-knowledge-base-web-page-element-view lang="en" entry-point-url="${this.entryPointUrl}" value="bedienstete/bibliothek/buch-ausleihen" text="Borrow a book"></dbp-knowledge-base-web-page-element-view>
+ <dbp-knowledge-base-web-page-element-view subscribe="auth:auth" lang="en" entry-point-url="${this.entryPointUrl}" value="bedienstete/bibliothek/buch-ausleihen" text="Borrow a book"></dbp-knowledge-base-web-page-element-view>
</div>
<hr>
<div class="container">
<p>mit Text in der WebComponent:</p>
- <dbp-knowledge-base-web-page-element-view lang="${this.lang}" value="abc/def/xyz" text="FAQ"></dbp-knowledge-base-web-page-element-view>
+ <dbp-knowledge-base-web-page-element-view subscribe="auth:auth" lang="${this.lang}" value="abc/def/xyz" text="FAQ"></dbp-knowledge-base-web-page-element-view>
</div>
<hr>
<div class="container">
<p>ohne Text in der WebComponent:</p>
Kontaktieren Sie uns unter...
- <dbp-knowledge-base-web-page-element-view class="opt" lang="${this.lang}" value="abc/def/klm"></dbp-knowledge-base-web-page-element-view>
+ <dbp-knowledge-base-web-page-element-view subscribe="auth:auth" class="opt" lang="${this.lang}" value="abc/def/klm"></dbp-knowledge-base-web-page-element-view>
</div>
</section>
`;
diff --git a/packages/knowledge-base-web-page-element-view/src/knowledge-base-web-page-element-view.js b/packages/knowledge-base-web-page-element-view/src/knowledge-base-web-page-element-view.js
index c56aac2ffeb37cd8e0a5c342201b43ca2358f284..9b34f065e3f921b2b545fc24db7d9753d728023f 100644
--- a/packages/knowledge-base-web-page-element-view/src/knowledge-base-web-page-element-view.js
+++ b/packages/knowledge-base-web-page-element-view/src/knowledge-base-web-page-element-view.js
@@ -1,14 +1,15 @@
import {i18n} from './i18n';
-import {html, LitElement} from 'lit-element';
+import {html} from 'lit-element';
import {ScopedElementsMixin} from '@open-wc/scoped-elements';
import {MiniSpinner} from '@dbp-toolkit/common';
import * as commonUtils from "@dbp-toolkit/common/utils";
import {unsafeHTML} from 'lit-html/directives/unsafe-html.js';
+import {AdapterLitElement} from "@dbp-toolkit/provider/src/adapter-lit-element";
/**
* KnowledgeBaseWebPageElementView web component
*/
-export class KnowledgeBaseWebPageElementView extends ScopedElementsMixin(LitElement) {
+export class KnowledgeBaseWebPageElementView extends ScopedElementsMixin(AdapterLitElement) {
constructor() {
super();
this.lang = 'de';
@@ -21,6 +22,7 @@ export class KnowledgeBaseWebPageElementView extends ScopedElementsMixin(LitElem
//this.css = 'kb.css';
this.text = '';
this.class = '';
+ this.auth = {};
}
static get scopedElements() {
@@ -46,6 +48,7 @@ export class KnowledgeBaseWebPageElementView extends ScopedElementsMixin(LitElem
error: { type: String, attribute: false},
//css: { type: String },
text: { type: String },
+ auth: { type: Object },
};
}
@@ -53,7 +56,7 @@ export class KnowledgeBaseWebPageElementView extends ScopedElementsMixin(LitElem
* Loads the data from the web page element
*/
loadWebPageElement() {
- if (window.DBPAuthToken === undefined || window.DBPAuthToken === "") {
+ if (this.auth.token === undefined || this.auth.token === "") {
return;
}
@@ -66,7 +69,7 @@ export class KnowledgeBaseWebPageElementView extends ScopedElementsMixin(LitElem
fetch(apiUrl, {
headers: {
'Content-Type': 'application/ld+json',
- 'Authorization': 'Bearer ' + window.DBPAuthToken,
+ 'Authorization': 'Bearer ' + this.auth.token,
},
})
.then(function (res) {