Mix Youtube videos like a true DJ!
https://dj.tflcl.xyz
You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
TFLCL
bb4cd4c795
|
2 years ago | |
---|---|---|
css | 2 years ago | |
fonts | 2 years ago | |
img | 2 years ago | |
js | 2 years ago | |
.gitignore | 3 years ago | |
Jenkinsfile | 2 years ago | |
README.md | 2 years ago | |
favicon.ico | 2 years ago | |
index.html | 2 years ago | |
robots.txt | 3 years ago | |
site.webmanifest | 2 years ago |
README.md
Mix Youtube videos like a pro DJ!
About
This website is a tribute to the old twoyoutubevideosandamotherfuckingcrossfader.com. It's a simple way to play music from Youtube and smoothly fade between tracks thanks to the crossfader.
What's next?
Maybe one day
Search videos straight from the app (needs API key and calls)- Compatibility with Bandcamp music (not sure if it can be done without too much hacks)
- A playlist of to-be-played tracks that can be added manually ("add url") or through the search
- A history of played tracks?
Should be done quickly
- Clean code (especially old P5JS)
- Sanitize it (naming, organization, comments...)
- Add current tracks/playlists as hashes in the URL so we can share track combinations
- Better indication of the video current status (playing or paused),maybe using
outline
on the iframe, or changing thebox-shadow color
?
External resources and inspiration
Inspiration
- Original idea: http://twoyoutubevideosandamotherfuckingcrossfader.com/
- Youtube embedded player API implementation: https://thomaspark.co/projects/needledrop/
- Starry night: https://www.youtube.com/watch?v=NJjEGoqTn1Y
- CSS/JS shooting stars: https://www.geeksforgeeks.org/how-to-create-shooting-star-animation-effect-using-css/
Bandcamp fetching
- https://gist.github.com/Romern/cd7f1e9a742d27eb3ac104201f6ae87c
- https://stackoverflow.com/questions/65085046/how-do-i-pull-album-art-thumbnail-from-bandcamp
- https://github.com/89z/mech/blob/master/bandcamp/bandcamp.go
- https://github.com/openwhyd/openwhyd/blob/master/app/controllers/api/bandcampExtractor.js
- https://github.com/ytdl-org/youtube-dl/blob/master/youtube_dl/extractor/bandcamp.py
- https://github.com/masterT/bandcamp-scraper