Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 6 of 6
  1. #1
    New to the CF scene
    Join Date
    Jul 2014
    Posts
    3
    Thanks
    3
    Thanked 0 Times in 0 Posts

    Simple daily "PROGRAMME ON-AIR" for voluntary community radio station

    Hello all

    Firstly, apologies, I am a total newbie here, but I don't believe anyone had the query I have.

    I am the webmaster (by default because I have some knowledge of putting websites together and others, in typical voluntary fashion, can't be bothered) for a voluntary (non-commercial) community radio station. I was hoping to put a simple line above our "listen now" graphic on the website that tells visitors what programme is currently playing. I have seen several scripts about, one of these being from this forum, (which I have pasted below). However I am not adept enough to adapt it.

    What I want it to do is just display a very simple "Programme currently playing : Seven-Day Ramble" style message for each programme. No images or other messages about news time required.

    However, there are two factors complicating my adaptation of the script below:
    1. Our schedule (24 hours a day programming, GMT) is different each day [i.e. my own programme may be on at 13.00 one day but on at 7.00 the next day]
    2. Some programmes are only half an hour in length; however, if it meant two lines of text, I could certainly live with the 'currently playing message' saying the programme playing from the top of the hour on one line and the programme playing from the half-past the hour on the second line.

    If anyone could help, this would be fantastic. I would rather html (thus keeping to the KISS principle) so if needing to be changed, it could be done in the relevant html box as placed on the webpage rather than reloading a .php script each time. We (well, I) have experienced trouble with .php's previously.

    If anyone can help, this would be absolutely wonderful.

    This is the script I have seen on this forum:


    Code:
    <html>
    <head>
    <title>Time Display</title>
    
    <script type="text/javascript">
    
    function DisplayTIME() {
      var currentTime = new Date();
      var dayname = currentTime.getDay()
      var hours = currentTime.getHours();
    
      var nd = new Date();
      nd = nd.getTimezoneOffset();
      var offset = Math.floor(nd / 60);
      var nextTime = (hours + offset) % 24 +1;
      if (nextTime < 10) { nextTime = "0" + nextTime; }
      var message = "Our next live news bulletin on The Mix Radio is at ";
      if (offset == 0) {
        message += nextTime + ':00 GMT';
      } else {
        message += nextTime + ':00 Local Time ';
      }
      document.getElementById('yourdivid').innerHTML = '<p>'+message;
      document.getElementById('currentDJ').innerHTML = CurrentDJ(hours);
    }
    var baseURL = 'http://www.nova.edu/hpd/otm/pics/4fun/';
    var imgNoDJ = 'http://www.vicsjavascripts.org.uk/StdImages/frogs.jpg';
    var imgList = ['','','','','','','','','11.jpg', // midnight to 8am
        '11.jpg','12.jpg','12.jpg','13.jpg',         // 9am to noon
        '13.jpg','14.jpg','14.jpg','15.jpg',         // 1pm to 4pm
        '15.jpg','21.jpg','21.jpg','22.jpg',         // 5pm to 8pm
        '22.jpg','23.jpg','23.jpg','',               // 9pm to midnight
    ];
    var DJList = ['','','','','','','','','John',    // midnight to 8am
        'John','Jacob','Jacob','Jingle-Heimer',      // 9am to noon
        'Jingle-Heimer','Smith','Smith','Mary',      // 1pm to 4pm
        'Mary','Susan','Susan','Ophelia',            // 5pm to 8pm
        'Ophelia','Wolfman','Wolfman','',            // 9pm to midnight
    ];
    function CurrentDJ(hrs) {
      var tmp = imgList[hrs];
      var msg = '';
      if (tmp == '') { tmp = imgNoDJ;
                       msg = '<p>Currently we are Off-Air'; }
                else { tmp = baseURL+imgList[hrs]; 
                       msg = '<p>Currently On-Air is: '+DJList[hrs]; }
      document.getElementById('DJpicture').src = tmp;
      return msg;
    }
    </script>
    </head>
    
    <body onload = "DisplayTIME()">
    
    <div id="yourdivid">Message about TMR News schedule</div>
    <div id="currentDJ">Off Air</div>
    <img id="DJpicture" src="">
    </body>
    </html>


    Many thanks indeed
    Ed (Steddyeddy)
    Last edited by VIPStephan; 07-22-2014 at 08:52 AM. Reason: added code BB tags

  • #2
    Supreme Master coder! Old Pedant's Avatar
    Join Date
    Feb 2009
    Posts
    27,574
    Thanks
    80
    Thanked 4,620 Times in 4,583 Posts
    Looks suspiciously like code adapted from something I wrote. The "John Jacob Jingleheimer Smith" is indicative.

    But anyway...

    Let's do this a lot neater:
    Code:
    function Program( s, e, n, i )
    {
        this.start = s;
        this.end   = e;
        this.name = n;
        this.image = i;
    }
    
    var programs = [
        new Program( "8:00", "8:15", "Morning stretch", "stretch.jpg" ),
        new Program( "8:15", "9:00", "Morning news", "news.jpg" ),
        new Program( "9:00", "12:00", "Music in the morning", "music.png" ),
        ... others ...
    ];
    Would that work for you? Or maybe even more interesting: Put your programs into an Excel spreadsheet, with the column names shown (or even add more column names), one row per time slot. Then export the Excel data as a ".csv" file. Put the csv file on the website and your JS code can then read it, so that you won't have to change the code when the programs change.

    Getting there?
    An optimist sees the glass as half full.
    A pessimist sees the glass as half empty.
    A realist drinks it no matter how much there is.

  • Users who have thanked Old Pedant for this post:

    steddyeddy (07-22-2014)

  • #3
    Supreme Master coder! Old Pedant's Avatar
    Join Date
    Feb 2009
    Posts
    27,574
    Thanks
    80
    Thanked 4,620 Times in 4,583 Posts
    I would suggest that this might be better done with PHP or other server-side code.

    Though if you want the display to change when the time changes using JS is a good idea.
    An optimist sees the glass as half full.
    A pessimist sees the glass as half empty.
    A realist drinks it no matter how much there is.

  • Users who have thanked Old Pedant for this post:

    steddyeddy (07-22-2014)

  • #4
    New to the CF scene
    Join Date
    Jul 2014
    Posts
    3
    Thanks
    3
    Thanked 0 Times in 0 Posts
    Thank you so much, so very much appreciated - I will give it a shot - must confess "Excel csv" is a language I can speak with a littler more confidence, as that how the programme slots are provided for me by the programme-techies in the first place!

    I just need to satisfy myself with the relevant code!

    Yes, this was yours originally.

    Kind regards and again thank you
    Ed

  • #5
    Supreme Master coder! Old Pedant's Avatar
    Join Date
    Feb 2009
    Posts
    27,574
    Thanks
    80
    Thanked 4,620 Times in 4,583 Posts
    So JavaScript *CAN* read a CSV file so long as it is served up by the same host (base URL) as the web page that contains the JavaScript code.

    It's not even hard:
    Code:
        function Program( s, e, n, i )
        {
            this.start = s;
            this.end   = e;
            this.name  = n;
            this.image = i;
        } 
    
        var programs = [ ];
    
        var http = new new XMLHttpRequest() ||   new ActiveXObject("Microsoft.XMLHTTP");
        http.open( "GET", "/data/schedule.csv", false );
        http.send( );
        if ( http.status == 200 )
        {
            var lines = http.responseText.split( 'XXX' ); // see below
            for ( var i = 0 to lines.length )
            {
                var fields = lines[i].split(","); // or whatever delimiter you use in CSV file...| is a better choice
                programs.push( new Program( fields[0], fields[1], fields[2], fields[3] ) );
            }
        } else {
            ... unable to read the csv file...fatal...what will you do about it?
        }
    The code tag here messed up my use of "\n". Use "\n" in plase of "XXX".
    An optimist sees the glass as half full.
    A pessimist sees the glass as half empty.
    A realist drinks it no matter how much there is.

  • Users who have thanked Old Pedant for this post:

    steddyeddy (07-22-2014)

  • #6
    New to the CF scene
    Join Date
    Jul 2014
    Posts
    3
    Thanks
    3
    Thanked 0 Times in 0 Posts
    Once again - thank you.


  •  

    Tags for this Thread

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •