ambilight.js

Ambilight effect for HTML.

Demos:

• Aurora
• Dartmoor
• The Peak

Quick Usage

import ambilight from "ambilight.js";

ambilight(document.querySelector("video"));

led and ambient are two possible strategies of performing the ambilight effect. They can be applied as the second argument to ambilight. The default one is led.

API

ambilight(video:HTMLVideoElement, [strategy:function])

strategy may be one of the following:

• ambient(options:object)
  • options.strength:number, light strength, default: 1.1
  • options.spread:number, light spread, default: 60
• led(options:object)
  • options.vertical:number - number vertical of light points, default: 6
  • options.horizontal:number - number horizontal of light points, default: 4

ambient duplicates input video, puts it behind the original video and applies blur CSS filter so that it looks like a glow.

led divides input video into options.horizontal × options.vertical areas aligned as a grid. Each area has assigned average color of the corresponsing video area. Each area glows with its own color via border-shadow CSS property. This gives more dynamic and smooth effect than ambient.

License

The MIT License (MIT). Copyright (c) 2018 mirz (that.mirz@gmail.com)