19
5

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

More than 5 years have passed since last update.

obnizAdvent Calendar 2019

Day 3

Noodlからobniz + Geek Servoを動かしてみた

Last updated at Posted at 2019-12-02

「ゆるメカトロ」という最高コミュニティがありまして...

ギアに萌える人におすすめの、ゆるメカトロというFacebookコミュニティがありまして、
みんなGeek ServoというLEGOにくっつけることができるかわいいモーターで遊んでいるので羨ましくて購入してしまいました。

というわけで今回は…

NoodlからGeek Servoを動かす!

参考にした記事

obniz+Geek Servo モーター+LEGO テクニック歯車で正・逆回転とパワー制御したメモ

obniz + enebular 部分ハンズオン 2019-10-29版

ほぼコピペです。ありがとうございます。

obnizの準備

1.MQTTブローカーの準備

ブローカーはshiftrを使用しています。
shiftr.io

MQTT初めての方はコチラ!
プロトタイピングツール Noodl と Node-RED をMQTTでつないでみるメモ

##2.obnizのプログラムをコピペ

下記をコピペして、ユーザー名とパスワードを先程取得したMQTTブローカーのものに書き換えます。

<html>
<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css">
  <link rel="stylesheet" href="/css/starter-sample.css">
  <script src="https://obniz.io/js/jquery-3.2.1.min.js"></script>
  <script src="https://unpkg.com/obniz@2.5.0/obniz.js" crossorigin="anonymous"></script>
  <script src="https://unpkg.com/mqtt@2.15.1/dist/mqtt.min.js"></script>
</head>
<body>
 
 
 
<div class="wrap">
 
  <div class="DCMotor">
    <h3 class="text-center">Controling on a DCMotor</h3>
  </div>
   
  <div class="DCMotor">
    <button class="btn btn-primary btn-block" id="forward">Forward</button>
    <button class="btn btn-primary btn-block" id="reverse">Reverse</button>
    <button class="btn btn-success btn-block " id="powerup">Power 100</button>
    <button class="btn btn-success btn-block" id="powerdown">Power 30</button>
    <button class="btn btn-secondary btn-block" id="stop">Stop</button>
  </div>
 
</div>
 
<script>
  var obniz = new Obniz("YOUR_OBNIZ_ID");
  obniz.onconnect = async function () {
    var motor = obniz.wired("DCMotor", {forward:0, back:1});
    ////////  
        const mqttBroker = "mqtt://broker.shiftr.io";
        const mqttUsername = "ユーザー名";
        const mqttPassword = "パスワード";
        const pubTopic = "/servo/obniz";
        const subTopic = "/servo/noodl";

        obniz.display.clear();
        obniz.display.print('Here!!!');
     ////////   
      
    // ClientID
      const clientId = "servo-" + new Date().getTime();

      // shftr.io
      var obnizDeviceMQTT = mqtt.connect(mqttBroker, {
        "username": mqttUsername,
        "password": mqttPassword
      });
      
      // 接続
        console.log("obnizDeviceMQTT : connect start");
        console.log("clientId " , clientId );

        obnizDeviceMQTT.on("connect", function () {
          console.log("obnizDeviceMQTT : connect success");
          obnizDeviceMQTT.subscribe(subTopic, function (e) {
            if (e) {
              console.log("obnizDeviceMQTT: Subscrib error", e);
            }
            else {
              console.log("bonizDeviceMQTT: Subscribed!! ");
              //
              var sendData = {
                "message": "Hello"
              };
              // 一度メッセージを送る
              obnizDeviceMQTT.publish(pubTopic, JSON.stringify(sendData));
            }
          });
        });

        obnizDeviceMQTT.on("error", (topic, payload) => {
          console.log(payload.toString());
        });
    
        obnizDeviceMQTT.on("message", async function (topic, payload) {
          // メッセージ受信できたよログ
          console.log("メッセージ受信できたよログ");
          //
          let payloadJSON = JSON.parse(payload);
          var message = payloadJSON["message"];

          // message
          if(payloadJSON.hasOwnProperty("message")){
            console.log("message" , payloadJSON["message"]);
            obniz.display.clear();
            message = payloadJSON["message"];
            obniz.display.print(message);
          }
          
          switch (message) {
          case 'forward':
            console.log(message);
            motor.forward();
            obniz.display.clear();
            obniz.display.print("forward");
            break;
          case 'reverse':
            console.log(message);
            motor.reverse();
            obniz.display.clear();
            obniz.display.print("reverse");
            break;
          case 'stop':
            console.log(message);
            motor.stop();
            obniz.display.clear();
            obniz.display.print("stop");
            break;
          default:
            console.log('default');
        }
          
        });

  };
</script>
</body>
</html>

これでobnizは準備完了!

Noodlの準備

NoodlプロジェクトをCloneして読み込む

こちらからプロジェクトをcloneしてください。

MQTTの設定

プロジェクト設定(歯車アイコン)からBroker URLを変更します。
shiftr.ioの、「mqtt://XXX:XXXXXX@broker.shiftr.io」というやつをコピペしてください。
スクリーンショット 2019-12-02 18.09.29.png

完成!

IMG_1759.jpg

ギアがないので3Dペンで適当にパーツをつくって無理やり貼り付けました。
次はギアを買うぞー!

回っているウサギは、「スキウサギ」というキャラクターです。
スキウサギについて詳細はコチラ

19
5
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
19
5

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?