Added contact link, commented Bandcamp related stuff
This commit is contained in:
24
README.md
24
README.md
@@ -1 +1,23 @@
|
||||
Mix Youtube videos like a pro DJ!
|
||||
#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)
|
||||
###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
|
||||
|
||||
##External resources and inspiration
|
||||
###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
|
||||
|
||||
@@ -357,3 +357,8 @@ input[type=range]#crossfader::-ms-thumb {
|
||||
.footer span {
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
span.spacer {
|
||||
display: inline-block;
|
||||
width: 3em;
|
||||
}
|
||||
|
||||
12
index.html
12
index.html
@@ -64,11 +64,11 @@
|
||||
</div>
|
||||
<input class='load-button' type="button" value="Load new track or playlist">
|
||||
</div>
|
||||
<div class="hidden">
|
||||
<!-- <iframe style="border: 0; width: 480px; height: 270px;" src="https://bandcamp.com/EmbeddedPlayer/album=78256716/size=large/bgcol=ffffff/linkcol=0687f5/artwork=small/track=1064671887/transparent=true/" seamless><a href="https://clett.bandcamp.com/album/tancarville">Tancarville by Clett</a></iframe> -->
|
||||
<!-- For a single track:
|
||||
<iframe style="border: 0; width: 480px; height: 270px;" src="https://bandcamp.com/EmbeddedPlayer/album=78256716/size=large/bgcol=ffffff/linkcol=0687f5/artwork=small/track=1064671887/transparent=true/" seamless><a href="https://clett.bandcamp.com/album/tancarville">Tancarville by Clett</a></iframe>-->
|
||||
</div>
|
||||
<!-- <div class="hidden">
|
||||
<iframe style="border: 0; width: 480px; height: 270px;" src="https://bandcamp.com/EmbeddedPlayer/album=78256716/size=large/bgcol=ffffff/linkcol=0687f5/artwork=small/track=1064671887/transparent=true/" seamless><a href="https://clett.bandcamp.com/album/tancarville">Tancarville by Clett</a></iframe>
|
||||
For a single track:
|
||||
<iframe style="border: 0; width: 480px; height: 270px;" src="https://bandcamp.com/EmbeddedPlayer/album=78256716/size=large/bgcol=ffffff/linkcol=0687f5/artwork=small/track=1064671887/transparent=true/" seamless><a href="https://clett.bandcamp.com/album/tancarville">Tancarville by Clett</a></iframe>
|
||||
</div> -->
|
||||
</div>
|
||||
|
||||
<div id="crossfader-wrapper">
|
||||
@@ -90,7 +90,7 @@
|
||||
|
||||
<h1>🔊 Mix like a pro youtube DJ! 🎧</h1>
|
||||
<div class="footer">
|
||||
<p><span id='shooting-stars-enable'></span> ⚒ <a href="https://tflcl.xyz">Made by tflcl.xyz</a> 🧩</p>
|
||||
<p><span id='shooting-stars-enable'></span> <span class="spacer"></span> <a href="https://tflcl.xyz" target="_blank" >⚒ Made by tflcl.xyz 🧩</a> <span class="spacer"></span> <a href="#" id="contact-me">💌 Contact me 💌</a></p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
40
js/main.js
40
js/main.js
@@ -54,6 +54,7 @@ class player {
|
||||
let resp = check_url(url);
|
||||
|
||||
if (resp < 0) {
|
||||
alert('Wrong URL...');
|
||||
console.log('Nothing to load!');
|
||||
} else if (resp == 0) {
|
||||
let newTrackID = get_video_id(url);
|
||||
@@ -66,10 +67,13 @@ class player {
|
||||
console.log('track to load: ' + newTrackID);
|
||||
this.load(newTrackID);
|
||||
} else {
|
||||
alert('Wrong URL...');
|
||||
console.log('Nothing to load!');
|
||||
}
|
||||
} else if (resp == 1) {
|
||||
fetch_bandcamp_url(url);
|
||||
// fetch_bandcamp_url(url);
|
||||
alert('Wrong URL...');
|
||||
console.log('Nothing to load!');
|
||||
}
|
||||
|
||||
|
||||
@@ -181,12 +185,15 @@ function get_playlist_id(url) {
|
||||
let regPlaylist = /[?&]list=([^#\&\?]+)/;
|
||||
let regIndex = /[?&]index=([^#]+)/;
|
||||
let match = url.match(regPlaylist);
|
||||
console.log('match ' + match);
|
||||
let matchIndex = url.match(regIndex);
|
||||
console.log('matchindex ' + matchIndex);
|
||||
// console.log('regexp ' + match.match(/=LL([^#\&\?]*)/));
|
||||
let index = 0;
|
||||
if (matchIndex != null) {
|
||||
index = matchIndex[1] - 1;
|
||||
}
|
||||
if (match != null) {
|
||||
if (match != null && match[1].lenght > 2) { // lenght > 2 prevents from trying to load a "list=LL" (liked videos of signed-in user)
|
||||
return [match[1], index];
|
||||
} else {
|
||||
return [0,0];
|
||||
@@ -225,6 +232,12 @@ function componentToHex(c) {
|
||||
// -----------------------------------
|
||||
// BANDCAMP Tests
|
||||
// -----------------------------------
|
||||
// let surl = 'https://bandcamp.com/api/bcsearch_public_api/1/autocomplete_elastic';
|
||||
// let req = {"search_text": "techno",
|
||||
// "search_filter": "",
|
||||
// "full_page": false,
|
||||
// "fan_id": null
|
||||
// };
|
||||
// let bcURL = 'https://clett.bandcamp.com/track/placenta';
|
||||
// let request = new Request(bcURL);
|
||||
// let headers = new Headers({
|
||||
@@ -309,9 +322,9 @@ function newShootingStar() {
|
||||
newShootingStar();
|
||||
|
||||
// Enable/disable shooting stars
|
||||
let separatorSpan = document.createElement('span');
|
||||
separatorSpan.innerHTML = ' - ';
|
||||
document.getElementById('shooting-stars-enable').after(separatorSpan);
|
||||
// let separatorSpan = document.createElement('span');
|
||||
// separatorSpan.innerHTML = ' - ';
|
||||
// document.getElementById('shooting-stars-enable').after(separatorSpan);
|
||||
document.getElementById('shooting-stars-enable').innerHTML = '⭐️Disable shooting stars⭐️';
|
||||
|
||||
document.getElementById('shooting-stars-enable').addEventListener('click', () => {
|
||||
@@ -345,3 +358,20 @@ document.getElementById('shooting-stars-enable').addEventListener('click', () =>
|
||||
// processingIsOn = true;
|
||||
// }
|
||||
// });
|
||||
|
||||
/*-------------------------------------------------------
|
||||
- EMAIL OBFUSCATION - found here http://www.grall.name/posts/1/antiSpam-emailAddressObfuscation.html
|
||||
-------------------------------------------------------*/
|
||||
document.getElementById('contact-me').addEventListener('click', (e) => {
|
||||
console.log('okay');
|
||||
var y = decode("pbagnpg@gsypy.klm"); //https://rot13.com/
|
||||
e.target.setAttribute("href", "mailto:" + y);
|
||||
})
|
||||
|
||||
function decode(a) {
|
||||
// ROT13 : a Caesar cipher
|
||||
// letter -> letter' such that code(letter') = (code(letter) + 13) modulo 26
|
||||
return a.replace(/[a-zA-Z]/g, function(c){
|
||||
return String.fromCharCode((c <= "Z" ? 90 : 122) >= (c = c.charCodeAt(0) + 13) ? c : c - 26);
|
||||
})
|
||||
};
|
||||
|
||||
Reference in New Issue
Block a user