Skip to content
Snippets Groups Projects
Unverified Commit e728b2a0 authored by Bekerle, Patrizio's avatar Bekerle, Patrizio :fire:
Browse files

Refactor dbp-knowledge-base-organization-select to dbp-organization-select

parent d3ec7b93
No related branches found
No related tags found
No related merge requests found
Pipeline #18172 failed
...@@ -9,21 +9,21 @@ npm i @dbp-toolkit/organization-select ...@@ -9,21 +9,21 @@ npm i @dbp-toolkit/organization-select
## Usage ## Usage
```html ```html
<dbp-knowledge-base-organization-select></dbp-knowledge-base-organization-select> <dbp-organization-select></dbp-organization-select>
<script type="module" src="node_modules/@dbp-toolkit/organization-select/dist/dbp-knowledge-base-organization-select.js"></script> <script type="module" src="node_modules/@dbp-toolkit/organization-select/dist/dbp-organization-select.js"></script>
``` ```
## Attributes ## Attributes
- `lang` (optional, default: `de`): set to `de` or `en` for German or English - `lang` (optional, default: `de`): set to `de` or `en` for German or English
- example `<dbp-knowledge-base-organization-select lang="de"></dbp-knowledge-base-organization-select>` - example `<dbp-organization-select lang="de"></dbp-organization-select>`
- `entry-point-url` (optional, default is the TU Graz entry point url): entry point url to access the api - `entry-point-url` (optional, default is the TU Graz entry point url): entry point url to access the api
- example `<dbp-knowledge-base-organization-select entry-point-url="http://127.0.0.1:8000"></dbp-knowledge-base-organization-select>` - example `<dbp-organization-select entry-point-url="http://127.0.0.1:8000"></dbp-organization-select>`
- `value` (optional): api path of organization to preload the selector with - `value` (optional): api path of organization to preload the selector with
- example `<dbp-knowledge-base-organization-select value="/people/testuser"></dbp-knowledge-base-organization-select>` - example `<dbp-organization-select value="/people/testuser"></dbp-organization-select>`
- the `value` will also be set automatically when an organization is chosen in the selector - the `value` will also be set automatically when an organization is chosen in the selector
- `data-object` (read-only): when an organization is selected the organization object will be set as json string - `data-object` (read-only): when an organization is selected the organization object will be set as json string
- example `<dbp-knowledge-base-organization-select data-object="{"@id":"/organizations/1190-F2050","@type":"http://schema.org/Organization","identifier":"1190-F2050","name":"Institut fr Stahlbau","url":"https://online.tugraz.at/tug_online/wborg.display?pOrgNr=1190","alternateName":"F2050"}"></dbp-knowledge-base-organization-select>` - example `<dbp-organization-select data-object="{"@id":"/organizations/1190-F2050","@type":"http://schema.org/Organization","identifier":"1190-F2050","name":"Institut für Stahlbau","url":"https://online.tugraz.at/tug_online/wborg.display?pOrgNr=1190","alternateName":"F2050"}"></dbp-organization-select>`
- `auth` object: you need to set that object property for the auth token - `auth` object: you need to set that object property for the auth token
- example auth property: `{token: "THE_BEARER_TOKEN"}` - example auth property: `{token: "THE_BEARER_TOKEN"}`
- note: most often this should be an attribute that is not set directly, but subscribed at a provider - note: most often this should be an attribute that is not set directly, but subscribed at a provider
......
...@@ -2,11 +2,11 @@ ...@@ -2,11 +2,11 @@
<html> <html>
<head> <head>
<meta charset="UTF-8"> <meta charset="UTF-8">
<script type="module" src="dbp-knowledge-base-organization-select-demo.js"></script> <script type="module" src="dbp-organization-select-demo.js"></script>
</head> </head>
<body> <body>
<dbp-knowledge-base-organization-select-demo auth requested-login-status lang="de" entry-point-url="http://127.0.0.1:8000"></dbp-knowledge-base-organization-select-demo> <dbp-organization-select-demo auth requested-login-status lang="de" entry-point-url="http://127.0.0.1:8000"></dbp-organization-select-demo>
</body> </body>
</html> </html>
{ {
"name": "@dbp-toolkit/organization-select", "name": "@dbp-toolkit/organization-select",
"homepage": "https://gitlab.tugraz.at/dbp/web-components/toolkit/-/tree/master/packages/organization-select", "homepage": "https://gitlab.tugraz.at/dbp/web-components/toolkit/-/tree/master/packages/organization-select",
"version": "0.2.0", "version": "0.2.1",
"main": "src/index.js", "main": "src/index.js",
"license": "LGPL-2.1-or-later", "license": "LGPL-2.1-or-later",
"repository": { "repository": {
......
...@@ -14,7 +14,7 @@ console.log("build: " + build); ...@@ -14,7 +14,7 @@ console.log("build: " + build);
export default (async () => { export default (async () => {
return { return {
input: (build != 'test') ? ['src/dbp-knowledge-base-organization-select.js', 'src/dbp-knowledge-base-organization-select-demo.js'] : glob.sync('test/**/*.js'), input: (build != 'test') ? ['src/dbp-organization-select.js', 'src/dbp-organization-select-demo.js'] : glob.sync('test/**/*.js'),
output: { output: {
dir: 'dist', dir: 'dist',
entryFileNames: '[name].js', entryFileNames: '[name].js',
......
...@@ -19,7 +19,7 @@ export class OrganizationSelectDemo extends ScopedElementsMixin(DBPLitElement) { ...@@ -19,7 +19,7 @@ export class OrganizationSelectDemo extends ScopedElementsMixin(DBPLitElement) {
return { return {
'dbp-auth-keycloak': AuthKeycloak, 'dbp-auth-keycloak': AuthKeycloak,
'dbp-login-button': LoginButton, 'dbp-login-button': LoginButton,
'dbp-knowledge-base-organization-select': OrganizationSelect, 'dbp-organization-select': OrganizationSelect,
}; };
} }
...@@ -75,13 +75,13 @@ export class OrganizationSelectDemo extends ScopedElementsMixin(DBPLitElement) { ...@@ -75,13 +75,13 @@ export class OrganizationSelectDemo extends ScopedElementsMixin(DBPLitElement) {
<div class="field"> <div class="field">
<label class="label">Organization 1</label> <label class="label">Organization 1</label>
<div class="control"> <div class="control">
<dbp-knowledge-base-organization-select subscribe="auth" lang="${this.lang}" entry-point-url="${this.entryPointUrl}"></dbp-knowledge-base-organization-select> <dbp-organization-select subscribe="auth" lang="${this.lang}" entry-point-url="${this.entryPointUrl}"></dbp-organization-select>
</div> </div>
</div> </div>
<div class="field"> <div class="field">
<label class="label">Organization 2</label> <label class="label">Organization 2</label>
<div class="control"> <div class="control">
<dbp-knowledge-base-organization-select subscribe="auth" lang="${this.lang}" entry-point-url="${this.entryPointUrl}"></dbp-knowledge-base-organization-select> <dbp-organization-select subscribe="auth" lang="${this.lang}" entry-point-url="${this.entryPointUrl}"></dbp-organization-select>
</div> </div>
</div> </div>
</form> </form>
...@@ -91,4 +91,4 @@ export class OrganizationSelectDemo extends ScopedElementsMixin(DBPLitElement) { ...@@ -91,4 +91,4 @@ export class OrganizationSelectDemo extends ScopedElementsMixin(DBPLitElement) {
} }
} }
commonUtils.defineCustomElement('dbp-knowledge-base-organization-select-demo', OrganizationSelectDemo); commonUtils.defineCustomElement('dbp-organization-select-demo', OrganizationSelectDemo);
import * as commonUtils from '@dbp-toolkit/common/utils'; import * as commonUtils from '@dbp-toolkit/common/utils';
import {OrganizationSelect} from './organization-select.js'; import {OrganizationSelect} from './organization-select.js';
commonUtils.defineCustomElement('dbp-knowledge-base-organization-select', OrganizationSelect); commonUtils.defineCustomElement('dbp-organization-select', OrganizationSelect);
import './dbp-knowledge-base-organization-select-demo.js'; import './dbp-organization-select-demo.js';
import {assert} from 'chai'; import {assert} from 'chai';
import '../src/dbp-knowledge-base-organization-select.js'; import '../src/dbp-organization-select.js';
import '../src/demo.js'; import '../src/demo.js';
suite('dbp-knowledge-base-organization-select basics', () => { suite('dbp-organization-select basics', () => {
let node; let node;
setup(async () => { setup(async () => {
node = document.createElement('dbp-knowledge-base-organization-select'); node = document.createElement('dbp-organization-select');
document.body.appendChild(node); document.body.appendChild(node);
await node.updateComplete; await node.updateComplete;
}); });
...@@ -21,11 +21,11 @@ suite('dbp-knowledge-base-organization-select basics', () => { ...@@ -21,11 +21,11 @@ suite('dbp-knowledge-base-organization-select basics', () => {
}); });
}); });
suite('dbp-knowledge-base-organization-select-demo basics', () => { suite('dbp-organization-select-demo basics', () => {
let node; let node;
setup(async () => { setup(async () => {
node = document.createElement('dbp-knowledge-base-organization-select-demo'); node = document.createElement('dbp-organization-select-demo');
document.body.appendChild(node); document.body.appendChild(node);
await node.updateComplete; await node.updateComplete;
}); });
......
{ {
"element": "dbp-knowledge-base-organization-select-demo-activity", "element": "dbp-organization-select-demo-activity",
"module_src": "dbp-organization-select-demo-activity.js", "module_src": "dbp-organization-select-demo-activity.js",
"routing_name": "organization-select", "routing_name": "organization-select",
"name": { "name": {
......
import {css, html, LitElement} from 'lit-element'; import {css, html, LitElement} from 'lit-element';
import {ScopedElementsMixin} from '@open-wc/scoped-elements'; import {ScopedElementsMixin} from '@open-wc/scoped-elements';
import {OrganizationSelectDemo} from '@dbp-toolkit/organization-select/src/dbp-knowledge-base-organization-select-demo'; import {OrganizationSelectDemo} from '@dbp-toolkit/organization-select/src/dbp-organization-select-demo';
import * as commonUtils from '@dbp-toolkit/common/utils'; import * as commonUtils from '@dbp-toolkit/common/utils';
import * as commonStyles from '@dbp-toolkit/common/styles'; import * as commonStyles from '@dbp-toolkit/common/styles';
import {unsafeHTML} from 'lit-html/directives/unsafe-html.js'; import {unsafeHTML} from 'lit-html/directives/unsafe-html.js';
...@@ -18,7 +18,7 @@ class DbpOrganizationSelectDemoActivity extends ScopedElementsMixin(AdapterLitEl ...@@ -18,7 +18,7 @@ class DbpOrganizationSelectDemoActivity extends ScopedElementsMixin(AdapterLitEl
static get scopedElements() { static get scopedElements() {
return { return {
'dbp-knowledge-base-organization-select-demo': OrganizationSelectDemo, 'dbp-organization-select-demo': OrganizationSelectDemo,
}; };
} }
...@@ -59,9 +59,9 @@ class DbpOrganizationSelectDemoActivity extends ScopedElementsMixin(AdapterLitEl ...@@ -59,9 +59,9 @@ class DbpOrganizationSelectDemoActivity extends ScopedElementsMixin(AdapterLitEl
render() { render() {
return html` return html`
${unsafeHTML(readme)} ${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> <dbp-organization-select-demo id="demo" lang="${this.lang}" entry-point-url="${this.entryPointUrl}" no-auth></dbp-organization-select-demo>
`; `;
} }
} }
commonUtils.defineCustomElement('dbp-knowledge-base-organization-select-demo-activity', DbpOrganizationSelectDemoActivity); commonUtils.defineCustomElement('dbp-organization-select-demo-activity', DbpOrganizationSelectDemoActivity);
0% Loading or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment