Add organization select page to the toolkit showcase app

toolkit-showcase/assets/dbp-toolkit-showcase.topic.metadata.json.ejs

@@ -15,6 +15,7 @@
   "activities": [
     {"path": "auth.metadata.json"},
     {"path": "person-select.metadata.json"},
+    {"path": "organization-select.metadata.json"},
     {"path": "knowledge-base-web-page-element-view.metadata.json"},
     {"path": "common.metadata.json"},
     {"path": "qr-code-scanner.metadata.json"},

toolkit-showcase/assets/organization-select.metadata.json

+{
+  "element": "dbp-knowledge-base-organization-select-demo-activity",
+  "module_src": "dbp-organization-select-demo-activity.js",
+  "routing_name": "organization-select",
+  "name": {
+    "de": "Institutsauswahl",
+    "en": "Organization select"
+  },
+  "short_name": {
+    "de": "Institutsauswahl",
+    "en": "Organization select"
+  },
+  "description": {
+    "de": "Erlaubt die Auswahl von Instituten",
+    "en": "Allows selection of organizations"
+  },
+  "subscribe": "lang,entry-point-url"
+}

toolkit-showcase/package.json

@@ -53,6 +53,7 @@
     "@dbp-toolkit/notification": "^0.2.0",
     "@dbp-toolkit/person-profile": "^0.2.0",
     "@dbp-toolkit/person-select": "^0.2.0",
+    "@dbp-toolkit/organization-select": "^0.2.0",
     "@open-wc/scoped-elements": "^1.1.1",
     "fabric": "^4.2.0",
     "file-saver": "^2.0.2",

toolkit-showcase/src/dbp-organization-select-demo-activity.js

+import {css, html, LitElement} from 'lit-element';
+import {ScopedElementsMixin} from '@open-wc/scoped-elements';
+import {OrganizationSelectDemo} from '@dbp-toolkit/organization-select/src/dbp-knowledge-base-organization-select-demo';
+import * as commonUtils from '@dbp-toolkit/common/utils';
+import * as commonStyles from '@dbp-toolkit/common/styles';
+import {unsafeHTML} from 'lit-html/directives/unsafe-html.js';
+import readme from '@dbp-toolkit/organization-select/README.md';
+import highlightCSSPath from 'highlight.js/styles/default.css';
+import * as demoStyles from "./styles";
+import {AdapterLitElement} from "@dbp-toolkit/provider/src/adapter-lit-element";
+
+class DbpOrganizationSelectDemoActivity extends ScopedElementsMixin(AdapterLitElement) {
+    constructor() {
+        super();
+        this.lang = 'en';
+        this.entryPointUrl = '';
+    }
+
+    static get scopedElements() {
+        return {
+          'dbp-knowledge-base-organization-select-demo': OrganizationSelectDemo,
+        };
+    }
+
+    static get properties() {
+        return {
+            ...super.properties,
+            lang: { type: String },
+            entryPointUrl: { type: String, attribute: 'entry-point-url' },
+        };
+    }
+
+    connectedCallback() {
+        super.connectedCallback();
+
+        this.updateComplete.then(()=>{
+        });
+    }
+
+    static get styles() {
+        // language=css
+        return [
+            commonStyles.getThemeCSS(),
+            commonStyles.getGeneralCSS(),
+            demoStyles.getDemoCSS(),
+            css`
+            h1.title {margin-bottom: 1em;}
+            div.container {margin-bottom: 1.5em;}
+
+            #demo{
+                display: block;
+                padding-top: 50px;
+            }
+            
+            `
+        ];
+    }
+
+    render() {
+        return html`
+            ${unsafeHTML(readme)}
+            <dbp-knowledge-base-organization-select-demo id="demo" lang="${this.lang}" entry-point-url="${this.entryPointUrl}" no-auth></dbp-knowledge-base-organization-select-demo>
+        `;
+    }
+}
+
+commonUtils.defineCustomElement('dbp-knowledge-base-organization-select-demo-activity', DbpOrganizationSelectDemoActivity);