Compare commits
9 Commits
Author | SHA1 | Date | |
---|---|---|---|
a168b03caf | |||
75160b7dbc | |||
af887a0bfb | |||
7626c20f08 | |||
6998616445 | |||
627757ff6d | |||
0a775f919b | |||
7063b80bdd | |||
f3049160b6 |
10
package.json
10
package.json
@ -1,6 +1,6 @@
|
|||||||
{
|
{
|
||||||
"name": "@ztimson/utils",
|
"name": "@ztimson/utils",
|
||||||
"version": "0.13.1",
|
"version": "0.14.6",
|
||||||
"description": "Utility library",
|
"description": "Utility library",
|
||||||
"author": "Zak Timson",
|
"author": "Zak Timson",
|
||||||
"license": "MIT",
|
"license": "MIT",
|
||||||
@ -9,13 +9,13 @@
|
|||||||
"type": "git",
|
"type": "git",
|
||||||
"url": "https://git.zakscode.com/ztimson/js-utilities"
|
"url": "https://git.zakscode.com/ztimson/js-utilities"
|
||||||
},
|
},
|
||||||
"main": "./dist/utils.cjs",
|
"main": "./dist/index.cjs",
|
||||||
"module": "./dist/utils.mjs",
|
"module": "./dist/index.mjs",
|
||||||
"types": "./dist/index.d.ts",
|
"types": "./dist/index.d.ts",
|
||||||
"exports": {
|
"exports": {
|
||||||
".": {
|
".": {
|
||||||
"import": "./dist/utils.mjs",
|
"import": "./dist/index.mjs",
|
||||||
"require": "./dist/utils.cjs",
|
"require": "./dist/index.cjs",
|
||||||
"types": "./dist/index.d.ts"
|
"types": "./dist/index.d.ts"
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
@ -1,8 +0,0 @@
|
|||||||
export function download(href: any, name: string) {
|
|
||||||
const a = document.createElement('a');
|
|
||||||
a.href = href;
|
|
||||||
a.download = name;
|
|
||||||
document.body.appendChild(a);
|
|
||||||
a.click();
|
|
||||||
document.body.removeChild(a);
|
|
||||||
}
|
|
54
src/files.ts
Normal file
54
src/files.ts
Normal file
@ -0,0 +1,54 @@
|
|||||||
|
import {PromiseProgress} from './promise-progress';
|
||||||
|
|
||||||
|
export function download(href: any, name: string) {
|
||||||
|
const a = document.createElement('a');
|
||||||
|
a.href = href;
|
||||||
|
a.download = name;
|
||||||
|
document.body.appendChild(a);
|
||||||
|
a.click();
|
||||||
|
document.body.removeChild(a);
|
||||||
|
}
|
||||||
|
|
||||||
|
export function downloadBlob(blob: Blob, name: string) {
|
||||||
|
const url = URL.createObjectURL(blob);
|
||||||
|
download(url, name);
|
||||||
|
URL.revokeObjectURL(url);
|
||||||
|
}
|
||||||
|
|
||||||
|
export function fileBrowser(options: {accept?: string, multiple?: boolean} = {}): Promise<File[]> {
|
||||||
|
return new Promise(res => {
|
||||||
|
const input = document.createElement('input');
|
||||||
|
input.type = 'file';
|
||||||
|
input.accept = options.accept || '*';
|
||||||
|
input.style.display='none';
|
||||||
|
input.multiple = !!options.multiple;
|
||||||
|
input.onblur = input.onchange = async () => {
|
||||||
|
res(Array.from(<any>input.files));
|
||||||
|
input.remove();
|
||||||
|
}
|
||||||
|
document.body.appendChild(input);
|
||||||
|
input.click();
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
export function uploadWithProgress<T>(options: {
|
||||||
|
url: string;
|
||||||
|
files: File[];
|
||||||
|
headers?: {[key: string]: string};
|
||||||
|
withCredentials?: boolean;
|
||||||
|
}): PromiseProgress<T> {
|
||||||
|
return new PromiseProgress<T>((res, rej, prog) => {
|
||||||
|
const xhr = new XMLHttpRequest();
|
||||||
|
const formData = new FormData();
|
||||||
|
options.files.forEach(f => formData.append('file', f));
|
||||||
|
|
||||||
|
xhr.withCredentials = !!options.withCredentials
|
||||||
|
xhr.upload.addEventListener('progress', (event) => event.lengthComputable ? prog(event.loaded / event.total) : null);
|
||||||
|
xhr.upload.addEventListener('load', (resp) => res(<any>resp));
|
||||||
|
xhr.upload.addEventListener('error', (err) => rej(err));
|
||||||
|
|
||||||
|
xhr.open('POST', options.url);
|
||||||
|
Object.entries(options.headers || {}).forEach(([key, value]) => xhr.setRequestHeader(key, value));
|
||||||
|
xhr.send(formData);
|
||||||
|
});
|
||||||
|
}
|
29
src/http.ts
29
src/http.ts
@ -1,7 +1,7 @@
|
|||||||
import {clean} from './objects';
|
import {clean} from './objects';
|
||||||
import {PromiseProgress} from './promise-progress.ts';
|
import {PromiseProgress} from './promise-progress';
|
||||||
|
|
||||||
export type DecodedResponse<T> = Response & {data?: T}
|
export type DecodedResponse<T> = Response & {data: T | null}
|
||||||
|
|
||||||
export type HttpInterceptor = (response: Response, next: () => void) => void;
|
export type HttpInterceptor = (response: Response, next: () => void) => void;
|
||||||
|
|
||||||
@ -70,7 +70,7 @@ export class Http {
|
|||||||
});
|
});
|
||||||
|
|
||||||
if(typeof opts.body == 'object' && opts.body != null && headers['Content-Type'] == 'application/json')
|
if(typeof opts.body == 'object' && opts.body != null && headers['Content-Type'] == 'application/json')
|
||||||
opts.body = JSON.stringify(opts.json);
|
opts.body = JSON.stringify(opts.body);
|
||||||
|
|
||||||
// Send request
|
// Send request
|
||||||
return new PromiseProgress((res, rej, prog) => {
|
return new PromiseProgress((res, rej, prog) => {
|
||||||
@ -78,14 +78,11 @@ export class Http {
|
|||||||
headers,
|
headers,
|
||||||
method: opts.method || (opts.body ? 'POST' : 'GET'),
|
method: opts.method || (opts.body ? 'POST' : 'GET'),
|
||||||
body: opts.body
|
body: opts.body
|
||||||
}).then(async (resp: DecodedResponse<T>) => {
|
}).then(async (resp: any) => {
|
||||||
console.log('done!');
|
|
||||||
for(let fn of [...Object.values(Http.interceptors), ...Object.values(this.interceptors)]) {
|
for(let fn of [...Object.values(Http.interceptors), ...Object.values(this.interceptors)]) {
|
||||||
await new Promise<void>(res => fn(resp, () => res()));
|
await new Promise<void>(res => fn(resp, () => res()));
|
||||||
}
|
}
|
||||||
|
|
||||||
if(!resp.ok) rej(resp);
|
|
||||||
|
|
||||||
const contentLength = resp.headers.get('Content-Length');
|
const contentLength = resp.headers.get('Content-Length');
|
||||||
const total = contentLength ? parseInt(contentLength, 10) : 0;
|
const total = contentLength ? parseInt(contentLength, 10) : 0;
|
||||||
let loaded = 0;
|
let loaded = 0;
|
||||||
@ -94,28 +91,28 @@ export class Http {
|
|||||||
const stream = new ReadableStream({
|
const stream = new ReadableStream({
|
||||||
start(controller) {
|
start(controller) {
|
||||||
function push() {
|
function push() {
|
||||||
reader?.read().then(({done, value}) => {
|
reader?.read().then((event: any) => {
|
||||||
if(done) return controller.close();
|
if(event.done) return controller.close();
|
||||||
loaded += value.byteLength;
|
loaded += event.value.byteLength;
|
||||||
prog(loaded / total);
|
prog(loaded / total);
|
||||||
controller.enqueue(value);
|
controller.enqueue(event.value);
|
||||||
push();
|
push();
|
||||||
}).catch(error => {
|
}).catch((error: any) => controller.error(error));
|
||||||
controller.error(error);
|
|
||||||
});
|
|
||||||
}
|
}
|
||||||
push();
|
push();
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
|
|
||||||
const data = new Response(stream);
|
const data = new Response(stream);
|
||||||
|
|
||||||
const content = resp.headers.get('Content-Type')?.toLowerCase();
|
const content = resp.headers.get('Content-Type')?.toLowerCase();
|
||||||
if(content?.includes('json')) resp.data = <T>await data.json();
|
if(content?.includes('json')) resp.data = <T>await data.json();
|
||||||
else if(content?.includes('text')) resp.data = <T>await data.text();
|
else if(content?.includes('text')) resp.data = <T>await data.text();
|
||||||
else if(content?.includes('form')) resp.data = <T>await data.formData();
|
else if(content?.includes('form')) resp.data = <T>await data.formData();
|
||||||
else if(content?.includes('application')) resp.data = <T>await data.blob();
|
else if(content?.includes('application')) resp.data = <T>await data.blob();
|
||||||
res(resp);
|
else resp.data = <any>null;
|
||||||
|
|
||||||
|
if(resp.ok) res(resp);
|
||||||
|
else rej(resp);
|
||||||
})
|
})
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
@ -1,6 +1,6 @@
|
|||||||
export * from './array';
|
export * from './array';
|
||||||
export * from './aset';
|
export * from './aset';
|
||||||
export * from './download';
|
export * from './files';
|
||||||
export * from './emitter';
|
export * from './emitter';
|
||||||
export * from './errors';
|
export * from './errors';
|
||||||
export * from './http';
|
export * from './http';
|
||||||
@ -11,4 +11,3 @@ export * from './objects';
|
|||||||
export * from './promise-progress';
|
export * from './promise-progress';
|
||||||
export * from './string';
|
export * from './string';
|
||||||
export * from './time';
|
export * from './time';
|
||||||
export * from './upload';
|
|
||||||
|
@ -1,25 +0,0 @@
|
|||||||
import {PromiseProgress} from './promise-progress.ts';
|
|
||||||
|
|
||||||
export type UploadOptions = {
|
|
||||||
url: string;
|
|
||||||
file: File;
|
|
||||||
headers?: {[key: string]: string};
|
|
||||||
withCredentials?: boolean;
|
|
||||||
}
|
|
||||||
|
|
||||||
export function uploadWithProgress(options: UploadOptions) {
|
|
||||||
return new PromiseProgress((res, rej, prog) => {
|
|
||||||
const xhr = new XMLHttpRequest();
|
|
||||||
const formData = new FormData();
|
|
||||||
formData.append('file', options.file);
|
|
||||||
|
|
||||||
xhr.withCredentials = !!options.withCredentials
|
|
||||||
Object.entries(options.headers || {}).forEach(([key, value]) => xhr.setRequestHeader(key, value));
|
|
||||||
xhr.upload.addEventListener('progress', (event) => event.lengthComputable ? prog(event.loaded / event.total) : null);
|
|
||||||
xhr.upload.addEventListener('load', (resp) => res(resp));
|
|
||||||
xhr.upload.addEventListener('error', (err) => rej(err));
|
|
||||||
|
|
||||||
xhr.open('POST', options.url);
|
|
||||||
xhr.send(formData);
|
|
||||||
});
|
|
||||||
}
|
|
@ -8,8 +8,8 @@ export default defineConfig({
|
|||||||
entry: resolve(process.cwd(), 'src/index.ts'),
|
entry: resolve(process.cwd(), 'src/index.ts'),
|
||||||
name: 'utils',
|
name: 'utils',
|
||||||
fileName: (module, entryName) => {
|
fileName: (module, entryName) => {
|
||||||
if(module == 'es') return 'utils.mjs';
|
if(module == 'es') return 'index.mjs';
|
||||||
if(module == 'umd') return 'utils.cjs';
|
if(module == 'umd') return 'index.cjs';
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
emptyOutDir: true,
|
emptyOutDir: true,
|
||||||
|
Reference in New Issue
Block a user