flecks/packages/http/src/entry.js

66 lines
1.7 KiB
JavaScript
Raw Normal View History

2022-02-25 04:58:08 -06:00
import D from 'debug';
import {Flecks} from '@flecks/core';
/* global __non_webpack_import__ */
const {version} = require('../package.json');
let finished = 0;
let progress = 0;
const setBarStyle = (bar) => {
const {style} = bar;
style.border = 0;
style.display = 'none';
style.height = '0.17em';
style.left = 0;
style.margin = 0;
style.padding = 0;
style.position = 'absolute';
style.top = 0;
style.transition = '0.25s width, 0.5s opacity';
setTimeout(() => {
style.display = 'block';
}, 250);
};
const $progress = window.document.createElement('progress');
setBarStyle($progress);
$progress.style.width = '100%';
$progress.value = 0;
window.document.body.prepend($progress);
(async () => {
// eslint-disable-next-line no-console
console.log(`flecks client v${version} loading runtime...`);
const config = window[Symbol.for('@flecks/http/config')];
const debug = D(config['@flecks/core']?.id || 'flecks');
debug('loading runtime...');
const {default: loader} = await __non_webpack_import__(
/* @preserve webpackChunkName: "flecks-runtime" */
'@flecks/http/runtime',
);
const updater = setInterval(() => {
$progress.value += (progress - $progress.value) * 0.5;
}, 16);
const runtime = await loader((total, path) => {
finished += 1;
debug('loaded %s (%d/%d)', path, finished, total);
progress = finished / total;
});
setTimeout(() => {
clearInterval(updater);
}, 500);
// $placeholder.style.opacity = 0;
$progress.style.opacity = 0;
debug('starting client...');
const flecks = new Flecks(runtime);
window.flecks = flecks;
try {
await flecks.up('@flecks/http/client/up');
debug('up!');
}
catch (error) {
// eslint-disable-next-line no-console
console.error(error);
}
})();