67 lines
3.6 KiB
PHP
67 lines
3.6 KiB
PHP
<?php
|
|
if($station->contentplayer == ""){
|
|
?>
|
|
<style>
|
|
.staticpage{
|
|
background: linear-gradient(45deg, #3849a8, #f7b835);
|
|
padding: 22px 35px 10px 35px;
|
|
display: block;
|
|
z-index: 1;
|
|
position: absolute;
|
|
height: calc(100vh - 312px);
|
|
color: white;
|
|
text-align: center;
|
|
width: 100%;
|
|
max-width: 450px;
|
|
left: 50%;
|
|
transform: translateX(-50%);
|
|
}
|
|
.staticpage > .logo{
|
|
width: 200px;
|
|
border-radius: 15px;
|
|
margin-bottom: 20px;
|
|
}
|
|
.staticpage > p{
|
|
margin: 0;
|
|
}
|
|
.staticpage > p.titleRadio{
|
|
font-weight: 600;
|
|
}
|
|
</style>
|
|
<div class="staticpage">
|
|
<img src="<?php echo $station->logo; ?>" class="logo" alt="logo radio">
|
|
<p class="titleRadio"><?php echo $station->name; ?></p>
|
|
<p class="subtitleRadio"><?php echo $station->slogan; ?></p>
|
|
</div>
|
|
<?php
|
|
}else{
|
|
?>
|
|
<iframe src="<?php echo $station->contentplayer; ?>" class="contentplayer" frameborder="0"></iframe>
|
|
<?php
|
|
}
|
|
?>
|
|
|
|
<div class="footer_player" <?php if($is_mobile){ echo "style=\"bottom: 84px;\""; } ?>>
|
|
<div class="row align-items-center">
|
|
<div class="col-2" style="width: 70px;">
|
|
<img src="<?php echo $station->logo; ?>" alt="<?php echo $station->name; ?>" style="width: 60px;">
|
|
</div>
|
|
<div class="col">
|
|
<div id="artist" style="font-weight: 700; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 1; -webkit-box-orient: vertical; overflow: hidden;"><?php echo $station->name; ?></div>
|
|
<div id="playerStatus" style="text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 1; -webkit-box-orient: vertical ;overflow: hidden;"><?php echo $station->slogan; ?></div>
|
|
</div>
|
|
<div class="col-auto" style="text-align: center; margin-top: 1px; padding-right: 0;">
|
|
<button id="formatToggleBtn" title="Cambia formato audio">
|
|
<span id="formatLabel" style="font-size: 12px;font-weight: 600;border-radius: 6px;border: 2px solid #ffffff;padding: 4px 6px;background: rgba(247, 184, 53, 0.3);color: #2a377e;">HLS</span>
|
|
</button>
|
|
</div>
|
|
<div class="col-2" style="text-align: center; margin-top: 1px; margin-right: 5px; width: 67px;">
|
|
<button id="playPauseBtn" data-stream-hls="<?php echo $station->streamhls; ?>" data-stream-fallback="<?php echo $station->stream; ?>" data-station-name="<?php echo htmlspecialchars($station->name); ?>" data-station-logo="<?php echo $station->logo; ?>" data-station-slogan="<?php echo htmlspecialchars($station->slogan); ?>">
|
|
<i class="material-icons play-icon" id="play-pause" style="font-size: 35px; border-radius: 10px; border: 2px solid #ffffff; padding: 4px 5px 4px 4px; margin-top: -2px; background: #f7b835; color: #2a377e;">play_arrow</i>
|
|
<i class="material-icons pause-icon" id="play-pause" style="display:none; font-size: 35px; border-radius: 10px; border: 2px solid #ffffff; padding: 4px 5px 4px 4px; margin-top: -2px; background: #f7b835; color: #2a377e;">pause</i>
|
|
</button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<audio id="hlsAudioPlayer" preload="none"></audio>
|