Project 3 unbale to understand the code

1

hi can any one in the platform help me understand the code used to control LED

function digitalWrite(pin,val){
    var xmlhttp = new XMLHttpRequest();
    xmlhttp.onreadystatechange = function() {
        if (xmlhttp.readyState == 4 && xmlhttp.status == 200 && debug == 1) {
            //document.getElementById("javascript_response").innerHTML = "Javascript Response : "+xmlhttp.responseText;
            alert(xmlhttp.responseText);
            var obj = JSON.parse(xmlhttp.responseText);
            if(obj.success=="1"){
                    alert(obj.value);
            }
        }
    };  
    xmlhttp.open("GET", base_url+api_key+"/digitalWrite?pin="+pin+"&state="+val+"&deviceName="+d_name,true);
    xmlhttp.send();

I understand above is the function we are calling in our project. I don’t understand why the reaydState and status is checked before the url is opened, I mean this “if” statement “if (xmlhttp.readyState == 4 && xmlhttp.status == 200 && debug == 1”. Shouldn’t this come after the “open” and “send” statement i,e “xmlhttp.open(“GET”, base_url+api_key+”/digitalWrite?pin="+pin+"&state="+val+"&deviceName="+d_name,true);
xmlhttp.send(); ".

Also i didn’t understand what the following statement are doing!!

document.getElementById("javascript_response").innerHTML = "Javascript Response : "+xmlhttp.responseText;
            alert(xmlhttp.responseText);
            var obj = JSON.parse(xmlhttp.responseText);
            if(obj.success=="1"){
                    alert(obj.value);
2

Hi @sagar.myadav94,
1.
The location of xmlhttp.onreadystatechange function does not matter. You can put it before sending the xmlhttp.open or after xmlhttp.open.

Because it is attached to readystatechange event. So whenever the status of the request changes, xmlhttp.onreadystatechange will get called and code inside the xmlhttp.onreadystatechange will get executed.

You can add some console logs to check the behavior.

  1. The next thing is our response from the Bolt Cloud is in xmlhttp.responseText variable.

For example: The response from the Bolt Cloud is {“success”: “1”, “value”: “123”} then the value of responseText will be {“success”: “1”, “value”: “123”} but here it is in string format.

So in the below line, we are just converting the string response into JSON response.

var obj = JSON.parse(xmlhttp.responseText);

After converting the response in JSON, you can fetch the value using the key.

For example:

obj.success
"1"
obj.value
"123"

Do let me know in case you need further assistance.

3

@rahul.singh1 thanks for your explanation, but i still am confused what exactly below statement is doing
//document.getElementById(“javascript_response”).innerHTML = "Javascript Response : "+xmlhttp.responseText;. Is this line commented? if not where is element by id “javascript_response” whose innerHTML is getting updated by resposneText.

in the “if” statement what is the debug variable used for?
if (xmlhttp.readyState == 4 && xmlhttp.status == 200 && debug == 1)

how is the pins of the micro-controller getting configured for this project, because we have skipped that part in our project

thanks for your response