Casey DeLorme ad973b205e remove redundancy delay multiplier for videos | 1 жил өмнө | |
---|---|---|
demo.html | 1 жил өмнө | |
readme.md | 1 жил өмнө | |
show.js | 1 жил өмнө |
A system for rendering sequences of various media, including images and videos.
It leverages addEventListener
for preloading, and requestAnimationFrame
for real-time rendering.
This is an optimized and simplified replacement for jslideshow.
The demo.html
included demonstrates full screen styles, importing, and loading a set of files.
A new instance of Show
accepts three parameters:
The parent element will have its children replaced.
The files array has two accepted formats:
The string is treated verbatim and assigned the default delay value.
When given an object it looks at four potential properties:
The string format substitution works with two options:
%s
%03s
creating 001
, 002
, 003
, etc...)A file name can contain multiple substitutions and multiple formats, all of them will be recursively processed.
The range
is an array with a start and end for a numeric loop, or raw values that can be numbers or strings.
This system supports video files with the extensions of mp4
, webm
, and ogg
. Due to browser limitations videos are treated as muted by default.
When the file is a video or ends in .gif
, an attempt will be made to extract the duration of the video or animated gif, and an updated value will be set to latency
. If delay
was provided, it will be treated as a multiplier.
The system attempts to preload up to 40% (or +-5) of the next and previous files which should prevent stutter when rendering.
Simple operations are exposed to allow manipulation:
toggle()
- change play statenext()
- go to the next imageprevious()
- go to the previous imageIf the target window is not active, the rendering operation will be paused.
Security on browsers may prevent gifDuration
from being calculated when loading local files without a web server.
To resolve this you can set security.fileuri.strict_origin_policy
to false
in firefox, or launch google chrome with the --allow-file-access-from-files
flag.
Another option would be to set the latency
property manually.