WEBRAD / TECHNICAL REFERENCE

Timer

Nonvisual timer with single or repeated execution.

WebTimerNonvisualNonvisual3 events

Quick start

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

Timer1.time = 1000;
Timer1.loop = true;
Timer1.onTimer = (sender) => {
  Message(sender.tickCount);
  if (sender.tickCount >= 5) sender.Stop();
};
Timer1.Start();
// Timer1.Stop();
// Timer1.Restart();

Configure Time (ms), Loop, and Enabled in the nonvisual component tray.
time accepts an integer between 1 and 2147483647 ms. Changing time while running restarts the current interval.
Start() starts and resets tickCount; called while running, it preserves the count. Stop() stops; Restart() stops and starts again.
loop = false runs once. OnTimer receives detail.tick; OnStart and OnStop track state.
Each page or reusable component has its own instance; disposal cancels the timer.

More examples

Single execution with typed detail

import type { WebTimer, WebTimerEventDetail } from '@webrad/runtime';
// Set Loop = false and link this method to OnTimer.
class Example {
  public async Timer1Timer(
    sender: WebTimer,
    event: CustomEvent<WebTimerEventDetail>,
  ): Promise<void> {
    Message(event.detail.tick);
    // For single execution, sender.enabled is already false in this event.
  }
}

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
`time`Time (ms) · BehaviorInterval in milliseconds (1 to 2147483647). Changing it restarts the current interval.	`number`	`1000`	time
`loop`Loop · Behavior	`boolean`	`true`	loop
`enabled`Enabled · Behavior	`boolean`	`false`	enabled

API in code

Member	Signature	Access
`time`	`get time(): number;`	Read and write
`loop`	`get loop(): boolean;`	Read and write
`enabled`	`get enabled(): boolean;`	Read and write
`tickCount`	`get tickCount(): number;`	Read-only
`onTimer`	`set onTimer(handler: WebComponentEventHandler<this> \| null);`	Read and write
`onStart`	`set onStart(handler: WebComponentEventHandler<this> \| null);`	Read and write
`onStop`	`set onStop(handler: WebComponentEventHandler<this> \| null);`	Read and write

`Start`

method

Start(): void;

Starts a new run; calling Start while running has no effect.

Example

Timer1.Start();

`Stop`

method

Stop(): void;

Example

Timer1.Stop();

`Restart`

method

Restart(): void;

Example

Timer1.Restart();

`dispose`

method

dispose(): void;

Example

// Call only when disposing of an instance whose lifecycle you control.
Timer1.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.

OnTimer

WebTimerEventDetail in event.detail · tick

Signature and example

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

OnStart

Standard event (Event).

Signature and example

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

OnStop

Standard event (Event).

Signature and example

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