diff --git a/packages/knowledge-base-web-page-element-view/package.json b/packages/knowledge-base-web-page-element-view/package.json index 367805b46d2f5b4a98f29af1e0584dcf16e15ec4..4e7a272714d5f14662d48d0e2da5d89fb8ec5712 100644 --- a/packages/knowledge-base-web-page-element-view/package.json +++ b/packages/knowledge-base-web-page-element-view/package.json @@ -18,6 +18,7 @@ "@webcomponents/webcomponentsjs": "^2.2.10", "i18next": "^17.0.3", "lit-element": "^2.1.0", + "lit-html": "^1.1.1", "vpu-auth": "*", "vpu-common": "*" }, diff --git a/packages/knowledge-base-web-page-element-view/vendor/common b/packages/knowledge-base-web-page-element-view/vendor/common index 8786f24eb39e717995747fa291c9fb1c770d4506..7c9e79d20c319bb6a6154c1724f20eb2f67cfbeb 160000 --- a/packages/knowledge-base-web-page-element-view/vendor/common +++ b/packages/knowledge-base-web-page-element-view/vendor/common @@ -1 +1 @@ -Subproject commit 8786f24eb39e717995747fa291c9fb1c770d4506 +Subproject commit 7c9e79d20c319bb6a6154c1724f20eb2f67cfbeb diff --git a/packages/knowledge-base-web-page-element-view/vpu-kb-wpe-view.js b/packages/knowledge-base-web-page-element-view/vpu-kb-wpe-view.js index 696f769d6f673d5e55e98cf895a45de6e1926c5e..0313a02edbcc21bc83a2f3c49efa069b6b94279e 100644 --- a/packages/knowledge-base-web-page-element-view/vpu-kb-wpe-view.js +++ b/packages/knowledge-base-web-page-element-view/vpu-kb-wpe-view.js @@ -1,8 +1,10 @@ import {i18n} from './i18n'; import {html} from 'lit-element'; -import JSONLD from 'vpu-common/jsonld'; +// import JSONLD from 'vpu-common/jsonld'; import VPULitElement from 'vpu-common/vpu-lit-element' import utils from "./utils"; +import commonUtils from "vpu-common/utils"; +import {unsafeHTML} from 'lit-html/directives/unsafe-html.js'; /** * KnowledgeBaseWebPageElementView web component @@ -12,6 +14,7 @@ class VPUKnowledgeBaseWebPageElementView extends VPULitElement { super(); this.lang = 'de'; this.value = ''; + this.html = ''; } /** @@ -21,6 +24,7 @@ class VPUKnowledgeBaseWebPageElementView extends VPULitElement { return { lang: { type: String }, value: { type: String }, + html: { type: String, attribute: false }, }; } @@ -29,21 +33,29 @@ class VPUKnowledgeBaseWebPageElementView extends VPULitElement { i18n.changeLanguage(this.lang); const that = this; - JSONLD.initialize(utils.getAPiUrl(), function (jsonld) { - // TODO: there is no entity url without "collectionOperations" - const apiUrl = jsonld.getApiUrlForEntityName("KnowledgeBaseWebPageElement") + '/' + that.value; - console.log(apiUrl); + // JSONLD.initialize(utils.getAPiUrl(), function (jsonld) { + // const apiUrl = jsonld.getApiUrlForEntityName("KnowledgeBaseWebPageElement") + '/' + btoa(that.value); + // }); + // sadly there there is no entity url without "collectionOperations" in entity KnowledgeBaseWebPageElement! + const apiUrl = utils.getAPiUrl("/web_page_elements/knowledge_base_web_page_elements/") + commonUtils.base64EncodeUnicode(that.value); + + window.addEventListener("vpu-auth-init", function(e) + { fetch(apiUrl, { headers: { 'Content-Type': 'application/ld+json', - 'Authorization': 'Bearer ' + that.token, + 'Authorization': 'Bearer ' + window.VPUAuthToken, }, }) - .then(response => response.json()) - .then((person) => { - console.log(person); - }); + .then(res => res.json()) + .then(webPageElement => { + if (webPageElement !== undefined && webPageElement.text !== undefined) { + that.html = webPageElement.text; + } + }) + // catch e.g. 404 errors + .catch(error => console.error(error)); }); this.updateComplete.then(()=>{ @@ -61,6 +73,11 @@ class VPUKnowledgeBaseWebPageElementView extends VPULitElement { Hier kann man dann etwas aufklappen. </div> </div> + <div class="columns"> + <div class="column"> + ${unsafeHTML(this.html)} + </div> + </div> `; } }