Puck.Js and integration with IoT and IFTTT

Posted on
  • Hello,

    I am a new fish on the pond and my question might be a stupid one but I thought to ask anyway:
    I am trying to learn how to use Puck in a simple way to trigger IoT events with IFTTT. I found the section talking about that but I did not get it quite. I do know that Puck itself does not have a means to form an internet connection itself, but is this preventing me triggering IFTTT events with maker channel or something like that? Surely it must be enough that Puck is connected with Web bluetooth and sending the appropriate message to server? Must be really easy, but somehow for a beginner like me a bit frustrating to find the way.

    Would appreciate some advice!

    Thanks! - Saarni

  • IFTTT maker channel needs HTTP requests, so you'll need a proxy of some description between your Puck and the IFTTT service. There's an Espruino hub that's designed to run on Raspberry Pi 3. It offers a HTTP Proxy option. You could use Web Bluetooth but you'd need to script it. I started down this road with this project, but haven't so far go to the proxy piece, and maybe won't.

    It's also worth evaluating if you need a Puck for your use case. If you want to communicate over the Internet maybe Espruino Wifi or Espruino on ESP8266 would be a more natural fit.

  • Here's a bit of code that'll do it - if you stick this on an HTTPS webpage then once connected, when you press the button it'll call IFTTT.

    It even automatically loads the code onto the Puck for you:

    <html>
     <head>
       <title>IFTTT Web Bluetooth Example</title>
     </head>
     <body>
      <pre id="log"></pre>
      <button>Click here to start</button><br/>
      <iframe id="ifttt" style="width:640px;height:32px"></iframe­>
      <script src="https://www.puck-js.com/puck.js"></­script>
      <script type="text/javascript">
        var button = document.getElementsByTagName('button')[­0];
        var logelement = document.getElementById('log');
        var iftttRequests = 0;
        function log(txt) {
          logelement.innerHTML += txt+"\n";
        }
    
        function ifttt() {
          document.getElementById('ifttt').src = "https://maker.ifttt.com/trigger/puck_ev­ent/with/key/km.....Qv?"+iftttRequests;
          // ^^^^^^ Change the URL above
          iftttRequests++;
        }
    
        // Called when we get a line of data
        function onLine(v) {
          log("Received: "+JSON.stringify(v));
          if (v.indexOf("Pressed")>=0) {
            log("Calling IFTTT");
            ifttt();
          }
        }
    
        // When clicked, connect or disconnect
        var connection;
        button.addEventListener("click", function() {
          if (connection) {
            log("Closing connection");
            connection.close();
            connection = undefined;
          }
          log("Opening connection");
          Puck.connect(function(c) {
            if (!c) {
              log("Couldn't connect!");
              return;
            }
            log("Connecting...");
            connection = c;
            // Handle the data we get back, and call 'onLine'
            // whenever we get a line
            var buf = "";
            connection.on("data", function(d) {
              buf += d;
              var i = buf.indexOf("\n");
              while (i>=0) {
                onLine(buf.substr(0,i));
                buf = buf.substr(i+1);
                i = buf.indexOf("\n");
              }
            });
            // First, reset Puck.js
            connection.write("\x10reset();\n", function() {
              // Wait for it to reset itself
              setTimeout(function() {
                // Now tell it to write data on the current light level to Bluetooth 10 times a second
                connection.write("\x10setWatch(function(­){Bluetooth.println('Pressed');},BTN,{re­peat:true,debounce:50,edge:'rising'});\n­",
                  function() { log("Ready!"); });
              }, 1500);
            });
          });
        });
      </script>
     </body>
    </html>
    

    As @Ollie says, if you really want an internet connection it might be better to do something directly, but the above works well for tests.

  • Thanks for your help both of you! I see I need to study a bit more before I can understand the code you sent. But I have the interest to do so! I am really exited about the possibilities of the Puck.js!

  • Just to add I turned this into a tutorial: http://www.espruino.com/Puck.js+IFTTT

  • Gordon, Hi! Thanks so much for your tutorial. I am a complete newbie and I’m struggling to understand why I can’t see this properly:

    https://github.com/jennygrist/pucktest/b­lob/master/test.html

    I know I am supposed to be seeing a ‘press to start’ button, but all I am seeing is the code.

    Am I looking for the file in the wrong place? Have I pasted the code in the wrong way? I’d appreciate any help anyone might offer; I am very new to this.

    :)

  • Sun 2019.04.07

    Hello @Jennygrist, welcome to the world of Espruino. Although I've not done that tutorial, the idea is to create a web page using that code, and deploy to a remote server or your own public GitHub account. I believe the restriction is that Puck.js requires an https:// secure access.


    From inside the link in #5 above:

    'For an example of how to do this, see the Web Bluetooth tutorial'

    What was the result of following the step-by-step outline in:

    https://www.espruino.com/Web%20Bluetooth­



    The last instruction at:

    https://pages.github.com/

    Fire up a browser and go to https://username.github.io

    If I type in: https://jennygrist.github.io/
    The page indicates that the GitHub Pages account is not yet set up.

    It appears your repository does contain the (your link in #6) source code, and that looks fine, just that the deployed to Pages part isn't complete yet. In can take fifteen minutes or so. That Pages account part serves your repository Html page content in order for you to see the rendered button output in the browser.



    In the meantime, were you able to use the 'Try Me' button in the first code block at:

    https://www.espruino.com/Web%20Bluetooth­

    and connect to your Puck that way?

  • Hurrah, thanks so much for your help @Robin, although I had followed the early instructions, I hadn’t a clue why the page wasn’t ‘appearing’ properly. Your reply helped me to understand that I had to look elsewhere to find the Github Page and also wait a while. I’d been trying a similar task yesterday and looking in the right place, but way too soon. Thanks from a newbie!

  • Post a reply
    • Bold
    • Italics
    • Link
    • Image
    • List
    • Quote
    • code
    • Preview
About

Puck.Js and integration with IoT and IFTTT

Posted by Avatar for user73357 @user73357

Actions