Untitled

mail@pastecode.io avatar
unknown
html
2 years ago
11 kB
3
Indexable
<!doctype html>
<html>
<head>
<meta charset="UTF-8">
<link href="decorazioneSimply12.css" rel="stylesheet" type"text/css" />
<link rel="icon" type="image/x-icon" href="/appatk/sviluppo/favicon.ico">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.6.0/jquery.min.js"></script>  <!-- intestazioni per app json , css,ajax-->
<link rel="manifest" href="/appatk/sviluppo/manifest.json">
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
<link href="https://cdn.jsdelivr.net/npm/select2@4.0.13/dist/css/select2.min.css" rel="stylesheet" />
<script src="https://cdn.jsdelivr.net/npm/select2@4.0.13/dist/js/select2.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/@popperjs/core@2.9.2/dist/umd/popper.min.js" integrity="sha384-IQsoLXl5PILFhosVNubq5LC7Qb9DXgDA9i+tQ8Zj3iwWAwPtgFTxbJ8NT4GN1R8p" crossorigin="anonymous"></script>
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.0.2/dist/js/bootstrap.min.js" integrity="sha384-cVKIPhGWiC2Al4u+LWgxfKTRIcfu0JTxR+EQDz/bgldoEyl4H0zUF0QKbrJ0EcQF" crossorigin="anonymous"></script>
</head>

    <body onload="load()">
    <p id="immagine"><img src="logo.png" width="70%"> </p>
    <div id="compilazione">    <!-- il div "compilazione contiene tutto cio' che ce nel "form" grigio --> </br>

            <input type="text " id="postazione" name="postazione" placeholder=" inserisci numero postazione"> <br> <br>
            <input type="text " id="postazione2" name="ordine"placeholder=" inserisci numero ordine"><br> <br>

            <select id="selectOptoperazione" >  <br> <br>
            <option id="operator">seleziona il numero dell'operazione</option> <br> <br>
            </select>   <br> <br>

        <input type="text" id="postazione3"   name="operazione"  min="0" >  <!-- qui creo un campo nascosto , grazie all'ajax qui verrà inserito il numerino identificativo dei ogni operatore , è da qui che viene mandato il valore al database , non da selectOpt -->       
        
        
        <select id="selectOpt">   &nbsp &nbsp
        <option id="operator" >seleziona il nome dell'operatore</option> 
        </select>
      

        <input type="text"  id="postazione4"  name="operatore"  min="0" >  <!-- altro campo hidden dove verrà preso il valore numerico-->
        </div>
        </div>
        </div>


        <p id="bottoni">
        <input class="button" type="submit" id="btn_play" name="btn_play" value="play ✅" onclick="play()" > &nbsp &nbsp &nbsp
        <input class="button" type="submit" id="btn_pause" value="pause ⏸" name="btn_pause" onclick="pause()"> &nbsp &nbsp &nbsp  <!-- creazione dei bottoni , assegno a loro la funzione onclick="cambiacolore()" che servirà a cambiare colore , ma anche per effettuare operazioni e nascondere bottoni al momento giusto -->
        <input class="button" type="submit" id="btn_stop" name="btn_stop" value="stop  🔴" onclick="stop()">
        </p>


        <script>
        document.getElementById('btn_pause').disabled=true;
        document.getElementById('btn_stop').disabled=true;

            function trasmissione(){
                var a=postazione.value;
                var o=postazione2.value;
                var op= postazione3.value;
                var oz= postazione4.value;
                var hs=hstart.value;
                var tp=totp.value;
                const verificare=0;
                    
                    const xhttp = new XMLHttpRequest();
                    xhttp.open("GET", "zan.php?a="+a+"&o="+o+"&op="+op+"&oz="+oz+"&st="+st+"&qta="+qta+"&hs="+hs+"&tp="+tp);
                    xhttp.send();
                }
         
           function play(){
        
                window.st="play";
                window.qta=0;
                if(postazione.value!="" && postazione2.value!="" && postazione3.value!="" && postazione4.value!=""){

                var element = document.getElementById("compilazione");
                element.style.borderColor = "#00ff00";
        
                document.getElementById("btn_play").disabled = true;        // prima funzione , btn play ... verifico che non ci siano campi vuoti , se essi non ci sono allora procede con tutte le varie procedure, altrimenti viene aperta una pagina bianca che indicherà all'utente di reinserire il valore nei campi
                document.getElementById("btn_pause").disabled = false;
                   
                document.getElementById('postazione').readOnly = true;
                document.getElementById('postazione2').readOnly = true;
                document.getElementById('selectOpt').disabled = true;
                document.getElementById('selectOptoperazione').disabled = true;
                document.getElementById("btn_stop").disabled = false;
                   
    
                    var ip=tip.value;
                    var operatore=postazione4.value;
                    if(ip==0){
                        var m = new Date();
                        var hstart = 
                
                        ("0" + (m.getUTCHours()+2)).slice(-2) + ":" +
                        ("0" + m.getUTCMinutes()).slice(-2) + ":" +
                        ("0" + m.getUTCSeconds()).slice(-2);
                         document.getElementById('hstart').value=hstart;
                   
                    
                
                        }

                    else if(ip!==0){
                        var tpausa=parseFloat(document.getElementById('totp').value);
                        var fpausa=parseFloat((Math.round((Date.now()-tip.value)/6000)/10));
                        tpausa=tpausa+fpausa;
                        totp.value=tpausa;
                         }
                        ip.value=document.getElementById('tip').value="play";
                             }
                                trasmissione();
                        }
               
               
                function pause(){
                window.st="pause";
                window.qta=0;
                var element = document.getElementById("compilazione");
                element.style.borderColor ="#ffc426";
                    document.getElementById("btn_play").disabled = false;
                    document.getElementById("btn_pause").disabled = true;
                    document.getElementById("btn_stop").disabled = false;
      
                    document.getElementById('postazione').readOnly = true;
                    document.getElementById('postazione2').readOnly = true;
                    document.getElementById('selectOpt').disabled = true;
                    document.getElementById('selectOptoperazione').disabled = true;
        

       //calcolo l'ora d'inizio di pausa  
                    var now=new Date();
                    var seconds = now.getSeconds();
                    var minutes = now.getMinutes();
                    var hour = now.getHours();
                    var tip=document.getElementById('tip').value =Date.now();
                    trasmissione();
                                     }



                        function stop(){
                        window.st="stop";
                         
                         window.qta=prompt("inserisci la quantita",0);
                        if (qta === null) {
                                return;
                                            }

                   while(qta==0){
                    alert('campi non validi');
                    qta = prompt('inserisci la quantità');
                        }

                           
        var element = document.getElementById("compilazione");

        element.style.borderColor ="#fe0000";
        document.getElementById('selectOpt').disabled = true;
        document.getElementById('selectOptoperazione').disabled = true;
        document.getElementById("btn_play").disabled = false;
        document.getElementById("btn_pause").disabled = true;
        document.getElementById("btn_stop").disabled = true;


                        if(tip.value!="play") {var tpausa=parseFloat(document.getElementById('totp').value);
                        var fpausa=parseFloat((Math.round((Date.now()-tip.value)/6000)/10));
                        tpausa=tpausa+fpausa;
                        totp.value=tpausa;
                        
 }

                    
                    trasmissione();
                      
                        tip.value=0;
                        postazione.value="";
                        postazione2.value="";
                        selectOpt.value="";
                        selectOptoperazione.value="";
                      
                                         }



                                         function load() {
            const xmlhttp = new XMLHttpRequest();
            xmlhttp.onload = function() {
            document.getElementById("selectOptoperazione").innerHTML = this.responseText;
           
            
              }
              xmlhttp.open("GET", "loadselect.php");
            xmlhttp.send();
           load2();
           
        }

        function load2(){
            const xmlhttp = new XMLHttpRequest();
            xmlhttp.onload = function() {
            document.getElementById("selectOpt").innerHTML = this.responseText;
           
            
              }
              xmlhttp.open("GET", "loadselect2.php");
            xmlhttp.send();

           

        }
                                        
  
                    $(document).ready(function() {        //eseguo scambio value tra select e form , cosi' riesco a prelevarlo e assegnare valore alle variabili
                
                $("#selectOpt").change(function() {

                    $("#postazione4").val($('#selectOpt option:selected').val());
                                                    });

                                                    });
                $(document).ready(function() {
                $("#selectOptoperazione").change(function() {
                $("#postazione3").val($('#selectOptoperazione option:selected').val());
                            });
                                }); 


                                $(document).ready(function () {
            //change selectboxes to selectize mode to be searchable
   $("select").select2();
});
</script>


















<input type ="text" id="hstart" value="0" hidden="hidden">
<input type ="text" id="tip" value="0" hidden="hidden">
<input type ="text"id="totp" name="totp" value="0" hidden="hidden">




</body>
</html>