import { createElement, createFragment, createRender } from "../../lib/skeleton/index.js"; import { animate, slideYOut } from "../../lib/animate.js"; import rxjs, { effect, onClick } from "../../lib/rx.js"; import { loadCSS } from "../../helpers/loader.js"; import { qs } from "../../lib/dom.js"; export default function(render) { const $page = createFragment(`
`); componentFilezone(createRender($page.children[0])); componentUploadQueue(createRender($page.children[1])); componentUploadFAB(createRender($page.children[2])); render($page); } export function init() { return loadCSS(import.meta.url, "./ctrl_upload.css"); } function componentUploadQueue(render) { const $page = createElement(` `); render($page); effect(onClick(qs($page, "img[alt=\"close\"]")).pipe( rxjs.mergeMap(() => animate($page, { time: 200, keyframes: slideYOut(50) })), rxjs.tap(() => $page.classList.add("hidden")), )); } function componentFilezone(render) { // document.body // .querySelector(`[data-bind="filemanager-children"]`) // .classList.add("dropzone"); } function componentUploadFAB(render) { render(createElement(`
`)); }