plugin-essentials icon indicating copy to clipboard operation
plugin-essentials copied to clipboard

[Feature request] File type field

Open RedSparr0w opened this issue 3 years ago • 2 comments

Add a field to allow uploading a local file

Concept image: image

Optional parameters:

lines: How many lines the field should take up (similar to FPS graph)
accept/filetypes: Which file types we should accept
multiple (boolean): If we should accept multiple files

The field should be clickable to bring up a file select window or accept drag and dropping a file into the field too.

RedSparr0w avatar Mar 08 '22 06:03 RedSparr0w

Had this same case. Thought my solution might work for you @RedSparr0w . All filters can be applied to the input itself.

Used this workaround with a button: Edit: 'f' its just a pane page in my case.

let file = null;
f.addButton({
    title: 'Upload file'
}).on('click', () => {
    const input = document.createElement('input');
    input.setAttribute('type', 'file');
    input.style.opacity = '0';
    input.style.position = 'fixed';
    document.body.appendChild(input);
    input.addEventListener('input', (ev) => {
        file = input.files[0];
        document.body.removeChild(input);                
    }, { once: true })
    input.click();
})

martifenosa avatar Mar 31 '22 09:03 martifenosa

I know I'm a wee late but I needed something like this so I created a small package inspired by this - https://github.com/LuchoTurtle/tweakpane-plugin-file-import. Doesn't support multiple files yet but all contributions are welcome! Thanks @RedSparr0w for the inspiration :D

LuchoTurtle avatar Jun 03 '23 20:06 LuchoTurtle