Sending javascript Functions - Newbie

Thread Starter

james211

Joined May 29, 2012
283
Hello,

So with the help of some kind folks I was able to build the coding behind a project I've been wanting to do for some time. The project is a four channel, expandable, programmable doser for aquariums based on the particle platform (particle.io). I've been able to program manual on/off functions, calibration functions and programming that allows the user to set the total dose, and how often it should dose over a 24hr period.

Now comes the part where I need some more help...I've hit a wall on the second part of the programming, a webpage that uses javascript. I've been able to lay the webpage out, and I was able to get a function working that pulls the current settings, but I can't seem to get any of the functions working for the buttons.

Please let me know if you can help me work through this.

Here is the particle build code, and below that is the HTML code that I started.

C:
typedef struct {
    int onTime;
    int offTime;
    float totalDose;
    float doseRate; // mL/min
    int connectedPin;
    int calibrationEnd = 90000; // a vaule greater than "now" can ever be
} Channel;

void updateChannel(Channel c);
float now;
char getRelay1[75];
char getRelay2[75];
char getRelay3[75];
char getRelay4[75];

Channel channels[4];


void setup() {
    channels[0].connectedPin = D0;
    channels[1].connectedPin = D1;
    channels[2].connectedPin = D2;
    channels[3].connectedPin = D3;
    pinMode(D0,OUTPUT);
    pinMode(D1,OUTPUT);
    pinMode(D2,OUTPUT);
    pinMode(D3,OUTPUT);
    Serial.begin(9600);
    Time.zone(-4);
    delay(3000);
    Particle.function("setupChannel", setupChannel);
    Particle.function("calibrate",calibrate);
    Particle.function("manual",manual);
    Particle.variable("getRelay1", getRelay1);
    Particle.variable("getRelay2", getRelay2);
    Particle.variable("getRelay3", getRelay3);
    Particle.variable("getRelay4", getRelay4);
   }


void loop() {
    now = Time.hour() * 3600 + Time.minute() * 60 + Time.second();
    Serial.println(now);
    for (int i=0;i<4;i++) {
        updateChannel(i);
    }
  
  
    delay(5000);
}



void updateChannel(int index) {
    Channel *c = &channels[index];
    if (c->onTime <= now && c->totalDose > 0) {
        digitalWrite(c->connectedPin, HIGH);
        Serial.printlnf("Fired Relay %d", index);
        c->onTime += 7200;
    }

    if (c->offTime <= now && c->totalDose > 0) {
        digitalWrite(c->connectedPin, LOW);
        Serial.printlnf("Turned off Relay %d", index);
        c->offTime += 7200;
    }
  
        if (c->calibrationEnd <= now) {
        digitalWrite(c->connectedPin, LOW);
        c->calibrationEnd = 90000;
    }
}


int setupChannel(String cmd) { // cmd syntax: "channel#,startTime,doseRate, dose" (startTime is sent as hour*3600 + minute*60 + second)
    Serial.println(cmd);
    char *rmdr;
    char *stringArgs = (char*)cmd.c_str();
    int index = atoi(strtok_r(stringArgs, ",", &rmdr));
    Channel* c = &channels[index];
    c->onTime = atof(strtok_r(NULL, ",", &rmdr));
    c->doseRate = atof(strtok_r(NULL, ",", &rmdr));
    c->totalDose = atof(rmdr);
    float dosePerActuation = c->totalDose/12;
    float durationPerActuation = (dosePerActuation/c->doseRate) * 60; // assuming doseRate is in volume/minute
    c->offTime = c->onTime + durationPerActuation;

    Serial.printlnf("channel#: %d, onTime: %d, doseRate: %f, totalDose: %f", index, c->onTime, c->doseRate, c->totalDose);
char *str;
    switch (index) {
        case 0:
            str = getRelay1;
            break;
        case 1:
            str = getRelay2;
            break;
        case 2:
            str = getRelay3;
            break;
        case 3:
            str = getRelay4;
            break;
    }
    sprintf(str, "onTime: %d, doseRate: %.1f, totalDose: %.1f", c->onTime, c->doseRate, c->totalDose);
    return 1;
}
    int calibrate(String cmd) {
    char *rmdr;
    char *stringArgs = (char*)cmd.c_str();
    int index = atoi(strtok_r(stringArgs, ",", &rmdr));
    Channel* c = &channels[index];
  
    if (strcmp(rmdr, "on") == 0) {
        digitalWrite(c->connectedPin,HIGH);
        c->calibrationEnd =  Time.hour() * 3600 + Time.minute() * 60 + Time.second() + 60;
        return 1;
    }
    else if (strcmp(rmdr, "off") == 0) {
        digitalWrite(c->connectedPin,LOW);
        return 0;
    }
    else {
        return -1;
    }
}
    int manual(String cmd) {
    char *rmdr;
    char *stringArgs = (char*)cmd.c_str();
    int index = atoi(strtok_r(stringArgs, ",", &rmdr));
    Channel* c = &channels[index];
  
    if (strcmp(rmdr, "on") == 0) {
        digitalWrite(c->connectedPin,HIGH);
        return 1;
    }
    else if (strcmp(rmdr, "off") == 0) {
        digitalWrite(c->connectedPin,LOW);
        return 0;
    }
    else {
        return -1;
    }
}

HTML:
    <!DOCTYPE HTML>
    <html>
      <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js" type="text/javascript" charset="utf-8">  </script>
    <body>
    <p> <b>4 Channel Doser</b>
  
      <p>Doses Over 24hr Period:
         <select id="totalDose"></select>
         </p>
  
      <p>Pump 1: Current setting <span id="relay1">unknown</span>
        <button id="getR1" onclick="getRelay(1)">Refresh</button>
        &nbsp;&nbsp;&nbsp;&nbsp;New setting
        <select id="relay1hours">
        </select> :
        <select id="relay1minutes">
        </select>
        </p>
  
      <p>Pump 2: Current setting <span id="relay2">unknown</span>
        <button id="getR2" onclick="getRelay(2)">Refresh</button>
        &nbsp;&nbsp;&nbsp;&nbsp;New setting
        <select id="relay2hours">
        </select> :
        <select id="relay2minutes">
        </select>
        </p>
  
      <p>Pump 3: Current setting <span id="relay3">unknown</span>
        <button id="getR3" onclick="getRelay(3)">Refresh</button>
        &nbsp;&nbsp;&nbsp;&nbsp;New setting
        <select id="relay3hours">
        </select> :
        <select id="relay3minutes">
        </select>
        </p>
  
      <p>Pump 4: Current setting <span id="relay4">unknown</span>
        <button id="getR4" onclick="getRelay(4)">Refresh</button>
        &nbsp;&nbsp;&nbsp;&nbsp;New setting
        <select id="relay4hours">
        </select> :
        <select id="relay4minutes">
        </select>
        </p>
      
        <p> <b>Calibration</b>
        <br><br>
        Each pump will run for 60 seconds.  Enter measured amount, divide by 60 and click set.
        </p>
      
        <p><button id="calibrate1"  onclick="calibration(0,1)">Pump 1</button>
        &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;Dose Rate
        <input type="text" id="doseRate(1)" value="1.26">  mL/min
        <button id="setR1" onclick="setRelay(1)">Set</button>
        </p>
      
        <p><button id="calibrate2"  onclick="calibration(1,1)">Pump 2</button>
        &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;Dose Rate
        <input type="text" id="doseRate(2)" value="1.26">  mL/min
        <button id="setR2" onclick="setRelay(2)">Set</button>
        </p>
      
        <p><button id="calibrate3"  onclick="calibration(2,1)">Pump 3</button>
        &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;Dose Rate
        <input type="text" id="doseRate(3)" value="1.26">  mL/min
        <button id="setR3" onclick="setRelay(3)">Set</button>
        </p>
      
        <p><button id="calibrate4"  onclick="calibration(3,1)">Pump 4</button>
        &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;Dose Rate
        <input type="text" id="doseRate(4)" value="1.26">  mL/min
        <button id="setR4" onclick="setRelay(4)">Set</button>
        </p>
      
        <p> <b>Manual ON/OFF</b>
        </p>
        <p>Pump 1:&nbsp;&nbsp;&nbsp;
        <button id="pump1onbutton"  onclick="manual(0,1)">ON</button>
        <button id="pump1offbutton"  onclick="manual(0,0)">OFF</button>
        </p>
      
        <p>Pump 2:&nbsp;&nbsp;&nbsp;
        <button id="pump2onbutton"  onclick="manual(1,1)">ON</button>
        <button id="pump2offbutton"  onclick="manual(1,0)">OFF</button>
        </p>
      
        <p>Pump 3:&nbsp;&nbsp;&nbsp;
        <button id="pump3onbutton"  onclick="manual(2,1)">ON</button>
        <button id="pump3offbutton"  onclick="manual(2,0)">OFF</button>
        </p>
      
        <p>Pump 4:&nbsp;&nbsp;&nbsp;
        <button id="pump4onbutton"  onclick="manual(3,1)">ON</button>
        <button id="pump4offbutton"  onclick="manual(3,0)">OFF</button>
  
        <script type="text/javascript">
      
        var select = '';
        for (i=1;i<=24;i++){
            select += '<option val=' + i + '>' + i + '</option>';
        }
        $('#totalDose').html(select);
  
        for(i=0;i<24;i++) {
                  for(relay=1;relay<5;relay++) {
                               var rh = document.getElementById("relay"+relay.toString()+"hours");
                               var opt = document.createElement("OPTION");
                               opt.setAttribute("value", i.toString() );
                               var nd  = document.createTextNode(i.toString());
                               opt.appendChild(nd);
                               rh.appendChild(opt);
                               }
                  }
  
        for(i=0;i<60;i++) {
                  for(relay=1;relay<5;relay++) {
                               var rm = document.getElementById("relay"+relay.toString()+"minutes");
                               var opt = document.createElement("OPTION");
                               opt.setAttribute("value", i.toString() );
                               var nd  = document.createTextNode(i.toString());
                               opt.appendChild(nd);
                               rm.appendChild(opt);
                               }
                  }
  
          var deviceID    = "xxxx";
          var accessToken = "xxxx";
          var setFunc = "setRelay";
          var getFunc = "getRelay";
  
          function getRelay(relay) {
             requestURL = "https://api.particle.io/v1/devices/" + deviceID + "/" + getFunc + relay.toString() + "/?access_token=" + accessToken;
                 $.getJSON(requestURL, function(json) {
                     document.getElementById("relay"+relay.toString() ).innerHTML = json.result;
                     });
          }
  
          function setupChannel(relay) {
            var newValue = document.getElementById("relay"+relay+"hours").value   + ":" +
                           document.getElementById("relay"+relay+"minutes").value + ":" +
                                                                             "00" + "*" +
                           document.getElementById("relay"+relay+"duration").value;
        var requestURL = "https://api.particle.io/v1/devices/" +deviceID + "/" + setFunc + relay + "/";
            $.post( requestURL, { params: newValue, access_token: accessToken });
          }
                var setFunc = "manual()";
  
          function manual() {
            if (newValue==1) {
               paramStr = paramStr + ",HIGH";
            } else {
              paramStr = paramStr + ",LOW";
            }
        var requestURL = "https://api.particle.io/v1/devices/" +deviceID + "/" + setFunc + "/";
            $.post( requestURL, { params: paramStr, access_token: accessToken });
          }
  
        </script>
        </p>
    </p>
    </body>
    </html>
Moderators note: used code tags for C in first code block
 
Last edited by a moderator:
Top