I’ve been using Windows Vista for 1 year now and I never used the sidebar before. I turned it off in the first week and never turned it back on again. Last week I decided to give it a try again and after filling it with some handy gadgets I thought it was time to build my own.
I didn’t know how to build a gadget so I looked it up on MSDN. There are some samples there but basically sidebar gadgets are small “web parts” totally build in HTML and JavaScript.
My first gadget I’m going to build is a Last.FM music player that can play a music stream from the Last.fm site with peoples favorite artists or with music matching a tag. Like you can do on the Last.fm site yourself.I went searching how I could get this stream to run in my gadget and I found out that Last.fm is using a fairly simple http based protocol which is described at http://www.audioscrobbler.net/development/protocol/I first started out with the 1.1 protocol because I didn’t read that there already was a 1.2 version. The 1.2 protocol has 3 states (handshake, now playing and submission) at the moment I’m writing this the only thing I have made is the handshake part and other functions to get metadata from the track.
I didnt make a nice user interface for my gadget yet and i didnt make anything to save your settings in. This will all be done in the upcoming days. If someone is really good in making a nice little interface (max 60 pixels wide) and feel like helping me out at this give me a call!. I'm not that good at grapic design.
btw. Coding Javascript in Visual Studio 2008 is really really nice. The intellisense really works great and it helps you write code a lot quicker.
I didnt put the sourcecode online yet since it's all in the debugging phase right now and everything is still hard coded (user,password, radio channel etc). When everything is done i'll post the full sourcecode here.
The functions that I’ve build now are shown in the following picture
The javascript code for these functions is shown below. (I will put it all on my site as a gadget when the whole thing is done).
This is all i could do in my spare time the last 2 days. I hope to get a lot further tomorrow and i'll post the results again.
function Play()
{
duration = 0;
document.WindowsMediaPlayer.Stop();
GetMetaData();
currentlyPlaying = true;
setTimeout("UpdateTimer()", 1000);
}
function stop()
{
currentlyPlaying = false;
document.WindowsMediaPlayer.Stop();
}
function UpdateTimer()
{
if (currentlyPlaying)
{
if((document.WindowsMediaPlayer.CurrentPosition < duration) || (duration == 0))
{
document.getElementById("counter").innerHTML = ConvertSecondsToTime(document.WindowsMediaPlayer.CurrentPosition);setTimeout("UpdateTimer()", 950);
}
else
{
//alert("restart");
document.WindowsMediaPlayer.Stop();
SendHandshake();
}
}
else
{
stop();
}
}
function ConvertSecondsToTime(seconds)
{
var date = new Date(seconds * 1000);
var timeString = date.getMinutes() + ":" + date.getSeconds();
return timeString;
}
function makeRequest(url) { http_request = false;
if (window.XMLHttpRequest) { // Mozilla, Safari,...
http_request = new XMLHttpRequest();
if (http_request.overrideMimeType) {http_request.overrideMimeType(
'text/xml');
}
} else if (window.ActiveXObject) { // IE
try {
http_request = new ActiveXObject("Msxml2.XMLHTTP");}
catch (e) {
try {http_request =
new ActiveXObject("Microsoft.XMLHTTP");} catch (e) {alert("error");}
}
}
if (!http_request) {
alert('Giving up :( Cannot create an XMLHTTP instance');
return false;
}
http_request.onreadystatechange = alertContents;
http_request.open('GET', url, true); http_request.send(null);
}
function alertContents()
{
if (http_request.readyState == 4)
{
if (http_request.status == 200)
{
document.getElementById("debug").innerHTML = http_request.responseText;
switch(functionCall)
{
case "SendHandshake" :
GetHandshakeResponse(http_request.responseText);
break;case "TuneIn" :
GetTuneInResponse(http_request.responseText);
break;
case "GetMetaData" :
GetMetaDataResponse(http_request.responseText);
break;default:
alert(functionCall);
}
}
else
{
alert('There was a problem with the request.' + http_request.status);
}
}
}
function SendHandshake()
{
var now = new Date();
now.setHours(now.getUTCHours(),now.getUTCMinutes(),now.getUTCSeconds(),now.getUTCMilliseconds());
var time = parseInt(now.getTime()/1000.0)
functionCall = "SendHandshake";
url = "http://post.audioscrobbler.com/?hs=true&p=1.2&c=tst&v=1.3.1.1&u="
url += "geertvdcruijsen";url += "&t=";
url += time;
url += "&a=";
var md5String = MD5("password");
md5String += (time);
url += MD5(md5String);
makeRequest(url);
}
function GetHandshakeResponse(response)
{
arr_response = response.split("\n");
//stream_url = arr_response[1].split("stream_url=")[1];
session = arr_response[0].split("session=")[1];document.getElementById("session").innerHTML =response;
TuneIn();
}
function TuneIn()
{
functionCall = "TuneIn";url = "http://ws.audioscrobbler.com/radio/adjust.php?session=";
url += session;
url += "&url="
url += "lastfm://artist/Chemical+Brothers/similarartists";url += "&debug=0";
makeRequest(url);
}
function GetTuneInResponse(response)
{
Play();
}
function GetMetaData()
{
var now = new Date();
functionCall = "GetMetaData";url =
"http://ws.audioscrobbler.com/radio/xspf.php?sk=";
url += session;
url += "&discovery=0&desktop=1.3.1.1&time="
url += now.getTime();
makeRequest(url);
}
function GetMetaDataResponse(response)
{
arr_location = response.split("<location>");stream_url = arr_location[1].split("</location>")[0];
arr_duration = response.split("<duration>");duration = arr_duration[1].split(
"</duration>")[0];
duration = (parseInt(duration,0)/1000) -3;
document.getElementById("metadata").innerHTML = ConvertSecondsToTime(duration);
document.WindowsMediaPlayer.fileName = stream_url;
document.WindowsMediaPlayer.Play();
}
<object id="wmp" standby="standby" type="application/x-oleobject"> <embed type="application/x-mplayer2" id="WindowsMediaPlayer" name="WindowsMediaPlayer" showstatusbar="-1"></embed>
</object>
Comments (0)