metade · October 25, 2012 16:33
diff --git a/index.html b/index.html
 <!DOCTYPE html>
 <html>
 <head>
    <title>Radio TV</title>
    <script src="require.js" type="text/javascript"></script>
    <script type="text/javascript">
        bbcRequireMap = {
          'jquery-1'             : 'http://static.bbci.co.uk/frameworks/jquery/0.1.8/sharedmodules/jquery-1.6.2',
          'swfobject-2'          : 'http://static.bbci.co.uk/frameworks/swfobject/0.1.3/sharedmodules/swfobject-2',
          'demi-1'               : 'http://static.bbci.co.uk/frameworks/demi/0.9.8/sharedmodules/demi-1'
          };
        require({
          baseUrl: 'http://static.bbci.co.uk/',
          paths: bbcRequireMap,
          waitSeconds: 30
          });
    </script>
    
    <style>
        body { background: white url(radiotv.jpg) no-repeat; width: 1024px; }
        #emp1 { position: absolute; top: 300px; left: 370px; }
        #stations {
            position: absolute;
            top: 300px;
            left: 753px;
            width: 110px;
            font-size: 2em;
        }
        #details {
            font-family: arial;
            padding: 5px;
            background: white;
            width: 50%;
            margin-left:auto;
        }
    </style>
    
 </head>
 <body>
    <div id="emp1">Choose a station</div>
    <div id="details">
        <h2 id="title"></h2>
        <p id="synopsis"></p>
    </div>
    
    
    <select name="selectionField" id="stations"> 
      <option value="bbc_radio_one">Radio 1</option>
      <option value="bbc_radio_two">Radio 2</option>
      <option value="bbc_radio_three">Radio 3</option>
      <option value="bbc_radio_four">Radio 4</option>
      <option value="bbc_radio_five_live">5live</option>
      <option value="bbc_6music">6music</option>
      <option value="bbc_1xtra">1Xtra</option>
      <option value="bbc_london">London</option>
    </select>
    
    
    <script type="text/javascript">
        var current = 0;
        var programmes;
        require(['jquery-1'], function($) {
            function setupStation(station) {
                $.getJSON('http://jsonp.jit.su/?callback=?&url=http://www.bbc.co.uk/radioassets/latest/' + station + '/clips.json', function(data) {
                    programmes = data.programmes;
                    programme = programmes[0];
                    setupProgramme(programme);
                    setupEmp("http://www.bbc.co.uk/iplayer/playlist/" + programme.pid);
                });
            }
            
            $("#stations").change(function() {
                setupStation($(this).val());
            });
            setupStation('bbc_radio_one');
        });
        function setupProgramme(programme) {
            require(['jquery-1'], function($) {
            
                $('#title').text(programme.title);
                $('#synopsis').text(programme.medium_synopsis);
            });
        }
        function setupEmp(playlist) {
            require(['http://www.bbc.co.uk/emp/bump/define.js'], function (embeddedMedia) {
                var emp = new embeddedMedia.Player();
                emp.setWidth("345");
                emp.setHeight("280");
                emp.setDomId("emp1");
                emp.setPlaylist(playlist);
                
                emp.setConfig("http://www.bbc.co.uk/emp/docs/demos/xml/jsapi_config.xml");
                emp.set("config_settings_autoPlay", true);
                emp.set("config_settings_showPopoutButton", false);
                emp.set("config_settings_suppressRelatedLinks", true);
                
                emp.write();
                
                emp.onMediaPlayerInitialised = function() {
                    console.log('onMediaPlayerInitialised');
                    emp.register('onPlaylistCompleted');
                    emp.onPlaylistCompleted = function(e, emp) {
                        current++
                        var programme = programmes[current];
                        setupProgramme(programme);
                        setupEmp("http://www.bbc.co.uk/iplayer/playlist/" + programme.pid);
                    };
                }
            });
        }
    </script>
    
    <small>http://www.flickr.com/photos/joimson/2437158796/</small>
 </body>
 </html>
	<!DOCTYPE html>
	<html>
	<head>
	<title>Radio TV</title>
	<script src="require.js" type="text/javascript"></script>
	<script type="text/javascript">
	bbcRequireMap = {
	'jquery-1' : 'http://static.bbci.co.uk/frameworks/jquery/0.1.8/sharedmodules/jquery-1.6.2',
	'swfobject-2' : 'http://static.bbci.co.uk/frameworks/swfobject/0.1.3/sharedmodules/swfobject-2',
	'demi-1' : 'http://static.bbci.co.uk/frameworks/demi/0.9.8/sharedmodules/demi-1'
	};
	require({
	baseUrl: 'http://static.bbci.co.uk/',
	paths: bbcRequireMap,
	waitSeconds: 30
	});
	</script>

	<style>
	body { background: white url(radiotv.jpg) no-repeat; width: 1024px; }
	#emp1 { position: absolute; top: 300px; left: 370px; }
	#stations {
	position: absolute;
	top: 300px;
	left: 753px;
	width: 110px;
	font-size: 2em;
	}
	#details {
	font-family: arial;
	padding: 5px;
	background: white;
	width: 50%;
	margin-left:auto;
	}
	</style>

	</head>
	<body>
	<div id="emp1">Choose a station</div>
	<div id="details">
	<h2 id="title"></h2>
	<p id="synopsis"></p>
	</div>


	<select name="selectionField" id="stations">
	<option value="bbc_radio_one">Radio 1</option>
	<option value="bbc_radio_two">Radio 2</option>
	<option value="bbc_radio_three">Radio 3</option>
	<option value="bbc_radio_four">Radio 4</option>
	<option value="bbc_radio_five_live">5live</option>
	<option value="bbc_6music">6music</option>
	<option value="bbc_1xtra">1Xtra</option>
	<option value="bbc_london">London</option>
	</select>


	<script type="text/javascript">
	var current = 0;
	var programmes;
	require(['jquery-1'], function($) {
	function setupStation(station) {
	$.getJSON('http://jsonp.jit.su/?callback=?&url=http://www.bbc.co.uk/radioassets/latest/' + station + '/clips.json', function(data) {
	programmes = data.programmes;
	programme = programmes[0];
	setupProgramme(programme);
	setupEmp("http://www.bbc.co.uk/iplayer/playlist/" + programme.pid);
	});
	}

	$("#stations").change(function() {
	setupStation($(this).val());
	});
	setupStation('bbc_radio_one');
	});
	function setupProgramme(programme) {
	require(['jquery-1'], function($) {

	$('#title').text(programme.title);
	$('#synopsis').text(programme.medium_synopsis);
	});
	}
	function setupEmp(playlist) {
	require(['http://www.bbc.co.uk/emp/bump/define.js'], function (embeddedMedia) {
	var emp = new embeddedMedia.Player();
	emp.setWidth("345");
	emp.setHeight("280");
	emp.setDomId("emp1");
	emp.setPlaylist(playlist);

	emp.setConfig("http://www.bbc.co.uk/emp/docs/demos/xml/jsapi_config.xml");
	emp.set("config_settings_autoPlay", true);
	emp.set("config_settings_showPopoutButton", false);
	emp.set("config_settings_suppressRelatedLinks", true);

	emp.write();

	emp.onMediaPlayerInitialised = function() {
	console.log('onMediaPlayerInitialised');
	emp.register('onPlaylistCompleted');
	emp.onPlaylistCompleted = function(e, emp) {
	current++
	var programme = programmes[current];
	setupProgramme(programme);
	setupEmp("http://www.bbc.co.uk/iplayer/playlist/" + programme.pid);
	};
	}
	});
	}
	</script>

	<small>http://www.flickr.com/photos/joimson/2437158796/</small>
	</body>
	</html>