WEBRAD / TECHNICAL REFERENCE

Video Upload

Upload videos to RestGO with progress and resume support.

WebVideoUploadNonvisualNonvisual8 events

Quick start

Add VideoUpload1 in the Designer. Use the example in a page method.

const selection = await VideoUpload1.OpenFile();
if (!selection) return;
VideoUpload1.title = 'Presentation';
VideoUpload1.descri = 'Product video';
VideoUpload1.isPublic = false;
try {
  const video = await VideoUpload1.SendToRestGO();
  Message(video.id);
  await VideoUpload1.WaitUntilReady({ timeoutMs: 600_000 });
} catch (error) {
  Message(error instanceof Error ? error.message : String(error));
}
// Pause(), Resume(), CancelUpload(), and Clear() control the upload.

Configure accept, maxFileSizeMB, and maxDurationSeconds; null disables optional limits.
OpenFile() selects; SendToRestGO() uploads in chunks. percentage tracks uploading and processingProgress tracks conversion.
Pause() preserves the checkpoint. Resume() uses the same file; after reloading, select it again and pass the saved resumeToken.
CancelUpload() cancels the remote session. Clear() clears local state.
OnProgress, OnStateChange, OnUploadComplete, OnProcessingProgress, OnReady, OnError, and OnComplete track the stages.

Inspector properties

Component options and defaults. Fields without runtime access are configured in the Inspector.

Property / source	Type and options	Default	Runtime access
`name`Name · Identity	`string`	`—`	name
`accept`Accepted video types · BehaviorChooser filter. RestGo accepts MP4, MOV, MKV and WebM.	`string`	`".mp4,.mov,.mkv,.webm"`	accept
`enabled`Enabled · Behavior	`boolean`	`true`	enabled
`title`Title · VideoEmpty uses the filename as the title on RestGo.	`string`	`""`	title
`descri`Description · Video	`string`	`""`	descri
`isPublic`Public video · VideoPublic upload requires server permission. Private by default.	`boolean`	`false`	isPublic
`chunkSizeBytes`Chunk size (bytes) · UploadPositive integer. Automatically capped at the session maxChunkBytes.	`number`	`8388608`	chunkSizeBytes
`maxFileSizeMB`Maximum file size (MB) · LimitsOptional local limit, 1 MB = 1024² bytes. Leave empty for no local limit; server limits still apply.	`number`	`null`	maxFileSizeMB
`maxDurationSeconds`Maximum duration (seconds) · LimitsOptional positive limit. The browser must be able to read the duration; leave empty to disable.	`number`	`null`	maxDurationSeconds

API in code

Member	Signature	Access
`title`	`title: string;`	Read and write
`descri`	`descri: string;`	Read and write
`isPublic`	`isPublic: boolean;`	Read and write
`accept`	`get accept(): string;`	Read and write
`enabled`	`get enabled(): boolean;`	Read and write
`maxFileSizeMB`	`get maxFileSizeMB(): number \| null;`	Read and write
`maxDurationSeconds`	`get maxDurationSeconds(): number \| null;`	Read and write
`chunkSizeBytes`	`get chunkSizeBytes(): number;`	Read and write
`selectedFile`	`get selectedFile(): File \| null;`	Read-only
`selection`	`get selection(): WebVideoUploadSelection \| null;`	Read-only
`uploadSession`	`get uploadSession(): import("@webrad/restgo-sdk").RestGoVideoUploadSession \| null;`	Read-only
`resumeToken`	`get resumeToken(): import("@webrad/restgo-sdk").RestGoVideoResumeToken \| null;`	Read-only
`video`	`get video(): import("@webrad/restgo-sdk").RestGoVideo \| null;`	Read-only
`state`	`get state(): WebVideoUploadState;`	Read-only
`confirmedBytes`	`get confirmedBytes(): number;`	Read-only
`totalBytes`	`get totalBytes(): number;`	Read-only
`percentage`	`get percentage(): number \| null;`	Read-only
`processingProgress`	`get processingProgress(): number \| null;`	Read-only
`error`	`get error(): Error \| null;`	Read-only
`onChange`	`set onChange(handler: WebComponentEventHandler<this> \| null);`	Read and write
`onProgress`	`set onProgress(handler: WebComponentEventHandler<this> \| null);`	Read and write
`onStateChange`	`set onStateChange(handler: WebComponentEventHandler<this> \| null);`	Read and write
`onUploadComplete`	`set onUploadComplete(handler: WebComponentEventHandler<this> \| null);`	Read and write
`onProcessingProgress`	`set onProcessingProgress(handler: WebComponentEventHandler<this> \| null);`	Read and write
`onReady`	`set onReady(handler: WebComponentEventHandler<this> \| null);`	Read and write
`onError`	`set onError(handler: WebComponentEventHandler<this> \| null);`	Read and write
`onComplete`	`set onComplete(handler: WebComponentEventHandler<this> \| null);`	Read and write

`OpenFile`

method

OpenFile(): Promise<WebVideoUploadSelection | null>;

Opens the chooser from a user gesture. It never creates or sends an upload.

Example

await VideoUpload1.OpenFile();

`SendToRestGO`

method

SendToRestGO(options?: WebVideoUploadOptions): Promise<import("@webrad/restgo-sdk").RestGoVideo>;

Example

await VideoUpload1.SendToRestGO({ isPublic: false });

`Resume`

method

Resume(options?: WebVideoUploadResumeOptions): Promise<import("@webrad/restgo-sdk").RestGoVideo>;

Example

await VideoUpload1.Resume();

`Pause`

method

Pause(): void;

Aborts only local upload I/O. The server session remains resumable.

Example

VideoUpload1.Pause();

`CancelUpload`

method

CancelUpload(): Promise<void>;

Explicitly cancels the open upload on RestGo. It does not cancel conversion jobs.

Example

await VideoUpload1.CancelUpload();

`WaitUntilReady`

method

WaitUntilReady(options?: import("@webrad/restgo-sdk").RestGoVideoWaitOptions): Promise<import("@webrad/restgo-sdk").RestGoVideo>;

Example

await VideoUpload1.WaitUntilReady({ timeoutMs: 600_000 });

`Clear`

method

Clear(): void;

Clears local state and stops requests. No remote video/session is deleted.

Example

VideoUpload1.Clear();

`dispose`

method

dispose(): void;

Example

// Call only when disposing of an instance whose lifecycle you control.
VideoUpload1.dispose();

Inherited members (4)

Member	Signature	Access
`id`	`readonly id: string;`	Read-only
`name`	`readonly name: string;`	Read-only

`bindEvent`

method

bindEvent(eventName: string, handler: WebComponentEventHandler<this> | null): () => void;

`emit`

method

emit(eventName: string, detail?: unknown): boolean;

Events

Link methods in Interaction. How to use events.

OnChange

WebVideoUploadChangeEventDetail in event.detail

Signature and example

import type { WebVideoUpload, WebVideoUploadChangeEventDetail } from '@webrad/runtime';
// Copy this method into the page class and link it in Interaction.
class Example {
  public async VideoUpload1Change(
    sender: WebVideoUpload,
    event: CustomEvent<WebVideoUploadChangeEventDetail>,
  ): Promise<void> {
    console.log(event.detail);
  }
}

OnProgress

WebVideoUploadProgressEventDetail in event.detail · confirmedBytes, totalBytes, percentage, chunk

Signature and example

import type { WebVideoUpload, WebVideoUploadProgressEventDetail } from '@webrad/runtime';
// Copy this method into the page class and link it in Interaction.
class Example {
  public async VideoUpload1Progress(
    sender: WebVideoUpload,
    event: CustomEvent<WebVideoUploadProgressEventDetail>,
  ): Promise<void> {
    console.log(event.detail);
    const { confirmedBytes, totalBytes, percentage, chunk } = event.detail;
    console.log(confirmedBytes, totalBytes, percentage, chunk);
  }
}

OnStateChange

WebVideoUploadStateEventDetail in event.detail · previous, state

Signature and example

import type { WebVideoUpload, WebVideoUploadStateEventDetail } from '@webrad/runtime';
// Copy this method into the page class and link it in Interaction.
class Example {
  public async VideoUpload1StateChange(
    sender: WebVideoUpload,
    event: CustomEvent<WebVideoUploadStateEventDetail>,
  ): Promise<void> {
    console.log(event.detail);
    const { previous, state } = event.detail;
    console.log(previous, state);
  }
}

OnUploadComplete

WebVideoUploadResult in event.detail

Signature and example

import type { WebVideoUpload, WebVideoUploadResult } from '@webrad/runtime';
// Copy this method into the page class and link it in Interaction.
class Example {
  public async VideoUpload1UploadComplete(
    sender: WebVideoUpload,
    event: CustomEvent<WebVideoUploadResult>,
  ): Promise<void> {
    console.log(event.detail);
  }
}

OnProcessingProgress

WebVideoUploadProcessingEventDetail in event.detail · video, jobs

Signature and example

import type { WebVideoUpload, WebVideoUploadProcessingEventDetail } from '@webrad/runtime';
// Copy this method into the page class and link it in Interaction.
class Example {
  public async VideoUpload1ProcessingProgress(
    sender: WebVideoUpload,
    event: CustomEvent<WebVideoUploadProcessingEventDetail>,
  ): Promise<void> {
    console.log(event.detail);
    const { video, jobs } = event.detail;
    console.log(video, jobs);
  }
}

OnReady

WebVideoUploadResult in event.detail

Signature and example

import type { WebVideoUpload, WebVideoUploadResult } from '@webrad/runtime';
// Copy this method into the page class and link it in Interaction.
class Example {
  public async VideoUpload1Ready(
    sender: WebVideoUpload,
    event: CustomEvent<WebVideoUploadResult>,
  ): Promise<void> {
    console.log(event.detail);
  }
}

OnError

Error in event.detail

Signature and example

import type { WebVideoUpload } from '@webrad/runtime';
// Copy this method into the page class and link it in Interaction.
class Example {
  public async VideoUpload1Error(
    sender: WebVideoUpload,
    event: CustomEvent<Error>,
  ): Promise<void> {
    Message(event.detail.message);
  }
}

OnComplete

WebVideoUploadCompleteEventDetail in event.detail · operation, video, error

Signature and example

import type { WebVideoUpload, WebVideoUploadCompleteEventDetail } from '@webrad/runtime';
// Copy this method into the page class and link it in Interaction.
class Example {
  public async VideoUpload1Complete(
    sender: WebVideoUpload,
    event: CustomEvent<WebVideoUploadCompleteEventDetail>,
  ): Promise<void> {
    console.log(event.detail);
    const { operation, video, error } = event.detail;
    console.log(operation, video, error);
  }
}