Blank page in HTML browser controller


#1

Working through Simon Monk’s Getting Started with the Photon, has gone fairly smoothly until Project 9: Measuring Light over the internet. I can Tickle from my cell and read the analog variable; and also get results from https://api.spark.io/v1/devices//analog?access_token= (page 111). But when I load in file p_09_light_meter.html with personalized token and device ID, the web screen comes up blank. I have the same problem with project 10 so feel I must be doing something wrong. The HTML programs use two libraries not used before and I have not done anything about them assuming the java code does the trick. I’m using MS explorer but Chrome & Firefox also come up white. Here is the code:

<html>
<head>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js" type="text/javascript" charset="utf-8"></script>
<script src="raphael.2.1.0.min.js"></script>
<script src="justgage.1.0.1.min.js"></script>

<script>
var accessToken = "9f4....d49";
var deviceID = "34....032"
var url = "https://api.spark.io/v1/devices/" + deviceID + "/volts";

function callback(data, status){
	if (status == "success") {
		volts = parseFloat(data.result);
		volts = volts.toFixed(2);
		g.refresh(volts);
		setTimeout(getReading, 1000);
	}
	else {
		alert("There was a problem");
	}
}

function getReading(){
   	$.get(url, {access_token: accessToken}, callback);
}
</script>
</head>	

<body>
<div id="gauge" class="200x160px"></div>

<script>
var g = new JustGage({
    id: "gauge",
    value: 0,
    min: 0,
    max: 3.3,
    title: "Volts"
});
getReading();
</script>

</body>
</html>

#2

Looks like the code was chopped off because of length. Its I the book anyway - page 115


#3

I’d think not everybody has the book, so pasting the code might help :wink:
Also stating what libraries you suspect to give you headache might help.


#4

Ok here is the code; Two new libraries are mentioned: Raphael and justgage.

<html>
<head>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js" type="text/javascript" charset="utf-8"></script>
<script src="raphael.2.1.0.min.js"></script>
<script src="justgage.1.0.1.min.js"></script>

<script>
var accessToken = "<---- redacted ---->";
var deviceID = "<---- redacted ---->"
var url = "https://api.spark.io/v1/devices/" + deviceID + "/volts";

function callback(data, status){
	if (status == "success") {
		volts = parseFloat(data.result);
		volts = volts.toFixed(2);
		g.refresh(volts);
		setTimeout(getReading, 1000);
	}
	else {
		alert("There was a problem");
	}
}

function getReading(){
   	$.get(url, {access_token: accessToken}, callback);
}
</script>
</head>	

<body>
<div id="gauge" class="200x160px"></div>

<script>
var g = new JustGage({
    id: "gauge",
    value: 0,
    min: 0,
    max: 3.3,
    title: "Volts"
});
getReading();
</script>

</body>
</html>

#7

If you’re posting code, especially HTML, you should use code formatting. It’s there for a reason, both making it legible, and not disappear.

Have you seen this topic? I’m not sure what this means

The only visible thing on that page is using those libraries, so you do need to add them.


#8

I guess @Moors7 meant to add a link here


#9

Gentlemen
I’m glad you spotted my post. If you know what’s going on I certainly would appreciate your help. vis. How do you add the libraries if that’s what is necessary.?
vis Is there a document that shares how to use formatting so that the code doesn’t disappear. Is there a document to teach how to make appropriate additions to these posts. I want to do it right but need instructions.


#10

The forum tips and tricks give you some hints about the formatting

And about the libraries, I’d guess you got a CD or at least a link with the book that should provide you with the needed libraries.
Copy or download them and put them alongside your HTML file in a dedicated directory and then open the HTML file.

We’ve now seen several people with the same or similar question. Are there no instructions in the introducing section of the book of how to use the samples?


#11

Thank you ScruffR
Just a quick update. When I opened the HTML file in the same directory, as the libraries Raphael and Justgage, everything worked as Moors suggested.
When I get the time in the next couple of days I will post a series of steps to get a novice through to this point. It’s a shame Simon Monk did not have a novice work through his “Getting started” book before if was published so the stumbling blocks could have been straightened out in a re-edit. He assumed too much from the novice starting out.