function displayImage(list,domelem,delay){
console.log("next image:")
 let file = list.splice(0,1)[0]//pop first

 if(file === undefined){
  console.log("done")
 document.getElementById("mainImage").style.display="none"
 document.getElementById("config").style.display="block"
 }
 else{ 
  console.log(file)
  let reader = new FileReader();  
  reader.onload = function(event) {
    domelem.src=event.target.result
    setTimeout(displayImage,delay,list,domelem,delay)
  }
  reader.readAsDataURL(file);

  
 }

}

Date.prototype.addHours= function(h){
    this.setHours(this.getHours()+h);
    return this;
}

//set current date
document.getElementById('datePicker').defaultValue = (new Date).addHours(1).toISOString().slice(0,-5);

document.getElementById("filePicker").onchange=function(){
 //files = Array.from(document.getElementById("fileInput").files)
 //fl.forEach((file)=>{console.log(file.name)})

 let files=Array.from(this.files);
 let names= files.map(file => file.name)
 document.getElementById("fileNames").innerText = "filenames:\n"+names.join("\n")
 console.log(names)

};


document.getElementById("startButton").onclick=function(){
console.log("starting")
let dateInput = document.getElementById("datePicker")
console.log("date valid:"+dateInput.checkValidity())
console.log(dateInput.value)

document.getElementById("mainImage").style.display="block"
document.getElementById("config").style.display="none"

let list = Array.from(document.getElementById("filePicker").files)
let img = document.getElementById("mainImage")
let delay = document.getElementById("delayPicker").value
setTimeout(displayImage,100,list,img,delay)

};