https://github.com/benfoxall/scrub

Video scrubbing with WebCodecs
https://github.com/benfoxall/scrub

webcodecs

Last synced: 11 days ago
JSON representation

Video scrubbing with WebCodecs

• Host: GitHub
• URL: https://github.com/benfoxall/scrub
• Owner: benfoxall
• License: mit
• Created: 2021-10-12T18:54:35.000Z (over 3 years ago)
• Default Branch: main
• Last Pushed: 2023-11-19T16:38:29.000Z (about 1 year ago)
• Last Synced: 2025-01-19T08:31:19.523Z (18 days ago)
• Topics: webcodecs
• Language: JavaScript
• Homepage: https://benjaminbenben.com/scrub/
• Size: 112 MB
• Stars: 14
• Watchers: 3
• Forks: 2
• Open Issues: 0
• Metadata Files:
  • Readme: README.md
  • License: LICENSE

Awesome Lists containing this project

README

        
# Scrub

Video scrubbing with WebCodecs.

This effect is usually made by downloading each frame as an image, though this demo uses a single file and extracts frames with WebCodecs.

Most of the important stuff is from the w3c WebCodecs mp4-decode sample:

https://github.com/w3c/webcodecs/tree/main/samples/mp4-decode

![scrub](https://media.giphy.com/media/K1hcRycU5tSOvbqN7g/giphy.gif)

## Sources

### Code

The video decoding code came from the w3c WebCodecs sample repo

- https://github.com/w3c/webcodecs/tree/main/samples/mp4-decode

### Video

Earth video genearated from [NOAA / GOES Image Viewer](https://www.star.nesdis.noaa.gov/goes/fulldisk_band.php?sat=G16&band=GEOCOLOR&length=12&dim=1)

- https://gist.github.com/benfoxall/2741f5383528e6d2bc4c609b812310f1

Inky water video - by hicham yah from Pexels

- https://www.pexels.com/video/mixture-of-smoke-with-different-colors-2025634/

Traffic:

- https://www.pexels.com/video/traffic-on-an-intersection-road-in-a-city-3121459

## :link:

- https://github.com/benfoxall/video-stills Previous hack (using wasm & broadway to decode)

---

## TODO

- [x] Time ribbon

- [ ] streaming decoder

- [ ] live video

- [ ] video loops

- [x] drag upload