file-uploader-component/dist/index.js

A reactjs and vuejs component of file uploader.

import { __extends } from 'tslib';
window.__extends = __extends;
/**
 * @public
 */
export var defaultLocale = {
    dragAndDrop: 'Upload files by dragging & dropping,',
    selectFile: 'selecting them',
    pasteFromClipboard: ', or pasting from the clipboard.'
};
/**
 * @public
 */
export function getLocale(locale) {
    return locale || defaultLocale;
}
function upload(name, url, method, file, fileGot, fileUploaded, progress, requestCreated, beforeRequest) {
    fileGot();
    if (name && url && method) {
        var request_1 = new XMLHttpRequest();
        var uploadRequest_1 = {
            request: request_1,
            file: file,
            percent: 0
        };
        request_1.upload.onprogress = function (e) {
            var percent = Math.round(100 * e.loaded / e.total);
            progress(percent);
            uploadRequest_1.percent = percent;
        };
        request_1.onreadystatechange = function () {
            if (request_1.readyState === XMLHttpRequest.DONE) {
                fileUploaded(request_1);
            }
        };
        request_1.open(method, url);
        var formData = new FormData();
        formData.append(name, file);
        if (beforeRequest) {
            beforeRequest(request_1, formData);
        }
        request_1.send(formData);
        requestCreated(uploadRequest_1);
    }
}
/**
 * @public
 */
export function onDrop(e, name, url, method, fileGot, fileUploaded, progress, requestCreated, beforeRequest) {
    if (e.dataTransfer) {
        var files = e.dataTransfer.files;
        if (files.length > 0) {
            e.preventDefault();
            e.stopPropagation();
            var _loop_1 = function (i) {
                var file = files.item(i);
                if (file) {
                    upload(name, url, method, file, function () {
                        fileGot(file);
                    }, function (request) {
                        fileUploaded(request);
                    }, function (percent) {
                        progress(percent);
                    }, function (fileRequest) {
                        requestCreated(fileRequest);
                    }, beforeRequest);
                }
            };
            for (var i = 0; i < files.length; i++) {
                _loop_1(i);
            }
        }
    }
}
/**
 * @public
 */
export function onPaste(e, name, url, method, fileGot, fileUploaded, progress, requestCreated, beforeRequest) {
    if (!e.clipboardData) {
        return;
    }
    var items = e.clipboardData.items;
    if (items.length > 0) {
        e.preventDefault();
        var _loop_2 = function (i) {
            var item = items[i];
            if (item.kind === 'file') {
                var file_1 = item.getAsFile();
                if (file_1) {
                    upload(name, url, method, file_1, function () {
                        fileGot(file_1);
                    }, function (request) {
                        fileUploaded(request);
                    }, function (percent) {
                        progress(percent);
                    }, function (fileRequest) {
                        requestCreated(fileRequest);
                    }, beforeRequest);
                }
            }
        };
        for (var i = 0; i < items.length; i++) {
            _loop_2(i);
        }
    }
}
/**
 * @public
 */
export function onFileUploaded(e, name, url, method, fileGot, fileUploaded, progress, requestCreated, beforeRequest) {
    var files = e.currentTarget.files;
    if (files) {
        e.preventDefault();
        if (files.length > 0) {
            var _loop_3 = function (i) {
                var file = files.item(i);
                if (file) {
                    upload(name, url, method, file, function () {
                        fileGot(file);
                    }, function (request) {
                        fileUploaded(request);
                    }, function (percent) {
                        progress(percent);
                    }, function (fileRequest) {
                        requestCreated(fileRequest);
                    }, beforeRequest);
                }
            };
            for (var i = 0; i < files.length; i++) {
                _loop_3(i);
            }
        }
    }
}
/**
 * @public
 */
export function removeRequest(requests, request) {
    for (var i = 0; i < requests.length; i++) {
        if (requests[i].request === request) {
            requests.splice(i, 1);
            break;
        }
    }
}