185 lines
5.5 KiB
HTML
185 lines
5.5 KiB
HTML
|
<!DOCTYPE html>
|
|||
|
|
<html lang="en">
|
|||
|
|
<head>
|
|||
|
|
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
|
|||
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|||
|
|
<title>Pélican</title>
|
|||
|
|
<link rel="stylesheet" href="bootstrap.min.css">
|
|||
|
|
<link rel="stylesheet" href="main.css" type="text/css" media="screen">
|
|||
|
|
<script src="jquery-3.6.0.min.js"></script>
|
|||
|
|
<script src="bootstrap.bundle.min.js"></script>
|
|||
|
|
<script>
|
|||
|
|
$(document).ready(function() {
|
|||
|
|
$("#modal1").show();
|
|||
|
|
$("#success").click(function(){
|
|||
|
|
$("#modal1").show();
|
|||
|
|
$.get("/on",function(data) {
|
|||
|
|
<!-- console.log(data); -->
|
|||
|
|
<!-- $("#result").html(data); -->
|
|||
|
|
});
|
|||
|
|
});
|
|||
|
|
|
|||
|
|
$("#send").click(function(){
|
|||
|
|
//event.preventDefault();
|
|||
|
|
console.log($("#alpha").val());
|
|||
|
|
$("#modal1").hide();
|
|||
|
|
$.get("/set?alpha="+$("#alpha").val(),function(data) {
|
|||
|
|
<!-- $("#result").html(data); -->
|
|||
|
|
});
|
|||
|
|
});
|
|||
|
|
|
|||
|
|
|
|||
|
|
$("#Submit").click(function(){
|
|||
|
|
//event.preventDefault()
|
|||
|
|
|
|||
|
|
if (isNaN($('#alpha').val()) == true || !$('#alpha').val()) {
|
|||
|
|
alert('Alpha Haut invalide!');
|
|||
|
|
return;
|
|||
|
|
}
|
|||
|
|
if (isNaN($('#alphaLV').val()) == true || !$('#alphaLV').val()) {
|
|||
|
|
alert('Alpha bas invalide!');
|
|||
|
|
return;
|
|||
|
|
}
|
|||
|
|
if (isNaN($('#beta').val()) == true || !$('#beta').val()) {
|
|||
|
|
alert('beta Haut invalide!');
|
|||
|
|
return;
|
|||
|
|
}
|
|||
|
|
if (isNaN($('#betaLV').val()) == true || !$('#betaLV').val()) {
|
|||
|
|
alert('beta bas invalide!');
|
|||
|
|
return;
|
|||
|
|
}
|
|||
|
|
$('#Run').prop("disabled", false);
|
|||
|
|
$('#volume').prop("disabled", false);
|
|||
|
|
$('#volume').prop("max", $('#selectpip').val());
|
|||
|
|
$('#volume').prop("value", (($('#selectpip').val())/2));
|
|||
|
|
$("#volumemax").text($('#selectpip').val());
|
|||
|
|
|
|||
|
|
|
|||
|
|
if ($('#selectpip').val() == 10 ){
|
|||
|
|
$('#volume').prop("min", 0);
|
|||
|
|
$('#volume').prop("step", 1);
|
|||
|
|
}
|
|||
|
|
if ($('#selectpip').val() == 50 ){
|
|||
|
|
$('#volume').prop("min", 0);
|
|||
|
|
$('#volume').prop("step", 5);
|
|||
|
|
}
|
|||
|
|
if ($('#selectpip').val() == 1000 ){
|
|||
|
|
$('#volume').prop("min", 0);
|
|||
|
|
$('#volume').prop("step", 10);
|
|||
|
|
}
|
|||
|
|
if ($('#selectpip').val() == 200 ){
|
|||
|
|
$('#volume').prop("min", 0);
|
|||
|
|
$('#volume').prop("step", 10);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
});
|
|||
|
|
|
|||
|
|
|
|||
|
|
|
|||
|
|
$("input[name=flexRadioDefault]").change(function () {
|
|||
|
|
$('#selectpip').prop("disabled", false);
|
|||
|
|
$('#selectpip').empty()
|
|||
|
|
$('#selectpip').append('<option selected>Choix de la pipette</option>');
|
|||
|
|
$('#Run').prop("disabled", true);
|
|||
|
|
$('#volume').prop("disabled", true);
|
|||
|
|
|
|||
|
|
if(this.value == "P1")
|
|||
|
|
{
|
|||
|
|
$('#selectpip').append('<option value="10">10µl</option>');
|
|||
|
|
$('#selectpip').append('<option value="50">50µl</option>');
|
|||
|
|
$('#selectpip').append('<option value="200">200µl</option>');
|
|||
|
|
$('#selectpip').append('<option value="1000">1000µl</option>');
|
|||
|
|
}
|
|||
|
|
else if(this.value == "P8")
|
|||
|
|
{
|
|||
|
|
$('#selectpip').append('<option value="10">10µl</option>');
|
|||
|
|
$('#selectpip').append('<option value="200">200µl</option>');
|
|||
|
|
}
|
|||
|
|
});
|
|||
|
|
|
|||
|
|
$("#selectpip").on('change', function() {
|
|||
|
|
$('#Run').prop("disabled", true);
|
|||
|
|
$('#volume').prop("disabled", true);
|
|||
|
|
});
|
|||
|
|
|
|||
|
|
$("#volume").on('input',function () {
|
|||
|
|
if(($("#volume").val()) == 0){
|
|||
|
|
$("#volumevoulu").text("1");
|
|||
|
|
}else{
|
|||
|
|
$("#volumevoulu").text($("#volume").val());
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
});
|
|||
|
|
|
|||
|
|
|
|||
|
|
});
|
|||
|
|
</script>
|
|||
|
|
|
|||
|
|
</head>
|
|||
|
|
<body>
|
|||
|
|
|
|||
|
|
<!-- The Modal -->
|
|||
|
|
<div class="modal" id="modal1">
|
|||
|
|
<div class="modal-dialog modal-xl modal-dialog-centered modal-dialog-scrollable">
|
|||
|
|
<div class="modal-content">
|
|||
|
|
<!-- Modal Header -->
|
|||
|
|
<div class="modal-header">
|
|||
|
|
<img id="logo" src="logo-primadiag.svg">
|
|||
|
|
</div>
|
|||
|
|
<!-- Modal body -->
|
|||
|
|
<div class="modal-body" >
|
|||
|
|
<h6>
|
|||
|
|
<input class="form-check-input" type="radio" name="flexRadioDefault" id="p1" value="P1">
|
|||
|
|
<label class="form-check-label" for="flexRadioDefault1" >
|
|||
|
|
Pipette 1 voie
|
|||
|
|
</label>
|
|||
|
|
</br>
|
|||
|
|
<input class="form-check-input" type="radio" name="flexRadioDefault" value="P8" id="p8">
|
|||
|
|
<label class="form-check-label" for="flexRadioDefault2">
|
|||
|
|
Pipette 8 voie <br>
|
|||
|
|
</label>
|
|||
|
|
</h6>
|
|||
|
|
<h5>
|
|||
|
|
|
|||
|
|
<select id="selectpip" class="form-select" aria-label="Default select example" disabled>
|
|||
|
|
<option selected>Choix de la pipette</option>
|
|||
|
|
</select>
|
|||
|
|
|
|||
|
|
|
|||
|
|
<hr>
|
|||
|
|
|
|||
|
|
<h6>
|
|||
|
|
</br>
|
|||
|
|
<p class="text-center" >α high volume :
|
|||
|
|
<input id="alpha" type="text">
|
|||
|
|
<class="text-center">α low volume :
|
|||
|
|
<input id="alphaLV" type="text">
|
|||
|
|
</p>
|
|||
|
|
<p class="text-center">β high volume :
|
|||
|
|
<input id="beta" type="text">
|
|||
|
|
<class="text-center">β low volume:
|
|||
|
|
<input id="betaLV" type="text"></p>
|
|||
|
|
</br>
|
|||
|
|
</h5>
|
|||
|
|
<div class="d-grid gap-2">
|
|||
|
|
<button id="Submit" type="button" class="btn btn-success btn-lg btn-block"><h5>Submit</h5></button>
|
|||
|
|
</div>
|
|||
|
|
</br>
|
|||
|
|
<hr>
|
|||
|
|
<p class="text-center">Volume voulu</label></p>
|
|||
|
|
<p id="volumemin" class="text-center" >0
|
|||
|
|
<input type="range" class="form-range" id="volume" oninput="this.nextElementSibling.value = this.value" disabled>
|
|||
|
|
<class="text-center" id="volumemax" >1000</p>
|
|||
|
|
<p id="volumevoulu" class="text-center" >0</p>
|
|||
|
|
<div class="d-grid gap-2">
|
|||
|
|
<button id="Run" type="button" class="btn btn-success btn-lg btn-block" disabled><h5> Run </h5></button>
|
|||
|
|
</div>
|
|||
|
|
</br>
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
|
|||
|
|
</body>
|
|||
|
|
</html>
|