iframe-proxy | Sunbelt Computer Software

99 lines (86 loc) · 2.33 KB

<!DOCTYPE html>
<html lang="en">
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">
  <title>sound</title>
  <script src="../../webcomponentsjs/webcomponents.js"></script>
  <link rel='import' href='../web-arduino.html'></link>
  <link rel='import' href='../wa-sound.html'></link>
  <link rel='import' href='../wa-led.html'></link>
    font-size: 20px;
  #msg.default::after {
    content: "訊息";
  #msg.waiting::after {
    content: "Loading...";
  #msg.ready::after {
    content: "Ready!";
  #msg.setting::after {
    content: "設定中...";
  #msg.set::after {
    content: "設定完成";
  <web-arduino id='board'>
    <wa-sound id='sound' pin='10'></wa-sound>
    <wa-led id='led' pin='6'></wa-led>
  </web-arduino>
  <div id="msg" class="waiting"></div>
    <label>device : </label>
    <input type="text" id="device">
    <button class="setting" id="set">設定</button>
  <p>Led pin : 6</p>
  <p>sound pin : 10</p>
  <p>利用聲音感應，讓 Led 亮起來。</p>
  <p id='ledstatus'>none</p>
  window.addEventListener('WebComponentsReady', function() {
    var board = document.getElementById('board'),
      msg = document.getElementById('msg'),
      device = document.getElementById('device'),
      sound = document.getElementById('sound'),
      led = document.getElementById('led'),
      setBtn = document.getElementById('set'),
      ledstatus = document.getElementById('ledstatus');
    device.setAttribute('value', localStorage.device || "");
    msg.className = "ready";
    setBtn.addEventListener('click', function(e) {
      msg.className = "setting";
      board.device = device.value;
      localStorage.device = device.value;
      board.on('ready', ready);
      board.init();
      e.stopPropagation();
      e.preventDefault();
      return false;
    }, false);
    function ready() {
      // 示意 board ready
      msg.className = "set";
      run();
    function run() {
      sound.on('detected', function() {
        led.on();
        ledstatus.innerHTML = "LED on!";
      sound.on('ended', function() {
        led.off();
        ledstatus.innerHTML = "LED off!";
  </script>

Sunbelt Computer Software

PL/B Language Development and Support

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Uh oh!

Sunbelt Computer Software

PL/B Language Development and Support

Uh oh!

FilesExpand file tree

sound.html

Latest commit

History

sound.html

File metadata and controls