Skip to content

Twitch streambox

pulseP1986 edited this page Feb 16, 2024 · 1 revision

Add scheduler task into application/config/scheduler_config.json

"LiveStreams": { "time": "*\/2 * * * *", "status": 1, "desc": "Check twitch live streams." }

  1. Creat app at https://dev.twitch.tv/console/apps and get client id and secret

  2. Set OAuth Redirect URLs to your domain when creating app

  3. Add streambox config into constants.php

define('TWITCH_CLIENT_ID',	'client id here');
define('TWITCH_SECRET',	'client secret here');

define('STREAM_BOX',	true);
define('STREAMERS',	[
	'some twitch user' => 'some tags' 
]);
define('STREAM_BOX_THUMBNAIL_SIZE_W', 216);
define('STREAM_BOX_THUMBNAIL_SIZE_H', 126);
https://www.mediafire.com/file/n5kgnsm6l4ghmc7/twitchAssets.zip/file

Extract necessary css and js files into root website directory

Open application/views/your template folder/view.footer.php and add

<?php
if(defined('STREAM_BOX') && STREAM_BOX == true ){
$streams = $this->website->findTwitchStreamers();

?>
<script src="<?php echo $this->config->base_url; ?>assets/plugins/js/streambox.js"></script>
<link href="<?php echo $this->config->base_url; ?>assets/plugins/css/streambox.css" rel="stylesheet">
<div class="stream-box">
  <div class="streams" style="display: none;">
	<?php
	if(!empty($streams)){
	foreach($streams AS $key => $data){
		if(!empty($data)){
	?>
	<div class="stream" style="padding-top:5px;border: 1px solid;border-color:#009ef7;">
		<div style="background-color:rgba(0, 0, 0, 1);color:#EEE;height:20px;text-align:right;">
			<span></span> 
			<span style="padding-right:3px"><?php echo $data['user'];?></span>
		</div>
		<img style="z-index: 0; display: inline;" class="frame-image " src="<?php echo $data['profile_image'];?>" width="<?php echo STREAM_BOX_THUMBNAIL_SIZE_W;?>" height="<?php echo STREAM_BOX_THUMBNAIL_SIZE_H;?>">
		<iframe style="z-index: 0; display: none;" class="frame-video" src="https://player.twitch.tv/?channel=<?php echo $data['user'];?>&parent=<?php echo parse_url($this->config->base_url, PHP_URL_HOST);?>&autoplay=false&muted=true" scrolling="no" allowfullscreen="" width="<?php echo STREAM_BOX_THUMBNAIL_SIZE_W;?>" height="<?php echo STREAM_BOX_THUMBNAIL_SIZE_H;?>" frameborder="0"></iframe>
	</div>
	<?php 
	}}} 
	?>	
  </div>
  <div class="alerter noselect">
    <span style="padding-right:33px;padding-top:4px;float:left;">&nbsp;<?php echo __('Stream Box');?></span>

    <img class="alert-up" style="vertical-align: middle; display: inline;" src="<?php echo $this->config->base_url; ?>assets/plugins/images/arrow.png">
    <img class="alert-down" style="vertical-align: middle; transform: rotate(180deg); display: none;" src="<?php echo $this->config->base_url; ?>assets/plugins/images/arrow.png">

    <span class="live" style="padding-top:4px;">
      <span class="dot blink_dot"></span>
      &nbsp;<?php echo __('LIVE');?>&nbsp;
    </span>
  </div>
</div>
<?php } ?>
Clone this wiki locally