From 717f24871d73c7fdfbf093c293ff42df1a7a0e20 Mon Sep 17 00:00:00 2001
From: Patrizio Bekerle <patrizio.bekerle@tugraz.at>
Date: Mon, 29 Jul 2019 10:05:39 +0200
Subject: [PATCH] Implement fetching and viewing of web page elements
---
.../package.json | 1 +
.../vendor/common | 2 +-
.../vpu-kb-wpe-view.js | 37 ++++++++++++++-----
3 files changed, 29 insertions(+), 11 deletions(-)
diff --git a/packages/knowledge-base-web-page-element-view/package.json b/packages/knowledge-base-web-page-element-view/package.json
index 367805b4..4e7a2727 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 8786f24e..7c9e79d2 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 696f769d..0313a02e 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>
`;
}
}
--
GitLab