# aframe-alphavideo-shader
> Alpha video effects in A-Frame. Provided a 'src' video, and (option) a second 'alpha' video, this material will render the src transparent from the lightness of the src or alpha video image.
Latest version **1.0.0** (published 2021-01-14) · MIT license · 0 weekly downloads
## Install
```sh
npm install aframe-alphavideo-shader
pnpm add aframe-alphavideo-shader
yarn add aframe-alphavideo-shader
bun add aframe-alphavideo-shader
```
## Health
**Score 15/100 (F)** — status: abandoned.
Positive: no vulnerabilities.
Warnings: low downloads; no types; no esm support.
Negative: abandoned; low maintenance score.
## Facts
| | |
|---|---|
| Version | 1.0.0 |
| Published | 2021-01-14 |
| First published | 2021-01-14 |
| Weekly downloads | 0 |
| License | MIT |
| TypeScript types | none |
| Module format | CommonJS |
| Dependencies | 0 |
| Unpacked size | 11.4 KB |
| Known vulnerabilities | 0 |
| Install scripts | no |
| Author | Nick Warner |
| Maintainers | vadimti |
| Keywords | 8thwall, aframe, aframe-component, aframe-shader, aframe-vr, vr, mozvr, webvr, webxr, video-shader |
## Links
- npm: https://www.npmjs.com/package/aframe-alphavideo-shader
- npm.io page: https://npm.io/package/aframe-alphavideo-shader
## Alternatives
- [@sindresorhus/slugify](https://npm.io/package/@sindresorhus/slugify.md) — 3.7M weekly downloads
- [solid-js](https://npm.io/package/solid-js.md) — 2.7M weekly downloads
- [expo-glass-effect](https://npm.io/package/expo-glass-effect.md) — 2.5M weekly downloads
- [nanoassert](https://npm.io/package/nanoassert.md) — 780.8K weekly downloads
- [@ffmpeg/ffmpeg](https://npm.io/package/@ffmpeg/ffmpeg.md) — 529.5K weekly downloads
## Recent versions
- 1.0.0 (latest) — 2021-01-14
## README
## aframe-alphavideo-material
Alpha video effects in [A-Frame](https://aframe.io). Provided a "src" video, and (option) a second "alpha" video, this material will
render the src transparent from the lightness of the src or alpha video image.
It permit many effects and transitions with videos, including 360 or composite screens, backgrounds, interface animation, etc...
lame fork of the ChromaKey AFrame component of Nick Warner
https://github.com/nikolaiwarner/aframe-chromakey-material
### REM/Todo
- only works for video textures at the moment > Add option for basic images as alpha source in the shader
- need to be packaged correctly for aframe components, or replaced by proper alpha support in basic material
### API
|Shader | Property | Description |
|-------| -------- | ----------- |
|alphavideomap | src | base video texture |
| " | alpha | alpha video texture |
|alphavideopremul | src | base video texture |
### Installation
#### Browser
use by directly including the [files](dist) alongside your scene :
```html
My A-Frame Scene
```
#### Credits
All goes to prior coders
lame fork of chromakey component by Nick Warner https://github.com/nikolaiwarner/aframe-chromakey-material
A big thanks to the prior research on chromakey shaders in WebGL and Three.js by:
https://github.com/makc/makc.github.io/tree/master/three.js/chromakey
https://github.com/hawksley/Threex.chromakey
---
_Source: https://npm.io/package/aframe-alphavideo-shader · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._