Registrazione schermo javascript ma non riesco auploadare al mio sito

Buonasera a tutti,

Ho intenzione con altri utenti del mio sito di creare un flusso video per i miei utenti in javascript e php, con un file in formato webm, però nonostante io riesca a registrare e a scaricare il file localmente nel mio pc, ho bisogno che al termine della registrazione venga inviato automaticamente in javascript al mio sito in una cartella utenti esempio:  ( cartella/utente.webm ).

L'idea è realizzare un loop che giri anche in differita di 60 secondi e sovrascriva sempre lo stesso file continuamente anche se sono consapevole che andando in registrazione perderà 60 secondi per realizzarlo.

Purtroppo riesco solamente ad utilizzare la versione blob e a scaricare solo localmente, vi prego aiutatemi perchè sto impazzendo letteralmente per capire come fare in javascript e non sono esperto di questo linguaggio, ma solo di html e php.

Vorrei un qualcosa di automatizzato con funzione di refresh ogni 60 secondi, che faccia tutto senza pulsanti, mi hanno detto che è qualcosa legato al chunk o all'url del blob, ma non vi so dire.

Mi hanno detto che dovrei utilizzare formdata API in java, ho visto delle guide ma è incomprensibile.

Posto il codice corretto e formattato dal tasto 4.

        <script>
               let preview = document.getElementById("preview");
let recording = document.getElementById("recording");
let startButton = document.getElementById("startButton");
let stopButton = document.getElementById("stopButton");
let downloadButton = document.getElementById("downloadButton");
let logElement = document.getElementById("log");

let recordingTimeMS = 50000;

function log(msg) {
 logElement.innerHTML += msg + "";
}

function wait(delayInMS) {
 return new Promise(resolve => setTimeout(resolve, delayInMS));
}

function startRecording(stream, lengthInMS) {
 let recorder = new MediaRecorder(stream);
 let data = [];

 recorder.ondataavailable = event => data.push(event.data);
 recorder.start();
 log(recorder.state + " for " + (lengthInMS/1000) + " seconds...");

 let stopped = new Promise((resolve, reject) => {
   recorder.onstop = resolve;
   recorder.onerror = event => reject(event.name);
 });

 let recorded = wait(lengthInMS).then(
   () => recorder.state == "recording" && recorder.stop()
 );

 return Promise.all([
   stopped,
   recorded
 ])
 .then(() => data);
}

function stop(stream) {
 stream.getTracks().forEach(track => track.stop());
}

</script>

    <div id="startButton" style="background-color:white;color:white;border-size:1pt;border-color:white;color:white;border:0 px;font-family:Arial;font-size:1px;"onclick="button()" class="button">
  </div>
  <h2></h2>
  <video style="hidden:yes;"  autoplay id="preview" width="160" height="120"></video>
</div>
  <h2></h2>
  <video id="recording"  width="160" height="120" controls></video>
  <a title="Scarica" id="downloadButton" hidden="hidden" href="#" class="button"><button>
   Scarica
  </button>