com.github.fluorumlabs.disconnect.vaadin.Upload Maven / Gradle / Ivy
Go to download
Show more of this group Show more artifacts with this name
Show all versions of disconnect-vaadin Show documentation
Show all versions of disconnect-vaadin Show documentation
Vaadin components bindings for Disconnect Zero
The newest version!
package com.github.fluorumlabs.disconnect.vaadin;
import com.github.fluorumlabs.disconnect.core.annotations.WebComponent;
import com.github.fluorumlabs.disconnect.polymer.types.BooleanPropertyChangeEvent;
import com.github.fluorumlabs.disconnect.polymer.types.PropertyChangeEvent;
import com.github.fluorumlabs.disconnect.vaadin.constants.UploadMethod;
import com.github.fluorumlabs.disconnect.vaadin.elements.UploadElement;
import com.github.fluorumlabs.disconnect.vaadin.i18n.UploadI18n;
import com.github.fluorumlabs.disconnect.vaadin.types.UploadEvent;
import com.github.fluorumlabs.disconnect.vaadin.types.UploadRejectEvent;
import com.github.fluorumlabs.disconnect.vaadin.types.UploadRequestEvent;
import com.github.fluorumlabs.disconnect.vaadin.types.UploadingFile;
import com.github.fluorumlabs.disconnect.zero.component.*;
import com.github.fluorumlabs.disconnect.zero.observable.ObservableEvent;
import js.util.StringRecord;
import js.util.collections.Array;
import javax.annotation.Nullable;
/**
* <vaadin-upload> is a Web Component for uploading multiple files with drag and drop support.
*
* Example:
*
*
<vaadin-upload></vaadin-upload>
*
* Styling
* The following shadow DOM parts are available for styling:
*
*
*
* Part name Description primary-buttonsUpload container upload-buttonUpload button drop-labelLabel for drop indicator drop-label-iconIcon for drop indicator file-listFile list container
* The following state attributes are available for styling:
*
*
*
* Attribute Description Part name nodropSet when drag and drop is disabled (e. g., on touch devices)
* :hostdragoverA file is being dragged over the element :hostdragover-validA dragged file is valid with maxFiles and
* accept criteria :host
* See
* ThemableMixin – how to apply styles for shadow parts
*/
@WebComponent
public class Upload extends AbstractComponent
implements HasSlots,
HasStyle, HasComponents> {
public Upload() {
super(UploadElement.TAGNAME());
}
/**
* Define whether the element supports dropping files on it for uploading.
* By default it's enabled in desktop and disabled in touch devices
* because mobile devices do not support drag events in general. Setting
* it false means that drop is enabled even in touch-devices, and true
* disables drop in all devices.
*/
public boolean nodrop() {
return getNode().isNodrop();
}
/**
* Define whether the element supports dropping files on it for uploading.
* By default it's enabled in desktop and disabled in touch devices
* because mobile devices do not support drag events in general. Setting
* it false means that drop is enabled even in touch-devices, and true
* disables drop in all devices.
*/
public Upload nodrop(boolean nodrop) {
getNode().setNodrop(nodrop);
return this;
}
/**
* The server URL. The default value is an empty string, which means that
* window.location will be used.
*/
@Nullable
public String target() {
return getNode().getTarget();
}
/**
* The server URL. The default value is an empty string, which means that
* window.location will be used.
*/
public Upload target(String target) {
getNode().setTarget(target);
return this;
}
/**
* HTTP Method used to send the files. Only POST and PUT are allowed.
*/
@Nullable
public UploadMethod method() {
return getNode().getMethod();
}
/**
* HTTP Method used to send the files. Only POST and PUT are allowed.
*/
public Upload method(UploadMethod method) {
getNode().setMethod(method);
return this;
}
/**
* Key-Value map to send to the server. If you set this property as an
* attribute, use a valid JSON string, for example:
*
* <vaadin-upload headers='{"X-Foo": "Bar"}'></vaadin-upload>
*
*/
@Nullable
public StringRecord headers() {
return getNode().getHeaders();
}
/**
* FIXME type Object | null | undefined
* Key-Value map to send to the server. If you set this property as an
* attribute, use a valid JSON string, for example:
*
* <vaadin-upload headers='{"X-Foo": "Bar"}'></vaadin-upload>
*
*/
public Upload headers(StringRecord headers) {
getNode().setHeaders(headers);
return this;
}
/**
* Max time in milliseconds for the entire upload process, if exceeded the
* request will be aborted. Zero means that there is no timeout.
*/
public int timeout() {
return getNode().getTimeout();
}
/**
* Max time in milliseconds for the entire upload process, if exceeded the
* request will be aborted. Zero means that there is no timeout.
*/
public Upload timeout(int timeout) {
getNode().setTimeout(timeout);
return this;
}
/**
* The array of files being processed, or already uploaded.
*
* Each element is a File
* object with a number of extra properties to track the upload process:
*
*
* uploadTarget: The target URL used to upload this file.elapsed: Elapsed time since the upload started.elapsedStr: Human-readable elapsed time.remaining: Number of seconds remaining for the upload to finish.remainingStr: Human-readable remaining time for the upload to finish.progress: Percentage of the file already uploaded.speed: Upload speed in kB/s.size: File size in bytes.totalStr: Human-readable total size of the file.loaded: Bytes transferred so far.loadedStr: Human-readable uploaded size at the moment.status: Status of the upload process.error: Error message in case the upload failed.abort: True if the file was canceled by the user.complete: True when the file was transferred to the server.uploading: True while transferring data to the server.
*/
@Nullable
public Array files() {
return getNode().getFiles();
}
/**
* The array of files being processed, or already uploaded.
*
* Each element is a File
* object with a number of extra properties to track the upload process:
*
*
* uploadTarget: The target URL used to upload this file.elapsed: Elapsed time since the upload started.elapsedStr: Human-readable elapsed time.remaining: Number of seconds remaining for the upload to finish.remainingStr: Human-readable remaining time for the upload to finish.progress: Percentage of the file already uploaded.speed: Upload speed in kB/s.size: File size in bytes.totalStr: Human-readable total size of the file.loaded: Bytes transferred so far.loadedStr: Human-readable uploaded size at the moment.status: Status of the upload process.error: Error message in case the upload failed.abort: True if the file was canceled by the user.complete: True when the file was transferred to the server.uploading: True while transferring data to the server.
*/
public Upload files(UploadingFile... files) {
getNode().setFiles(files);
return this;
}
public Upload files(Array files) {
getNode().setFiles(files);
return this;
}
/**
* Limit of files to upload, by default it is unlimited. If the value is
* set to one, native file browser will prevent selecting multiple files.
*/
public int maxFiles() {
return getNode().getMaxFiles();
}
/**
* Limit of files to upload, by default it is unlimited. If the value is
* set to one, native file browser will prevent selecting multiple files.
*/
public Upload maxFiles(int maxFiles) {
getNode().setMaxFiles(maxFiles);
return this;
}
/**
* Specifies if the maximum number of files have been uploaded
*/
public boolean maxFilesReached() {
return getNode().isMaxFilesReached();
}
/**
* Specifies the types of files that the server accepts.
* Syntax: a comma-separated list of MIME type patterns (wildcards are
* allowed) or file extensions.
* Notice that MIME types are widely supported, while file extensions
* are only implemented in certain browsers, so avoid using it.
* Example: accept="video/*,image/tiff" or accept=".pdf,audio/mp3"
*/
@Nullable
public String accept() {
return getNode().getAccept();
}
/**
* Specifies the types of files that the server accepts.
* Syntax: a comma-separated list of MIME type patterns (wildcards are
* allowed) or file extensions.
* Notice that MIME types are widely supported, while file extensions
* are only implemented in certain browsers, so avoid using it.
* Example: accept="video/*,image/tiff" or accept=".pdf,audio/mp3"
*/
public Upload accept(String accept) {
getNode().setAccept(accept);
return this;
}
/**
* Specifies the maximum file size in bytes allowed to upload.
* Notice that it is a client-side constraint, which will be checked before
* sending the request. Obviously you need to do the same validation in
* the server-side and be sure that they are aligned.
*/
public int maxFileSize() {
return getNode().getMaxFileSize();
}
/**
* Specifies the maximum file size in bytes allowed to upload.
* Notice that it is a client-side constraint, which will be checked before
* sending the request. Obviously you need to do the same validation in
* the server-side and be sure that they are aligned.
*/
public Upload maxFileSize(int maxFileSize) {
getNode().setMaxFileSize(maxFileSize);
return this;
}
/**
* Specifies the 'name' property at Content-Disposition
*/
@Nullable
public String formDataName() {
return getNode().getFormDataName();
}
/**
* Specifies the 'name' property at Content-Disposition
*/
public Upload formDataName(String formDataName) {
getNode().setFormDataName(formDataName);
return this;
}
/**
* Prevents upload(s) from immediately uploading upon adding file(s).
* When set, you must manually trigger uploads using the uploadFiles method
*/
public boolean noAuto() {
return getNode().isNoAuto();
}
/**
* Prevents upload(s) from immediately uploading upon adding file(s).
* When set, you must manually trigger uploads using the uploadFiles method
*/
public Upload noAuto(boolean noAuto) {
getNode().setNoAuto(noAuto);
return this;
}
/**
* Set the withCredentials flag on the request.
*/
public boolean withCredentials() {
return getNode().isWithCredentials();
}
/**
* Set the withCredentials flag on the request.
*/
public Upload withCredentials(boolean withCredentials) {
getNode().setWithCredentials(withCredentials);
return this;
}
/**
* Pass-through to input's capture attribute. Allows user to trigger device inputs
* such as camera or microphone immediately.
*/
@Nullable
public String capture() {
return getNode().getCapture();
}
/**
* Pass-through to input's capture attribute. Allows user to trigger device inputs
* such as camera or microphone immediately.
*/
public Upload capture(String capture) {
getNode().setCapture(capture);
return this;
}
/**
* The object used to localize this component.
* For changing the default localization, change the entire
* i18n object or just the property you want to modify.
*
* The object has the following JSON structure and default values:
*
*
{
* dropFiles: {
* one: 'Drop file here
* many: 'Drop files here
* },
* addFiles: {
* one: 'Select File...',
* many: 'Upload Files...'
* },
* cancel: 'Cancel',
* error: {
* tooManyFiles: 'Too Many Files.',
* fileIsTooBig: 'File is Too Big.',
* incorrectFileType: 'Incorrect File Type.'
* },
* uploading: {
* status: {
* connecting: 'Connecting...',
* stalled: 'Stalled.',
* processing: 'Processing File...',
* held: 'Queued'
* },
* remainingTime: {
* prefix: 'remaining time: ',
* unknown: 'unknown remaining time'
* },
* error: {
* serverUnavailable: 'Server Unavailable',
* unexpectedServerError: 'Unexpected Server Error',
* forbidden: 'Forbidden'
* }
* },
* units: {
* size: ['B', 'kB', 'MB', 'GB', 'TB', 'PB', 'EB', 'ZB', 'YB']
* },
* formatSize: function(bytes) {
* // returns the size followed by the best suitable unit
* },
* formatTime: function(seconds, [secs, mins, hours]) {
* // returns a 'HH:MM:SS' string
* }
* }
*
*/
@Nullable
public UploadI18n i18n() {
return getNode().getI18n();
}
/**
* The object used to localize this component.
* For changing the default localization, change the entire
* i18n object or just the property you want to modify.
*
* The object has the following JSON structure and default values:
*
*
{
* dropFiles: {
* one: 'Drop file here
* many: 'Drop files here
* },
* addFiles: {
* one: 'Select File...',
* many: 'Upload Files...'
* },
* cancel: 'Cancel',
* error: {
* tooManyFiles: 'Too Many Files.',
* fileIsTooBig: 'File is Too Big.',
* incorrectFileType: 'Incorrect File Type.'
* },
* uploading: {
* status: {
* connecting: 'Connecting...',
* stalled: 'Stalled.',
* processing: 'Processing File...',
* held: 'Queued'
* },
* remainingTime: {
* prefix: 'remaining time: ',
* unknown: 'unknown remaining time'
* },
* error: {
* serverUnavailable: 'Server Unavailable',
* unexpectedServerError: 'Unexpected Server Error',
* forbidden: 'Forbidden'
* }
* },
* units: {
* size: ['B', 'kB', 'MB', 'GB', 'TB', 'PB', 'EB', 'ZB', 'YB']
* },
* formatSize: function(bytes) {
* // returns the size followed by the best suitable unit
* },
* formatTime: function(seconds, [secs, mins, hours]) {
* // returns a 'HH:MM:SS' string
* }
* }
*
*/
public Upload i18n(UploadI18n i18n) {
getNode().setI18n(i18n);
return this;
}
/**
* Triggers the upload of any files that are not completed
*/
public void uploadFiles(UploadingFile... files) {
getNode().uploadFiles(files);
}
public void uploadFiles(Array files) {
getNode().uploadFiles(files);
}
/**
* Fired when a file cannot be added to the queue due to a constrain:
* file-size, file-type or maxFiles
*/
public ObservableEvent fileRejectEvent() {
return createEvent("file-reject");
}
/**
* Fired when retry abort is requested. If the default is prevented, then the
* file upload would not be aborted.
*/
public ObservableEvent uploadAbortEvent() {
return createEvent("upload-abort");
}
/**
* Fired before the XHR is opened. Could be used for changing the request
* URL. If the default is prevented, then XHR would not be opened.
*/
public ObservableEvent uploadBeforeEvent() {
return createEvent("upload-before");
}
/**
* Fired in case the upload process failed.
*/
public ObservableEvent uploadErrorEvent() {
return createEvent("upload-error");
}
/**
* Fired as many times as the progress is updated.
*/
public ObservableEvent uploadProgressEvent() {
return createEvent("upload-progress");
}
/**
* Fired when the XHR has been opened but not sent yet. Useful for appending
* data keys to the FormData object, for changing some parameters like
* headers, etc. If the event is defaultPrevented, vaadin-upload will not
* send the request allowing the user to do something on his own.
*/
public ObservableEvent uploadRequestEvent() {
return createEvent("upload-request");
}
/**
* Fired when we have the actual server response, and before the component
* analyses it. It's useful for developers to make the upload fail depending
* on the server response. If the event is defaultPrevented the vaadin-upload
* will return allowing the user to do something on his own like retry the
* upload, etc. since he has full access to the xhr and file objects.
* Otherwise, if the event is not prevented default vaadin-upload continues
* with the normal workflow checking the xhr.status and file.error
* which also might be modified by the user to force a customized response.
*/
public ObservableEvent uploadResponseEvent() {
return createEvent("upload-response");
}
/**
* Fired when retry upload is requested. If the default is prevented, then
* retry would not be performed.
*/
public ObservableEvent uploadRetryEvent() {
return createEvent("upload-retry");
}
/**
* Fired when the XHR is sent.
*/
public ObservableEvent uploadStartEvent() {
return createEvent("upload-start");
}
/**
* Fired in case the upload process succeed.
*/
public ObservableEvent uploadSuccessEvent() {
return createEvent("upload-success");
}
/**
* Fired when the files property changes.
*/
public ObservableEvent>> filesChangedEvent() {
return createEvent("files-changed");
}
/**
* Fired when the maxFilesReached property changes.
*/
public ObservableEvent maxFilesReachedChangedEvent() {
return createEvent("max-files-reached-changed");
}
public HasSlots.Container addButtonSlot() {
return slotted("add-button");
}
public HasSlots.Container dropLabelIconSlot() {
return slotted("drop-label-icon");
}
public HasSlots.Container dropLabelSlot() {
return slotted("drop-label");
}
public HasSlots.Container fileListSlot() {
return slotted("file-list");
}
}