Skip to content
Snippets Groups Projects
Commit a4a64997 authored by Neuber, Eugen Ramon's avatar Neuber, Eugen Ramon :speech_balloon: Committed by Reiter, Christoph
Browse files

Make vpu-button disable work

parent 5fee7c49
No related branches found
No related tags found
No related merge requests found
import env from './env.js'; import env from './env.js';
export const getAssetURL = (path) => {
const elm = document.getElementById('vpu-library-app-src');
if (!elm)
return path;
const url = elm.src;
// newer browsers only
//var url = import.meta.url;
return new URL(path, url).href;
};
/** /**
* Parses a link header * Parses a link header
* *
...@@ -28,7 +38,7 @@ export const parseLinkHeader = (header) => { ...@@ -28,7 +38,7 @@ export const parseLinkHeader = (header) => {
} }
return links; return links;
} };
/** /**
* Reads a setting * Reads a setting
...@@ -38,11 +48,11 @@ export const parseLinkHeader = (header) => { ...@@ -38,11 +48,11 @@ export const parseLinkHeader = (header) => {
*/ */
export const setting = (key) => { export const setting = (key) => {
return env[key]; return env[key];
} };
export const getAPiUrl = (path = "", withPrefix = true) => { export const getAPiUrl = (path = "", withPrefix = true) => {
return env.apiBaseUrl + (withPrefix ? env.apiUrlPrefix : "") + path; return env.apiBaseUrl + (withPrefix ? env.apiUrlPrefix : "") + path;
} };
/** /**
* Parses the base url from an url * Parses the base url from an url
...@@ -55,7 +65,7 @@ export const parseBaseUrl = (url) => { ...@@ -55,7 +65,7 @@ export const parseBaseUrl = (url) => {
const protocol = pathArray[0]; const protocol = pathArray[0];
const host = pathArray[2]; const host = pathArray[2];
return protocol + '//' + host; return protocol + '//' + host;
} };
/** /**
* Converts a string list to a data array for Select2 * Converts a string list to a data array for Select2
...@@ -67,7 +77,7 @@ export const stringListToSelect2DataArray = (list) => { ...@@ -67,7 +77,7 @@ export const stringListToSelect2DataArray = (list) => {
let data = []; let data = [];
list.forEach((item) => {data.push({id: item, text: item})}); list.forEach((item) => {data.push({id: item, text: item})});
return data; return data;
} };
/** /**
* Does generic Base64 Encoding with support for 16-bit encoded strings * Does generic Base64 Encoding with support for 16-bit encoded strings
...@@ -84,7 +94,7 @@ export const base64EncodeUnicode = (str) => { ...@@ -84,7 +94,7 @@ export const base64EncodeUnicode = (str) => {
}); });
return btoa(utf8Bytes); return btoa(utf8Bytes);
} };
/** /**
* Like customElements.define() but tries to display an error in case the browser doesn't * Like customElements.define() but tries to display an error in case the browser doesn't
...@@ -106,7 +116,7 @@ export const defineCustomElement = (name, constructor, options) => { ...@@ -106,7 +116,7 @@ export const defineCustomElement = (name, constructor, options) => {
} }
customElements.define(name, constructor, options); customElements.define(name, constructor, options);
return true; return true;
} };
/** /**
* Creates a random id * Creates a random id
...@@ -117,15 +127,15 @@ export const defineCustomElement = (name, constructor, options) => { ...@@ -117,15 +127,15 @@ export const defineCustomElement = (name, constructor, options) => {
* @returns {string} * @returns {string}
*/ */
export const makeId = (length) => { export const makeId = (length) => {
var result = ''; let result = '';
var characters = 'ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789'; const characters = 'ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789';
var charactersLength = characters.length; const charactersLength = characters.length;
for ( var i = 0; i < length; i++ ) { for ( let i = 0; i < length; i++ ) {
result += characters.charAt(Math.floor(Math.random() * charactersLength)); result += characters.charAt(Math.floor(Math.random() * charactersLength));
} }
return result; return result;
} };
/** /**
* Pads a number with a 0 so it has two digits * Pads a number with a 0 so it has two digits
......
import {html, LitElement, css} from 'lit-element'; import {html, LitElement, css} from 'lit-element';
import * as commonUtils from './utils.js'; import * as commonUtils from './utils.js';
import bulmaCSSPath from 'bulma/css/bulma.min.css'; import bulmaCSSPath from 'bulma/css/bulma.min.css';
import * as utils from "../../src/utils";
class Button extends LitElement { class Button extends LitElement {
...@@ -12,6 +11,7 @@ class Button extends LitElement { ...@@ -12,6 +11,7 @@ class Button extends LitElement {
this.type = "primary"; this.type = "primary";
this.spinner = false; this.spinner = false;
this.spinnerOnClick = true; this.spinnerOnClick = true;
this.disabled = false;
} }
static get properties() { static get properties() {
...@@ -20,6 +20,7 @@ class Button extends LitElement { ...@@ -20,6 +20,7 @@ class Button extends LitElement {
type: { type: String }, type: { type: String },
spinner: { type: Boolean }, spinner: { type: Boolean },
spinnerOnClick: { type: Boolean, attribute: 'spinner-on-click' }, spinnerOnClick: { type: Boolean, attribute: 'spinner-on-click' },
disabled: { type: Boolean },
}; };
} }
...@@ -38,11 +39,13 @@ class Button extends LitElement { ...@@ -38,11 +39,13 @@ class Button extends LitElement {
} }
render() { render() {
const bulmaCSS = utils.getAssetURL(bulmaCSSPath); const bulmaCSS = commonUtils.getAssetURL(bulmaCSSPath);
return html` return html`
<link rel="stylesheet" href="${bulmaCSS}"> <link rel="stylesheet" href="${bulmaCSS}">
<button @click="${this.clickHandler}" class="button ${this.type}">${this.value} <vpu-mini-spinner style="display: ${this.spinner ? "inline" : "none"}"></vpu-mini-spinner></button> <button @click="${this.clickHandler}" class="button ${this.type}" ?disabled="${this.disabled}">
${this.value} <vpu-mini-spinner style="display: ${this.spinner ? "inline" : "none"}"></vpu-mini-spinner>
</button>
`; `;
} }
} }
......
0% Loading or .
You are about to add 0 people to the discussion. Proceed with caution.
Please register or to comment