127 lines
5.3 KiB
PHTML
127 lines
5.3 KiB
PHTML
<script language="JavaScript">
|
|
function autoResize(id){
|
|
var newheight;
|
|
var newwidth;
|
|
|
|
if(document.getElementById){
|
|
newheight=document.getElementById(id).contentWindow.document.body.scrollHeight;
|
|
// Hack to get height in Firefox
|
|
if (newheight == 0) newheight = newheight = document.getElementById(id).contentWindow.document.documentElement.scrollHeight;
|
|
newwidth=document.getElementById(id).contentWindow.document.body.scrollWidth;
|
|
}
|
|
document.getElementById(id).height= (newheight) + "px";
|
|
document.getElementById(id).width= (newwidth) + "px";
|
|
}
|
|
</script>
|
|
|
|
<div class="wrapper">
|
|
|
|
<div class="bck_cover"></div>
|
|
|
|
<?php if ($this->stationLogo === DEFAULT_LOGO_PLACEHOLDER) {
|
|
echo "<a href='#' class='logo'><img src='".DEFAULT_LOGO_FILE."'></a>";
|
|
} else {
|
|
echo "<a href='#' class='logo'><img src='data:image/png;base64," . $this->stationLogo . "'></a>";
|
|
} ?>
|
|
|
|
<?php if ($this->displayLoginButton) {
|
|
echo "<div class='login-btn'>
|
|
<a href='/login' target='_parent'>
|
|
<span>Login</span>
|
|
<span class='login-img'></span>
|
|
</a>
|
|
</div>";
|
|
}?>
|
|
|
|
<div id="tab-1" class="schedule tab_content current">
|
|
<iframe onLoad="autoResize('schedule_iframe');" id="schedule_iframe" height="300px" scrolling="yes" frameborder="0" src=<?php echo $this->stationUrl."embed/weekly-program?style=premium"?>></iframe>
|
|
</div>
|
|
|
|
|
|
<div id="tab-2" class="about_us tab_content">
|
|
<h1><?php echo $this->escape($this->stationName) ?></h1>
|
|
<p><?php echo $this->escape($this->stationDescription) ?></p>
|
|
</div>
|
|
|
|
<div id="tab-3" class="login tab_content">
|
|
<h2>Login</h2>
|
|
<form action="demo_form.asp">
|
|
<input type="text" name="FirstName" value="username"><br>
|
|
<input type="text" name="Password" value="password"><br>
|
|
<input type="submit" value="Login">
|
|
</form>
|
|
</div>
|
|
|
|
<?php
|
|
if ($this->displayRssTab) {?>
|
|
<div id="tab-4" class="station_rss tab_content">
|
|
<script type="text/javascript">
|
|
$.each(<?php echo $this->episodes ?>, function(index, value){
|
|
// map mime to format muses recognizes
|
|
// TODO: this doesn't make a difference
|
|
if (value.track_metadata.mime == "audio/mp3") {
|
|
value.track_metadata.mime = "mp3";
|
|
} else if (value.track_metadata.mime == "audio/vorbis") {
|
|
value.track_metadata.mime = "ogg";
|
|
}
|
|
|
|
$("#tab-4").append("<div>"+value.track_metadata.artist_name+" - "+value.track_metadata.track_title+
|
|
" <a id='rss-download-link' href='"+value.download_url+"'>Download</a>" +
|
|
" <a id='rss-play-link' data-metaartist='"+value.track_metadata.artist_name+"' data-metatitle='"+value.track_metadata.track_title+"' data-streamurl='"+value.download_url+"' data-streamcodec='"+value.track_metadata.mime+"' href='#'>Play</a></div>");
|
|
});
|
|
|
|
$("a#rss-play-link").click(function() {
|
|
var file_url = $(this).attr("data-streamurl");
|
|
var file_codec = $(this).attr("data-streamcodec");
|
|
var artist_name = $(this).attr("data-metaartist");
|
|
var track_title = $(this).attr("data-metatitle");
|
|
//console.log(track_title);
|
|
|
|
document.getElementById("player_iframe").contentWindow.musesPlayer.playPodcastTrack(file_url, file_codec);
|
|
document.getElementById("player_iframe").contentWindow.detachStreamMetadataFromPlayer();
|
|
document.getElementById("player_iframe").contentWindow.attachFileMetadataToPlayer(artist_name, track_title);
|
|
});
|
|
</script>
|
|
</div>
|
|
<?php
|
|
}
|
|
?>
|
|
|
|
<iframe id="player_iframe" frameborder="0" width="100%" style="bottom:0px; left:0px; position:fixed; right:0px;" src=<?php echo $this->stationUrl."embed/player?stream=auto&style=premium";?>></iframe>
|
|
|
|
</div>
|
|
|
|
<script type="text/javascript">
|
|
$(document).ready(function(){
|
|
$("#player_iframe").load(function () {
|
|
// FIXME: Should we hide this somehow when the station is set to private?
|
|
$("#player_iframe").contents().find('.bottom_bar').append("<div class='station_rss_btn button' data-tab='tab-4'></div>");
|
|
$("#player_iframe").contents().find('.bottom_bar').append("<div class='about_us_btn button' data-tab='tab-2'></div>");
|
|
$("#player_iframe").contents().find('.bottom_bar').append("<div class='schedule_btn button current' data-tab='tab-1'></div>");
|
|
|
|
|
|
$("#player_iframe").contents().find('.bottom_bar .button').click(function(){
|
|
var tab_id = $(this).attr('data-tab');
|
|
|
|
$("#player_iframe").contents().find('.bottom_bar .button').removeClass('current');
|
|
$('.tab_content').removeClass('current');
|
|
|
|
window.scrollTo(0,0);
|
|
$(this).addClass('current');
|
|
$("#"+tab_id).addClass('current');
|
|
});
|
|
});
|
|
|
|
// schedule widget tabs
|
|
$('.tabs li').click(function(){
|
|
var tab_id = $(this).attr('data-tab');
|
|
|
|
$('.tabs li').removeClass('active');
|
|
$('.schedule_item').removeClass('active');
|
|
|
|
$(this).addClass('active');
|
|
$("#"+tab_id).addClass('active');
|
|
});
|
|
|
|
})
|
|
</script>
|