tp-elements/helpers
2
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Fixes and modifications

Browse Source
This commit is contained in:
pk 2023-07-27 16:40:07 +02:00
parent b30c9b4e2d
commit 12a8cbeba8
3 changed files with 35 additions and 8 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

17
control-state.js
View File

@ -4,7 +4,7 @@ Copyright (c) 2022 trading_peter
This program is available under Apache License Version 2.0
*/
export const ControlState = function(superClass) {
export const ControlState = function (superClass) {
return class extends superClass {
static get properties() {
return {
@ -20,10 +20,21 @@ export const ControlState = function(superClass) {
firstUpdated() {
super.firstUpdated();
if (!this.hasAttribute('tabindex')) {
this.setAttribute('tabindex', '0');
}
this.addEventListener('focus', this._boundFocus, true);
this.addEventListener('blur', this._boundFocus, true);
}
shouldUpdate(changes) {
if (changes.has('disabled')) {
this._disabledChanged(this.disabled);
}
return super.shouldUpdate(changes);
}
_focusHandler(e) {
this.focused = e.type === 'focus';
}
@ -38,7 +49,7 @@ export const ControlState = function(superClass) {
// leaving `-1` hides shadow root children from the tab order.
this._prevTabIndex = this.getAttribute('tabindex');
this.focused = false;
this.tabIndex = -1;
this.setAttribute('tabIndex', '-1');
this.blur();
} else if (this._prevTabIndex !== undefined) {
if (this._prevTabIndex === null) {
@ -49,4 +60,4 @@ export const ControlState = function(superClass) {
}
}
};
}
}

2
fetch-mixin.js
View File

@ -24,7 +24,7 @@ export const fetchMixin = function(superClass) {
try {
const reqOptions = {
method: 'POST',
signal: this.__abortControllers.get(url).signal,
signal: overwrite ? this.__abortControllers.get(url).signal : null,
mode: 'cors',
cache: 'no-cache',
headers: {

24
upload-files.js
View File

@ -8,13 +8,13 @@ export const upload = function(superClass) {
* @param {Object} opts Upload options
* @returns Promise
*/
uploadFiles(url, files, opts = {}) {
uploadFiles(url, files, data = {}) {
return new Promise((resolve, reject) => {
const request = new XMLHttpRequest();
const formData = new FormData();
for (const key in opts) {
formData.append(key, opts[key]);
for (const key in data) {
formData.append(key, data[key]);
}
request.open('POST', url, true);
@ -24,14 +24,30 @@ export const upload = function(superClass) {
}
});
request.upload.addEventListener('progress', e => {
request.addEventListener('loadstart', e => {
this.dispatchEvent(new CustomEvent('upload-started', { detail: e, bubbles: true, composed: true }));
});
request.addEventListener('progress', e => {
this.dispatchEvent(new CustomEvent('upload-progress', { detail: { percent: ((e.loaded / e.total) * 100).toFixed(2) }, bubbles: true, composed: true }));
});
request.addEventListener('error', e => {
this.dispatchEvent(new CustomEvent('upload-error', { detail: e, bubbles: true, composed: true }));
});
request.addEventListener('error', e => {
this.dispatchEvent(new CustomEvent('upload-error', { detail: e, bubbles: true, composed: true }));
});
request.addEventListener('load', () => {
this.dispatchEvent(new CustomEvent('upload-finished', { detail: null, bubbles: true, composed: true }));
});
request.addEventListener('abort', () => {
this.dispatchEvent(new CustomEvent('upload-aborted', { detail: null, bubbles: true, composed: true }));
});
for (let i = 0; i < files.length; i++) {
formData.append(files[i].name, files[i]);
}