Created
October 9, 2019 06:57
-
-
Save akosnikhazy/c8636d58f44a1505e096d315738b346c to your computer and use it in GitHub Desktop.
A small widget that shows up only when someone is live on Twitch, using Twitch's Helix API
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
<?php | |
$ch = curl_init(); | |
curl_setopt($ch, CURLOPT_URL, 'https://api.twitch.tv/helix/streams?user_id=THE USER ID HERE'); | |
curl_setopt($ch, CURLOPT_HTTPHEADER, array( | |
'Authorization: Bearer YOUR SECRET HERE', | |
'Client-ID: YOUR APP CLIENT ID HERE' | |
)); | |
curl_setopt($ch, CURLOPT_RETURNTRANSFER, true); | |
$streamdata = json_decode ( | |
curl_exec($ch) | |
,true | |
); | |
curl_close($ch); | |
if(!empty($streamdata['data'])){ | |
?> | |
<div id="twitchstreamwidget"> | |
<!-- Twitch Stream Widget created by Ákos Nikházy --> | |
<div id="twitchstreamclose">X</div> | |
<iframe src="https://player.twitch.tv/?channel=YOUR CHANNEL NAME" frameborder="0" allowfullscreen="true" scrolling="no" width="400" height="300"></iframe> | |
<div id="twitchwidgetplaying">Stream Title: <?php echo $streamdata['data'][0]['title']; ?></div> | |
</div> | |
<style> | |
#twitchstreamwidget,#twitchstreamwidget iframe{ | |
width:400px; | |
} | |
#twitchstreamwidget iframe{ | |
height:210px; | |
-webkit-border-radius: 10px 10px 0 0; | |
border-radius: 10px 10px 0 0; | |
border-bottom:1px solid #777; | |
} | |
#twitchstreamwidget{ | |
background:#2f2f37; | |
height:250px; | |
position: fixed; | |
left:5px; | |
bottom:5px; | |
-webkit-border-radius: 10px 10px 10px 10px; | |
border-radius: 10px 10px 10px 10px; | |
} | |
#twitchstreamclose{ | |
background:#fefefe; | |
text-align:center; | |
-webkit-border-radius: 1000px 1000px 1000px 1000px; | |
border-radius: 1000px 1000px 1000px 1000px; | |
padding:0; | |
margin:0; | |
font-weight:bold; | |
border:1px solid #333; | |
width:22px; | |
height:22px; | |
font-size:11px; | |
position:absolute; | |
right:-10px; | |
top:-10px; | |
cursor:pointer | |
} | |
#twitchstreamclose:hover{ | |
background:#ff7777; | |
} | |
#twitchwidgetplaying{ | |
padding-top:1px; | |
padding-left:10px; | |
font-size:0.7em; | |
color:#efefef; | |
} | |
#twitchwidgetplaying::after { | |
content: " [ • Live]"; | |
color:#ff2222; | |
font-weight:bold; | |
} | |
</style> | |
<script> | |
var twitchStreamWidget= document.getElementById('twitchstreamwidget'); | |
var twitchWidgetClose = document.getElementById('twitchstreamclose'); | |
twitchWidgetClose.addEventListener("click", deleteTwitchWidget); | |
function deleteTwitchWidget() | |
{ | |
twitchStreamWidget.parentNode.removeChild(twitchStreamWidget); | |
} | |
</script> | |
<?php | |
} | |
?> |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
(about this: https://yzahk.in/twitch-php-widget/ )