--- /dev/null
+
+<!DOCTYPE html>
+<html lang="en">
+ <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">
+ <script type ="text/javascript" src="JS/practice.js"></script>
+ <script type="text/javascript" src="JS/file.js"></script>
+ <script type="text/javascript" src="JS/option.js"></script>
+ <script src="JS/jquery-1.7.2.min.js"></script>
+ <script type="text/javascript" src="JS/canvas.js"></script>
+ <script type="text/javascript" src="JS/emcontrol.js"></script>
+ <script type="text/javascript" src="JS/ajax.js"></script>
+
+ <!-- <script type="text/javascript" src="JS/gamepad.js"></script> -->
+ <!--[if lt IE 9]>
+ <script src="js/html5shiv-3.7.0.js"></script>
+ <script src="js/respond-1.4.2.js"></script>
+ <![endif]-->
+ </head>
+ <body onload="filemethod();filemethod2();filemethod3();firsttab();gamepad();emnamecatch('fei');tilt();emcondition('request')">
+ <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="jeol.png" /></a></div>
+ </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">
+ <!-- NAVIGATION -->
+ <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="#" onclick="cngTab('2');FocusTab('mtab2');tabcheck()">Single Particle Analysis</a></li>
+ <!--<li id="mtab3"><a href="#" onclick="FocusTab('mtab3')">Tomography</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 id="mtab6"><a href="#" onclick="FocusTab('mtab6')"></a></li>
+ <li id="mtab7"><a href="#" onclick="FocusTab('mtab7')" >Nav Item7</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="select.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= 'introduce'>
+ <div class="content-block">
+ <div class="container">
+ <div class="row">
+ <div class="col-md-12">
+ <h1>You can control JEOL JEM-2100 from this site.</h1>
+ <p>The JEM-2100 is a multipurpose, 200 kV analytical electron microscope. Variety of versions is provided to adapt user’s purposes. The JEM-2100, which incorporates an integrated PC system for various functions with excellent cost performance, supports research and development in wide scientific fields, for biology to materials researches.
+Excellent LaB6 electron gun promises excellent performance with a reasonable cost.
+Ultrahigh TEM resolution as high as 0.19 nm (in UHR configuration) enables us to perform an observation at atomic resolution.
+STEM (Scanning Transmission Electron Microscope: option) function integrated in PC control system enables us to see a scanning image of a sample at nanometer resolution.
+EDS (Energy Dispersive X-ray Spectrometer) with a 0.28sr of solid angle (in HR configuration with a 50mm2 detector) performs highly sensitive analysis at nanometer resolution.
+Highly stable specimen stage enables us to perform a long term observation and analysis.</p>
+
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ <div id= 'eucentricheightcontents'>
+ <div class="content-block">
+ <div class="container">
+ <div class="row">
+ <div class="col-md-12">
+ <h1>Eucentric Height</h1>
+ </div>
+ </div>
+ <div class="row">
+ <div class="col-md-6">
+ <div id="viewArea">
+ <img class="animatedEntrance" src="http://placehold.it/720x850/21b2eb/058dcd" />
+ </div>
+ </div>
+ <div class="col-md-6">
+ <br>
+ <br>
+ <h2>Control Electron Microscopy</h2>
+ <p>
+ <!--
+ <form name="test">
+ <input type="file" id="exsample" onchange="SaveFileContents()"/>
+ <span id="con"></span><br>
+ <span id="change">/////Value of File/////</span>
+ </form>
+ -->
+ <p>
+ <form name="eucentric" id="eucentricid" action="">
+ <div class="form-group">
+ <label>max tilt</label>
+ <input type="number" name="maxtilt" id="maxtiltid" onchange="SaveFileContents()" onclick="SaveFileContents()">nm
+ </div>
+ </p>
+ <p>
+ <div class="form-group">
+ <label>speed </label>
+
+ <input type="number" name="speed" id="speed" onchange="SaveFileContents()" onclick="SaveFileContents()">nm
+ </div>
+ </p>
+ <p>
+ <div class="form-group">
+ <label>z-shift</label>
+
+ <input type="number" name="zshift" id="zshift" onchange="SaveFileContents()" onclick="SaveFileContents()">nm
+ </div>
+ </p>
+ </form>
+
+ <button type="submit" class="btn btn-default" id="submit" onclick="SaveFileContents()">Start</button>
+
+ <button type="submit" class="btn btn-default" id="submit">Stop</button>
+ <br>
+ <br>
+ <p>
+ <!-- Save condition<br>
+ <form name="save" id="saveid">
+ Condition:<textarea id="text" rows="1" cols="55"></textarea><br>
+ File name:<input id="name" placeholder="mytext">.txt<br>
+ <button onclick="TextSave()" class="btn btn-default">Save</button><br>
+ <a id='DL_link'></a>
+ </form>
+ -->
+ </p>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ <div id='form'>
+ <div class="form-block">
+ <div class="container">
+ <div class="row">
+ <div class="col-md-6 col-sm-6">
+ <img src="http://placehold.it/720x850/21b2eb/058dcd" />
+ </div>
+ <div class="col-md-6 col-sm-6">
+ <form method="post" id="custom_form" name="custom_form">
+ <div class="form-group">
+ <label >Name</label>
+ <input type="text" id="name" name="name" class="form-control">
+ </div>
+ <div class="form-group">
+ <label >Email</label>
+ <input type="text" id="email" name="email" class="form-control" >
+ </div>
+ <div class="form-group">
+ <label >Message</label>
+ <textarea type="text" id="message" name="message" class="form-control"></textarea>
+ </div>
+ <div class="form-group">
+ <label>Captcha (case sensitive)</label>
+ <div id="spambox">
+ <div class="spam"></div>
+ </div>
+ </div>
+ <button type="submit" class="btn btn-default" id="submit">Submit</button>
+ </form>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ <div id= 'singleparticlecontents'>
+ <div class="content-block">
+ <div class="container">
+ <div class="row">
+ <div class="col-md-12">
+ <h1>Single particle analysis</h1>
+ </div>
+ </div>
+ <div class="row">
+ <div class="col-md-6">
+ <div id="viewArea">
+ <!--<img class="animatedEntrance" src="http://placehold.it/720x850/21b2eb/058dcd" />-->
+ <br>
+ <br>
+ <canvas id="canvasOne" width="540" height="605"></canvas>
+ </div>
+ </div>
+ <div class="col-md-6">
+ <!-- <h2>Control Electron Microscopy</h2>-->
+ <p>
+ <form name="test2">
+ <input type="file" id="exsample2" onchange="SaveFileContents()"/>
+ <span id="con2"></span><br>
+ <span id="change2">/////Value of File/////</span>
+ </form>
+ <br>
+ <p>
+ <label>Step1. Search particle</label>
+ </p>
+ Control mode select: <a onclick="switchkey('1');controlmodeselect('key')"><span id="key">Key(ex.↑↓→←,wsad,hjkl)</span></a> <a onclick="switchkey('0');controlmodeselect('formmode')"><span id="formmode">Form</span></a> <a onclick="switchkey('2');controlmodeselect('gamepad')"><span id="gamepad">Gamepad</span></a>
+ <form name="movestage" id="movestageid" action="">
+ <div class="form-group">
+ move x
+ <input type="number" name="movex" id="movex" value="0" onchange="canvasApp()">nm
+ Current x:<span id="currentx"></span>
+ </div>
+ <div class="form-group">
+ move y
+ <input type="number" name="movey" id="movey" value="0" onchange="canvasApp()">nm
+ Current y:<span id="currenty"></span><br><!--<span id=stage></span>-->
+ </div>
+ </form>
+ <p>
+ <label>Step2. Set Focus</label>
+ </p>
+ <form name="moveza" id="moveza" action="">
+ <div class="form-group">
+ move z(keep magnificance)
+
+ <input type="number" name="movez" id="movez" value="0" onchange="canvasApp()">nm<br><br>
+ change current(keep stage)
+
+ <input type="number" name="current" id="current" onchange="objcontrol('obj',current.value);emcondition('request')">% Current lenz:<span id="obj"></span>
+ </div>
+ </form>
+ <p>
+ <label>Step3. Take Photo</label>
+ </p>
+ Use MDS: <input type="radio" name="mdsselect" value="usemds"> Yes <input type="radio" name="mdsselect" value="no"> No
+ <form name="save" id="saveid">
+ Save Photo
+
+ File name:<input id="namephoto" placeholder="myphoto">.tif
+ <button onclick="CanvasSave('canvasOne')" class="btn btn-default">Save</button><br>
+ <a id="DL_link_canvas"></a>
+ </form>
+ <br>
+ <p>
+ <label>Electron Microscopy Condition</label>
+ <!--<input type="button" value="push" onClick="emcondition('request')"></input>--><br>
+ <form name="save" id="saveid">
+ File name:<input id="name1" placeholder="mytext">.txt
+ <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
+ <button onclick="ConditionFileSave()" class="btn btn-default">Save</button>
+ <a id='DL_link_condition'></a>
+ </form>
+ </p>
+ -->
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ <div id= 'tomography'>
+ <div class="content-block">
+ <div class="container">
+ <div class="row">
+ <div class="col-md-12">
+ <h1>Tomography</h1>
+ </div>
+ </div>
+ <div class="row">
+ <div class="col-md-6">
+ <div id="viewArea">
+ <!--<img class="animatedEntrance" src="http://placehold.it/720x850/21b2eb/058dcd" />-->
+ <canvas id="canvastomo" width="540" height="605"></canvas>
+ <div id="condition" style="width:340px; height:250; padding:10px; border:6px outset">
+ TEM:<span id="tem2"></span>
+ Position:<span id="Position2"></span>x=<span id="GonioX2"></span>,y=<span id="GonioY2"></span>,z=<span id="GonioZ2"></span>,a=<span id="GonioA2"></span><br>
+ SpotSizeIndex:<span id="SpotSizeIndex2"></span>
+ Brightness:<span id="MagIndex2"></span>
+ Obj:<span id="Obj2"></span>
+ BeamTiltX:<span id="BeamTiltX2"></span>
+ BeamTiltY:<span id="BeamTiltY2"></span>
+ Speed:<span id="Speed2"></span>
+ </div>
+
+ </div>
+ </div>
+ <div class="col-md-6">
+ <!-- <h2>Control Electron Microscopy</h2>-->
+ <p>
+ <form name="test2">
+ <input type="file" id="exsample" onchange="SaveFileContents()"/>
+ <span id="con"></span><br>
+ <span id="change">/////Value of File/////</span>
+ </form>
+ <br>
+ <p>
+ <label>Step1. Search particle</label>
+ </p>
+ Control mode select: <a onclick="switchkey('1');controlmodeselect('key2')"><span id="key2">Key(ex.↑↓→←,wsad,hjkl)</span></a> <a onclick="switchkey('0');controlmodeselect('formmode2')"><span id="formmode2">Form</span></a> <a onclick="switchkey('2');controlmodeselect('gamepad2')"><span id="gamepad2">Gamepad</span></a>
+ <form name="movestagetomo" id="movestageid" action="">
+ <div class="form-group">
+ move x
+ <input type="number" name="movex" id="movex" value="0" onchange="canvastomo()">nm
+ Current x:<span id="currenttomox"></span>
+ </div>
+ <div class="form-group">
+ move y
+ <input type="number" name="movey" id="movey" value="0" onchange="canvastomo()">nm
+ Current y:<span id="currenttomoy"></span>
+ <br><span id ="stagetomo"></span>
+ </div>
+ </form>
+ <p>
+ <label>Step2. Set Focus</label>
+ </p>
+ <form name="moveztomo" id="moveztomo" action="">
+ <div class="form-group">
+ move z(keep magnification)
+
+ <input type="number" name="movez" id="movez" onchange="canvastomo()" value="0">nm<br>
+ Current z:<span id="currenttomoz"></span>
+ <br><br>
+ change current(keep stage)
+
+ <input type="number" name="currentromo" id="currenttomo" onchange="objcontrol('obj',currenttomo.value);emcondition('request')">%<br>
+ Current lenz:<span id="objtomo"></span>
+ </div>
+ </form>
+ <p>
+ <label>Step3. Setting</label>
+ </p>
+ <form name="setting" id="setting" action="">
+ <div class="form-group">
+ About Tilting :
+ <input type="radio" name="tilting" value="standard" onclick="tilt()" checked="checked"> standard <span id="standard"><input type="number" name="standardnum" id="standardnum" value="0" min="-90" max="90" step="1" style="width:100px;" onchange="canvastomo()">°</span>
+ <input type="radio" name="tilting" value="saxtorn" onclick="tilt()"> saxtorn <span id="saxtorn"><input type="number" name="tiltingnum" id="tiltingnum" value="0" step="1" style="width:100px;" onchange="tilt();canvastomo()">°*cos<span id="angurar">x</span>°</span><br>
+ About tracking :
+ Traccking every <select name="tracking">
+ <option value="1">one sheet</option>
+ <option value="2">two sheets</option>
+ <option value="4">four sheets</option>
+ <option value="8">eight sheets</option>
+ </select>
+ </div>
+ </form>
+ <p>
+ <label>Step3. Take Photo</label>
+ <!-- </p>
+ Use MDS: <input type="radio" name="mdsselect" value="usemds"> Yes <input type="radio" name="mdsselect" value="no"> No-->
+ <form name="save" id="saveid">
+ Save Photo
+
+ File name:<input id="namephoto2" placeholder="myphoto">.tif
+ <button onclick="CanvasSave('canvastomo')" class="btn btn-default">Save</button><br>
+ <a id="DL_link_canvas"></a>
+ </form>
+ <br>
+ <p>
+ <label>Electron Microscopy Condition</label>
+ <!--<input type="button" value="push" onClick="emcondition('request')"></input>--><br>
+ <form name="save" id="saveid">
+ File name:<input id="name" placeholder="mytext">.txt
+ <button onclick="ConditionFileSave()" class="btn btn-default">Save</button>
+ <a id='DL_link_condition'></a>
+ </form>
+
+ </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
+ <button onclick="ConditionFileSave()" class="btn btn-default">Save</button>
+ <a id='DL_link_condition'></a>
+ </form>
+ </p>
+ -->
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ <div id= 'mds'>
+ <div class="content-block">
+ <div class="container">
+ <div class="row">
+ <div class="col-md-12">
+ <h1>Minimum Dose System</h1>
+ </div>
+ </div>
+ <div class="row">
+ <div class="col-md-6">
+ <div id="viewArea">
+ <!--<img class="animatedEntrance" src="http://placehold.it/720x850/21b2eb/058dcd" />-->
+ <br>
+ <br>
+ <canvas id="canvasmds" width="540" height="605"></canvas>
+ </div>
+ </div>
+ <div class="col-md-6">
+ <!-- <h2>Control Electron Microscopy</h2>-->
+ <p>
+ <form name="test3">
+ <input type="file" id="exsample3" onchange="SaveFileContents()"/>
+ <span id="con3"></span><br>
+ <span id="change3">/////Value of File/////</span>
+ </form>
+ <br>
+ <p>
+ <label>Step1. Search particle</label>
+ </p>
+ Control mode select: <a onclick="switchkey('1');controlmodeselect('key3')"><span id="key3">Key(ex.↑↓→←,wsad,hjkl)</span></a> <a onclick="switchkey('0');controlmodeselect('formmode3')"><span id="formmode3">Form</span></a> <a onclick="switchkey('2');controlmodeselect('gamepad3')"><span id="gamepad3">Gamepad</span></a>
+ <form name="movestagemds" id="movestagemds" action="">
+ <div class="form-group">
+ move x
+ <input type="number" name="movex" id="movex" value="0" onchange="canvasmds()">nm
+ Current x:<span id="currentmdsx"></span> shift place <input type="button" onclick="shiftplace()" value="Shift">
+ </div>
+ <div class="form-group">
+ move y
+ <input type="number" name="movey" id="movey" value="0" onchange="canvasmds()">nm
+ Current y:<span id="currentmdsy"></span><br><span id="api"></span><span id="stagemds"></span>
+ </div>
+ </form>
+ <p>
+ <label>Step2. Set Forcus</label>
+ </p>
+ <form name="moveza" id="movezmds" action="">
+ <div class="form-group">
+ move z(keep magnificance)
+
+ <input type="number" name="movez" id="movez" value="0" onchange="canvasmds()">nm<br><br>
+ change current(keep stage)
+
+ <input type="number" name="current" id="current" onchange="objcontrol('obj',current.value);emcondition('request')">% Current lenz:<span id="objmds"></span>
+ </div>
+ </form>
+ <p>
+ <label>Step3. Take Photo</label>
+ </p>
+ replace <input type="button" onclick="replace()" value="replace">
+ <form name="save" id="saveid">
+ Save Photo
+
+ File name:<input id="namephoto" placeholder="myphoto">.tif
+ <button onclick="CanvasSave('canvasmds')" class="btn btn-default">Save</button><br>
+ <a id="DL_link_canvas"></a>
+ </form>
+ <br>
+ <p>
+ <label>Electron Microscopy Condition</label>
+ <!--<input type="button" value="push" onClick="emcondition('request')"></input>--><br>
+ <form name="save" id="saveid">
+ File name:<input id="name" placeholder="mytext">.txt
+ <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="tem3"></span>
+ Position:<span id="Position3"></span>x=<span id="GonioX3"></span>,y=<span id="GonioY3"></span>,z=<span id="GonioZ3"></span>,a=<span id="GonioA3"></span><br>
+ SpotSizeIndex:<span id="SpotSizeIndex3"></span>
+ MagIndex:<span id="MagIndex3"></span>
+ Obj:<span id="Obj3"></span>
+ BeamTiltX:<span id="BeamTiltX3"></span>
+ BeamTiltY:<span id="BeamTiltY3"></span>
+ Speed:<span id="Speed3"></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
+ <button onclick="ConditionFileSave()" class="btn btn-default">Save</button>
+ <a id='DL_link_condition'></a>
+ </form>
+ </p>
+ -->
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ <!-- SCRIPTS -->
+ <script src="JS/jquery-1.7.2.min.js"></script>
+ <script src="JS/bootstrap-3.1.1.min.js"></script>
+ <script src="plugins/backstretch/backstretch-2.0.4.min.js"></script>
+ <script src="plugins/camera-slider/camera-slider-1.3.4.min.js"></script>
+ <script src="plugins/camera-slider/easing-1.3.min.js"></script>
+ <script src="plugins/fancybox/fancybox-1.3.4.pack.js"></script>
+ <script src="plugins/fancybox/klass-1.0.min.js"></script>
+ <script src="plugins/fancybox/photoswipe-3.0.5.min.js"></script>
+ <script src="plugins/hover-animations/transform2d.min.js"></script>
+ <script src="plugins/hover-animations/hover-animations-1.0.min.js"></script>
+ <script src="plugins/match-height/match-height-0.5.1.min.js"></script>
+ <script src="plugins/validation/validation-2.2.min.js"></script>
+ <script src="http://maps.google.com/maps/api/js?sensor=false"></script>
+ <script src="JS/lollies.min.js"></script>
+ <script src="JS/custom.js"></script>
+ </body>
+</html>