StringVideoAutoplay

StringVideoAutoplay is a video module. It activates on <video>, reads the source from string-src, prepares the element for muted inline autoplay, and then plays or pauses the video as the object enters or leaves view.

Public API

Attributes

Attribute	Target	Default	Real runtime effect
`string="autoplay"`	`<video>`	required	Activates the module for that video object.
`string-src`	`<video>`	`""`	Provides the video source assigned on first connect.

StringVideoAutoplay only works on actual <video> elements.

CSS Variables and DOM Output

On first connect, the module mutates the video element by writing:

string-started
muted
playsinline
loop
autoplay
src

At runtime, the module then:

calls play() on local object enter
calls pause() on local object leave

This module does not expose public CSS variables.

Events

This module does not emit public events.

Mirror Behavior

This module has no mirror output contract.

Quick Example

HTML

<div class="video-spacer">Scroll down</div>

<video
  string="autoplay"
  string-src="https://interactive-examples.mdn.mozilla.net/media/cc0-videos/flower.mp4"
  class="video-demo"
></video>

<div class="video-state" id="video-state">Waiting</div>

<div class="video-spacer"></div>

CSS

.video-spacer {
  height: 70vh;
}

.video-demo {
  display: block;
  width: min(100%, 520px);
  margin: 0 auto;
  border: 1px solid black;
  background: black;
}

.video-state {
  min-height: 32px;
  display: grid;
  place-items: center;
  margin-top: 12px;
}

Registration

TypeScript

import StringTune, { StringVideoAutoplay } from '@fiddle-digital/string-tune';

const stringTune = StringTune.getInstance();
stringTune.use(StringVideoAutoplay);
stringTune.start(60);

Detailed Behavior

Enter and leave are local object events, not documented global channels.
The source is read from string-src, not from src in your HTML.
Autoplay is attempted in muted inline mode because that is what the runtime enforces.
If play() is blocked, the module catches the error and logs a warning.