56 lines
1.9 KiB
JavaScript
56 lines
1.9 KiB
JavaScript
import { addFiles } from './on_files_change.js';
|
|
import { onFilesChange } from './on_files_change.js';
|
|
import { onFolderChange } from './on_folder_change.js';
|
|
import { findNode, flattenFiles, render } from './render.js';
|
|
|
|
export function initUploadTable(cfg) {
|
|
const elements = {
|
|
fileInputEl: cfg.fileInputEl,
|
|
folderInputEl: cfg.folderInputEl,
|
|
tableBodyEl: cfg.tableBodyEl,
|
|
countEl: cfg.countEl,
|
|
};
|
|
const state = { nodes: [], fileMeta: new Map(), busy: false };
|
|
elements.fileInputEl.addEventListener('change', onFilesChange(state, cfg, elements));
|
|
elements.folderInputEl.addEventListener('change', onFolderChange(state, cfg, elements));
|
|
elements.tableBodyEl.addEventListener('click', (event) => {
|
|
const toggle = event.target.closest('[data-toggle]');
|
|
if (toggle) {
|
|
const found = findNode(state.nodes, toggle.dataset.toggle);
|
|
if (found) found.node.expanded = !found.node.expanded;
|
|
render(state, elements);
|
|
return;
|
|
}
|
|
const remove = event.target.closest('[data-remove]');
|
|
if (remove) {
|
|
const found = findNode(state.nodes, remove.dataset.remove);
|
|
if (found) found.nodes.splice(found.nodes.indexOf(found.node), 1);
|
|
render(state, elements);
|
|
}
|
|
});
|
|
|
|
const api = {
|
|
pickFiles: () => elements.fileInputEl.click(),
|
|
pickFolder: () => elements.folderInputEl.click(),
|
|
addFiles: (files) => addFiles(state, cfg, files, elements),
|
|
getFiles: () => flattenFiles(state.nodes),
|
|
remove: (id) => {
|
|
const found = findNode(state.nodes, id);
|
|
if (found) found.nodes.splice(found.nodes.indexOf(found.node), 1);
|
|
render(state, elements);
|
|
},
|
|
render: () => render(state, elements),
|
|
clear: () => {
|
|
state.nodes = [];
|
|
state.fileMeta.clear();
|
|
render(state, elements);
|
|
},
|
|
setBusy: (busy) => {
|
|
state.busy = busy;
|
|
elements.fileInputEl.disabled = busy;
|
|
elements.folderInputEl.disabled = busy;
|
|
},
|
|
};
|
|
api.render();
|
|
return api;
|
|
} |