Frontend Widgets

Ancient Documentation Warning

This documentation is out-of-date and we do not recommend following this approach.

Contents:

Widget Installation The Three Widgets Current/Next show widget Upcoming shows widget Weekly shows widget How to Push Widget Data from Airtime to Your Public Website Airtime Server Public Web Site Server 3rd Party Widgets

Widget Installation

Using the widgets is very simple.

1) In the Airtime admin interface, login as an administrator, go to the "Preferences" page, and enable the option "Allow Remote Websites To Access 'Schedule' Info?".

2) Get the widgets from the "widgets" directory in the tarball. (Download the latest from here)

3) Put that directory on your webserver and name it "airtime-widgets".

4) In order to avoid conflicts with other libraries, it is best to put the widgets in an iframe:

"airtime-iframe.html" contains:

You can tweak the above using the guides below for each widget.

5) In order to test the widgets, make sure you have some shows scheduled for the next 24 hours.

The widgets should now be displaying data properly.

The Three Widgets

Current/Next show widget

A very small widget that displays information about the current show (show time elapsed, show time remaining), as well as some information about the next show (start time, end time).

The widget can be used as follows:

If you do not see anything displayed, it may mean that the widget is unable to connect to the server you specified.

Upcoming shows widget

A medium sized widget the displays the upcoming show schedule for that day.

Usage:

Weekly shows widget

A large sized widget that lets you browse through the show schedule for that week.

Usage:

How to Push Widget Data from Airtime to Your Public Website

This may be needed if the Airtime server is hidden behind a firewall on an internal network. It may also be used to protect the Airtime server from large numbers of direct hits from the public to the schedule api.

Airtime Server

1. Create script to export the widget data:

sudo vi /opt/airtime/export-widget-data.sh

File content:

#!/bin/sh curl -s "http://localhost/api/live-info/type/endofday?callback=***" > /tmp/airtime-live-info curl -s "http://localhost/api/week-info?callback=***" > /tmp/airtime-week-info

Set perms on the script:

sudo chmod 755 /opt/airtime/export-widget-data.sh

2. Set the export script to run each minute:

sudo vi /etc/cron.d/airtime-widgets-generate-data

File content:

* * * * * root /opt/airtime/export-widget-data.sh

3. Create the file to upload widget data to public site:

sudo vi /opt/airtime/upload-widget-data.sh

File content: !/bin/bash HOST='PUBLIC_WEB_SERVER' USER='PUT_USERNAME_HERE' PASSWD='PUT_PASSWORD_HERE'

ftp -n -v $HOST << EOT user $USER $PASSWD ascii prompt put /tmp/airtime-week-info put /tmp/airtime-live-info bye EOT

Set permissions for the file:

sudo chmod 755 /opt/airtime/upload-widget-data.sh

4. Upload widget data to public site once per minute:

sudo vi /etc/cron.d/airtime-widgets-upload

File content:

* * * * * root /opt/airtime/upload-widget-data.sh

5. Restart cron so that it can see your new cron entries:

sudo service cron restart

Public Web Site Server

1. Create on public site root the folders api/live-info and api/week-info (they MUST be named exactly as shown).

2. Create index. file in api/live-info folder:

header('Content-Type: text/javascript'); header("Expires: Thu, 01 Jan 1970 00:00:00 GMT"); header("Cache-Control: no-store, no-cache, must-revalidate");

$callback = empty($_GET['callback']) ? null : $_GET['callback']; $content = file_get_contents($filename); $content = str_replace('***', $callback, $content); echo $content; ?>

3. Create index.php file in api/week-info folder:

header('Content-Type: text/javascript'); header("Expires: Thu, 01 Jan 1970 00:00:00 GMT"); header("Cache-Control: no-store, no-cache, must-revalidate");

$callback = empty($_GET['callback']) ? null : $_GET['callback']; $content = file_get_contents($filename); $content = str_replace('***', $callback, $content); echo $content; ?>

4. Set up widgets to work with public site

... sourceDomain: public_site_address ...

3rd Party Widgets

This widget will show what is currently playing on an Icecast server: http://blog.codingexpert.de/?p=66