test/view/mds/js/camera.js

   1 // camera.js
   2
   3 // 変数 //////////////////////////////////////
   4
   5 var ws           // WebSocket
   6 var i = 0;       // 画像取得回数カウント用
   7 var cameraParams = {
   8   size : 1,      // 画像サイズ
   9   binning : 4,   // ビニング
  10   exptime : 0.07    // 露光時間
  11 };
  12 var sendBuf = {
  13   "type" : 0,
  14   "data"  : 0
  15 };
  16
  17 //////////////////////////////////////////////
  18
  19
  20 // イベント登録 //////////////////////////////
  21
  22 $(function () {
  23
  24   $( "#start_button" ).toggle( startAcq, stopAcq) ;
  25
  26 });
  27
  28 //////////////////////////////////////////////
  29
  30
  31 function startAcq () {
  32   i = 0;
  33
  34   $( "#start_button" ).attr( "class", "btn btn-default btn-lg btn-danger");
  35
  36
  37   // サーバーとWebSocket接続
  38   ws = new WebSocket( "ws://"+$ipAddress+":3000" );
  39
  40   ws.onopen = function () {
  41     console.time(0)
  42    ws.onmessage = function( event ){
  43      console.timeEnd(i)
  44        i = i+1;
  45       data = JSON.parse(event.data)
  46         if(data["type"]=="connection"){
  47           if(data["data"]=="open"){
  48             sendBuf["type"] = "req";
  49             sendBuf["data"] = "img";
  50             ws.send(JSON.stringify(sendBuf));
  51             console.time(i);
  52           }
  53         }else if(data["type"]=="img"){
  54          draw(JSON.parse(data["data"]));
  55           sendBuf["type"] = "req";
  56           sendBuf["data"] = "img";
  57           ws.send(JSON.stringify(sendBuf));
  58         console.time(i)
  59         }
  60     }
  61   }
  62 }
  63
  64
  65 function stopAcq () {
  66    $( "#start_button" ).attr( "class", "btn btn-default btn-lg btn-default");
  67   console.log("stop");
  68    ws.close(1000, "close");
  69 }
  70
  71
  72 function dispParams () {
  73   paramsT =JSON.stringify(params);
  74   $( "#acqParams" ).html( paramsT );
  75 }
  76
  77 function setParams () {
  78   sendSettings();
  79   dispParams();
  80 }
  81
  82 function sendSettings () {
  83  $.ajax({
  84     type:"GET",
  85     url:"http://"+$ipAddress+":"+$port+"/fei/set/acq_init?bng="+cameraParams["binning"]+"&&exp="+cameraParams["exptime"]+"&&size="+cameraParams["size"],
  86     success: function(data){
  87     }
  88   });
  89 }
  90
  91
  92 // 描画
  93 function draw (data) {
  94   var ctx;
  95   var imgData;
  96   var emData;
  97   var length;
  98   var canvas = document.getElementById('camera_screen');
  99
 100   if(canvas.getContext){
 101     ctx = canvas.getContext('2d');
 102   }
 103
 104   ctx.scale(0.5, 0.5);
 105
 106   emData = data;
 107   length = data.length
 108   imgData = ctx.createImageData(length, length);
 109
 110   // 各ピクセルの色情報設定
 111   for (var i=0;i<length;i++){
 112     for (var j=0;j<length;j++){
 113       var n = j*4+i*length*4;
 114       var pixel = emData[i][j];
 115       imgData.data[n]   = pixel;
 116       imgData.data[n+1] = pixel;
 117       imgData.data[n+2] = pixel;
 118       imgData.data[n+3] = 255;
 119     }
 120   }
 121   //  console.timeEnd('draw for');
 122
 123   // CanvasのコンテキストにImageDataを設定
 124   //  console.time('put');
 125   ctx.scale(0.5, 0.5);
 126   ctx.putImageData(imgData, 0, 0);
 127 //  ctx.drawImage(imgData, 0, 0);
 128 //  console.log(put);
 129   //  console.timeEnd('put');
 130 }
 131