Class Scene<T>

Type Parameters

T extends SceneFunction

Hierarchy (View Summary)

EventEmitter<SceneEventMap>
- Scene

Index

Constructors

constructor

new Scene<T extends SceneFunction>(
    app: App,
    setup: T,
    defaultOptions: SceneOptions<T>,
): Scene<T>
Type Parameters
- T extends SceneFunction
Parameters
- app: App
  The App instance
- setup: T
  The scene setup function
- defaultOptions: SceneOptions<T>
  Default scene options
Returns Scene<T>
Overrides EventEmitter.constructor
- Defined in packages/psytask/src/scene.ts:139

Properties

`Readonly`root

root: HTMLDivElement = ...

Root element

`Readonly`props

props: DeepReadonly<T extends Component<P, (...) & (...)> ? P : LooseObject>

Reactive props

See

reactive

`Optional`data

data?: T extends Component<P, D> ? () => D : () => LooseObject

Data getter

`Function`show

show: T extends Component<P, D> ? SceneShow<P, D> : T = ...

Show the scene and change props temporarily

Example

using scene = app.text('', { defaultProps: { children: 'default' } });
await scene.show({ children: 'new' }); // will show `new`
await scene.show(); // will show `default`

options

options: SceneOptions<T>

Current scene options

`Readonly`app

app: App

The App instance

`Readonly`defaultOptions

defaultOptions: SceneOptions<T>

Default scene options

`Protected`listeners

listeners: {
    "mouse:left"?: Set<(e: ...) => ...>;
    "mouse:middle"?: Set<(e: ...) => ...>;
    "mouse:right"?: Set<(e: ...) => ...>;
    "mouse:unknown"?: Set<(e: ...) => ...>;
    "scene:show"?: Set<(e: ...) => ...>;
    "scene:frame"?: Set<(e: ...) => ...>;
    "scene:close"?: Set<(e: ...) => ...>;
    cleanup?: Set<(e: ...) => ...>;
    fullscreenchange?: Set<(e: ...) => ...>;
    fullscreenerror?: Set<(e: ...) => ...>;
    abort?: Set<(e: ...) => ...>;
    animationcancel?: Set<(e: ...) => ...>;
    animationend?: Set<(e: ...) => ...>;
    animationiteration?: Set<(e: ...) => ...>;
    animationstart?: Set<(e: ...) => ...>;
    auxclick?: Set<(e: ...) => ...>;
    beforeinput?: Set<(e: ...) => ...>;
    beforetoggle?: Set<(e: ...) => ...>;
    blur?: Set<(e: ...) => ...>;
    cancel?: Set<(e: ...) => ...>;
    canplay?: Set<(e: ...) => ...>;
    canplaythrough?: Set<(e: ...) => ...>;
    change?: Set<(e: ...) => ...>;
    click?: Set<(e: ...) => ...>;
    close?: Set<(e: ...) => ...>;
    compositionend?: Set<(e: ...) => ...>;
    compositionstart?: Set<(e: ...) => ...>;
    compositionupdate?: Set<(e: ...) => ...>;
    contextlost?: Set<(e: ...) => ...>;
    contextmenu?: Set<(e: ...) => ...>;
    contextrestored?: Set<(e: ...) => ...>;
    copy?: Set<(e: ...) => ...>;
    cuechange?: Set<(e: ...) => ...>;
    cut?: Set<(e: ...) => ...>;
    dblclick?: Set<(e: ...) => ...>;
    drag?: Set<(e: ...) => ...>;
    dragend?: Set<(e: ...) => ...>;
    dragenter?: Set<(e: ...) => ...>;
    dragleave?: Set<(e: ...) => ...>;
    dragover?: Set<(e: ...) => ...>;
    dragstart?: Set<(e: ...) => ...>;
    drop?: Set<(e: ...) => ...>;
    durationchange?: Set<(e: ...) => ...>;
    emptied?: Set<(e: ...) => ...>;
    ended?: Set<(e: ...) => ...>;
    error?: Set<(e: ...) => ...>;
    focus?: Set<(e: ...) => ...>;
    focusin?: Set<(e: ...) => ...>;
    focusout?: Set<(e: ...) => ...>;
    formdata?: Set<(e: ...) => ...>;
    gotpointercapture?: Set<(e: ...) => ...>;
    input?: Set<(e: ...) => ...>;
    invalid?: Set<(e: ...) => ...>;
    keydown?: Set<(e: ...) => ...>;
    keypress?: Set<(e: ...) => ...>;
    keyup?: Set<(e: ...) => ...>;
    load?: Set<(e: ...) => ...>;
    loadeddata?: Set<(e: ...) => ...>;
    loadedmetadata?: Set<(e: ...) => ...>;
    loadstart?: Set<(e: ...) => ...>;
    lostpointercapture?: Set<(e: ...) => ...>;
    mousedown?: Set<(e: ...) => ...>;
    mouseenter?: Set<(e: ...) => ...>;
    mouseleave?: Set<(e: ...) => ...>;
    mousemove?: Set<(e: ...) => ...>;
    mouseout?: Set<(e: ...) => ...>;
    mouseover?: Set<(e: ...) => ...>;
    mouseup?: Set<(e: ...) => ...>;
    paste?: Set<(e: ...) => ...>;
    pause?: Set<(e: ...) => ...>;
    play?: Set<(e: ...) => ...>;
    playing?: Set<(e: ...) => ...>;
    pointercancel?: Set<(e: ...) => ...>;
    pointerdown?: Set<(e: ...) => ...>;
    pointerenter?: Set<(e: ...) => ...>;
    pointerleave?: Set<(e: ...) => ...>;
    pointermove?: Set<(e: ...) => ...>;
    pointerout?: Set<(e: ...) => ...>;
    pointerover?: Set<(e: ...) => ...>;
    pointerup?: Set<(e: ...) => ...>;
    progress?: Set<(e: ...) => ...>;
    ratechange?: Set<(e: ...) => ...>;
    reset?: Set<(e: ...) => ...>;
    resize?: Set<(e: ...) => ...>;
    scroll?: Set<(e: ...) => ...>;
    scrollend?: Set<(e: ...) => ...>;
    securitypolicyviolation?: Set<(e: ...) => ...>;
    seeked?: Set<(e: ...) => ...>;
    seeking?: Set<(e: ...) => ...>;
    select?: Set<(e: ...) => ...>;
    selectionchange?: Set<(e: ...) => ...>;
    selectstart?: Set<(e: ...) => ...>;
    slotchange?: Set<(e: ...) => ...>;
    stalled?: Set<(e: ...) => ...>;
    submit?: Set<(e: ...) => ...>;
    suspend?: Set<(e: ...) => ...>;
    timeupdate?: Set<(e: ...) => ...>;
    toggle?: Set<(e: ...) => ...>;
    touchcancel?: Set<(e: ...) => ...>;
    touchend?: Set<(e: ...) => ...>;
    touchmove?: Set<(e: ...) => ...>;
    touchstart?: Set<(e: ...) => ...>;
    transitioncancel?: Set<(e: ...) => ...>;
    transitionend?: Set<(e: ...) => ...>;
    transitionrun?: Set<(e: ...) => ...>;
    transitionstart?: Set<(e: ...) => ...>;
    volumechange?: Set<(e: ...) => ...>;
    waiting?: Set<(e: ...) => ...>;
    webkitanimationend?: Set<(e: ...) => ...>;
    webkitanimationiteration?: Set<(e: ...) => ...>;
    webkitanimationstart?: Set<(e: ...) => ...>;
    webkittransitionend?: Set<(e: ...) => ...>;
    wheel?: Set<(e: ...) => ...>;
    [key: `key:${string}`]: undefined | Set<(e: ...) => ...>;
} = {}

Methods

use

use<T extends Component<any, LooseObject & ForbiddenSceneData>>(
    setup: T,
    defaultProps: T extends Component<P, LooseObject & ForbiddenSceneData>
        ? P
        : never,
): ReturnType<T> & { props: T extends Component<(...), (...)> ? P : never }
Use component
Type Parameters
- T extends Component<any, LooseObject & ForbiddenSceneData>
Parameters
- setup: T
  Scene setup function
- defaultProps: T extends Component<P, LooseObject & ForbiddenSceneData> ? P : never
  Default props for the scene
Returns ReturnType<T> & { props: T extends Component<(...), (...)> ? P : never }
Example
```
using scene = app.scene(
  (props: { text: string }, ctx) => {
    const stim = ctx.use(TextStim); // use other component
    effect(() => {
      stim.props.children = 'Current text is: ' + props.text;
    });
    return {
      node: h('div', null, stim.node),
      data: () => ({
        ...stim.data(),
        length: props.text.length,
      }),
    };
  },
  { defaultProps: { text: 'default text' } },
);
```
- Defined in packages/psytask/src/scene.ts:185

config

config(patchOptions: Partial<SceneOptions<T>>): Scene<T>
Override default options temporarily
Parameters
- patchOptions: Partial<SceneOptions<T>>
Returns Scene<T>
Example
```
using scene = app.text('', { duration: 100 });
await scene.config({ duration: 200 }).show(); // will show 200ms
await scene.show(); // will show 100ms
```
- Defined in packages/psytask/src/scene.ts:203

close

close(): void
Returns void
- Defined in packages/psytask/src/scene.ts:207

[dispose]

"[dispose]"(): void
Returns void
Inherited from EventEmitter.[dispose]
- Defined in packages/psytask/src/util.ts:126

on

on<
    K extends
        | "mouse:left"
        | "mouse:middle"
        | "mouse:right"
        | "mouse:unknown"
        | `key:${string}`
        | (keyof HTMLElementEventMap)
        | "scene:show"
        | "scene:frame"
        | "scene:close"
        | "cleanup",
>(
    type: K,
    listener: (
        evt: (
            HTMLElementEventMap & {
                "scene:show": ...;
                "scene:frame": ...;
                "scene:close": ...;
            } & {
                "mouse:left": ...;
                "mouse:middle": ...;
                "mouse:right": ...;
                "mouse:unknown": ...;
            } & { [key: ...]: ... } & { cleanup: ... }
        )[K],
    ) => void,
): Scene<T>
Add event listener
Type Parameters
- K extends
      | "mouse:left"
      | "mouse:middle"
      | "mouse:right"
      | "mouse:unknown"
      | `key:${string}`
      | (keyof HTMLElementEventMap)
      | "scene:show"
      | "scene:frame"
      | "scene:close"
      | "cleanup"
Parameters
- type: K
- listener: (
      evt: (
          HTMLElementEventMap & {
              "scene:show": ...;
              "scene:frame": ...;
              "scene:close": ...;
          } & {
              "mouse:left": ...;
              "mouse:middle": ...;
              "mouse:right": ...;
              "mouse:unknown": ...;
          } & { [key: ...]: ... } & { cleanup: ... }
      )[K],
  ) => void
Returns Scene<T>
Inherited from EventEmitter.on
- Defined in packages/psytask/src/util.ts:130

off

off<
    K extends
        | "mouse:left"
        | "mouse:middle"
        | "mouse:right"
        | "mouse:unknown"
        | `key:${string}`
        | (keyof HTMLElementEventMap)
        | "scene:show"
        | "scene:frame"
        | "scene:close"
        | "cleanup",
>(
    type: K,
    listener: (
        evt: (
            HTMLElementEventMap & {
                "scene:show": ...;
                "scene:frame": ...;
                "scene:close": ...;
            } & {
                "mouse:left": ...;
                "mouse:middle": ...;
                "mouse:right": ...;
                "mouse:unknown": ...;
            } & { [key: ...]: ... } & { cleanup: ... }
        )[K],
    ) => void,
): Scene<T>
Remove event listener
Type Parameters
- K extends
      | "mouse:left"
      | "mouse:middle"
      | "mouse:right"
      | "mouse:unknown"
      | `key:${string}`
      | (keyof HTMLElementEventMap)
      | "scene:show"
      | "scene:frame"
      | "scene:close"
      | "cleanup"
Parameters
- type: K
- listener: (
      evt: (
          HTMLElementEventMap & {
              "scene:show": ...;
              "scene:frame": ...;
              "scene:close": ...;
          } & {
              "mouse:left": ...;
              "mouse:middle": ...;
              "mouse:right": ...;
              "mouse:unknown": ...;
          } & { [key: ...]: ... } & { cleanup: ... }
      )[K],
  ) => void
Returns Scene<T>
Inherited from EventEmitter.off
- Defined in packages/psytask/src/util.ts:135

once

once<
    K extends
        | "mouse:left"
        | "mouse:middle"
        | "mouse:right"
        | "mouse:unknown"
        | `key:${string}`
        | (keyof HTMLElementEventMap)
        | "scene:show"
        | "scene:frame"
        | "scene:close"
        | "cleanup",
>(
    type: K,
    listener: (
        evt: (
            HTMLElementEventMap & {
                "scene:show": ...;
                "scene:frame": ...;
                "scene:close": ...;
            } & {
                "mouse:left": ...;
                "mouse:middle": ...;
                "mouse:right": ...;
                "mouse:unknown": ...;
            } & { [key: ...]: ... } & { cleanup: ... }
        )[K],
    ) => void,
): Scene<T>
Add one-time event listener, can not be removed manually
Type Parameters
- K extends
      | "mouse:left"
      | "mouse:middle"
      | "mouse:right"
      | "mouse:unknown"
      | `key:${string}`
      | (keyof HTMLElementEventMap)
      | "scene:show"
      | "scene:frame"
      | "scene:close"
      | "cleanup"
Parameters
- type: K
- listener: (
      evt: (
          HTMLElementEventMap & {
              "scene:show": ...;
              "scene:frame": ...;
              "scene:close": ...;
          } & {
              "mouse:left": ...;
              "mouse:middle": ...;
              "mouse:right": ...;
              "mouse:unknown": ...;
          } & { [key: ...]: ... } & { cleanup: ... }
      )[K],
  ) => void
Returns Scene<T>
Inherited from EventEmitter.once
- Defined in packages/psytask/src/util.ts:140

emit

emit<
    K extends
        | "mouse:left"
        | "mouse:middle"
        | "mouse:right"
        | "mouse:unknown"
        | `key:${string}`
        | (keyof HTMLElementEventMap)
        | "scene:show"
        | "scene:frame"
        | "scene:close"
        | "cleanup",
>(
    type: K,
    e: (
        HTMLElementEventMap & {
            "scene:show": null;
            "scene:frame": { lastFrameTime: ... };
            "scene:close": null;
        } & {
            "mouse:left": MouseEvent;
            "mouse:middle": MouseEvent;
            "mouse:right": MouseEvent;
            "mouse:unknown": MouseEvent;
        } & { [key: `key:${(...)}`]: KeyboardEvent } & { cleanup: null }
    )[K],
): number
Emit event listeners
Type Parameters
- K extends
      | "mouse:left"
      | "mouse:middle"
      | "mouse:right"
      | "mouse:unknown"
      | `key:${string}`
      | (keyof HTMLElementEventMap)
      | "scene:show"
      | "scene:frame"
      | "scene:close"
      | "cleanup"
Parameters
- type: K
- e: (
      HTMLElementEventMap & {
          "scene:show": null;
          "scene:frame": { lastFrameTime: ... };
          "scene:close": null;
      } & {
          "mouse:left": MouseEvent;
          "mouse:middle": MouseEvent;
          "mouse:right": MouseEvent;
          "mouse:unknown": MouseEvent;
      } & { [key: `key:${(...)}`]: KeyboardEvent } & { cleanup: null }
  )[K]
Returns number
Inherited from EventEmitter.emit
- Defined in packages/psytask/src/util.ts:155

Class Scene<T>

Type Parameters

Hierarchy (View Summary)

Index

Constructors

Properties

Methods

Constructors

constructor

Type Parameters

Parameters

Returns Scene<T>

Properties

Readonlyroot

Readonlyprops

See

Optionaldata

Functionshow

Example

options

Readonlyapp

ReadonlydefaultOptions

Protectedlisteners

Methods

use

Type Parameters

Parameters

Returns ReturnType<T> & { props: T extends Component<(...), (...)> ? P : never }

Example

config

Parameters

Returns Scene<T>

Example

close

Returns void

[dispose]

Returns void

on

Type Parameters

Parameters

Returns Scene<T>

off

Type Parameters

Parameters

Returns Scene<T>

once

Type Parameters

Parameters

Returns Scene<T>

emit

Type Parameters

Parameters

Returns number

Settings

On This Page

`Readonly`root

`Readonly`props

`Optional`data

`Function`show

`Readonly`app

`Readonly`defaultOptions

`Protected`listeners