mirror of
https://github.com/goonstation/goonstation-2016.git
synced 2026-07-13 01:52:21 +01:00
Tobba
259 lines
11 KiB
HTML
259 lines
11 KiB
HTML
<!DOCTYPE html>
|
|
<html>
|
|
<head>
|
|
<title>Pathogen Manipulator</title>
|
|
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />
|
|
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
|
|
<script src="{{resource("js/jquery.min.js")}}" type="text/javascript"></script>
|
|
<!--<script src="./json2.min.js" type="text/javascript"></script>-->
|
|
<script src="{{resource("js/pathology_display.js")}}" type="text/javascript"></script>
|
|
<script src="{{resource("js/pathoui-script.js")}}" type="text/javascript"></script>
|
|
<link href="{{resource("css/pathoui.css")}}" rel="stylesheet" type="text/css"></link>
|
|
</head>
|
|
|
|
<body>
|
|
<div class="mainContent">
|
|
<!--Displays information about the currently loaded pathogen-->
|
|
<div id="loadedPathogen">
|
|
<div class="noborder">
|
|
<span class="label">DNA Load Status: </span>
|
|
<div class="annunciator a-green" id="annDNALoad">
|
|
LOAD
|
|
</div>
|
|
<div class="annunciator a-red" id="annDNANoLoad">
|
|
NO LOAD
|
|
</div>
|
|
<div class="annunciator a-yellow" id="annDNASplice">
|
|
SPLICE
|
|
</div>
|
|
<span class="label">Pathogen: </span>
|
|
<div class="text-field tf-med" id="txtPName">G68P68</div>
|
|
<div class="text-field tf-med" id="txtPType">(fungus)</div>
|
|
|
|
</div>
|
|
<div class="noborder">
|
|
<span class="label">Slot: </span>
|
|
<div class="text-field tf-narrow" id="txtExpSlot">1</div>
|
|
<div class="annunciator a-yellow" id="annSlotExp">EXPOSED</div>
|
|
<div class="annunciator a-green" id="annSlotSample">SAMPLE</div>
|
|
<div class="button btn-small" id="btnCloseSlot">Close</div>
|
|
<div class="button btn-small" id="btnEjectSample">Eject</div>
|
|
</div>
|
|
<div class="noborder">
|
|
<span class="label">DNA Seq: </span><br>
|
|
<div class="text-field tf-long" id="txtPSeq">
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<!--Displays the currently selected page-->
|
|
<div class="dataDisplay">
|
|
<div class="dataPage" id="dpManip">
|
|
<h1>DNA Manipulator</h1>
|
|
<div id="manipHolder">
|
|
<div class="narrow-border extrapad">
|
|
<span class="label lb-long">Status:</span>
|
|
<div class="annunciator a-green" id="aMutRdy">READY</div>
|
|
<div class="annunciator a-yellow" id="aMutIrr">RAD</div>
|
|
<div class="annunciator a-green" id="aMutAck">PASS</div>
|
|
<span class="label lb-long"></span>
|
|
<div class="annunciator a-red" id="aMutOpen">EXPOSED</div>
|
|
<div class="annunciator a-red" id="aMutSample">SAMPLE</div>
|
|
<div class="annunciator a-red" id="aMutNack">FAIL</div>
|
|
</div>
|
|
|
|
<table>
|
|
<tr>
|
|
<td><span class="label lb-long">Mutativeness:</span></td>
|
|
<td><div class="button btn-tiny" data-tsk="mut=-1">-</div></td>
|
|
<td><div class="text-field tf-narrow" id="txtMut"></div></td>
|
|
<td><div class="button btn-tiny" data-tsk="mut=1">+</div></td>
|
|
</tr>
|
|
<tr>
|
|
<td><span class="label lb-long">Mutation Speed:</span></td>
|
|
<td><div class="button btn-tiny" data-tsk="mts=-1">-</div></td>
|
|
<td><div class="text-field tf-narrow" id="txtMts"></div></td>
|
|
<td><div class="button btn-tiny" data-tsk="mts=1">+</div></td>
|
|
</tr>
|
|
<tr>
|
|
<td><span class="label lb-long">Advance Speed:</span></td>
|
|
<td><div class="button btn-tiny" data-tsk="adv=-1">-</div></td>
|
|
<td><div class="text-field tf-narrow" id="txtAdv"></div></td>
|
|
<td><div class="button btn-tiny" data-tsk="adv=1">+</div></td>
|
|
</tr>
|
|
<tr>
|
|
<td><span class="label lb-long">Maliciousness:</span></td>
|
|
<td><div class="button btn-tiny" data-tsk="mal=-1">-</div></td>
|
|
<td><div class="text-field tf-narrow" id="txtMal"></div></td>
|
|
<td><div class="button btn-tiny" data-tsk="mal=1">+</div></td>
|
|
</tr>
|
|
<tr>
|
|
<td><span class="label lb-long">Suppression Threshold:</span></td>
|
|
<td><div class="button btn-tiny" data-tsk="sth=-1">-</div></td>
|
|
<td><div class="text-field tf-narrow" id="txtSth"></div></td>
|
|
<td><div class="button btn-tiny" data-tsk="sth=1">+</div></td>
|
|
</tr>
|
|
|
|
</table>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="dataPage" id="dpSplice1">
|
|
<h1>Select splice target</h1>
|
|
<span class='label lb-slong'>The loaded DNA will be modified during this session.</span>
|
|
<div class='noborder splice-selection'>
|
|
<div class='noborder slot-holder' id='spliceSlots'>
|
|
|
|
</div>
|
|
<div class='narrow-border button-holder' id='spliceButtons'>
|
|
<div class='annunciator a-red' id='annSpliceStatExp'>EXPOSED</div>
|
|
<div class='annunciator a-green' id="annSpliceStatSource">SOURCE</div>
|
|
<div class='annunciator a-green' id="annSpliceStatTarget">TARGET</div>
|
|
<hr>
|
|
<div class='button' id='btnSpliceBegin'>Begin<BR>Splice</div>
|
|
<div class='button' id='btnSpliceCancel'>Cancel<BR>Splice</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="dataPage" id="dpSplice2">
|
|
<h1>Splicing Session</h1>
|
|
<div class="noborder splice-selection">
|
|
<!--DATA HOLDER-->
|
|
<div class="noborder" id="spliceData">
|
|
<div class="extrapad button-holder prediction-holder">
|
|
<span class="label lb-long">Predictive Effectiveness:</span>
|
|
<div class="text-field tf-med txtPredEffect"></div>
|
|
<div class="button btn-med display-known">Sequences</div>
|
|
</div>
|
|
<div class='extrapad splice-sequence' id='spliceTargetField'>
|
|
<span class="label lb-long">Target sequence:</span>
|
|
<div class='text-field tf-long' id='txtSpliceTarget'></div>
|
|
<div class='button btn-small btn-seq-off' dir=-1>-</div>
|
|
<div class='button btn-small btn-seq-off' dir=1>+</div>
|
|
<span class="label">Status:</span>
|
|
<div class="annunciator a-red" id='annSpliceTargetEmpty'>EMPTY</div>
|
|
</div>
|
|
<div class='button-holder extrapad splice-controls' id='spliceActions'>
|
|
<span class="label lb-elong">Splice actions:</span>
|
|
<div class="button btn-small" dir=-1>Before</div>
|
|
<div class="button btn-small" dir=1>After</div>
|
|
<div class="button btn-small" dir=0>Remove</div>
|
|
|
|
</div>
|
|
<div class='extrapad splice-sequence' id='spliceSourceField'>
|
|
<span class="label lb-long">Source sequence:</span>
|
|
<div class='text-field tf-long' id='txtSpliceSource'></div>
|
|
<div class='button btn-small btn-seq-off' dir=-1>-</div>
|
|
<div class='button btn-small btn-seq-off' dir=1>+</div>
|
|
<span class='label'>Status:</span>
|
|
<div class="annunciator a-red" id='annSpliceSourceEmpty'>EMPTY</div>
|
|
</div>
|
|
</div>
|
|
<!--FINALIZING BUTTONS-->
|
|
<div class="button-holder extrapad" id="spliceFinalButtons">
|
|
<span class="label lb-med">Splice status:</span>
|
|
<div class='annunciator a-green' id='annSpliceSuccess'>SUCCESS</div>
|
|
<div class='annunciator a-red' id='annSpliceFail'>FAIL</div>
|
|
<span class="label">Prediction:</span>
|
|
<div class='annunciator a-green' id='annPredSuccess'>SUCCESS</div>
|
|
<div class='annunciator a-yellow' id='annPredUnk'>UNKNOWN</div>
|
|
<div class='annunciator a-red' id='annPredFail'>FAIL</div>
|
|
<hr>
|
|
<div class="button" id='btnSpliceFinish'>Finish Splicing</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="dataPage" id="dpTester">
|
|
<h1>DNA Stability Analyzer</h1>
|
|
<div class= "noborder" id="analyzerHolder">
|
|
<!--SHOWING PREDICTIVE EFFECTIVENESS-->
|
|
<div class="narrow-border extrapad button-holder" id="predictionHolder">
|
|
<span class="label lb-long">Predictive Effectiveness:</span>
|
|
<div class="text-field tf-med txtPredEffect"></div>
|
|
<div class="button btn-med display-known">Sequences</div>
|
|
</div>
|
|
<!--HOLDING BOTH ANALYSIS BUFFERS (current / previous) -->
|
|
<div class="noborder extramargin">
|
|
<div class="narrow-border analysis-buffer extrapad" id="currAnalysis">
|
|
<span class="label lb-long block">Current analysis:</span>
|
|
<div class="text-field tf-enarrow" id="currAnalysis0"></div>
|
|
<div class="text-field tf-enarrow" id="currAnalysis1"></div>
|
|
<div class="text-field tf-enarrow" id="currAnalysis2"></div>
|
|
<div class="text-field tf-enarrow" id="currAnalysis3"></div>
|
|
<div class="text-field tf-enarrow" id="currAnalysis4"></div>
|
|
<div class="button btn-tinyish" id="btnClrAnalysisCurr">CLR</div>
|
|
</div>
|
|
<div class="narrow-border analysis-buffer extrapad" id="prevAnalysis">
|
|
<span class="label lb-long block">Previous analysis:</span>
|
|
<div class="text-field tf-enarrow" id="prevAnalysis0"></div>
|
|
<div class="text-field tf-enarrow" id="prevAnalysis1"></div>
|
|
<div class="text-field tf-enarrow" id="prevAnalysis2"></div>
|
|
<div class="text-field tf-enarrow" id="prevAnalysis3"></div>
|
|
<div class="text-field tf-enarrow" id="prevAnalysis4"></div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="noborder extramargin">
|
|
|
|
<div class="extrapad button-holder" id="analyzeComponents">
|
|
</div>
|
|
|
|
<div class="narrow-border extrapad" id="analyzeResults">
|
|
<span class="label">Stable:</span>
|
|
<div class="annunciator a-green" id="annStableYes">YES</div>
|
|
<div class="annunciator a-red" id="annStableNo">NO</div>
|
|
<span class="label">Transient:</span>
|
|
<div class="annunciator a-green" id="annTransYes">YES</div>
|
|
<div class="annunciator a-red" id="annTransNo">NO</div>
|
|
<hr>
|
|
<span class="label">Error:</span>
|
|
<div class="annunciator a-red" id="annErrBuffer">BUFFER</div>
|
|
<div class="annunciator a-red" id="annErrNack">NACK</div>
|
|
<span class="label"></span>
|
|
<div class="annunciator a-yellow" id="annErrSample">SAMPLE</div>
|
|
<div class="annunciator a-yellow" id="annErrData">T. DATA</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="button btn-long" id="btnAnalysisLoad">Load Sample & Clear Buffer</div>
|
|
<div class="button btn-long" id="btnAnalysisDoTest">Test DNA</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="dataPage" id="dpLoadSave">
|
|
<h1>Load / Save DNA</h1>
|
|
<div class="noborder slot-holder" id="dnaSlotHolder">
|
|
|
|
</div>
|
|
</div>
|
|
|
|
<div class="dataPage" id="dpWelcome">
|
|
<h1>Welcome to the Path-o-matic 2000</h1>
|
|
<span>The leading market solution for pathology research.</span>
|
|
<span>This device is capable of the following:</span>
|
|
<ul>
|
|
<li>DNA Sequence Verification</li>
|
|
<li>DNA Sequence Splicing</li>
|
|
<li>DNA Trait Segment Manipulation</li>
|
|
<li>Predictive Stability Analysis</li>
|
|
<li>Pathogen Sample Identification</li>
|
|
</ul>
|
|
</div>
|
|
|
|
</div>
|
|
|
|
<!--The main menu, used for scrolling through the pages-->
|
|
<div id="mainMenu">
|
|
<div class="button" id="btnRetMain">Main Screen</div>
|
|
<div class="button" id="btnManip">Manipulate</div>
|
|
<div class="button" id="btnSplice">Splice</div>
|
|
<div class="button" id="btnTester">DNA Analyzer</div>
|
|
<div class="button" id="btnLoadSave">Load / Save DNA</div>
|
|
|
|
<div class="annunciator a-yellow" id="annSynch">SYNCH</div>
|
|
</div>
|
|
|
|
</div>
|
|
</body>
|
|
</html> |