IC-7410の制御をhttpで(3)

右側の窓はsprigです。Cプログラムで、IC-7410がUSB接続されたリモートホストの上で走ります。

左側の窓はブラウザで、同じウォーターフォール画像を表示しています。

これは、ローカルホスト上の4つの異なるブラウザです。それらは、Chrome, Firefox, Opera, Safariですが、どれがどれだか分かりますか?

Remote host:

% sprig /dev/ttyUSB0 HW:2,0 |& node index.js

sprig.c

  for(int j=0;j<WATERFALL_XSIZE;j++) {
       double tmp  =  audio_signal_ffted[j];
       int    iii  = 10.0*tmp; fprintf(stderr, "%1d", iii);
       *p++ = *q++ = colormap_r(tmp);
       *p++ = *q++ = colormap_g(tmp);
       *p++ = *q++ = colormap_b(tmp);
  }

index.js

var http  = require('http');
var fs    = require('fs');
var index = fs.readFileSync(__dirname + '/index.html');
var count = 0;

var app = http.createServer(function(req, res) {
  res.writeHead(200, {'Content-Type' : 'text/html'});
  res.end(index);
});

var io = require('socket.io').listen(app);
app.listen(3000);

var ndata = 512;
var pos   = 0;
var myarray = new Array(ndata);

process.stdin.on('readable', function() {
  var buf = process.stdin.read();
  for (var i = 0; i < buf.length; i++) {
    myarray[pos++] = buf[i];
    if(pos == ndata) {
      pos = 0;
      console.log(myarray[0], myarray[1], myarray[2]);
      io.emit('time', {buffer : myarray});
    }
  }
});

index.html

<!doctype html>
<html>
<head>
<script src='/socket.io/socket.io.js'></script>
<script src="https://code.createjs.com/createjs-2015.11.26.min.js"></script>
<script>
var myarray = Array();
var socket  = io();
var canvas;
var ctx;
var imgData;
function init() {
  canvas = document.getElementById('myCanvas');
  ctx    = canvas.getContext('2d');

    imgData = ctx.createImageData(512, 512);
    for (i = 0; i < 512; i++) {
      for (j = 0; j < 512; j++) {
        imgData.data[0 + j * 4 + i * imgData.width * 4] = j % 256;
        imgData.data[1 + j * 4 + i * imgData.width * 4] = i % 256;
        imgData.data[2 + j * 4 + i * imgData.width * 4] = 0;
        imgData.data[3 + j * 4 + i * imgData.width * 4] = 255;
      }
    }
    ctx.putImageData(imgData, 0, 0);
}

function emitParticles(myarray) {
  ctx.putImageData(imgData, 0, 1);
  imgData = ctx.getImageData(0, 0, 512, 512);
  for (j = 0; j < 512; j++) {
    var index = (myarray[j] - 48) * 32 % 256;
    imgData.data[0 + j * 4] = index;
    imgData.data[1 + j * 4] = 256 - index;
    imgData.data[2 + j * 4] = 0;
    imgData.data[3 + j * 4] = 255;
  }
}

socket.on('time', function(data) {
  myarray = data.buffer;
  emitParticles(myarray);
console.log(count);
});
</script>
</head>

<body>
    <canvas id="myCanvas" width="512" height="512" style="background:white;"></canvas>
    <p id='messages'></p>
</body>
</html>

Leave a Reply

Your email address will not be published. Required fields are marked *

This site uses Akismet to reduce spam. Learn how your comment data is processed.