kashire
/
lainchan


			
							<!DOCTYPE html>
<html style="height:100vh; width:100%;">
  <head>
    <meta http-equiv="Content-type" content="text/html; charset=utf-8" />
     <meta name="viewport" content="width=device-width,initial-scale=1.0">
    <title>{{ settings.title }}</title>
<script type="text/javascript">
var active_page = "radio";
</script>
	{% include 'header.html' %}
    <link rel="stylesheet" media="screen" href="/stylesheets/dark.css"/>
    <link rel="stylesheet" media="screen" href="/stylesheets/cyberpunk.css"/>
<script src="https://lainchan.org/js/jquery.min.js"></script>
<script type="text/javascript">

function check_status(){  
$.get("{{ settings.radiostatus }}", function(data){    
var el = $( '<div></div>' );   
el.html(data.getElementsByTagName('html')[0].innerHTML);   
 var channel = $("#channel").val(); 
 var nowplaying = el.find(".roundbox").has("h3:contains('mpd-"+channel+"')").find('td:contains("Current")').eq(0).next().text();
 var currentlisteners = 0;
 el.find(".roundbox").has("h3:contains("+channel+")").find('td:contains("current")').next().each(function() {
    currentlisteners += parseInt(this.firstChild.nodeValue, 10);
});
 $(".nowplaying").text("Now playing: " + nowplaying);   
 $(".currentlisteners").text("Current listeners: " + currentlisteners ); 
});}


function change_channel(e) {
    let audio  = document.getElementById("player");
    let paused = audio.paused;

    channel = e.value;

    {% set formatlist = settings.formats|split(' ') %}
    {% for format in formatlist %}
    let {{ "source" ~ format }} = document.getElementById("{{format ~ "source"}}");
    
    {{ "source" ~ format }}.src ="{{ settings.httpprefix ~ settings.radioprefix }}" +   channel  + ".{{ format }}";
    {% endfor %}

    audio.load();
    if(!paused) {
        audio.play();
    }
    {% for format in formatlist %}
    document.getElementById("{{ format }}playlist").href = "{{ settings.httpprefix ~ settings.radioprefix }}" + channel + ".{{ format ~ ".m3u" }}";
    {% endfor %}
    
    document.getElementById("fileslink").href = "{{ settings.httpprefix ~ settings.filelistprefix }}" + channel +  ".html";

    check_status();
} 
$(document).ready(function(){
        $("#stylesheet").remove();
	check_status();
        setInterval(check_status, 15000);
});
</script>
  </head>
  <body style=" background: url(/bg.php) no-repeat center center fixed; 
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
  ">
    <div class="bar top">
      {{ boardlist.top }}
	</div>

	{% if config.url_banner %}<img class="board_image" src="{{ config.url_banner }}" {% if config.banner_width or config.banner_height %}style="{% if config.banner_width %}width:{{ config.banner_width }}px{% endif %};{% if config.banner_width %}height:{{ config.banner_height }}px{% endif %}" {% endif %}alt="" />{% endif %}
    <header>
      <h1 class="glitch" data-text="{{ settings.title }}"> {{ settings.title }}</h1>
      <div class="subtitle">{{ settings.subtitle }}</div>
    </header>

    <img alt="mascot" src="static/lain_is_cute_datass_small.png" style="display: block; margin: 0 auto;"/>

    <div class="ban" style="margin-top: 0px!important; background-color: black; text-align: left!important;">
      <h2 style="text-align:center;">WELCOME TO CYBERIA</h2>

      <p style="text-align:center;">Welcome to lainchan's radio stream. 
      </p>

	<p class="inlineheading" style="text-align:center;" >Channel:
        <select style="float:none;" id="channel" onchange="change_channel(this)">
          {% set channellist = settings.channels|split(' ') %}
	  {% for channel in channellist %}
	  {% if channel == settings.defaultchannel %}
          <option value="{{ channel }}" selected>{{ channel }}</option>
	  {% else %} 
          <option value="{{ channel }}">{{ channel }}</option>
	  {% endif %} 
          {% endfor %}
	</select> </p>

      <p style="text-align:center;"> File list is <a id="fileslink" href="{{ settings.httpprefix ~ settings.filelistprefix ~ settings.defaultchannel ~ ".html" }}"> is here</a></p>
      <noscript><p style="text-align:center;">Radio statistics and channel switching will be not be updated without JavaScript, please visit {{ settings.radiostatus }} to see them directly.</p></noscript>
      
      <p class="nowplaying" style="text-align:center;"> Now playing: 
      </p>
      <p class="currentlisteners" style="text-align:center;"> Current listeners: 
      </p>

      <ul style="list-style-type: none;-webkit-padding-start: 0px;">

        {% set formatlist = settings.formats|split(' ') %}
	{% for format in formatlist %}
        <li style="text-align:center;"><a id="{{ format }}playlist" href="{{ settings.httpprefix ~ settings.radioprefix ~ settings.defaultchannel ~ "." ~ format ~ ".m3u" }}"> {{ format|upper }}  M3U Playlist</a></li>
        {% endfor %}

      </ul>
		<p style="text-align:center;">XSPF considered harmful.</p>

      <audio id="player" controls autoplay preload="none" style="margin: 0 5% 20px 5%; width: 90%; box-shadow: 0px 0px 5px black;">
	        {% for format in formatlist %}
		{% if format == "mp3" %}
		<source id="{{format}}source" src="{{ settings.httpprefix ~ settings.radioprefix ~ settings.defaultchannel ~ "." ~ format }}" type="audio/mpeg">
		{% else %}
		<source id="{{format}}source" src="{{ settings.httpprefix ~ settings.radioprefix ~ settings.defaultchannel ~ "." ~ format }}" type="audio/{{ format }}">
	  	{% endif %}
		{% endfor %}
        <em>Your browser lacks support for OGG Vorbis files. Please open the M3U file or XSPF file in a multimedia player.</em>
     </audio>
     <p style="text-align:center;"> To upload a voice-over / bump to radio click <a href="{{ settings.httpprefix ~ 'bump.html'}}" >here </a> </p>
    </div>
	<div class="pages"></div>
	<script type="text/javascript">{% raw %}
		ready();
	{% endraw %}</script>
  </body>
</html>