himbeere/open-organism-observer
1
0
Fork 0
Code Issues Pull requests Actions Packages Projects Releases Wiki Activity

see last commit

Browse source
This commit is contained in:
lukas fricke 2025-02-05 14:06:48 +01:00
parent 91a20b5b13
commit 0bf4fd2285
1 changed files with 120 additions and 16 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

124
observe_bact.html
View file

@ -89,35 +89,139 @@
</div>
<div id = "control-elements" class="col-3">
<div class="row">
<div class="col">
<label class = "form-label" for="Bacilli_count">
Bacilli
</label>
</div>
<div class="col">
<input class="form-control" type="number" id="Bacilli_count"
name="Bacilli_count" value=0>
</input>
</div>
</div>
<div class="row">
<div class="col">
<label class = "form-label" for="Cocci_count">
Cocci
</label>
</div>
<div class="col">
<input class="form-control" type="number" id="Cocci_count"
name="Cocci_count" value=0>
</input>
</div>
</div>
<div class="row">
<div class="col">
<label class = "form-label" for="Pathogen_count">
Pathogen
</label>
</div>
<div class="col">
<input class="form-control" type="number" id="Pathogen_count"
name="Pathogen_count" value=0>
</input>
</div>
</div>
<div class="row">
<div class="col">
<label class = "form-label" for="total_area">
Total area
</label>
</div>
<div class="col">
<input class="form-control" type="number" id="total_area"
name="total_area" value=0>
</input>
</div>
</div>
</div>
<div class="row">
<button class="btn btn-primary float-end" onclick="toggleFullscreen();" id="fullscreen-button">toggle Fullscreen video</button>
<button class="btn btn-primary float-end" onclick="do_opencv_magic();">opencv</button>
</div>
</div>
<div id="organisms-table">
<h2> bacteria-candidates </h2>
<h2> Bacteria Candidates </h2>
<table id= "org-table" style="width:100%">
<thead>
<tr>
<th>
bacteria
Number
</th>
<th>
Image
</th>
<th>
Size [um²]
</th>
<th>
Choose a Frame
</th>
<th>
Choose bacterium Type
</th>
</tr>
</thead>
<tbody>
</tbody>
</table>
</div>
</div>
<div class="row">
<button class="btn btn-primary float-end" onclick="toggleFullscreen();" id="fullscreen-button">toggle Fullscreen video</button>
<button class="btn btn-primary float-end" onclick="toggle_cam();">Toggle camera</button>
<button class="btn btn-primary float-end" onclick="do_opencv_magic();">opencv</button>
</div>
</div>
<button class="btn btn-primary float-end" onclick="submit_FoV();">submit FoV</button>
</div>
<div id = "FoV_table_div">
<h2> Fields of View </h2>
<table id= "FoV_table" style="width:100%">
<thead>
<th>
# FoV
</th>
<th>
Bacilli
</th>
<th>
Cocci
</th>
<th>
Pathogens
</th>
<th>
total Volume
</th>
</thead>
<tbody>
</tbody>
</table>
<button class="btn btn-primary float-end" onclick="submit_result();">submit result</button>
</div>
</div>
</body>
<script>
var microscope_setups = {};
var microscope_setup;
var default_setup_id;
var prep_protocols = {};
var prep_protocol;
var default_protocol_id;
var sample;
var samples = {};
var FoVs = [];
var dilution_chooser = document.querySelector("#dilution");
var result = [];
function toggleFullscreen() {
let elem = document.querySelector("#output");
canvas_draw.style.width = video.offsetWidth