snackbar.ts

1	import { poly_animate } from "./animate";
2	import { delay } from "./utils";
3
4	export async function showSnackbar(
5	text: string,
6	fadeDurationMs: number = 500,
7	showDurationMs: number = 3000) {
8
9	const div = document.createElement('div');
10	div.id = 'snackbar';
11	div.classList.add('info');
12	div.classList.add('show');
13	div.innerText = text;
14	document.body.appendChild(div);
15
16	const invisibleKeyframe = {
17	opacity: 0,
18	bottom: '0px'
19	};
20	const visibleKeyframe = {
21	opacity: 1,
22	bottom: '30px'
23	};
24	const options = { duration: fadeDurationMs, iterations: 1 };
25	await poly_animate(div, [invisibleKeyframe, visibleKeyframe], options);
26	await delay(showDurationMs);
27	await poly_animate(div, [visibleKeyframe, invisibleKeyframe], options);
28	div.parentNode.removeChild(div);
29	}