-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathindex.html
106 lines (96 loc) · 5.74 KB
/
index.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
<!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.0">
<title>Document</title>
<script src="https://d3js.org/d3.v7.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/plotly.js/2.9.0/plotly.min.js"></script>
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css" integrity="sha384-1BmE4kWBq78iYhFldvKuhfTAU6auU8tT94WrHftjDbrCEXSU1oBoqyl2QvZ6jIW3" crossorigin="anonymous">
<link href="https://fonts.googleapis.com/css?family=Ubuntu+Mono" rel="stylesheet">
<link href="css/style.css" rel="stylesheet">
</head>
<body>
<div class="container-fluid">
<div class="row title">
<div class="col-md-2 text-left">
<img src="images/almabe_red.png" style="width:150px;" alt="logo">
</div>
<div class="col-md-8 text-center">
<p class='titleText'>PEL 8024 Test for Oxidizing Liquids (A.21 / O.2)</p>
</div>
</div>
<div class="row" style="margin-top: 10px;">
<div class="col-md-6">
<button type="button" id="button" class="btn btn-primary" onclick="getReader();">CONNECT TO SERIAL</button>
</div>
</div>
<div id="layoutUI" style="display: none;">
<div class="row" style="margin-top: 10px;">
<div class="col-md-6">
<div id="formSwitch" class="form-check form-switch">
<input class="form-check-input" type="checkbox" id="switch">
<label class="form-check-label" for="switch">Data Acquisition</label>
<button type="button" class="btn btn-primary btn-sm myButton" onclick="saveData()">SAVE DATA</button>
<button type="button" class="btn btn-danger btn-sm myButton" onclick="deleteData()">DELETE DATA</button>
</div>
</div>
</div>
<div class="row d-flex justify-content-between" style="margin-top: 10px;">
<div class="col-md-6">
<div class="form-group row">
<label for="inputDate" class="col-sm-2 col-form-label text-right">Date</label>
<div class="col-sm-9">
<input type="text" class="form-control" id="inputDate" placeholder='Date and time at saving' readonly>
</div>
</div>
<div class="form-group row">
<label for="inputAnalyst" class="col-sm-2 col-form-label">Analyst</label>
<div class="col-sm-9">
<input type="text" class="form-control" id="inputAnalyst" placeholder="Analyst Name">
</div>
</div>
<div class="form-group row">
<label for="inputSampleNumber" class="col-sm-2 col-form-label">Sample</label>
<div class="col-sm-9">
<input type="text" class="form-control" id="inputSampleNumber" placeholder="Sample Number">
</div>
</div>
<div class="form-group row">
<label for="inputTInterval" class="col-sm-2 col-form-label text-right">Time Interval</label>
<div class="col-sm-9">
<input type="text" class="form-control" id="inputTInterval" placeholder='Click initial and final times' readonly>
</div>
</div>
<h6 style="margin-top:20px;">Select the Y axis units</h6>
<div class="btn-group" role="group" aria-label="Basic radio toggle button group">
<input type="radio" class="btn-check" name="btnradio" id="btnradio1" autocomplete="off" onclick="selectedUnits='pressure [MPa]';plotPoints(points);" checked>
<label class="btn btn-outline-secondary btn-sm" for="btnradio1">pressure [MPa]</label>
<input type="radio" class="btn-check" name="btnradio" id="btnradio2" autocomplete="off" onclick="selectedUnits='pressure [kPa]';plotPoints(points);">
<label class="btn btn-outline-secondary btn-sm" for="btnradio2">pressure [kPa]</label>
<input type="radio" class="btn-check" name="btnradio" id="btnradio3" autocomplete="off" onclick="selectedUnits='pressure [psi]';plotPoints(points);">
<label class="btn btn-outline-secondary btn-sm" for="btnradio3">pressure [psi]</label>
<input type="radio" class="btn-check" name="btnradio" id="btnradio4" autocomplete="off" onclick="selectedUnits='serial read';plotPoints(points);">
<label class="btn btn-outline-secondary btn-sm" for="btnradio4">serial read</label>
</div>
<div id="formSwitch" class="form-check form-switch">
<input class="form-check-input" type="checkbox" id="switchLimits" onclick="plotPoints(points);">
<label class="form-check-label" for="switchLimits">Show Limits</label>
</div>
</div>
<div class="col-md-6">
<div id="digitDisplay">
</div>
</div>
</div>
<div class="row">
<div id="plotId"></div>
</div>
</div>
</div>
<script src="js/plots.js"></script>
<script src="js/persist.js"></script>
<script src="js/acquisition.js"></script>
</body>
</html>