the widget
the last relating question. All seems to be working in order. I have a big request again. I'm stuck with trying to use the widget called justgage http://www.justgage.com and adding data to where I have live listener count show on the guage. I'm still using XDK from intel and I can't complain much with what they have. I just want to customize my app some more so that it can look presentable. So, going back to the question. How do you use just gage to show listeners live from the url stream. I'm thinking I'd have to parse data from the icecast server via the status-json.xsl and using the number value to list the number of listeners. Is that the best route? Or what should I do entirely? Should I switch to shoutcast that has better flexibility with html/http? Not quite sure how to word the terminology but you've never failed me so far so I'm trusting on your skills.
Note that the project has a new folder (js) to hold the JavaScript. You don't have to look at those files. It's just the gauge widget that you wanted to use.
This should have been much easier than it was. I've actually been working on it this entire time. Basically, the version of Icecast server that you are using a is little old and has a known bug. It took me a while to find that out. The JSON that it is returning is NOT valid JSON. Not even slightly. It's all messed up at the end. I eventually found out that there was a bug in prior versions of Icecast that caused this to happen.
So, since I can't upgrade your Icecast server software, I had to write code to both A.) Work when/if it ever gets fixed on your server, and B.) Work with the bad JSON.
The issue with bad JSON is that it simply will not parse at all. So it has to be fixed first and then parsed.
For the code, look at lines 59 and 60. That is where I add the JavaScript for the gauge.
Now look at lines 81 - 99. Notice that this is inside of the document ready block, but not in the click function.
In the success function in this block, you see that I send it to the processStuff function that I wrote. In the error function, I get the responseText (which is the bad JSON), correct it, and then parse it and send it to the processStuff function.
The processStuff function is on lines 105 - 115. It simply creates the gauge, using the number of listeners for the value. It uses the gauge div at line 127 to display the gauge.
So that should be everything that you need to get this working in any application. It really shouldn't have taken this much effort. But with that bug, it really challenging.
11 years ago
Purchase the answer to view it
- examplewithgage.zip