Skip to content

Instantly share code, notes, and snippets.

@severak
Created June 26, 2018 22:32
Show Gist options
  • Save severak/9abf7080d4691d71639d879d6d82a265 to your computer and use it in GitHub Desktop.
Save severak/9abf7080d4691d71639d879d6d82a265 to your computer and use it in GitHub Desktop.
generates sotds page
<?php
// builds playlist page
$forUser = null; // or set null to build global playlist
// hacked by Severak
// source: https://stackoverflow.com/a/17799714
/**
* Get Youtube video ID from URL
*
* @param string $url
* @return mixed Youtube video ID or FALSE if not found
*/
function getYoutubeIdFromUrl($url) {
$parts = parse_url($url);
if (!in_array($parts['host'], ['youtu.be', 'youtube.com', 'www.youtube.com'])) {
return false;
}
if(isset($parts['query'])){
parse_str($parts['query'], $qs);
if(isset($qs['v'])){
return $qs['v'];
}else if(isset($qs['vi'])){
return $qs['vi'];
}
}
if(isset($parts['path'])){
$path = explode('/', trim($parts['path'], '/'));
return $path[count($path)-1];
}
return false;
}
$videos = [];
$pdo = new PDO('sqlite:sotd.db', null, null, [PDO::ATTR_ERRMODE => PDO::ERRMODE_EXCEPTION]);
if ($forUser) {
$stmt = $pdo->prepare('SELECT * FROM sotd WHERE username=? ORDER BY created_at DESC LIMIT 100');
$stmt->execute(['~severak']);
} else {
$stmt = $pdo->prepare('SELECT * FROM sotd ORDER BY created_at DESC LIMIT 100');
$stmt->execute([]);
}
foreach ($stmt as $row) {
if ($id = getYoutubeIdFromUrl($row['link'])) {
$videos[] = ['id'=>$id, 'dj'=>$row['username'], 'title'=>$row['display'] ];
}
}
?>
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
<title><?php echo ($forUser ? $forUser : 'town')?>'s radio</title>
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="//tilde.town/~severak/flogiston-tui.css">
</head>
<body>
<div class="flogiston-page">
<div class="flogiston-article">
<!-- 1. The <iframe> (and video player) will replace this <div> tag. -->
<h1><?php echo ($forUser ? $forUser : 'town')?>'s radio</h1>
<p>now playing:<br><strong id="songName">?</strong><br>recommended by DJ <a id="djName" href="#">?</a></p>
<div id="player"></div>
<hr>
<small>generated using <a href="https://gist.github.com/severak/9abf7080d4691d71639d879d6d82a265">this ugly script</a> by <a href="https://tilde.town/~severak">severak</a></small>
</div>
</div>
<script>
var playlist = <?php echo json_encode($videos); ?>;
var details = {};
var idList = [];
playlist.forEach(function(vid){
details[vid.id] = vid;
idList.push(vid.id);
});
// 2. This code loads the IFrame Player API code asynchronously.
var tag = document.createElement('script');
tag.src = "https://www.youtube.com/iframe_api";
var firstScriptTag = document.getElementsByTagName('script')[0];
firstScriptTag.parentNode.insertBefore(tag, firstScriptTag);
// 3. This function creates an <iframe> (and YouTube player)
// after the API code downloads.
var player;
function onYouTubeIframeAPIReady() {
player = new YT.Player('player', {
height: '360',
width: '640',
videoId: idList.pop(),
events: {
'onReady': onPlayerReady,
'onStateChange': onPlayerStateChange
}
});
}
// 4. The API will call this function when the video player is ready.
function onPlayerReady(event) {
event.target.loadPlaylist({playlist: idList});
event.target.playVideo();
}
function updateNowPlaying() {
var vdata = player.getVideoData();
document.getElementById('songName').textContent = vdata.title;
var dj = details[vdata.video_id]['dj']
document.getElementById('djName').textContent = dj;
document.getElementById('djName').href = 'https://tilde.town/' + dj;
}
// 5. The API calls this function when the player's state changes.
// The function indicates that when playing a video (state=1),
// the player should play for six seconds and then stop.
function onPlayerStateChange(event) {
//if (event.data == 0 || event.data == 5) {
updateNowPlaying();
//}
}
</script>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment