WackoWiki: Hack: Async Upload

https://wackowiki.org/doc     Version: 35 (25.02.2023 13:03)

Hack: Async Upload

Compatible with: R6.1
Current version: 0.4.beta
Credits: WikiAdmin[link1]

{{upload}}

async_upload_patch.zip[link2]

2 of 2 Files accessible from this page :

async_upload_patch.0.5.zip[link3] for WackoWiki 6.1.19 and later 13.4 KiB  11.03.2023 11:49 
async_upload_patch.zip[link2] Asynchronous Upload Patch for R6.1 6.9 KiB  02.11.2022 10:53 


Put the files in the following folders:
folder / file
action/upload.php
action/template/upload.tpl
js/upload.js
handler/page/upload.php
handler/page/template/upload.tpl

1. Documentation

Action - module for bulk upload files on a WackoWiki site with a record in the database.

Features:
  1. uses Fetch API to upload (even large) files
  2. chose and upload multiple files at once

const url = 'handler/page/upload.php';
const form = document.querySelector('form');

form.addEventListener('submit', e => {
    e.preventDefault();

    const files = document.querySelector('[type=file]').files;
    const formData = new FormData();

    for (let i = 0; i < files.length; i++)
    {
        let file = files[i];

        formData.append('files[]', file);
    }

    fetch(url, {
        method: 'POST',
        body: formData
    }).then(response => {
        console.log(response);
    });
});


Resources

1.1. Configuration

1.2. How to use it

- same as current upload action

Drop-in replacement, just copy the files of this patch over the current ones.

2. Changelog

0.1 Intitial version - proof of concept
0.2 Merged changes from repo head
0.3 Changed names of time fields
0.4 minor changes

3. To Do

  1. may crash the browser while uploading a stack of large files
    1. set file limit
  2. provide a common summary after the upload of multiple files
    1. currently it shows only the last result
  3. preview files for upload
    1. shows thumbnail of image
    2. modify the file name and the file description
  4. test features