Skip to Content
It is currently September 27th, 2022, 1:31 pm

All times are UTC - 6 hours [ DST ]




Post new topic Reply to topic  [ 14 posts ] 
Author Message
 Post subject: "Time Left" countown?
PostPosted: March 3rd, 2018, 12:02 am 
Offline
Senior User
Senior User

Joined: July 23rd, 2007, 2:22 am
Posts: 174
Location: Vancouver, BC, Canada
I'm trying to find an html script that will allow me to show the time left of the song that is currently playing. Does such a thing exist? Can one easily be included? Does anyone else want to show this info?

I got the idea from Sam2Joom. It shows the time left of the currently playing song, and I thought it would be a great addition to the pages!

Thanks

_________________
Park Magic Radio
http://parkmagicradio.ca


Top
 Profile  
Reply with quote  
PostPosted: March 3rd, 2018, 3:35 pm 
Offline
SVS Member
SVS Member

Joined: May 8th, 2004, 9:00 am
Posts: 10572
Location: Denver, CO
it's done using php and javascript

_________________
- Rob Oyler, SVS
Image


Top
 Profile  
Reply with quote  
PostPosted: March 4th, 2018, 5:17 pm 
Offline
Senior User
Senior User

Joined: July 23rd, 2007, 2:22 am
Posts: 174
Location: Vancouver, BC, Canada
What I was hoping was if someone could share theirs with me. Sorry if my message wasn't clear.

_________________
Park Magic Radio
http://parkmagicradio.ca


Top
 Profile  
Reply with quote  
PostPosted: March 5th, 2018, 11:21 am 
Offline
SVS Member
SVS Member

Joined: May 8th, 2004, 9:00 am
Posts: 10572
Location: Denver, CO
Since you asked, I'll share it with you however it's NOT plug'n'play you'll have to figure out how to incorporate it into your web page. My site is ajax based.

basic function:
Code:
    <script type="text/javascript">
      function countDown()
      {
        countDownTime--;

        if ( countDownTime == 0 )
        {
          countDownTime = countDownInterval;

          if ( window.parent.active_module == "Now Playing" )
          {
            window.parent.getNowPlaying();
          }

          window.location.reload();

          return;
        }
        else if ( countDownTime < 0 )
        {
          countDownTime = 10;
        }

        if ( window.parent.document.getElementById( "countDownText" ) )
        {
          window.parent.document.getElementById( "countDownText" ).innerHTML = secsToMins( countDownTime );
        }
      }

      function secsToMins( theValue )
      {
        var theMin = Math.floor( theValue / 60 );
        var theSec = ( theValue % 60 );

        if ( theSec < 10 )
        {
          theSec = "0" + theSec;
        }

        return( theMin + ":" + theSec );
      }

      var countDownInterval = <?php echo( $secs_remain ); ?>;
      var countDownTime = countDownInterval + 1;
      setInterval ( "countDown();", 1000 );
    </script>

Create statement for now playing view
Code:

CREATE ALGORITHM
=UNDEFINED DEFINER=`root`@`localhost` SQL SECURITY DEFINER VIEW `samdb`.`fhr_now_playing_view` AS select `s`.`ID` AS `song_id`,`h`.`requestID` AS `requestID`,`s`.`artist` AS `artist`,`s`.`fhr_artistID` AS `artist_id`,`s`.`album` AS `album`,`s`.`fhr_albumID` AS `album_id`,`s`.`title` AS `title`,`s`.`duration` AS `duration`,`s`.`albumyear` AS `album_year`,`s`.`genre` AS `genre`,`s`.`composer` AS `composer`,`s`.`trackno` AS `trackno`,`s`.`lyrics` AS `lyrics`,`s`.`info` AS `info`,`s`.`picture` AS `picture`,`s`.`count_played` AS `count_played`,`s`.`count_requested` AS `count_requested`,`s`.`last_requested` AS `last_requested`,`s`.`count_performances` AS `count_performances`,`s`.`votes` AS `votes`,`s`.`rating` AS `rating`,`s`.`songtype` AS `songtype`,`s`.`date_added` AS `date_added`,`s`.`date_played` AS `date_played`,unix_timestamp() AS `database_time` from (`samdb`.`songlist` `s` join `samdb`.`historylist` `h`) where ((`s`.`ID` = `h`.`songID`) and ((`s`.`songtype` = _latin1'S') or (`s`.`songtype` = _latin1'C') or (`s`.`songtype` = _latin1'V'))) order by `h`.`ID` desc limit 1;

setup
Code:
  $result = mysqli_query( $samDB, "select * from fhr_now_playing_view" );
  $now_playing = mysqli_fetch_array( $result );
  $secs_remain = ( round( $now_playing["duration"] / 1000 ) - (( $now_playing["database_time"]) - strtotime($now_playing["date_played"] ) ) );
  $secs_remain = $secs_remain-2; //adjust refresh time here if needed +xx seconds delays refresh -xx seconds advances refresh -RO

actual display of the countdown timer next to the now playing track info
Code:
                 <tr>
                    <td align=right><b>Duration:</b></td>
                    <td>&nbsp;&nbsp;</td>
                    <td align=left><?php echo( $mmss ); ?>  (Remain: <b id="countDownText"></b>)</td>
                  </tr>

_________________
- Rob Oyler, SVS
Image


Top
 Profile  
Reply with quote  
PostPosted: March 5th, 2018, 3:40 pm 
Offline
SVS Member
SVS Member

Joined: December 6th, 2004, 9:00 am
Posts: 8306
Location: Cologne (Germany)
For the HTML or the PHP template?

In PHP:
Put this into display.playing.php, right before <!-- BEGIN:CURRENTLY PLAYING --> (there should be an empty line already that you can (ab)use.
Code:
<?php
$durationSeconds = $currentSong->duration / 1000; // duration is given in microseconds
$date_ends = strtotime($currentSong->date_played) + $durationSeconds;
$timeRemaining = $date_ends - time();
?>

<script>function startTimer(duration, display) {
    var timer = duration, minutes, seconds;
    setInterval(function () {
        minutes = parseInt(timer / 60, 10)
        seconds = parseInt(timer % 60, 10);

        minutes = minutes < 10 ? "0" + minutes : minutes;
        seconds = seconds < 10 ? "0" + seconds : seconds;

        display.textContent = minutes + ":" + seconds;

        if (--timer < 0) {
            timer = duration;
        }
    }, 1000);
}

window.onload = function () {
    var remaining=<?=$timeRemaining; ?>;
        display = document.querySelector('#currently-playing-remaining');
    startTimer(remaining, display);
};
</script>


I'd suggest adding another column to display the time remaining right after the Time column (the first th section is already there, I just included it to show you where to insert the new column header):
Code:
                        <th align="right" style="width: 50px;">
                           Time
                        </th>
                        <th align="right" style="width: 50px;">
                           Remaining
                        </th>


Code:
                        <td align="right">
                           <span id="currently-playing-duration"><?php echo $currentSong->durationDisplay; ?></span>
                        </td>
                        <td align="right">
                           <span id="currently-playing-remaining">Calculating remaining time...</span>
                        </td>


This will show a countdown based on the server time. Make sure to have your SAM and server times synchronized otherwise this will obviously not work at all. (And obviously the countdown will be off by whatever delay your stream server has over your actual SAM encoding.)


This is untested and I'm not sure if it works. I just wrote this off the top of my head (while looking at the sourcecode of the display.playing.php).
If you run into problems, you'll have to fix them yourself or pay me to do so. :P (no, really this is already way more than I usually do for free, I just had some spare time while resurrecting my 5 year old spare phone with some new software)

_________________
Benedikt Bauer - SVS (Spacial Volunteer Support)

Shop for readymade PAL scripts by countrywesterndj - Or get a custom script made by me (or others)

My Project:
Send "Now Playing" from SAM to Twitter and/or Facebook | Sourcecode


Top
 Profile  
Reply with quote  
PostPosted: May 30th, 2018, 10:33 pm 
Offline
Senior User
Senior User

Joined: July 23rd, 2007, 2:22 am
Posts: 174
Location: Vancouver, BC, Canada
@Masacheata, you are a genius! Have a look! I have to get it aligned a bit, but the remaining time countdown works!!

Thank you very much!

_________________
Park Magic Radio
http://parkmagicradio.ca


Top
 Profile  
Reply with quote  
PostPosted: June 2nd, 2018, 2:23 pm 
Offline
Senior User
Senior User

Joined: July 23rd, 2007, 2:22 am
Posts: 174
Location: Vancouver, BC, Canada
Is there a way to get the countdown to stop at "0:00" until the next song starts playing and the page refreshes? If I'm listening to the song and there are about 5 or 10 seconds left to play, and if watching the countdown at the same time, the countdown will go into a "negative" time mode and look something like this: -2:04-2 (or something like that). So if I could get it to stop at 0:00 once it finishes, then wait for the page to refresh before starting the countdown again for the next song, my site would be working perfectly! If you can help, thanks, but no pressure!

_________________
Park Magic Radio
http://parkmagicradio.ca


Top
 Profile  
Reply with quote  
PostPosted: June 4th, 2018, 2:34 am 
Offline
SVS Member
SVS Member

Joined: December 6th, 2004, 9:00 am
Posts: 8306
Location: Cologne (Germany)
Sure, this should keep the timer from ever going into negative numbers and should display a zero time while waiting for the next refresh of the page (usually every 5 seconds):
Code:
<script>function startTimer(duration, display) {
    var timer = duration, minutes, seconds;
    setInterval(function () {
        if (timer < 0) {
            timer = 0;
        }
        minutes = parseInt(timer / 60, 10)
        seconds = parseInt(timer % 60, 10);

        minutes = minutes < 10 ? "0" + minutes : minutes;
        seconds = seconds < 10 ? "0" + seconds : seconds;

        display.textContent = minutes + ":" + seconds;

        --timer;
    }, 1000);
}

window.onload = function () {
    var remaining=<?=$timeRemaining; ?>;
        display = document.querySelector('#currently-playing-remaining');
    startTimer(remaining, display);
};
</script>

_________________
Benedikt Bauer - SVS (Spacial Volunteer Support)

Shop for readymade PAL scripts by countrywesterndj - Or get a custom script made by me (or others)

My Project:
Send "Now Playing" from SAM to Twitter and/or Facebook | Sourcecode


Top
 Profile  
Reply with quote  
PostPosted: June 5th, 2018, 9:51 am 
Offline
Senior User
Senior User

Joined: July 23rd, 2007, 2:22 am
Posts: 174
Location: Vancouver, BC, Canada
As always, it works like a charm. Thank you again, Mastacheata!!

_________________
Park Magic Radio
http://parkmagicradio.ca


Top
 Profile  
Reply with quote  
PostPosted: February 20th, 2020, 10:31 am 
Offline
Junior User
Junior User

Joined: January 21st, 2013, 9:33 pm
Posts: 34
Mastacheata wrote:
This will show a countdown based on the server time. Make sure to have your SAM and server times synchronized otherwise this will obviously not work at all. (And obviously the countdown will be off by whatever delay your stream server has over your actual SAM encoding.)


I know this is old but in case someone wants this and having issue with synchronizing, just need to add the offset time difference, mine is -3600

Code:
<?php
$durationSeconds = $currentSong->duration / 1000; // duration is given in microseconds
$date_ends = strtotime($currentSong->date_played) + $durationSeconds;
$timeRemaining = $date_ends - time()-3600;
?>

_________________
Never a dull moment at MIXROCKMETAL.COM ~ UP THE IRONS \m/


Top
 Profile  
Reply with quote  
PostPosted: November 13th, 2021, 5:42 pm 
Offline
Junior User
Junior User

Joined: January 31st, 2009, 9:43 pm
Posts: 70
Sorry guys for digging out an old thread. I have tried the solution provided by Mastacheata, however my timing starts with xxx:xx. Not sure if this relates to server timing. Sam 2021.5 is running in local machine and with the time zone as Australian Eastern Daylight Time (AEDT)
You can view the counter in now playing tab. http://tamilragam.com/
Any help is much appreciated.

_________________
http://www.tamilragam.com


Top
 Profile  
Reply with quote  
PostPosted: November 14th, 2021, 8:01 pm 
Offline
SVS Member
SVS Member

Joined: December 6th, 2004, 9:00 am
Posts: 8306
Location: Cologne (Germany)
Check the post one above yours by armor for a solution to your problem.
They describe how you need to adjust my code and enter a timezone offset if your server's PHP runtime uses a different timezone.

You have to adjust the number 3600 to 36000 to get the right difference between server time and SAM time for you, though.
It seems like your server reports time in CET (UTC+1) instead of AEDT, because the offset as I see it appears to be exactly 600 minutes/10 hours.

Another alternative to adjusting the difference by hand is to just set the PHP timezone correctly. For that add this line to the top of my PHP code (you need to pick the right timezone identifier yourself, I picked Sydney, because that is very much on the east of Australia, but apparently not all your regions observe DST, so better check this yourself and not rely on me):
Code:
date_default_timezone_set('Australia/Sydney');


Valid timezone identifiers for Australia are listed here:
https://www.php.net/manual/en/timezones.australia.php

_________________
Benedikt Bauer - SVS (Spacial Volunteer Support)

Shop for readymade PAL scripts by countrywesterndj - Or get a custom script made by me (or others)

My Project:
Send "Now Playing" from SAM to Twitter and/or Facebook | Sourcecode


Top
 Profile  
Reply with quote  
PostPosted: November 14th, 2021, 9:59 pm 
Offline
Junior User
Junior User

Joined: January 31st, 2009, 9:43 pm
Posts: 70
Thank you so much, it worked perfectly fine. There is only few seconds difference between Sam and the webpage time counter. That is fine as it is better than having XXX:XX. I changed the last line of script based on your guidance
Code:
$timeRemaining = $date_ends - time()-39600;
I am assuming the logic is 39600 seconds = 11 hours which is (Australian Eastern Daylight Time (AEDT), UTC +11;)

Much appreciated with your help

_________________
http://www.tamilragam.com


Top
 Profile  
Reply with quote  
PostPosted: November 15th, 2021, 6:59 am 
Offline
SVS Member
SVS Member

Joined: December 6th, 2004, 9:00 am
Posts: 8306
Location: Cologne (Germany)
Quote:
There is only few seconds difference between Sam and the webpage time counter.

That's inevitable. It takes a few seconds for the audio to be processed (encoded) and sent over the network to your streaming server. Also the calculation in the PHP code needs to first call your database and then do the calculations, which will add another 200-300ms delay. I'd say 2-3 seconds is the best case scenario and anything up to 10 seconds doesn't hint at problems.

_________________
Benedikt Bauer - SVS (Spacial Volunteer Support)

Shop for readymade PAL scripts by countrywesterndj - Or get a custom script made by me (or others)

My Project:
Send "Now Playing" from SAM to Twitter and/or Facebook | Sourcecode


Top
 Profile  
Reply with quote  
Display posts from previous:  Sort by  
Post new topic Reply to topic  [ 14 posts ] 

All times are UTC - 6 hours [ DST ]


Who is online

Users browsing this forum: No registered users and 4 guests


You cannot post new topics in this forum
You cannot reply to topics in this forum
You cannot edit your posts in this forum
You cannot delete your posts in this forum
You cannot post attachments in this forum

Search for:
Jump to:  
cron
Powered by phpBB® Forum Software © phpBB Group