From 8ff240eeb3de8b0a0e7774ea0f67f08bbcde1ec8 Mon Sep 17 00:00:00 2001
From: Eugen Neuber <eugen.neuber@tugraz.at>
Date: Wed, 24 Feb 2021 11:25:09 +0100
Subject: [PATCH] Fix enabling select2 without auth/token
See issue dbp/web-components/toolkit#49
---
.../person-select/src/dbp-person-select-demo.js | 7 +++++++
packages/person-select/src/person-select.js | 14 +++++++++++---
2 files changed, 18 insertions(+), 3 deletions(-)
diff --git a/packages/person-select/src/dbp-person-select-demo.js b/packages/person-select/src/dbp-person-select-demo.js
index a0838df3..2f7e4b08 100644
--- a/packages/person-select/src/dbp-person-select-demo.js
+++ b/packages/person-select/src/dbp-person-select-demo.js
@@ -84,6 +84,13 @@ export class PersonSelectDemo extends ScopedElementsMixin(DBPLitElement) {
<dbp-person-select subscribe="auth" lang="${this.lang}" entry-point-url="${this.entryPointUrl}" show-reload-button reload-button-title="Click me"></dbp-person-select>
</div>
</div>
+ <div class="field">
+ <label class="label">Person 3 unsubscribed</label>
+ <div class="control">
+ <dbp-person-select lang="${this.lang}" entry-point-url="${this.entryPointUrl}" show-reload-button reload-button-title="Click me"></dbp-person-select>
+ </div>
+ <p>This comonent doesn't get any notification about user's login and will become active.</p>
+ </div>
</form>
</div>
</section>
diff --git a/packages/person-select/src/person-select.js b/packages/person-select/src/person-select.js
index 3b294563..013c0e78 100644
--- a/packages/person-select/src/person-select.js
+++ b/packages/person-select/src/person-select.js
@@ -110,7 +110,7 @@ export class PersonSelect extends ScopedElementsMixin(AdapterLitElement) {
JSONLD.initialize(this.entryPointUrl, function (jsonld) {
that.jsonld = jsonld;
- that.active = true;
+ that.active = that.authenticated();
// we need to poll because maybe the user interface isn't loaded yet
// Note: we need to call initSelect2() in a different function so we can access "this" inside initSelect2()
@@ -150,7 +150,7 @@ export class PersonSelect extends ScopedElementsMixin(AdapterLitElement) {
width: '100%',
language: this.lang === "de" ? select2LangDe() : select2LangEn(),
minimumInputLength: 2,
- placeholder: i18n.t('person-select.placeholder'),
+ placeholder: i18n.t(this.authenticated() ? 'person-select.placeholder' : 'person-select.login-required'),
dropdownParent: this.$('#person-select-dropdown'),
ajax: {
delay: 500,
@@ -293,6 +293,7 @@ export class PersonSelect extends ScopedElementsMixin(AdapterLitElement) {
break;
case "auth":
JSONLD.doInitializationOnce(this.entryPointUrl, this.auth.token);
+ this.active = this.authenticated();
break;
}
});
@@ -318,6 +319,10 @@ export class PersonSelect extends ScopedElementsMixin(AdapterLitElement) {
}));
}
+ authenticated() {
+ return (this.auth.token || '') !== '';
+ }
+
static get styles() {
return [
commonStyles.getThemeCSS(),
@@ -366,7 +371,10 @@ export class PersonSelect extends ScopedElementsMixin(AdapterLitElement) {
<div class="field has-addons">
<div class="select2-control control">
<!-- https://select2.org-->
- <select id="${this.selectId}" name="person" class="select" ?disabled=${!this.active}>${!this.active ? html`<option value="" disabled selected>${ i18n.t('person-select.login-required')}</option>` : ''}</select>
+ <select id="${this.selectId}" name="person" class="select"
+ ?disabled=${!this.active}>
+ ${!this.authenticated() ? html`<option value="" disabled selected>${ i18n.t('person-select.login-required')}</option>` : ''}
+ </select>
</div>
<a class="control button"
id="reload-button"
--
GitLab