Sunday, July 8, 2012

Radio PI

I decided to go ahead and release my Radio PI setup. Steps 2 & 3 are completely optional and not needed for playing internet radio at all, I just like having Webmin on all of my Linux Boxes.
This assumes that you are running the Wheezy Beta RPI distro or later (audio is fixed in Wheezy)

1) log into console: /etc/init.d/ssh start so you can login from the pc :)
2) Install webmin  (wget http://prdownloads.sourceforge.net/webadmin/webmin-1.590.tar.gz)  tar xvzf filename   cd webmin_folder   ./setup.sh
3) Set SSH to auto start at bootup in Webmin
4) install PHP  (apt-get install php5)  this will also install apache
5) install mpg123 (apt-get install mpg123)
6) Create a user that will auto login (adduser radio)
7) set the hostname (hostname RadioPI)
8) Create the web pages that will be used to change radio stations

/var/www/stationCommon.php
*********************************
<?php
// Created 7/7/2012 by Gregg Buntin - http://pentiumprime.realmlabs.com/
    $file = fopen("stationList","r");
    while(!feof($file))
    {
        $string = fgets($file);
        $tempArray = explode("~",$string);
        $radioList[] = $tempArray;
    }
    fclose($file);
    $currentStation = trim(file_get_contents("station"));
?>
*********************************

/var/www/index.php
*********************************
<?php
// Created 7/7/2012 by Gregg Buntin - http://pentiumprime.realmlabs.com/
    include("stationCommon.php");
?>
<html>
<head>
   <link href="station.css" rel="stylesheet" type="text/css">
</head>
<body bgcolor="#669">
    <center>
    <h2 style="color: #0f0;"><?=file_get_contents("/etc/hostname");?></h2>
    <table>
       <tr>
<?php
    $colCount = 0;
    foreach ($radioList as $key => $stationData)
    {
        if (trim($stationData[0]) > "")
        {
           $stationName = trim($stationData[0]);
           $stationUrl = trim($stationData[1]);
           if ($stationUrl > "")
           {
               $buttonClass = "button";
               if ($currentStation == $stationUrl)
               {
                   $buttonClass .= " save";
                   $currentName = $stationName;
               } // if currentStation
               else
               {
                   $buttonClass .= " play";
               }
               $colCount++;
               if ($colCount == 3) print "</tr>\r\n<tr>\r\n";
               print "<td><button id='$stationName' onclick=\"doRadio('$stationUrl','$stationName');\" class=\"$buttonClass\">$stationName</button></td>\r\n";
           } // if stationUrl
        } // if stationData[0]
    } // foreach
?>
       </tr>
    </table>
    </center>
    <iframe id="radioFrame" style="height: 0px; width: 0px; visibility: hidden;"></iframe>
    <script>
        var lastStation = '<?=$currentName;?>';
        var theFrame = document.getElementById('radioFrame');
        function doRadio(inUrl, inName)
        {
               if (lastStation > '')
               {
                  lastButton = document.getElementById(lastStation);
                  lastButton.innerText = lastStation;
                  lastButton.className = "button play";
               }
               if (inName > '')
               {
                  newButton = document.getElementById(inName);
                  newButton.innerText = inName;
                  newButton.className = "button save";
                  theFrame.src = "doRadioScript.php?inUrl="+inUrl;
                  lastStation = inName;
               }
        }
    </script>
</body>
</html>
*********************************

/var/www/station.css
*********************************
# CSS from this site: http://www.red-team-design.com/just-another-awesome-css3-buttons
.button
{
        display: inline-block;
        white-space: nowrap;
        background-color: #9cf;
        background-image: -webkit-gradient(linear, left top, left bottom, from(#eee), to(#9cf));
        background-image: -webkit-linear-gradient(top, #eee, #9cf);
        background-image: -moz-linear-gradient(top, #eee, #9cf);
        background-image: -ms-linear-gradient(top, #eee, #9cf);
        background-image: -o-linear-gradient(top, #eee, #9cf);
        background-image: linear-gradient(top, #eee, #9cf);
        filter: progid:DXImageTransform.Microsoft.gradient(startColorStr='#eeeeee', EndColorStr='#99ccff');
        border: 1px solid #777;
        padding: 0 1.5em;
        margin: 0.5em;
        font: bold 2em/3em Arial, Helvetica;
        text-decoration: none;
        color: #333;
        text-shadow: 0 1px 0 rgba(255,255,255,.8);
        -moz-border-radius: .2em;
        -webkit-border-radius: .2em;
        border-radius: .2em;
        -moz-box-shadow: 0 0 1px 1px rgba(255,255,255,.8) inset, 0 1px 0 rgba(0,0,0,.3);
        -webkit-box-shadow: 0 0 1px 1px rgba(255,255,255,.8) inset, 0 1px 0 rgba(0,0,0,.3);
        box-shadow: 0 0 1px 1px rgba(255,255,255,.8) inset, 0 1px 0 rgba(0,0,0,.3);
}

.button:hover
{
        background-color: #cfc;
        background-image: -webkit-gradient(linear, left top, left bottom, from(#fafafa), to(#cfc));
        background-image: -webkit-linear-gradient(top, #fafafa, #cfc);
        background-image: -moz-linear-gradient(top, #fafafa, #cfc);
        background-image: -ms-linear-gradient(top, #fafafa, #cfc);
        background-image: -o-linear-gradient(top, #fafafa, #cfc);
        background-image: linear-gradient(top, #fafafa, #cfc);
        filter: progid:DXImageTransform.Microsoft.gradient(startColorStr='#fafafa', EndColorStr='#cfc');
}

.button:active
{
        -moz-box-shadow: 0 0 4px 2px rgba(0,0,0,.3) inset;
        -webkit-box-shadow: 0 0 4px 2px rgba(0,0,0,.3) inset;
        box-shadow: 0 0 4px 2px rgba(0,0,0,.3) inset;
        position: relative;
        top: 1px;
}

.button:focus
{
        outline: 0;
        background: #fafafa;
}

.button:before
{
        background: #9cf;
        background: rgba(0,0,0,.1);
        float: left;
        width: 1em;
        text-align: center;
        font-size: 1.5em;
        margin: 0 1em 0 -1em;
        padding: 0 .2em;
        -moz-box-shadow: 1px 0 0 rgba(0,0,0,.5), 2px 0 0 rgba(255,255,255,.5);
        -webkit-box-shadow: 1px 0 0 rgba(0,0,0,.5), 2px 0 0 rgba(255,255,255,.5);
        box-shadow: 1px 0 0 rgba(0,0,0,.5), 2px 0 0 rgba(255,255,255,.5);
        -moz-border-radius: .15em 0 0 .15em;
        -webkit-border-radius: .15em 0 0 .15em;
        border-radius: .15em 0 0 .15em;
        pointer-events: none;
}

/* Hexadecimal entities for the icons */

.save:before
{
        content: "\2714";
}

.play:before
{
        content: "\25B6";
}
*********************************

/var/www/doRadioScript.php
*********************************
<?php
// Created 7/7/2012 by Gregg Buntin - http://pentiumprime.realmlabs.com/
    include "stationCommon.php";

    $inUrl = trim($_GET["inUrl"]);
    
    // Check to make sure the passed in URL is in our list of valid radio stations
    $DoIt = false;
    foreach ($radioList as $key => $stationData)
    {
        if (trim($stationData[0]) > "")
        {
           $stationUrl = trim($stationData[1]);
           if ($stationUrl > "")
           {
               if ($inUrl == $stationUrl)
               {
                   $DoIt = true;
               } // if inUrl
           } // if stationUrl
        } // if stationData[0]
    } // foreach

    // Passed in Url is in our List so write it out and restart mpg123
    if ($DoIt)
    {
       $file = fopen("/var/www/station","w");
       fwrite($file,$inUrl);
       fclose($file);
       echo shell_exec("/usr/bin/doradio > /dev/null 2>/dev/null &");
    }
?>
*********************************

/var/www/stationlist
*********************************
Antioch ~ http://lin2.ash.fast-serv.com:9022/listen.pls
WTMJ ~ http://1942.live.streamtheworld.com:3690/WTMJAM_SC
*********************************

/var/www/station (be sure to chmod 777 this file)
*********************************
http://lin2.ash.fast-serv.com:9022/listen.pls
*********************************

9) create the script to change the radio station based on their selections:

/usr/bin/doradio (be sure to chmod 755 this file)
*********************************
# Created 7/7/2012 by Gregg Buntin - http://pentiumprime.realmlabs.com/
sudo -uradio killall  mpg123
sudo -uradio /usr/bin/mpg123 -@ `cat /var/www/station` &
*********************************

10) Setup for the Auto Login (vi /etc/inittab)
    find this line and comment it out: 1:2345:respawn:/sbin/getty 115200 tty1
    below it add this line:  1:2345:respawn:/bin/login -f radio tty1 </dev/tty1 >/dev/tty1 2>&1
    save it
    
11) set the user to start the radio on login
    vi /home/radio/.bash_profile  and add the following line
    /usr/bin/doradio
    save it
    
12) setup www-data so it can sudo to the radio user
    vi /etc/sudoers and add the following lines:
        radio ALL=(radio)NOPASSWD:/usr/bin/doradio,/usr/bin/mpg123 *,/usr/bin/killall mpg123
        www-data ALL=(radio)NOPASSWD:/usr/bin/doradio,/usr/bin/mpg123 *,/usr/bin/killall mpg123
    save it
    
13) REBOOT and you are done!

No comments:

Post a Comment

Comments are moderated. We're only going to allow stuff that we find funny, interesting, or just plain for the heck of it. If you don't like that, feel free to leave.

Copyright Realm Laboratories, LLC