学習リモコンを作る

このエントリーをはてなブックマークに追加

What's this

リモコンの出すIR信号を受信し、arrayとして表示します。更に受信した時に出てくる"送信"ボタンをおすことでその信号を送信することも出来る学習リモコンプログラムです。

写真のようにIRレシーバーと赤外線LEDを接続して使って下さい。

Program

<!-- HTML Example -->
<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/css/bootstrap.min.css"  integrity="sha384-Gn5384xqQ1aoWXA+058RXPxPg6fy4IWvTNh0E263XmFcJlSAwiGgFAW/dAiS6JXm" crossorigin="anonymous">
  <script src="https://code.jquery.com/jquery-3.2.1.min.js" integrity="sha256-hwg4gsxgFZhOsEEamdOYGBf13FyQuiTwlAQgxVSNgt4=" crossorigin="anonymous"></script>
  <script src="https://unpkg.com/obniz@1.9.1/obniz.js"></script>
</head>

<body>
<div id="obniz-debug"></div>
<br>
<div class="container text-center">
  <h1> IR Playground </h1>
  <p>
    This monitor IR signal. If detected, data and Transmit button appear.
    <ul>
      <div> io0: vcc of IRSensor</div>
      <div> io1: gnd of IRSensor</div>
      <div> io2: output of IRSensor</div>
      <div> <br></div>
      <div> io10: InfraredLED anode</div>
      <div> io11: InfraredLED cathode</div>
    </ul>
  </p>
  <div id="recorded">
  </div>
</div>

<script>

/* This will be over written on obniz.io webapp page */
var obniz = new Obniz("OBNIZ_ID_HERE");

obniz.onconnect = async function () {
    
  var led = obniz.wired('InfraredLED', {anode: 10, cathode: 11});
  var sensor = obniz.wired('IRSensor', {vcc:0, gnd:1, output: 2});
  var index = 0;
  
  sensor.duration = 400;
  sensor.start((arr)=>{
    const data = JSON.stringify(arr);
    console.log(data);
    let str = "<div class ='row'><div class='col-sm-9'><textarea class='form-control' style='font-size:11px;height:80px;' id='recvd"+index+"'>";
    str += data; 
    str += "</textarea></div><div class='col-md-3'><button class='btn btn-block btn-primary send' data-target='"+index+"'>Transmit</button></div></div>"
    $("#recorded").html($("#recorded").html() + str);
    index++;
    $(".send").click(function(){
      var jsonString = $("#recvd" + $(this).attr('data-target')).text();
      led.send(JSON.parse(jsonString));
    })
  })
}
</script>
</body>
</html>

今すぐ実行

HTMLがブラウザで開かれて実行されます。