Codice di programmazione script e PHP visualizzazione valori

Script di richiamo informazioni alfa numeriche all'interno delle aree riservate

 

<div style="width:100%; border:1px solid #ccc; font-family:Arial;">

   <!-- Barra progresso -->
   <div style="width:100%; height:4px; background:#eee;">
       <div id="progress-bar" style="width:0%; height:100%; background:#000;"></div>
   </div>

   <!-- Contenuto dati -->
   <div id="box-dati-txt" style="padding:10px;">
       Caricamento dati...
   </div>

</div>

<script>
(function () {

   const URL_PROXY = "percorso del dominio/proxy.php"; // <-- tuo proxy
   const BOX = document.getElementById("box-dati-txt");
   const BAR = document.getElementById("progress-bar");

   const INTERVALLO = 2000; // 2 secondi
   const STEP = 100; // aggiornamento barra ogni 100ms

   let progresso = 0;

   async function caricaDati() {
       try {
           const response = await fetch(URL_PROXY + "?t=" + new Date().getTime());

           if (!response.ok) throw new Error();

           const testo = await response.text();

           BOX.textContent = testo;

       } catch (e) {
           BOX.textContent = "Errore nel caricamento dati.";
       }
   }

   function avviaBarra() {
       progresso = 0;
       BAR.style.width = "0%";

       const incremento = 100 / (INTERVALLO / STEP);

       const timer = setInterval(() => {
           progresso += incremento;

           if (progresso >= 100) {
               progresso = 100;
               BAR.style.width = "100%";

               clearInterval(timer);

               // Ricarica dati
               caricaDati();

               // Riavvia barra dopo un piccolo delay
               setTimeout(avviaBarra, 300);

           } else {
               BAR.style.width = progresso + "%";
           }

       }, STEP);
   }

   // Primo caricamento immediato
   caricaDati();

   // Avvio ciclo barra + refresh
   avviaBarra();

})();
</script>
 

Codice PHP pubblicato nella cartella PUBLIC per la modifica dei dati contenuti nel file nomefile.txt contenuto nella cartella PUBLIC con permessi di lettura e scrittura
Denominazione: EDITOR.php

 

<?php
$file = "nomefile.txt"; // <-- percorso del tuo file

// SALVATAGGIO
if ($_SERVER["REQUEST_METHOD"] === "POST") {
   if (isset($_POST["contenuto"])) {
       $contenuto = $_POST["contenuto"];

       if (file_put_contents($file, $contenuto) !== false) {
           echo "OK";
       } else {
           echo "ERRORE";
       }
   }
   exit;
}

// LETTURA
if (file_exists($file)) {
   echo file_get_contents($file);
} else {
   echo "";
}
?>

Codice PHP pubblicato per la lettura dei dati finali di lettura

Denominazione: PROXY.php

 

<?php
header("Access-Control-Allow-Origin: *");
header("Content-Type: text/plain; charset=UTF-8");

$url = "percorso del dominio/mamoquest.txt"; // <-- CAMBIA QUI

$contenuto = @file_get_contents($url);

if ($contenuto === FALSE) {
   echo "Errore nel recupero dati";
} else {
   echo $contenuto;
}
?>

Codice script da inserire nella pagina per la lettura con aggiornamento a 2 secondi del contenuto del file nomefile.txt contenuto nella cartella PUBLIC

 

<div style="width:100%; border:1px solid #ccc; font-family:Arial;">

   <!-- Barra progresso -->
   <div style="width:100%; height:4px; background:#eee;">
       <div id="progress-bar" style="width:0%; height:100%; background:#000;"></div>
   </div>

   <!-- Contenuto dati -->
   <div id="box-dati-txt" style="padding:10px;">
       Caricamento dati...
   </div>

</div>

<script>
(function () {

   const URL_PROXY = "percorso del dominio/proxy.php"; // <-- tuo proxy
   const BOX = document.getElementById("box-dati-txt");
   const BAR = document.getElementById("progress-bar");

   const INTERVALLO = 2000; // 2 secondi
   const STEP = 100; // aggiornamento barra ogni 100ms

   let progresso = 0;

   async function caricaDati() {
       try {
           const response = await fetch(URL_PROXY + "?t=" + new Date().getTime());

           if (!response.ok) throw new Error();

           const testo = await response.text();

           BOX.textContent = testo;

       } catch (e) {
           BOX.textContent = "Errore nel caricamento dati.";
       }
   }

   function avviaBarra() {
       progresso = 0;
       BAR.style.width = "0%";

       const incremento = 100 / (INTERVALLO / STEP);

       const timer = setInterval(() => {
           progresso += incremento;

           if (progresso >= 100) {
               progresso = 100;
               BAR.style.width = "100%";

               clearInterval(timer);

               // Ricarica dati
               caricaDati();

               // Riavvia barra dopo un piccolo delay
               setTimeout(avviaBarra, 300);

           } else {
               BAR.style.width = progresso + "%";
           }

       }, STEP);
   }

   // Primo caricamento immediato
   caricaDati();

   // Avvio ciclo barra + refresh
   avviaBarra();

})();
</script>
 

Codice script da inserire nella pagina per la modifica del contenuto del file nomefile.txt contenuto nella cartella PUBLIC

 

<div style="border:0px solid #ccc; padding:0px; font-family:Arial;">

   <textarea id="editor-txt" style="width:80px; height:40px;"></textarea>
   <button id="salva-btn" style="border: 0px solid #ccc; padding:0px cursor:pointer;">
       Salva
   </button>
<br><br>
   <div id="stato" style="margin-top:1px; font-size:12px;"></div>

</div>

<script>
(function () {

   const URL = "percorso del dominio/public/editor.php";
   const AREA = document.getElementById("editor-txt");
   const STATO = document.getElementById("stato");
   const BTN = document.getElementById("salva-btn");

   // CARICA CONTENUTO
   async function carica() {
       try {
           const res = await fetch(URL + "?t=" + Date.now());
           const testo = await res.text();
           AREA.value = testo;
       } catch {
           STATO.textContent = "In attesa nuovo valore...";
       }
   }

   // SALVA CONTENUTO
   async function salva() {
       STATO.textContent = "Salvataggio in corso...";

       try {
           const res = await fetch(URL, {
               method: "POST",
               headers: {
                   "Content-Type": "application/x-www-form-urlencoded"
               },
               body: "contenuto=" + encodeURIComponent(AREA.value)
           });

           const risposta = await res.text();

           if (risposta === "OK") {
               STATO.textContent = "Salvato con successo";
           } else {
               STATO.textContent = "Errore salvataggio";
           }

       } catch {
           STATO.textContent = "Stato Server OK";
       }
   }

   BTN.addEventListener("click", salva);

   // Carica all'avvio
   carica();

})();
</script>
 

Codice script da inserire nella pagina per la modifica del contenuto del campo .txt restituendo un valore modificato in base alla necessità.
Il codice inoltre permette di inserire accanto al valore restituito una freccia in alto di colore verde se il valore è cresciuto, verso il basso se è diminuito di colore rosso e un trattino in grigio se è rimasto uguale.

 

<div style="display:flex; align-items:stretch; border:1px solid #ccc; font-family:Arial; font-size:11px;">

 <!-- Barra laterale -->
 <div style="width:6px; background:#eee;">
   <div id="progress-bar" style="width:100%; height:0%; background:#a5d9fd;"></div>
 </div>

 <!-- Contenuto -->
 <div id="box-dati-txt" style="padding:10px; flex:1;">
   Caricamento dati...
 </div>

</div>

<script>
(function () {

const URL_PROXY = "https://www.mamoweb.it/public/mamoquest/1_chiodo_grande_proxy.php";
const BOX = document.getElementById("box-dati-txt");
const BAR = document.getElementById("progress-bar");

const INTERVALLO = 2000;
const STEP = 50;

/* ================================
  🔧 VALORE MODIFICABILE QUI
  ================================ */
const VALORE_DA_SOMMARE = 10;
/* ================================ */

let progresso = 0;

async function caricaDati() {
 try {
   const response = await fetch(URL_PROXY + "?t=" + new Date().getTime());

   if (!response.ok) throw new Error();

   const testo = await response.text();

   let numero = parseFloat(testo);

   if (isNaN(numero)) {
     BOX.textContent = "Dato non numerico";
     return;
   }

   let risultato = numero + VALORE_DA_SOMMARE;

   // 🔽 LOGICA FRECCE
   let simbolo = "";
   let colore = "";

   if (risultato > numero) {
     simbolo = "▲";
     colore = "green";
   } else if (risultato < numero) {
     simbolo = "▼";
     colore = "red";
   } else {
     simbolo = "—";
     colore = "gray";
   }

   // Output con stile
   BOX.innerHTML = `
     <span>${risultato}</span>
     <span style="color:${colore}; margin-left:6px; font-weight:bold;">
       ${simbolo}
     </span>
   `;

 } catch (e) {
   BOX.textContent = "Errore nel caricamento dati.";
 }
}

function avviaBarra() {
 progresso = 0;
 BAR.style.height = "0%";

 const incremento = 100 / (INTERVALLO / STEP);

 const timer = setInterval(() => {
   progresso += incremento;

   if (progresso >= 100) {
     progresso = 100;
     BAR.style.height = "100%";

     clearInterval(timer);

     caricaDati();

     setTimeout(avviaBarra, 100);

   } else {
     BAR.style.height = progresso + "%";
   }

 }, STEP);
}

// primo caricamento
caricaDati();

// avvia ciclo
avviaBarra();

})();
</script>

parallelamente il file .txt dovrà essere pubblicato nella cartella Public con i permessi di lettura e scrittura. Il file verrà letto e sostituito se modificato mediante il codice PROXY.php