OSDN Git Service

all files of WITs
authoryonghong1969 <m238079m@mail.kyutech.jp>
Thu, 24 Mar 2016 08:46:23 +0000 (17:46 +0900)
committeryonghong1969 <m238079m@mail.kyutech.jp>
Thu, 24 Mar 2016 08:46:23 +0000 (17:46 +0900)
JS/em.js
JS/realtimeCamera.js
JS/userSetting.js
index.html
simplePhoto.html

index c07ba30..d4c9334 100644 (file)
--- a/JS/em.js
+++ b/JS/em.js
@@ -4,6 +4,23 @@ var UrlElement = userSetting.GetUrlElementInstance();
 var hello = userSetting.sayHello;
 console.log(UrlElement['sendIpAddress']);
 
+var LoadLogMemory = new LogMemory();
+var GETLogMemory = LoadLogMemory.LogMemoryInstance();
+var MemoryAll = LoadLogMemory.GETLog();
+
+/*
+getCurrentParams()
+clickMove()
+setStage()
+setSpotSize()
+setMagnificationA()
+setMagnificationR()
+correntConditionText()
+setSpotSize()
+setMagnificationR()
+setMagnificationA()
+nowCondition()
+*/
 
 
 function getCurrentParams(){
@@ -22,8 +39,6 @@ console.log("getcurrentparams");
   });
 }
 
-
-
 function clickMove(direction){
   var movingdistance = $("#movingdistance").val();
   var movexr = $("#movex").val();
@@ -47,23 +62,21 @@ switch(directionSwitch){
     break;
 
     case "Left":
-      movexr = parseInt(movexr) - (parseInt(movingdistance));
+      movexr = parseInt(movexr) + (parseInt(movingdistance));
       $("#movex").val(String(movexr));
     break;
 
     case "Right":
-    movexr = parseInt(movexr) + (parseInt(movingdistance));
+    movexr = parseInt(movexr) - (parseInt(movingdistance));
     $("#movex").val(String(movexr));
     $("#currentx").val(String(movexr));
     break;
     }
     $.ajax({
       type:"GET",
-      //電子顕微鏡通信時
-  //    url:"http://192.168.4.146:9090/fei/set/stagea?x="+encodeURIComponent(movexr)+
-      //モック
       url:"http://" +UrlElement['sendIpAddress']+
-      ":"+UrlElement['sendPortNumber']+"/fei/set/stagea?x="+encodeURIComponent(movexr)+
+      ":"+UrlElement['sendPortNumber']+"/"+UrlElement['sendManufacturer']+
+      "/set/stagea?x="+encodeURIComponent(movexr)+
       "&y="+encodeURIComponent(moveyr)+
       "&z="+encodeURIComponent(movezr)+
       "&a="+encodeURIComponent(movezr),
@@ -78,9 +91,6 @@ function setStage(){
   var movexr = $("#movex").val();
   var moveyr = $("#movey").val();
   var movezr = $("#movez").val();
-console.log("movingdistance="+movingdistance);
-console.log("movex="+movexr);
-console.log("movey="+moveyr);
 
   $("#movey").keydown(function(e){
     console.log(e.keyCode);
@@ -99,6 +109,8 @@ console.log("movey="+moveyr);
   });
 
   $("#movex").keydown(function(e){
+    console.log(e.keyCode);
+    console.log(typeof(e.keyCode));
     //RIGHT(→,a,k)
     if (e.keyCode == 39 || e.keyCode == 68 || e.keyCode == 76) {
     movexr = parseInt(movexr) + (parseInt(movingdistance)-1);
@@ -117,7 +129,7 @@ console.log("movey="+moveyr);
 //    url:"http://192.168.4.146:9090/fei/set/stagea?x="+encodeURIComponent(movexr)+
     url:"http://"+UrlElement['sendIpAddress']+
     ":"+UrlElement['sendPortNumber']+
-    "/"+UrlElement['sendElectronMicroscopeName']+
+    "/"+UrlElement['sendManufacturer']+
     "/set/stagea?x="+encodeURIComponent(movexr)+
     "&y="+encodeURIComponent(moveyr)+
     "&z="+encodeURIComponent(movezr)+
@@ -136,3 +148,62 @@ function currentConditionText(){
   console.log("currentcondition");
   $("#Currentcondition").innerHTML='x:"movexr" y:"moveyr" z:"movezr"'
 }
+
+function setSpotSize(){
+  var setSpotSize = $("#SpotSize").val();
+  $.ajax({
+    type:"GET",
+    url:"http://"+UrlElement['sendIpAddress']+
+    ":"+UrlElement['sendPortNumber']+
+    "/"+UrlElement['sendManufacturer']+
+    "/set/spotsizea?sps="+encodeURIComponent(setSpotSize),
+    success: function(data){
+      console.log(data);
+    }
+  });
+}
+
+function setMagnificationA(){
+  var magnificationA = $("#magnificationA").val();
+  $.ajax({
+    type:"GET",
+    url:"http://"+UrlElement['sendIpAddress']+
+    ":"+UrlElement['sendPortNumber']+
+    "/"+UrlElement['sendManufacturer']+
+    "/set/magnificationa?mag="+encodeURIComponent(magnificationA),
+    success: function(data){
+      console.log(data);
+    }
+  });
+}
+function setMagnificationR(){
+  var magnificationR = $("#magnificationR").val();
+  $.ajax({
+    type:"GET",
+    url:"http://"+UrlElement['sendIpAddress']+
+    ":"+UrlElement['sendPortNumber']+
+    "/"+UrlElement['sendManufacturer']+
+    "/set/magnificationr?mag="+encodeURIComponent(magnificationR),
+    success: function(data){
+      console.log(data);
+    }
+  });
+}
+
+function nowCondition(){
+  var movexr = $("#movex").val();
+  var moveyr = $("#movey").val();
+  var movezr = $("#movez").val();
+  var movea = $("#movea").val();
+  var spotSize = $("#spotSize").val();
+  var exptime = $("#exptime").val();
+  var manufacturer = UrlElement['sendElectronMicroscopeName'];
+  document.getElementById("tem").innerHTML = manufacturer;
+  document.getElementById("currentx").innerHTML = parseInt(movexr);
+  document.getElementById("currenty").innerHTML = parseInt(moveyr);
+  document.getElementById("currentz").innerHTML = parseInt(movezr);
+  document.getElementById("currenta").innerHTML = parseInt(movea);
+  document.getElementById("SpotSizeIndex").innerHTML = parseInt(spotSize);
+  document.getElementById("MagIndex").innerHTML = parseInt(magnificationA);
+
+}
index 9e2a82f..e633aba 100644 (file)
@@ -1,6 +1,6 @@
-
 var ws ;
 var i = 0;
+var toggleSwitch =0;
 var params = {
   size : 0,
   binninb : 1,
@@ -12,29 +12,89 @@ var UrlElement = userSetting.GetUrlElementInstance();
 var hello = userSetting.sayHello;
 console.log(UrlElement['sendIpAddress']);
 
-function conectionStart(){
+/*function
+wsConnectionSwitch();
+apiConnectionSwitch();
+setParams();
+settings()
+connection()
+image()
+simplePhotoCamera()
+
+*/
+
+
+
+function wsConnectionSwitch(){
+  setParams();
+  var data;
+  toggleSwitch ^= 1 ;
+  switch(toggleSwitch){
+    case 1:
  ws = new WebSocket("ws://"+UrlElement['sendIpAddress']+":3001");
   ws.onopen = function(){
+    console.log('websocket connected')
   //  ws.send('req');
   };
-/*  ws.onerror = function(error){
-    console.log('websocket error' + error);
-  };*/
+  document.getElementById("wsConnectBtn").value = "websocket close";
   ws.onmessage = function(ture){
     data = JSON.parse(ture.data)
     console.log('server:' +data["type"]);
-    switch(data["type"]){
-      case "connection":
-      connection(data);
-      break;
-
-      case "img":
-      image(data);
-      break;
-    }
+  switch(data["type"]){
+    case "connection":
+    connection(data);
+    break;
+
+    case "img":
+    image(data);
+    break;
+  }
+};
+  break;
+
+  case 0:
+    ws.close();
+    console.log('closed');
+    document.getElementById("wsConnectBtn").value = "websocket start";
+    break;
   }
 }
 
+function apiConnectionSwitch(){
+toggleSwitch ^= 1;
+switch(toggleSwitch){
+  case 1:
+  //start
+  $.ajax({
+    type:"GET",
+    url:"http://" +UrlElement['sendIpAddress']+
+    ":"+UrlElement['sendPortNumber']+"/"+UrlElement['sendManufacturer']+
+    "/set/",
+    success: function(data){
+      console.log(data);//string型
+    }
+  });
+  document.getElementById("apiConnectBtn").value = "API close";
+  break;
+
+  case 0:
+//stop
+  $.ajax({
+    type:"GET",
+    url:"http://" +UrlElement['sendIpAddress']+
+    ":"+UrlElement['sendPortNumber']+"/"+UrlElement['sendManufacturer']+
+    "/set/",
+    success: function(data){
+      console.log(data);//string型
+    }
+  });
+  document.getElementById("apiConnectBtn").value = "API start";
+  break;
+};
+}
+
+
+
 function setParams(){
   settings();
 }
@@ -48,7 +108,7 @@ function settings(){
   }
   $.ajax({
     type:"GET",
-    url:"http://"+$ipAddress+":"+$port+"/fei/set/acq_init?bng="+params["binning"]+"&&exp="+params["exptime"]+"&&size="+params["size"],
+    url:"http://"+UrlElement["sendipAddress"]+":"+UrlElement["sendPortNumber"]+"/"+UrlElement["sendManufacturer"]+"/set/acq_init?bng="+params["binning"]+"&&exp="+params["exptime"]+"&&size="+params["size"],
     success: function(data){
     }
   });
@@ -59,21 +119,94 @@ ws.send('{"type":"req", "data":"img"}');
 }
 
 function image(data){
-console.log(data);
   ws.send('{"type":"req", "data":"img"}');
   drawMycrograph(data.data);
 }
 
-function connectionClose(){
-  ws.close();
+
+function simplePhotoCamera(){
+  var simplePhotoImage = $("canvasOne").val();
 
 }
 
+window.onload=canvasMap;
+function canvasMap(){
+  var canvas = document.getElementById("canvasMap");
+  var ctx = canvas.getContext("2d");
+  var x = $("#movex").val();
+  var y = $("#movey").val();
+  var z = $("#movez").val();
+  var a = $("#movea").val();
 
+  ctx.beginPath();
+  ctx.fillStyle = "#808080";
+  ctx.arc(100,100,100,0,Math.PI*2,true);
+  ctx.fill();
+  ctx.closePath();
 
-function simplePhotoCamera(){
-  var simplePhotoImage = $("canvasOne").val();
 
+  canvas.addEventListener("mousedown",function(e){
+    $.ajax({
+      type:"GET",
+      url:"http://"+UrlElement['sendIpAddress']+
+      ":"+UrlElement['sendPortNumber']+
+      "/"+UrlElement['sendManufacturer']+
+      "/set/stagea?x="+encodeURIComponent(movexr)+
+      "&y="+encodeURIComponent(moveyr)+
+      "&z="+encodeURIComponent(movezr)+
+      "&a="+encodeURIComponent(movezr),
+      success: function(data){
+        console.log(data);
+      }
+    });
+  });
+}
 
+/*
+function canvasMapDraw(){
+  var step = (1/2000);//倍率変化はここの通知を変化
+  var canvas = document.getElementById("canvasMap");
+  var ctx = canvas.getContext("2d");
+  var x = $("#movex").val();
+  var y = $("#movey").val();
+  if(x == 0 || y==0){
+  ctx.beginPath();
+  ctx.fillStyle = "#000000";
+  ctx.moveTo(100,100);
+  ctx.lineTo((parseInt(x)*step+100,-(parseInt(y)*step)+100);
+  //ctx.lineTo(150,100)
+  ctx.closePath();
+  ctx.stroke();
+  moveX = (parseInt(x)*step)+100;
+  moveY = -(parseInt(y)*step)+100;
+}
+  else if(x !=0 || y!= 0){
+  ctx.beginPath();
+  ctx.fillStyle = "#000000";
+  ctx.moveTo(moveX,moveY);
+  ctx.lineTo((parseInt(x)*step+100,-(parseInt(y)*step)+100);
+  //ctx.lineTo(150,100)
+  ctx.closePath();
+  ctx.stroke();
+  moveX = (parseInt(x)*step)+100;
+  moveY = -(parseInt(y)*step)+100;
+}
+}
+*/
 
+/*window.onload = drawCanvasMap;
+function drawCanvasMap(){
+  var drawCanvas = document.getElementById("canvasMap");
+  var ctx = drawCanvas.getContext("2D");
+//  if(canvas.getContext){
+  var x = $("#movex").val();
+  var y = $("#movey").val();
+  ctx.fillStyle = "#000000";
+  ctx.beginPath();
+  ctx.moveTo(parseInt(x)+100,parseInt(y)+100);
+  ctx.lineTo(150,100);
+  ctx.closePath();
+  ctx.stroke();
+//}
 }
+*/
index 0894187..27bb71a 100644 (file)
@@ -1,20 +1,22 @@
 
+/*
+UserSetting()
+GetUrlElement()
+IndexReadEmCondtionText
+SaveEmConditionFile()
+IndexSaveEmConditionFile()
+IndexReadEmCondtionTextArg()
+*/
+
+
+
 function UserSetting(){
 
-   var $ipAddress = $("#ipAddress").val();
-   var $port = $("#portNumber").val();
-   var $manufacturer = $("#manufacturer").val();
-   var $electoronMicroscopeName = $("#electoronMicroscopeName").val();
-  console.log($port);
-  console.log($ipAddress);
-/*
-  $.ajax({
-    type:"GET",
-    url:"//" +$ipAddress+ ":" +$port+ "/"+manufacturer+"/get",
-    success: function(data){
-      console.log(data);
-    }
-  });*/
+  var $ipAddress = $("#ipAddress").val();
+  var $port = $("#portNumber").val();
+  var $manufacturer = $("#manufacturer").val();
+  var $electronMicroscopeName = $("#electronMicroscopeName").val();
+
 }
 
 function GetUrlElement(){
@@ -25,12 +27,147 @@ function GetUrlElement(){
     arg[kv[0]]=kv[1];
   }
 
-$(".div2 h1 p").text(arg['sendElectronMicroscopeName'])
+  $(".div2 h1 p").text(arg['sendElectronMicroscopeName'])
+
   return {
     GetUrlElementInstance: function() {
       return arg;
     },
     sayHello: "Hello"
   }
+}
+
+function IndexSaveEmConditionFile(){
+  var date = new Date();
+  var $ipAddress = $("#ipAddress").val();
+  var $port = $("#portNumber").val();
+  var $manufacturer = $("#manufacturer").val();
+  var $electronMicroscopeName = $("#electronMicroscopeName").val();
+  var Year = date.getFullYear();
+  var Month = date.getMonth() + 1;
+  var day = date.getDate();
+
+  //文字を取得ファイルにはいるやつ
+  var text = "TEM:"+$manufacturer+
+  ",portNumber:"+$port+
+  ",ipAddress:"+$ipAddress+
+  ",electronMicroscopeName:"+$electronMicroscopeName+
+  ",Date:"+Year+
+  +Month+
+  +day+
+  "";
+//   var name = document.getElementById('saveEmConditionFileName').value = 'mytext';
+  //テキストファイルを作成
+  var blob = new Blob([text], {type: 'text/plain'});
+  //リンクを取得
+  var linkcondition = document.getElementById('DL_link_condition');
+  //リンクにダウンロードするファイルをセット
+  linkcondition.href = window.URL.createObjectURL(blob);
+  //もしダウンロード属性に対応していたら
+  if ('download' in linkcondition) {
+    var data = $manufacturer + Year.toString() +'_'+ Month.toString() +'_'+ day.toString();
+    //リンクにダウンロードする名前をセット
+    linkcondition.download = data + '.txt';
+    //リンクをクリックしてダウンロードさせる
+    linkcondition.click();
+    //もし対応してなかったら
+  } else {
+    //メッセージを表示する
+    linkcondition.textContent = '右クリックから名前を付けて保存してください';
+  }
+}
+
+function SaveEmConditionFile(){
+  var date = new Date();
+  var $manufacturer = $("#manufacturer").val();
+  var movex = $("#movex").val();
+  var movey = $("#movey").val();
+  var movez = $("#movez").val();
+  var movea = $("#movea").val();
+  var spotSize = $("#spotSize").val();
+  var magnificationA = $("#magnificationA").val();
+  var magnificationR = $("#magnificationR").val();
+  var binning = $("#binnig").val();
+  var size = $("#size").val();
+  var exptime = $("#exptime").val();
+  var Year = date.getFullYear();
+  var Month = date.getMonth() + 1;
+  var day = date.getDate();
+  var Hours = date.getHours();
+  var Minutes = date.getMinutes();
+
+  //文字を取得ファイルにはいるやつ
+  var text = "{'x':'"+movex+
+  "','y':'"+movey+
+  "','z':'"+movez+
+  "','a':'"+movea+
+  "','spotSize':'"+spotSize+
+  "','magnificationA':'"+magnificationA+
+  "','magnificationR':'"+magnificationR+
+  "','binning':'"+binning+
+  "','size':'"+size+
+  "','exptime':'"+exptime+
+  "','Date':'"+Year+
+  '/'+Month+
+  '/'+day+
+  "'}";
+  //ファイル名を取得、デフォルトは「mytext」
+  //      var name = document.getElementById('saveEmConditionFileName').value = 'mytext';
+  //テキストファイルを作成
+  var blob = new Blob([text], {type: 'text/plain'});
+  //リンクを取得
+  var linkcondition = document.getElementById('DL_link_condition');
+  //リンクにダウンロードするファイルをセット
+  linkcondition.href = window.URL.createObjectURL(blob);
+  //もしダウンロード属性に対応していたら
+  if ('download' in linkcondition) {
+    var data = "EMcondition" + Year.toString() +'_'+ Month.toString() +'_'+ day.toString()+'_'+Hours.toString()+'_'+Minutes.toString();
+    //リンクにダウンロードする名前をセット
+    linkcondition.download = data + '.txt';
+    //リンクをクリックしてダウンロードさせる
+    linkcondition.click();
+    //もし対応してなかったら
+  } else {
+    //メッセージを表示する
+    linkcondition.textContent = '右クリックから名前を付けて保存してください';
+  }
+}
 
+
+function IndexReadEmCondtionText(){
+  var obj1 = document.getElementById("selfile");
+  obj1.addEventListener("change",function(evt){
+    var file = evt.target.files;
+    var arg = {};
+    var reader = new FileReader();
+    reader.readAsText(file[0]);
+    reader.onload = function(ev){
+      console.log(reader.result);
+      document.selectFile.txt.value = reader.result;
+      var pair = reader.result.split(',');
+      for(var i=0;pair[i];i++) {
+        var kv = pair[i].split(':');
+        arg[kv[0]]=kv[1];
+      }
+      console.log(arg['Date']);
+      console.log(arg['ipAddress']);
+      console.log(arg['portNumber']);
+      console.log(arg['TEM']);
+      IndexReadEmCondtionTextArg(arg);
+    }
+    console.log(arg['Date']);
+  },false);
+}
+
+function IndexReadEmCondtionTextArg(arg){
+  var ipAddress = arg['ipAddress'];
+  var manufacturer = arg['TEM'];
+  var portNumber = arg['portNumber'];
+  var manufacturerName = arg['electronMicroscopeName'];
+  var res = confirm("Would that be OK with you?");
+  if(res == true){
+    window.location = "http://"+ipAddress+":3000/simplePhoto.html?sendIpAddress="+ipAddress+"&sendPortNumber="+portNumber+"&sendManufacturer="+manufacturer+"&sendElectronMicroscopeName="+manufacturerName+""
+  }else{
+    return false;
+  }
 }
index e98eba1..e966521 100644 (file)
             <div class="container-fluid">
                 <div class="row-fluid">
                     <div class="col-md-12">
-                        <h1>Please Select Electron Microscopes!</h1>
-                        <p>Proin eu leo non metus vulputate viverra. Curabitur ac augue ante. Praesent nisl diam, iaculis eget ipsum at, blandit laoreet eros. Nam hendrerit, erat commodo varius consequat, dolor massa tempor massa, vel cursus enim neque pellentesque augue. Aenean ullamcorper et lacus at hendrerit. Phasellus id lectus luctus, congue quam id, tempor justo. Mauris sodales imperdiet nisi eget lacinia. Nulla vehicula eleifend nibh sed malesuada. Praesent eget tortor erat. Nullam a sapien sit amet enim tempor cursus. Sed vehicula nisl sed odio gravida aliquam. Sed metus lorem, vestibulum vel pulvinar vel, condimentum vitae risus. Curabitur in odio ut nisl convallis dapibus sollicitudin vitae orci. Aenean vel molestie massa. Nam vehicula porta arcu, at dapibus nulla pulvinar fermentum. Nam orci enim, elementum ac risus vestibulum, imperdiet placerat mi.</p>
-                    </div>
+                        <h1>Please Input Your Electron Microscopes Data!</h1>
+<!--                        <p>Proin eu leo non metus vulputate viverra. Curabitur ac augue ante. Praesent nisl diam, iaculis eget ipsum at, blandit laoreet eros. Nam hendrerit, erat commodo varius consequat, dolor massa tempor massa, vel cursus enim neque pellentesque augue. Aenean ullamcorper et lacus at hendrerit. Phasellus id lectus luctus, congue quam id, tempor justo. Mauris sodales imperdiet nisi eget lacinia. Nulla vehicula eleifend nibh sed malesuada. Praesent eget tortor erat. Nullam a sapien sit amet enim tempor cursus. Sed vehicula nisl sed odio gravida aliquam. Sed metus lorem, vestibulum vel pulvinar vel, condimentum vitae risus. Curabitur in odio ut nisl convallis dapibus sollicitudin vitae orci. Aenean vel molestie massa. Nam vehicula porta arcu, at dapibus nulla pulvinar fermentum. Nam orci enim, elementum ac risus vestibulum, imperdiet placerat mi.</p>
+-->                </div>
                 </div>
             </div>
         </div>
-        <!--           <div class="service-block">
+               <div class="service-block">
             <div class="container-fluid">
                 <div class="row-fluid">
-                    <div class="col-md-4 col-sm-4">
-                        <div class="animate-paraslide animatedEntrance">
-                            <a href="./wits_hitachi.html">
-                                <img onclick="emnamecatch('hitachi')" src="./image/ef2000.jpg"/>
-                                <div class="overlay">
-                                    <h3>HITACHI EF-2000</h3>
-                                    <p>Use this electron microscope.</p>
-                                </div>
-                            </a>
-                        </div>
-                    </div>
-                    <div class="col-md-4 col-sm-4">
-                        <div class="animate-paraslide animatedEntrance">
-                            <img onclick = "emnamecatch('fei')" src="./image/fei.jpg"/>
-                            <a href="./wits_fei.html" onclick="emnamecatch('fei')">
-                                <div class="overlay">
-                                    <h3>FEI TecnaiG^2 Spirit</h3>
-                                    <p>Use this electron microscope.</p>
-                                </div>
-                            </a>
-                        </div>
-                    </div>
-                    <div class="col-md-4 col-sm-4">
-                        <div class="animate-paraslide animatedEntrance">
-                            <a href="./wits_jeol.html">
-                                <img onclick = "emnamecatch('jeol')" src="./image/jeol.jpg" alt="empicture"/>
-                                <div class="overlay">
-                                    <h3>JEOL JEM-2100</h3>
-                                    <p>Use this electron microscope.</p>
-                                </div>
-                            </a>
-                        </div>
-                    </div>
--->
+
                     <form method = "get" autocomplete = "on" action = "simplePhoto.html">
-                      <p>IP Address : <input type ="text" id = "ipAddress"  size = "40" name = "sendIpAddress"></p>
-                      <p>port number : <input type ="text" id = "portNumber" size = "40" name = "sendPortNumber"></p>
-                      <p>manufacturer : <input type ="text" id = "manufacturer" size = "40" name = "sendManufacturer"></p>
+                      <p>IP Address : <input type ="text" id = "ipAddress"  size = "40" name = "sendIpAddress" placeholder="localhost"></p>
+                      <p>port number : <input type ="text" id = "portNumber" size = "40" name = "sendPortNumber" placeholder="3000"></p>
+                      <p>manufacturer :
+                      <select id = "manufacturer" name = "sendManufacturer">
+                        <option value="fei">fei</option>
+                        <option value="jeol">jeol</option>
+                        <option value="hitachi">hitachi</option>
+                      </select>
+                      </p>
                       <p>electron microscope name : <input type ="text" id = "electronMicroscopeName" size = "40" name = "sendElectronMicroscopeName"></p>
-                      <p><input type = "submit" value = "access" onclick = "UserSetting()"></p>
+                      <p><input type = "submit" value = "access" onclick = "UserSetting()" class="btn btn-default"></p>
                     </form>
+
+                      <p>em condition save</p>
+                      File name:<input id="saveEmConditionFileName" placeholder="date">.txt
+                      &nbsp;&nbsp;&nbsp;<button onclick="IndexSaveEmConditionFile()" class="btn btn-default">Save</button>
+                      <a id='DL_link_condition'></a>
+                      <form name=selectFile>
+                        <input type="file" id="selfile"  onclick="IndexReadEmCondtionText()">
+                        <textarea name = "txt" row ="10" cols="50" readonly></textarea>
+<!--                    <input type="button" value="set condition" class="btn btn-default">
+-->                      </form>
                 </div>
             </div>
         </div>
index 2076ddd..16ff4be 100644 (file)
-
 <!DOCTYPE html>
-
 <html lang="en" xmlns = "http://www.w3.org/1999/xhtml">
-    <head>
-        <meta charset="utf-8">
-        <meta http-equiv="X-UA-Compatible" content="IE=edge">
-        <meta name="viewport" content="width=device-width, initial-scale=1">
-        <title>Websystem Integrated Tems</title>
-<!--        <link rel="shortcut icon" type="image/x-icon" href="favicon.png" />-->
-        <link href="fonts/font-awesome-4.1.0/css/font-awesome.min.css" rel="stylesheet">
-        <link href="CSS/bootstrap-3.1.1.min.css" rel="stylesheet">
-       <link href="CSS/lollies.min.css" rel="stylesheet">
-        <link href="CSS/custom.css" rel="stylesheet">
-    </head>
+<head>
+  <meta charset="utf-8">
+  <meta http-equiv="X-UA-Compatible" content="IE=edge">
+  <meta name="viewport" content="width=device-width, initial-scale=1">
+  <title>Websystem Integrated Tems</title>
+    <link href="fonts/font-awesome-4.1.0/css/font-awesome.min.css" rel="stylesheet">
+  <link href="CSS/bootstrap-3.1.1.min.css" rel="stylesheet">
+  <link href="CSS/lollies.min.css" rel="stylesheet">
+  <link href="CSS/custom.css" rel="stylesheet">
+</head>
 <body>
   <header id="main-header">
-      <div class="container">
-          <div class="row">
-              <div class="col-md-3 spacer"></div>
-              <div class="col-md-6">
-                  <!-- LOGO 4️--><b>W</b>ebsystem <b>I</b>ntegrated <b>T</b>ems
-                  <!--<div id="logo"><a href="/"><img src="image/fei.png" /></a></div>-->
-              </div>
-              <div class="col-md-3 spacer"></div>
+    <div class="container">
+      <div class="row">
+        <div class="col-md-3 spacer"></div>
+        <div class="col-md-6">
+          <b>W</b>ebsystem <b>I</b>ntegrated <b>T</b>ems
           </div>
+        <div class="col-md-3 spacer"></div>
       </div>
+    </div>
   </header>
-<!--
-   <nav id="main-nav">
-      <div class="container">
-          <div class="row">
-              <div class="col-md-12">
-                  <div class="navbar navbar-default" role="navigation">
-                      <div class="navbar-header">
-                          <button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse">
-                              <span class="sr-only">Toggle navigation</span>
-                              <span class="icon-bar"></span>
-                              <span class="icon-bar"></span>
-                              <span class="icon-bar"></span>
-                          </button>
-                      </div>
-                      <div class="navbar-collapse collapse">
-                          <ul class="nav navbar-nav nav-justified">
-                              <li id="mtab1"><a href="#" onclick="cngTab('1');FocusTab('mtab1');tabcheck()">About JEM-2100</a></li>
-                              <li id="mtab2"><a href="simplePhoto.html" >Simple Photo</a></li>
-                            <li class="dropdown" id="mtab3">
-                                  <a href="#" class="dropdown-toggle" data-toggle="dropdown" onclick="FocusTab('mtab3')">Tomography<b class="caret"></b></a>
-                                  <ul class="dropdown-menu">
-                                      <li><a href="#" onclick="cngTab('3');tabcheck()">1 Eucentric Height</a></li>
-                                      <li><a href="#" onclick="cngTab('4');tabcheck()">2 Take photo</a></li>
-                                  </ul>
-                              </li>
-                              <li id="mtab4"><a href="#" onclick="cngTab('5');tabcheck();FocusTab('mtab4')">MDS</a></li>
-                              <li id="mtab5"><a href="#" onclick="FocusTab('mtab5')">Information</a></li>
-                              <li class="dropdown" id="mtab8">
-                                  <a href="#" class="dropdown-toggle" data-toggle="dropdown" onclick="FocusTab('mtab8')">Option<b class="caret"></b></a>
-                                  <ul class="dropdown-menu">
-                                      <li class="dropdown">
-                                          <a href="#" class="dropdown-toggle" data-toggle="dropdown" onclick="bgColChangeDefault()">Change background<b class="caret"></b></a>
-                                      <li><a href="#" onclick="bgColChangeWhite()">White</a></li>
-                                      <li><a href="#" onclick="bgColChangeGrey()">grey</a></li>
-                              </li>
-                              <li><a href="index.html">Change EM</a></li>
-                              <li><a href="#">Something else here</a></li>
-                              <li class="divider"></li>
-                              <li class="dropdown-header">Nav header</li>
-                              <li><a href="#">Separated link</a></li>
-                              <li><a href="#">One more separated link</a></li>
-                          </ul>
-                          </li>
-                          </ul>
-                      </div>
-                  </div>
-              </div>
-          </div>
-      </div>
-  </nav>
--->
 
-<div id= 'simplephotecontents'>
+  <div id= 'simplephotecontents'>
     <div class="content-block">
-        <div class="container">
-            <div class="row">
-                <div class="col-md-12">
-                      <div class="div2">
-                        <h1>
-                      <p id = "displayEmName">display</p>
-                    </h1>
-                    </div>
-
-                </div>
+      <div class="container">
+        <div class="row">
+          <div class="col-md-12">
+            <div class="div2">
+              <h1>
+                <p id = "displayEmName">display</p>
+              </h1>
+            </div>
+          </div>
+        </div>
+        <div class="row">
+          <div class="col-md-6">
+            <div id="viewArea">
+              <br>
+              <br>
+              <canvas id="canvasSimplePhoto" width="512" height="512"></canvas>
+            </div>
+          </div>
+          <div class="col-md-6">
+            <h2>Control Electron Microscopy</h2>
+            <p>
+              <label>map</label>
+            </p>
+            <div>
+              <canvas height="200" width="200" id="canvasMap"></canvas>
             </div>
-            <div class="row">
-                <div class="col-md-6">
-                    <div id="viewArea">
-                        <br>
-                        <br>
-                        <canvas id="canvasSimplePhoto" width="512" height="512"></canvas>
-                    </div>
-                </div>
-                <div class="col-md-6">
-                     <h2>Control Electron Microscopy</h2>
-  <!--                    <div>
-                      <button calss="btn btn-default" onclick="getCurrentParams()">get start</button>
-                    </div>
--->
 
-<p>
-    <label>Settings</label>
-</p>
-<div id="SimplePhotoPrams">
-  image size:
-  <select id="size" name="size">
-    <option value="0">full</option>
-    <option value="1">half</option>
-    <option value="2">quarter</option>
-  </select>
+            <p>
+              <label>Settings</label>
+            </p>
+            <div id="SimplePhotoPrams">
+              image size:
+              <select id="size" name="size" onchange="LogCollect()">
+                <option value="0">full</option>
+                <option value="1">half</option>
+                <option value="2">quarter</option>
+              </select>
 
-  binning:
-  <select id="binning" name="ninning">
-    <option value="1">1</option>
-    <option value="2">2</option>
-    <option value="4">4</option>
-  </select>
+              binning:
+              <select id="binning" name="ninning" onchang="LogCollect()">
+                <option value="1">1</option>
+                <option value="2">2</option>
+                <option value="4">4</option>
+              </select>
 
-  ecptime:
-  <input type="text" id="exptime" name="exptime">
+              ecptime:
+              <input type="number" id="exptime" name="exptime" onchang="LogCollect()">
 
-                    <p>
-                        <label>stage controle</label>
-                    </p>
+              <p>
+                <label> Stage controle </label>
+              </p>
 
-                    <!--switmood choose to crick Control mode select -->
+              <form name="movestage" id="movestageid" action="">
+                <p><div class="form-group">
+                  moving distance
+                  <input type="number" name="movingdistance" id="movingdistance" value="1" onchange="setStage()">nm</input>
+                </div>
 
-                    Control mode select:<a onclick="switchkey('1');controlmodeselect('key')"><span id="key">Key(ex.↑↓→←,wsad,hjkl)</span></a>
-                    <!--&nbsp;&nbsp;&nbsp;&nbsp;<a onclick="controlmodeselect('formmode')"><span id="formmode">Form</span></a>
-                    &nbsp;&nbsp;&nbsp;&nbsp;<a onclick="switchkey('2');controlmodeselect('gamepad')"><span id="gamepad">Gamepad</span></a>
-                -->    <form name="movestage" id="movestageid" action="">
+                <p><div class="form-group">
+                  move x
+                  <input type="number" name="movex" id="movex" value="0" step="100" onchange="setStage() ; canvasMapDraw() ; LogCollect()">nm
+                  <input type="button" id="clickMoveyLeft" value="←" class="btn btn-default" onclick="clickMove('Left') ; LogCollect()">
+                  <input type="button" id="clickMoveyRight" value="→" class="btn btn-default" onclick="clickMove('Right') ; LogCollect()">
+                </div>
+                <div class="form-group">
+                  move y
+                  <input type="number" name="movey" id="movey" value="0" step="100" onchange="setStage() ; canvasMapDraw() ; LogCollect()">nm
+                  <input type="button" id="clickMovexUp" value="↑" class="btn btn-default" onclick="clickMove('Up') ; LogCollect()">
+                  <input type="button" id="clickMovexDown" value="↓" class="btn btn-default" onclick="clickMove('Down') ; LogCollect()">
+                </div>
+              </form>
 
-                      <p><div class="form-group">
-                          moving distance
-                          <input type="number" name="movingdistance" id="movingdistance" value="1" onchange="setStage()">nm</input>
-                        </div>
+              <form name="moveza" id="moveza" action="">
+                <div class="form-group">
+                  move z(keep magnificance)
+                  &nbsp;&nbsp;
+                  <input type="number" name="movez" id="movez" value="0" onchange="setStage() ; LogCollect()">nm<br><br>
+                  change current(keep stage)
+                  &nbsp;&nbsp;
+                  <input type="number" name="movea" id="movea" onchange="objcontrol('obj',current.value) ; LogCollect()">%&nbsp;&nbsp;Current lenz:<span id="obj"></span>
+                </div>
+              </form>
+              <form>
+                spot size
+                <input type = "number" name = "sps" id = "SpotSize" onchange="setSpotSize() ; LogCollect()">
+              </form>
+              <p>
+                magnification absolute value
+                <input type = "number" name = "magA" id = "magnificationA" onchange = "setMagnificationA() ; LogCollect()">
+              </p>
+              <form>
+                magnification relative value
+                <input type = "number" name = "magR" id = "magnificationR" onchange = "setMagnificationR() ; LogCollect()">
+              </form>
+            </div>
+            <div>
+            <p>
+              <label> Take Photo</label>
+           </p>
+            <input id="wsConnectBtn" onclick="wsConnectionSwitch() ; LogCollect()" class="btn btn-default" value="websocket start">
+            <input id = "apiConnectBtn" onclick="apiConnectionSwitch() ; LogCollect()" class = "btn btn-default" value="API start">
+          </br>
+          <p>
+            <label>Save Photo<label>
+            </p>
+            File name:<input id="namephoto" placeholder="myphoto">.tif
+            &nbsp;&nbsp;&nbsp;<button onclick="CanvasSave('canvasSimplePhoto')" class="btn btn-default">Save</button><br>
+            <a id="DL_link_canvas"></a>
 
-                        <p><div class="form-group">
-                            move x
-                            <input type="number" name="movex" id="movex" value="0" onchange="setStage()">nm
-                            <input type="button" id="clickMoveyLeft" value="←" class="btn btn-default" onclick="clickMove('Left')">
-                            <input type="button" id="clickMoveyRight" value="→" class="btn btn-default" onclick="clickMove('Right')">
-                        </div>
-                        <div class="form-group">
-                            move y
-                            <input type="number" name="movey" id="movey" value="0" onchange="setStage()">nm
-                            <input type="button" id="clickMovexUp" value="↑" class="btn btn-default" onclick="clickMove('Up')">
-                            <input type="button" id="clickMovexDown" value="↓" class="btn btn-default" onclick="clickMove('Down')">
-  <!--                          &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;Current y:<span id="currenty"></span><br><span id=stage></span>
-      </div>
-                        <input id="getcurrent" class="btn btn-default" value="current conditoin" onclick="currentConditionText()">
-    -->                </form>
-                    <form name="moveza" id="moveza" action="">
-                        <div class="form-group">
-                            move z(keep magnificance)
-                            &nbsp;&nbsp;
-                            <input type="number" name="movez" id="movez" value="0" onchange="setStage()">nm<br><br>
-                            change current(keep stage)
-                            &nbsp;&nbsp;
-                            <input type="number" name="current" id="current" onchange="objcontrol('obj',current.value);emcondition('request')">%&nbsp;&nbsp;Current lenz:<span id="obj"></span>
-                        </div>
-                    </form>
-                    <p>
-                        <label>Step3. Take Photo</label>
-                    </p>
-                    <p>
-                    <button id="SimplePhotoSetPrams" onclick="conectionStart()" class="btn btn-default">connection start</button>
-                    <button onclick="connectionClose()" class = "btn btn-default">connection close</button>
-                  </br>
-                  <p>
+        </div>
 
-                              Save Photo
-                        &nbsp;&nbsp;
-                        File name:<input id="namephoto" placeholder="myphoto">.tif
-                        &nbsp;&nbsp;&nbsp;<button onclick="CanvasSave('canvasSimplePhoto')" class="btn btn-default">Save</button><br>
-                        <a id="DL_link_canvas"></a>
-                    </form>
-                    <br>
-                    <p>
-                        <label>Electron Microscopy Condition</label>&nbsp;&nbsp;&nbsp;&nbsp;
-                        <!--<input type="button" value="push" onClick="emcondition('request')"></input>--><br>
-                        <form name="save" id="saveid">
-                        File name:<input id="name1" placeholder="mytext">.txt
-                        &nbsp;&nbsp;&nbsp;<button onclick="ConditionFileSave()" class="btn btn-default">Save</button>
-                        <a id='DL_link_condition'></a>
-                    </form>
-                    <div id="condition" style="width:340px; height:250; padding:10px; border:6px outset">
-                        TEM:<span id="tem"></span>
-                        Position:<span id="Position"></span>x=<span id="GonioX"></span>,y=<span id="GonioY"></span>,z=<span id="GonioZ"></span>,a=<span id="GonioA"></span><br>
-                        SpotSizeIndex:<span id="SpotSizeIndex"></span>
-                        MagIndex:<span id="MagIndex"></span>
-                        Obj:<span id="Obj"></span>
-                        BeamTiltX:<span id="BeamTiltX"></span>
-                        BeamTiltY:<span id="BeamTiltY"></span>
-                        Speed:<span id="Speed"></span>
-                    </div>
-                    </p>
-<!--
-                    <p>
-                        <label>Save condition</label><br>
-                      Todays:<span id="daysdata">a</span>
-                    <form name="save" id="saveid">
-                        File name:<input id="name" placeholder="mytext">.txt
-                        &nbsp;&nbsp;&nbsp;<button onclick="ConditionFileSave()" class="btn btn-default">Save</button>
-                        <a id='DL_link_condition'></a>
-                    </form>
-                    </p>
--->
+            <p>
+              <label>Electron Microscopy Condition</label>&nbsp;&nbsp;&nbsp;&nbsp;
+</p>
+                File name:<input id="name1" placeholder="date">.txt
+                &nbsp;&nbsp;&nbsp;<button onclick="SaveEmConditionFile()" class="btn btn-default">Save</button>
+                <a id='DL_link_condition'></a>
+                <div>
+                  LogFile name:<input id="logname" placeholder="log">.txt
+                  &nbsp;&nbsp;&nbsp;<button id="logsave" class="btn btn-default">Save</button>
                 </div>
-            </div>
+
+              <div id="condition" style="width:340px; height:250; padding:10px; border:6px outset">
+                TEM:<span id="tem"></span>
+                Position:<span id="Position"></span>x=<span id="currentx"></span>,y=<span id="currenty"></span>,z=<span id="currentz"></span>,a=<span id="currenta"></span><br>
+                SpotSizeIndex:<span id="SpotSizeIndex"></span>
+                MagIndex:<span id="MagIndex"></span>
+                Obj:<span id="Obj"></span>
+                BeamTiltX:<span id="BeamTiltX"></span>
+                BeamTiltY:<span id="BeamTiltY"></span>
+                Speed:<span id="Speed"></span>
+              </div>
+              <button class="btn btn-default" onclick="nowCondition()">currentConditon</button>
+          </div>
         </div>
+      </div>
     </div>
-</div>
+  </div>
+
 <!--script-->
 <script type="text/javascript" src= "JS/userSetting.js"></script>
 <script src="JS/jquery-1.7.2.min.js"></script>
 <script type="text/javascript" src= "JS/em.js"></script>
 <script type="text/javascript" src= "JS/realtimeCamera.js"></script>
 <script type="text/javascript" src= "JS/drawImage.js"></script>
-
+<script type="text/javascript" src= "JS/log.js"></script>
+<script type="text/javascript" src= "JS/map.js"></script>
 </body>
 </html>