Use a webpage with photon (cloud) and go to another webpage at the same time?

Cloud
1

@roinujo1 i reposted your question here with the sensitive credentials removed.

I am trying to use a photon that listens to a cloud variable “setGame” and does what it needs to accordingly. However, at the same time I would like to go to another page as well. The problem is that when I try to press the button, it doesn’t even go to the other page (the webpage is just a test page i am trying). It seems to be the json function that is causing it as it works when I comment it out. Is there a specific reason as to why its not working and if so is their a solution? I’m pretty sure I am using the .postjson incorrectly, but my logic is that it should work regardless if the data was sent correctly. Sorry if this is in the wrong place, but i’m desperate.

<!DOCTYPE html>
<html>

<body>

<input id="Memory Button" type="button" value="Memory Game" onclick="myFunction1()"/>

<script language="javascript" type="text/javascript">



function myFunction1(objButton)
{  
  var deviceID = "";
  var accessToken = "";
  var baseURL = "https://api.particle.io/v1/devices/";

  var varName="setGame";

  requestURL = baseURL + deviceID + "/" + varName + "/?access_token=" +      accessToken;
  $.postJSON(requestURL, function(json) {
    document.getElementById("varName").innerHTML = json.result;
    myFunction2();
}
}
function myFunction2()
{
    window.location.href = 'http://twin-cities.umn.edu/';
}

</script>


</body>

</html>
2

Hi @roinujo1

Do you have a Particle.variable() or a Particle.function() in your firmware? You are doing a POST which is for functions. If you have a variable, you should do a GET request.

3

Thanks for replying!

There is a particle function in the photon code.

However, my problem is that currently, I dont understand that when I use the button, why doesn’t go to the webpage regardless of the photon?

4

Hi @roinujo1

I can't see where in your Javascript that you pass the String parameter to your Particle.function(). I think the Cloud is rejecting your function POST since you are not passing the correct arguments.

Have you seen my tutorial yet?

5

I have tried looking at your code multiple times but I cant follow nor understand it.

I just dont understnad how to send data and go to another webpage. I have a

 Particle.function(setGame)

In my photon code. I dont understand how to program it using javascript without getting completely lost. Im sorry, thanks for the help. I will see what I can do.

6

So, I tried thinking about it and I wanted to know if, for this code:

<!DOCTYPE html>
<html>

<body>

<input id="Memory" type="button" value="Memory Game" onclick="myFunction1()"/>

<script language="javascript" type="text/javascript">

  var deviceID = "<deviceID>";
 var accessToken = "<accessToken>";
  var baseURL = "https://api.particle.io/v1/devices/";
  var whichGame="setGame";

function myFunction1()
{  
	requestURL = "https://api.spark.io/v1/devices/" + deviceID + "/" +     		whichGame + "/?access_token=" + accessToken;
     $.getJSON(requestURL, function(json) {
    document.getElementById("Memory").innerHTML = json.result;
    });
    
	
  	myFunction2();

}

function myFunction2()
{
    window.location.href = 'http://twin-cities.umn.edu/';
}

</script>


</body>

</html>

Does the line for

$.getJSON(requestURL, function(json) {
    document.getElementById("Memory").innerHTML = json.result;

set whichGame to the string Memory and in turn make setGame=“Memory”?

7

Hey bko, I looked at your code and I am having trouble figuring out how to call a cloud function in java script:
Here is what I have so far:

<!DOCTYPE html>
<html>
<head>
<script>"http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js" type="text/javascript" charset="utf-8"></script>
</head>
<body>


<input id="Memory Button" type="button" value="Memory" onclick="setValue()"/>

<script language="javascript" type="text/javascript">

  	var deviceID = "<deviceID>";
 	var accessToken = "<access Token>";
 	var baseURL = "https://api.spark.io/v1/devices/";
  	
function setValue(objButton) 
{
        var newValue = document.getElementById('Memory Button').value;
        myFunction1(newValue);
}

function myFunction1(newValue)
{  
    var requestURL = baseURL + deviceID + "/" +   setGame + "/";

    $.post( requestURL, { params: newValue, access_token: accessToken });
      
}
function myFunction2()
{
    window.location.href = 'http://twin-cities.umn.edu/';
}

</script>


</body>

</html>

Shouldn’t the value of the button clicked be read to newValue and sent to setGame? Here is my simple photon code as well:

void setup() {
pinMode(0,OUTPUT); // corresponds with c on 7 segment
Particle.function("setGame", setGamewithString);
}

void loop() {

}

int setGamewithString(String inputString)
{
    if(inputString=="Memory")
    {
        digitalWrite(0,HIGH);
        return 1;
    }
}
8

Hi @roinujo1

I am not sure why that is not working for you. I would fire up the debugging console in the browser and see if there is an error being thrown in your Javascript code. I seem to recall that you might need to remove the trailing “/” on the requestURL now.

If your Javascript seems to be working, then you could try adding some Serial printf’s to the firmware to see if that part is working (I don’t see anything obvious there now).

9

Thnaks for the help, bko. It worked when I used google chromes developer tools to look for where the error was and fix accordingly. Thanks again!

1 Like