obniz developer team
Published

Building a slack integrated doorbell with a M5StickC

Make a doorbell for the front door with M5StickC and notify Slack when the button is pressed.

IntermediateFull instructions provided2 hours2,078
Building a slack integrated doorbell with a M5StickC

Things used in this project

Story

Read more

Code

Code snippet #1

Plain text
var url = 'WEBHOOK_URL_HERE';
var data = {
  "channel": 'CHANNEL_NAME_HERE',
  "username": 'obniz-bot',
  "text": msg
};

Untitled file

HTML
<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1" />
    <script src="https://code.jquery.com/jquery-1.10.2.min.js"></script>
    <script src="https://unpkg.com/obniz@3.x/obniz.js"></script>
  </head>
  <body>
    <div id="obniz-debug"></div>
    <script>
      var stick = new Obniz.M5StickC("OBNIZ_ID_HERE");
      stick.onconnect = async function() {
        printPleasePressView();
      
        stick.buttonA.onchange = async pressed => {
          if (pressed) {
            onPressed();
          }
        };
      };
      async function onPressed() {
        sendToSlack("お客さんが来たよ");
        for (let i = 0; i < 10; i++) {
          printWaitingView(i / 10);
          await stick.wait(1);
        }
        setTimeout(printPleasePressView, 3000);
      }
      function printWaitingView(percent) {
        let offset = 100 - percent * 100;
        offset = offset < 0 ? 0 : offset;
        stick.display.drawing(false);
        stick.display.clear(50, 5);
        stick.display.font(null, 50);
        stick.display.pos(20, 5);
        stick.display.print("🚪");
        stick.display.pos(50 + offset, 5);
        stick.display.print("🏃");
        stick.display.font(null, 20);
        stick.display.pos(100 + offset, 35);
        stick.display.print("💨");
        stick.display.font(null, 10);
        stick.display.pos(30, 60);
        stick.display.print("OK, PLEASE WAIT");
        stick.display.drawing(true);
      }
      function printPleasePressView() {
        stick.display.drawing(false);
        stick.display.clear(50, 5);
        stick.display.pos(50, 5);
        stick.display.font(null, 50);
        stick.display.print("🔔");
        stick.display.font(null, 10);
        stick.display.pos(40, 60);
        stick.display.print("PUSH TO CALL→");
        stick.display.drawing(true);
      }
      function sendToSlack(msg) {
        var url = "WEBHOOK_URL_HERE";
        var data = {
          channel: "CHANNEL_NAME_HERE",
          username: "obniz-bot",
          text: msg
        };
        var dataJson = JSON.stringify(data);
        $.ajax({
          type: "POST",
          dataType: "json",
          url: url,
          processData: false,
          data: "payload=" + dataJson
        }).then(
          function(data) {},
          function(XMLHttpRequest, textStatus, errorThrown) {
            console.log("post to bot");
          }
        );
      }

    </script>
  </body>
</html>

Credits

obniz developer team

obniz developer team

80 projects • 32 followers
Development board "obniz" is controlled via the internet.

Comments