Full Screen Tube Status 404

Anyone know what’s happened to the TFL Tube Status full screen display?

https://tfl.gov.uk/tfl/syndication/feeds/serviceboard-fullscreen.htm

It’s been dead for a few days now.

Thanks
Andy

@andyj300

This has been depreciated. You are expected to make your own board up from a call to https://api.tfl.gov.uk/line/mode/tube/status

Well that would sure explain it!

Are there any alternatives (full screen simple tube status)? Or am I going to have learn how to code!? I was using it as part of a digital sign.

Here’s a basic routine in PHP that generates a serviceboard… The CSS might need fixing to get a full-screen display.

        <?php
    echo "<style>.rainbowBoard{border:1px solid #ccc;margin-top:10px}.rainbowBoard td{padding:8px 15px 8px 15px}.rainbowBoard tr>td:nth-child(1){color:#fff;width:50%}.rainbowBoard tr>td:nth-child(2){color:#fff}.
    black{color:#000!important}.partClosure,.severeDelays{background:#faf5e1}.
    .londonoverground{background:#e86a10}.london-overground{background:#e86a10}.piccadillyline{background:#0019a8}.bakerlooline{background:#894e24}.centralline{background:#dc241f}.circleline{background:#ffce00}
    .districtline{background:#007229}.hammersmithcityline{background:#d799af}.hammersmith-city{background:#d799af}.jubileeline{background:#6a7278}.metropolitanline{background:#751056}.northernline{background:#000}
    .victorialine{background:#00a0e2}.waterloocityline{background:#76d0bd}.tfLRail{background:#0019a8}.docklandslightrailway{background:#00afad}.londontrams{background:#6c0}</style>";
    $tflData = json_decode(file_get_contents("https://api.tfl.gov.uk/line/mode/tube,overground,dlr,tflrail,tram/status?"));
    $arrSavedNames = [];
    $arrResult = [];
    foreach ($tflData as $tflDatum) {
        $strLineID = strtr($tflDatum->id, ["-" => ""]);
        $strMode = $tflDatum->modeName;
        if ($strMode == "tube") {
            $strMode = "line";
        } else if ($strMode == "overground") {
            $strMode = "";
        } else if ($strMode == "dlr") {
            $strMode = "";
            $strLineID = "docklandslightrailway";
        } else if ($strMode == "tflrail") {
            $strMode = "";
            $strLineID = "tflrail";
        } else if ($strMode == "tram") {
            $strLineID = "londontrams";
            $strMode = "";
        }
        $strLineID = $strLineID;
        if (isset($tflDatum->name)) {
            $arrSavedNames[$strLineID . $strMode] = $tflDatum->name;
        }
        foreach ($tflDatum->lineStatuses as $lineStatus) {
            if (!isset($arrResult[$strLineID . $strMode])) {
                $arrResult[$strLineID . $strMode] = $lineStatus->statusSeverityDescription;
            } else {
                {
                    $arrResult[$strLineID . $strMode] .= ", " . $lineStatus->statusSeverityDescription;
                }
            }
        }
    }
    $strStandardRainbowBoard = "";
    foreach ($arrResult as $strID => $strStatus) {
        $strStandardRainbowBoard .= PHP_EOL . "<tr><td class='$strID'>" . $arrSavedNames[$strID] . "</td><td class='$strID'>$strStatus</td></tr>";
    }
    echo "<table class='rainbowBoard'>" . $strStandardRainbowBoard . "</table>";

That is awesome, thank you!

I have made some tweaks and added a ‘Last updated’ row and it is perfect.

Not really sure why the TFL one had to be scrapped, but this is working well.

My pleasure.

I think that the TfL one was removed for a good reason, probably something to do with https and iFrames.

2 Likes

We are using tube serviceboard status on our website.
Any alternative? other than PHP code.

@SriSwe2108

Welcome. I guess you could do the same sort of this in Javascript, it’s just I had the code from the MTR Crossrail system’s backend that I could cut and paste.

Here’s a quick knock-together code for Javascript…

    <!DOCTYPE html>
    <html lang="en">
    <head>
        <meta charset="UTF-8">
        <title>Title</title>
    </head>
    <body>
    
<style>.rainbowBoard{border:1px solid #ccc;margin-top:10px;color:#fff}.rainbowBoard td{padding:8px 15px 8px 15px}.rainbowBoard tr>td:nth-child(1){width:50%}.rainbowBoard tr>td:nth-child(2){}
    .black{color:#000!important}.partClosure,.severeDelays{background:#faf5e1}
    .londonoverground{background:#e86a10}.london-overground{background:#e86a10}.piccadilly{background:#0019a8;color:white}.bakerloo{background:#894e24; color:#fff}.central{background:#dc241f}.circle{background:#ffce00;color:#0019a8}
    .district{background:#007229}.hammersmithcity{background:#d799af}.hammersmith-city{background:#d799af}.jubilee{background:#6a7278}.metropolitan{background:#751056}.northern{background:#000;color:#fff}
    .victoria{background:#00a0e2}.waterloo-city{background:#76d0bd;color:#0019a8}.tfl-rail{background:#0019a8;color:white}.dlr{background:#00afad}.tram{background:#6c0}</style>
    
    <script>
        // Store XMLHttpRequest and the JSON file location in variables
        var xhr = new XMLHttpRequest();
        var url = "https://api.tfl.gov.uk/line/mode/tube,overground,dlr,tflrail,tram/status";
    
        // Called whenever the readyState attribute changes
        xhr.onreadystatechange = function () {
    
            // Check if fetch request is done
            if (xhr.readyState == 4 && xhr.status == 200) {
    
                // Parse the JSON string
                var jsonData = JSON.parse(xhr.responseText);
    
                // Call the showTfL(), passing in the parsed JSON string
                showTfL(jsonData);
            }
        };
    
        // Do the HTTP call using the url variable we specified above
        xhr.open("GET", url, true);
        xhr.send();
    
        // Function that formats the string with HTML tags, then outputs the result
        function showTfL(data) {
            var output = ""; // Open list
    
            // Loop through the artists, and add them as list items
            for (var i in data) {
                output += "<tr><td class='" + data[i].id + "'>" + data[i].name + "</td>";
    
                var str = "";
    
                for (var j in data[i].lineStatuses)
    
            {
                str = str + data[i].lineStatuses[j].statusSeverityDescription
            }
            output += "<td class='" + data[i].id + "'>" + str + "</td></tr>";
        }
    
    
        // Output the data to the "artistlist" element
        document.getElementById("divOut").innerHTML = "<table class='rainbowBoard'>" + output + "</>";
        }
    </script>
    
    [
    <div id="divOut"></div>
    ]
    
    </body>
    </html>
1 Like

Awesome ! this is working perfectly.
Thank you.

1 Like

@andyj300 @briantist is correct. I posted on here a while ago about the deprecation of the widgets - https://techforum.tfl.gov.uk/t/tfl-widgets-to-be-decommissioned-on-31-july-2019/1030/3 Unfortunately, we don’t have a database of people who are using them so couldn’t contact you direct. Glad @briantist has been able to help you out!

No problem! I didn’t know this forum existed until I was searching to find out why it had stopped working. We are all good now though.

I did find some other web facing status screens, but have since lost them. Don’t suppose you have some links?