Rename component to dbp-check-in-place-select (#34)

demo/assets/location-select.metadata.json → demo/assets/check-in-place-select.metadata.json

 {
-  "element": "dbp-location-select-demo-activity",
-  "module_src": "dbp-location-select-demo-activity.js",
-  "routing_name": "location-select",
+  "element": "dbp-check-in-place-select-demo-activity",
+  "module_src": "dbp-check-in-place-select-demo-activity.js",
+  "routing_name": "check-in-place-select",
   "name": {
     "de": "Ortauswahl",
-    "en": "Location select"
+    "en": "Check-in place select"
   },
   "short_name": {
     "de": "Ortauswahl",
-    "en": "Location select"
+    "en": "Check-in place select"
   },
   "description": {
     "de": "Ort Web Component",
-    "en": "location select web component"
+    "en": "Check-in place select web component"
   }
 }

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

@@ -20,7 +20,7 @@
     {"path": "notification.metadata.json"},
     {"path": "data-table-view.metadata.json"},
     {"path": "language-select.metadata.json"},
-    {"path": "location-select.metadata.json"},
+    {"path": "check-in-place-select.metadata.json"},
     {"path": "matomo.metadata.json"},
     {"path": "person-profile.metadata.json"},
     {"path": "file-handling.metadata.json"}

packages/location-select/README.md → packages/check-in-place-select/README.md

-# Location Select Web Component
+# Check-in place select web component
 
 [GitLab Repository](https://gitlab.tugraz.at/dbp/web-components/toolkit)
 
 ## Usage
 
 ```html
-<dbp-location-select></dbp-location-select>
+<dbp-check-in-place-select></dbp-check-in-place-select>
 ```
 
 ## Attributes
 
 - `lang` (optional, default: `de`): set to `de` or `en` for German or English
-    - example `<dbp-location-select lang="de"></dbp-location-select>`
+    - example `<dbp-check-in-place-select lang="de"></dbp-check-in-place-select>`
 - `entry-point-url` (optional, default is the TU Graz entry point url): entry point url to access the api
-    - example `<dbp-location-select entry-point-url="http://127.0.0.1:8000"></dbp-location-select>`
-- `value` (optional): api path of location to preload the selector with
-    - example `<dbp-location-select value="Besprechungsraum"></dbp-location-select>`
-    - the `value` will also be set automatically when a location is chosen in the selector
-- `data-object` (read-only): when a location is selected the location object will be set as json string
-    - example `<dbp-location-select data-object="{"@id":"id", "@type":"http://schema.org/Place", "identifier":"id", "name":"Besprechungsraum", "maximumPhysicalAttendeeCapacity":"50"}"></dbp-location-select>`
-- `show-capacity` (optional): also shows the capacity of the locations
-    - example `<dbp-location-select show-capacity></dbp-location-select>`
+    - example `<dbp-check-in-place-select entry-point-url="http://127.0.0.1:8000"></dbp-check-in-place-select>`
+- `value` (optional): api path of place to preload the selector with
+    - example `<dbp-check-in-place-select value="Besprechungsraum"></dbp-check-in-place-select>`
+    - the `value` will also be set automatically when a place is chosen in the selector
+- `data-object` (read-only): when a place is selected the place object will be set as json string
+    - example `<dbp-check-in-place-select data-object="{"@id":"id", "@type":"http://schema.org/Place", "identifier":"id", "name":"Besprechungsraum", "maximumPhysicalAttendeeCapacity":"50"}"></dbp-check-in-place-select>`
+- `show-capacity` (optional): also shows the capacity of the places
+    - example `<dbp-check-in-place-select show-capacity></dbp-check-in-place-select>`
 - `show-reload-button` (optional): if set a reload button will be viewed next to the select box
     - the button triggers a `change` event on the web component
-    - the button is disabled if no location is selected
-    - example `<dbp-location-select show-reload-button></dbp-location-select>`
+    - the button is disabled if no place is selected
+    - example `<dbp-check-in-place-select show-reload-button></dbp-check-in-place-select>`
 - `reload-button-title` (optional): sets a title text on the reload button
-    - example `<dbp-location-select show-reload-button reload-button-text="Reload result list"></dbp-location-select>`
+    - example `<dbp-check-in-place-select show-reload-button reload-button-text="Reload result list"></dbp-check-in-place-select>`
 
 ## Local development
 
 ```bash
 # get the source
 git clone git@gitlab.tugraz.at:dbp/web-components/toolkit.git
-cd toolkit/packages/location-select
+cd toolkit/packages/check-in-place-select
 git submodule update --init
 
 # install dependencies (make sure you have npm version 4+ installed, so symlinks to the git submodules are created automatically)

packages/location-select/assets/index.html → packages/check-in-place-select/assets/index.html

@@ -2,11 +2,11 @@
 <html>
 <head>
     <meta charset="UTF-8">
-    <script type="module" src="dbp-location-select-demo.js"></script>
+    <script type="module" src="dbp-check-in-place-select-demo.js"></script>
 </head>
 
 <body>
 
-<dbp-location-select-demo lang="de"></dbp-location-select-demo>
+<dbp-check-in-place-select-demo lang="de"></dbp-check-in-place-select-demo>
 </body>
 </html>

packages/location-select/package.json → packages/check-in-place-select/package.json

 {
-  "name": "dbp-location-select",
+  "name": "dbp-check-in-place-select",
   "version": "1.0.0",
   "main": "src/index.js",
   "license": "LGPL-2.1-or-later",

packages/location-select/rollup.config.js → packages/check-in-place-select/rollup.config.js

@@ -15,7 +15,7 @@ console.log("build: " + build);
 
 export default (async () => {
     return {
-        input: (build != 'test') ? ['src/dbp-location-select.js', 'src/dbp-location-select-demo.js'] : glob.sync('test/**/*.js'),
+        input: (build != 'test') ? ['src/dbp-check-in-place-select.js', 'src/dbp-check-in-place-select-demo.js'] : glob.sync('test/**/*.js'),
         output: {
             dir: 'dist',
             entryFileNames: '[name].js',

packages/location-select/src/location-select.js → packages/check-in-place-select/src/check-in-place-select.js

@@ -14,7 +14,7 @@ import select2CSSPath from 'select2/dist/css/select2.min.css';
 import * as errorUtils from "dbp-common/error";
 
 
-const locationContext = {
+const checkInPlaceContext = {
     "@id": "@id",
     "name": "http://schema.org/name",
     "maximumPhysicalAttendeeCapacity": "http://schema.org/maximumPhysicalAttendeeCapacity"
@@ -22,7 +22,7 @@ const locationContext = {
 
 select2(window, $);
 
-export class LocationSelect extends ScopedElementsMixin(LitElement) {
+export class CheckInPlaceSelect extends ScopedElementsMixin(LitElement) {
 
     constructor() {
         super();
@@ -32,7 +32,7 @@ export class LocationSelect extends ScopedElementsMixin(LitElement) {
         this.$select = null;
         this.active = false;
         // For some reason using the same ID on the whole page twice breaks select2 (regardless if they are in different custom elements)
-        this.selectId = 'location-select-' + commonUtils.makeId(24);
+        this.selectId = 'check-in-place-select-' + commonUtils.makeId(24);
         this.value = '';
         this.object = null;
         this.ignoreValueUpdate = false;
@@ -125,7 +125,7 @@ export class LocationSelect extends ScopedElementsMixin(LitElement) {
             return false;
         }
 
-        // find the correct api url for a location
+        // find the correct api url for a checkInPlace
         const apiUrl = this.jsonld.getApiUrlForIdentifier("http://schema.org/Place");
         // const apiUrl = this.jsonld.getApiUrlForEntityName("CheckInPlace");
 
@@ -144,8 +144,8 @@ export class LocationSelect extends ScopedElementsMixin(LitElement) {
             width: '100%',
             language: this.lang === "de" ? select2LangDe() : select2LangEn(),
             minimumInputLength: 2,
-            placeholder: i18n.t('location-select.placeholder'),
-            dropdownParent: this.$('#location-select-dropdown'),
+            placeholder: i18n.t('check-in-place-select.placeholder'),
+            dropdownParent: this.$('#check-in-place-select-dropdown'),
             ajax: {
                 delay: 500,
                 url: apiUrl,
@@ -161,7 +161,7 @@ export class LocationSelect extends ScopedElementsMixin(LitElement) {
                 },
                 processResults: function (data) {
                     that.lastResult = data;
-                    let transformed = that.jsonld.transformMembers(data, locationContext);
+                    let transformed = that.jsonld.transformMembers(data, checkInPlaceContext);
                     const results = [];
                     transformed.forEach((place) => {
                         results.push({id: place["@id"], maximumPhysicalAttendeeCapacity: place["maximumPhysicalAttendeeCapacity"], text: that.generateOptionText(place)});
@@ -228,7 +228,7 @@ export class LocationSelect extends ScopedElementsMixin(LitElement) {
             })
             .then((place) => {
                 that.object = place;
-                const transformed = that.jsonld.compactMember(that.jsonld.expandMember(place), locationContext);
+                const transformed = that.jsonld.compactMember(that.jsonld.expandMember(place), checkInPlaceContext);
                 const identifier = transformed["@id"];
                 const maxCapacity = transformed["maximumPhysicalAttendeeCapacity"];
                 const room = place.identifier;
@@ -259,7 +259,7 @@ export class LocationSelect extends ScopedElementsMixin(LitElement) {
     generateOptionText(place) {
         let text = place["name"];
 
-        // add maximum capacity to location if present
+        // add maximum capacity to checkInPlace if present
         if (this.showCapacity && (place["maximumPhysicalAttendeeCapacity"] !== undefined) && (place["maximumPhysicalAttendeeCapacity"] !== null)) {
             let capacity = place["maximumPhysicalAttendeeCapacity"];
             text += ` (${capacity})`;
@@ -366,7 +366,7 @@ export class LocationSelect extends ScopedElementsMixin(LitElement) {
                 <div class="field has-addons">
                     <div class="select2-control control">
                         <!-- https://select2.org-->
-                        <select id="${this.selectId}" name="location" class="select" ?disabled=${!this.active}>${!this.active ? html`<option value="" disabled selected>${ i18n.t('location-select.login-required')}</option>` : ''}</select>
+                        <select id="${this.selectId}" name="check-in-place" class="select" ?disabled=${!this.active}>${!this.active ? html`<option value="" disabled selected>${ i18n.t('check-in-place-select.login-required')}</option>` : ''}</select>
                     </div>
                     <a class="control button"
                        id="reload-button"
@@ -377,7 +377,7 @@ export class LocationSelect extends ScopedElementsMixin(LitElement) {
                         <dbp-icon name="reload"></dbp-icon>
                     </a>
                 </div>
-                <div id="location-select-dropdown"></div>
+                <div id="check-in-place-select-dropdown"></div>
             </div>
         `;
     }

packages/location-select/src/dbp-location-select-demo.js → packages/check-in-place-select/src/dbp-check-in-place-select-demo.js

 import {i18n} from './i18n.js';
 import {css, html, LitElement} from 'lit-element';
 import {ScopedElementsMixin} from '@open-wc/scoped-elements';
-import {LocationSelect} from './location-select.js';
+import {CheckInPlaceSelect} from './check-in-place-select.js';
 import {AuthKeycloak, LoginButton} from 'dbp-auth';
 import * as commonUtils from 'dbp-common/utils';
 import * as commonStyles from 'dbp-common/styles';
 
-class LocationSelectDemo extends ScopedElementsMixin(LitElement) {
+class CheckInPlaceSelectDemo extends ScopedElementsMixin(LitElement) {
     constructor() {
         super();
         this.lang = 'de';
@@ -17,7 +17,7 @@ class LocationSelectDemo extends ScopedElementsMixin(LitElement) {
         return {
           'dbp-auth-keycloak': AuthKeycloak,
           'dbp-login-button': LoginButton,
-          'dbp-location-select': LocationSelect,
+          'dbp-check-in-place-select': CheckInPlaceSelect,
         };
     }
 
@@ -61,21 +61,21 @@ class LocationSelectDemo extends ScopedElementsMixin(LitElement) {
         return html`
             <section class="section">
                 <div class="container">
-                    <h1 class="title">Location-Select-Demo</h1>
+                    <h1 class="title">Check-In-Place-Select-Demo</h1>
                 </div>
                 ${this.getAuthComponentHtml()}
                 <div class="container">
                     <form>
                         <div class="field">
-                            <label class="label">Location 1</label>
+                            <label class="label">Check-In-Place 1</label>
                             <div class="control">
-                                <dbp-location-select lang="${this.lang}" entry-point-url="${commonUtils.getAPiUrl()}"></dbp-location-select>
+                                <dbp-check-in-place-select lang="${this.lang}" entry-point-url="${commonUtils.getAPiUrl()}"></dbp-check-in-place-select>
                             </div>
                         </div>
                         <div class="field">
-                            <label class="label">Location 2</label>
+                            <label class="label">Check-In-Place 2</label>
                             <div class="control">
-                                <dbp-location-select lang="${this.lang}" entry-point-url="${commonUtils.getAPiUrl()}" show-reload-button reload-button-title="Click me"></dbp-location-select>
+                                <dbp-check-in-place-select lang="${this.lang}" entry-point-url="${commonUtils.getAPiUrl()}" show-reload-button reload-button-title="Click me"></dbp-check-in-place-select>
                             </div>
                         </div>
                     </form>
@@ -85,4 +85,4 @@ class LocationSelectDemo extends ScopedElementsMixin(LitElement) {
     }
 }
 
-commonUtils.defineCustomElement('dbp-location-select-demo', LocationSelectDemo);
+commonUtils.defineCustomElement('dbp-check-in-place-select-demo', CheckInPlaceSelectDemo);

packages/check-in-place-select/src/dbp-check-in-place-select.js

+import * as commonUtils from 'dbp-common/utils';
+import {CheckInPlaceSelect} from './check-in-place-select.js';
+
+commonUtils.defineCustomElement('dbp-check-in-place-select', CheckInPlaceSelect);

packages/check-in-place-select/src/demo.js

+import './dbp-check-in-place-select-demo.js';

packages/location-select/src/i18n/de/translation.json → packages/check-in-place-select/src/i18n/de/translation.json

 {
-  "location-select": {
+  "check-in-place-select": {
     "placeholder": "Bitte wählen Sie einen Ort aus",
     "error-summary": "Ein Fehler ist aufgetreten",
     "login-required": "Anmeldung erforderlich"

packages/location-select/src/i18n/en/translation.json → packages/check-in-place-select/src/i18n/en/translation.json

 {
-  "location-select": {
+  "check-in-place-select": {
     "placeholder": "Please select a location",
     "error-summary": "An error occurred",
     "login-required": "Login required"

packages/check-in-place-select/src/index.js

+import {CheckInPlaceSelect} from './check-in-place-select.js';
+
+export {CheckInPlaceSelect};
\ No newline at end of file