vem.html

   1 <!DOCTYPE html>
   2 <html lang="en">
   3   <head>
   4     <meta charset="utf-8">
   5     <title>VEM Control Interface</title>
   6     <link rel="stylesheet" type="text/css" href="CSS/vemclient.css">
   7     <script type ="text/javascript" src="JS/ajax.js"></script>
   8     <script type ="text/javascript" src="JS/TemControl.js"></script>
   9     <script type ="text/javascript" src="JS/filecontrol.js"></script>
  10     <script type ="text/javascript" src="JS/filedownload.js"></script>
  11     <script type ="text/javascript" src="JS/stagecontrol.js"></script>
  12     <script type ="text/javascript" src="JS/mscontrol.js"></script>
  13     <script type="text/javascript"></script>
  14   </head>
  15   <body>
  16
  17     <b>V</b>irtual <b>E</b>lectron <b>M</b>icroscope Client
  18
  19     <form id="temselect" name="temselect" action="#" onsubmit="return false;">
  20       <input type="hidden" id="teminfo" name="teminfo" value="none"></input>
  21       <input type="button" name="submit" id="HITACHI" onclick="TemControl('Connect','HITACHI');"></input>
  22       <input type="button" name="submit" id="FEI" onclick="TemControl('Connect','FEI');"></input>
  23       <input type="button" name="submit" id="JEOL" onclick="TemControl('Connect','JEOL');"></input>
  24     </form>
  25     <br>
  26     <div id="connection" style="width:600px; height:20px; border:3px inset; margin:0 auto">
  27
  28     </div>
  29
  30
  31     <div id="container">
  32
  33       <div id="leftside">
  34
  35         <p>The EM Image</p>
  36         <div id="result" style="margin:0 auto; width:400px; height:400px; padding:10px; border:3px solid">The EM-Image from instrument.</div>
  37
  38         <form id="cameracontrol" name="cameracontrol" action="#" onsubmit="return false;">
  39           <input type="hidden" id="fileurl" name="fileurl" value="none"></input>
  40
  41           <br>
  42           <input type="button" style="width:150px;" name="submit" value="Initialization" onclick="TemControl('Control','initialization');"></input>
  43           <input type="button" style="width:150px;" name="submit" value="Finalization" onclick="TemControl('Control','finalization');"></input>
  44           <br>
  45
  46           <div id="takephoto">
  47             <div id="left">
  48               <p>Input<input type="text" name="input" class="box" size="30"></input>
  49               <br>
  50               Output<input type="text" name="output" class="box" size="30"></input>
  51               </p>
  52             </div>
  53             <br>
  54             <div id="right">
  55               <input type="button" style="width:150px;" name="submit" value="TakePhoto" onclick="TemControl('TakePhoto',document.cameracontrol.input.value+':'+document.cameracontrol.output.value);">
  56             </div>
  57             <p class ="clearRight" />
  58
  59           </div>
  60
  61           <div id="download">
  62
  63             <div id="left">
  64               <p>Mode<input type="text" name="mode" class="box" size="30"></input>
  65               <br>
  66               DL<input type="text" name="dlname" class="box" size="30"></input>
  67               </p>
  68             </div>
  69             <br>
  70             <div id="right">
  71               <input type="button" style="width:150px;" name="submit" value="Download" onclick="filewrite();">
  72               <p id="link"></p>
  73             </div>
  74             <p class ="clearRight" />
  75           </div>
  76
  77    <div id="stagecontrol">
  78       <div id="left">
  79         <br>
  80         Absolute coordinate
  81         <p>move x <input type="text" name="x" class="box" size="30" ></input>
  82         <br>
  83         move y <input type="text" name="y" class="box" size="30"></input>
  84         <br>
  85         move z <input type="text" name="z"= class="box" size="30"></input>
  86         <br>
  87         tilt a <input type="text" name="a" class="box" size="30"></input>
  88         <br>
  89         </p>
  90         <br>
  91         <p>Brightnessset(0～200)
  92         <input type="text" name="brightness"></p>
  93         <p>Voltageset (0～120kV)
  94         <input type="text" name="voltage"></p>
  95         </p>
  96       </div>
  97
  98       <div id="right">
  99       <br>
 100       <br>
 101       <br>
 102       <br>
 103          <input type="button" style="width:150px;" name="submit" value="Detailset" onclick="stagecontrol('detailcatch',x.value,y.value,z.value,a.value)"></input>
 104           <br>
 105          <input type="button" style="width:150px;" name="submit" value="Autoset" onclick="alert('Under construction! Only use Detailset!')"></input>
 106       <br>
 107       <br>
 108       <br>
 109       <br>
 110          <input type="button" style="widrh:150px;" name="submit" value="Brightnessset" onclick="mscontrol('Brightnessset',brightness.value)"></input>
 111          <br>
 112           <br>
 113          <input type="button" style="widrh:150px;" name="submit" value="Voltageset" onclick="mscontrol('Voltageset',voltage.value)"></input>
 114       </div>
 115
 116    </div>
 117
 118           </div>
 119
 120
 121         </form>
 122
 123       </div>
 124
 125       <div id="rightside">
 126         <p>TEM Control Command</p>
 127         <div id="command" style="width:340px; height:570px; padding:10px; border:6px outset">The EM-control commandset.
 128         <br>
 129         <br>
 130         <div id="detail"></div>
 131         </div>
 132
 133    <br>
 134
 135         <p>Current condition</p>
 136         <div id="condition" style="width:340px; height:250; padding:10px; border:6px outset">
 137         <div id="Position">Position: </div>
 138         <div id="Magnificant">Magnificant: </div>
 139         <div id="Brightness">Brightness:</div>
 140         <div id="Contrast">Contrast: </div>
 141         <div id="Forcus">Forcus:  </div>
 142         <div id="Voltage">Voltage: </div>
 143         </div>
 144
 145
 146       </div>
 147     </div>
 148
 149   </body>
 150 </html>