
let fileUpload = document.getElementById('dpUploaded');
const preview = document.getElementById('uploadForm');
const allTds = document.querySelectorAll('.tracks_content');
const form = document.querySelector('#tk_mod form');
let html = '';
allTds.forEach(content => {
  content.addEventListener('click',  e => {
    if(e.target.tagName === "BUTTON") {
      tk_mod.style.display = 'block'
      let parent = document.getElementById(e.target.value);
      const bod = parent.querySelector('#body')
      const heading = parent.querySelector('#heading');
      const times = parent.querySelector("#time")
      const dates = parent.querySelector("#date")
      const id = e.target.value
      ds_id.value = id
      ds_bd.value = bod.innerText
      ds_hd.value = heading.innerText;
      ds_tm.value = times.innerText
      ds_dt.value = dates.innerText
   
    }

  })
})

form.addEventListener('submit', async e => {
  e.preventDefault();
  const fd = new FormData;
  fd.append('hd', ds_hd.value);
  fd.append('bdy', ds_bd.value);
  fd.append('tm', ds_tm.value);
  fd.append('dt', ds_dt.value);
  fd.append('id', ds_id.value);

  const req = await fetch('./hist_update.php', {
    method: 'POST',
    header: {'content-type': 'Application/json'},
    body: fd
  })
  const res = await req.json();
  if(res.success) {
    alert('history has been updated');
    tk_mod.style.display = 'none'
  }else {
    alert('history couldn\'t be update');
  }
  console.log('submitted', res)
})
function showPhoto(input) {
    if (input.files && input.files[0]) {
      var reader = new FileReader();
      reader.onload = function (e) {
        $('#preview')
          .attr('src', e.target.result)
          .width(150)
          .height(200);
      };
      reader.readAsDataURL(input.files[0]);
    }
}

function limit(element){
  inputLength = 30;
  if(element.value.length > inputLength) {
    element.value = element.value.substr(0, inputLength);
  }
}
function limit_message(element){
  if(element.value.length >  70) {
    element.value = element.value.substr(0,70);
  }
}



// function get latitude and longitude
async function getCoordinates(){
var address = document.getElementById('address').value;
  var theUrl = "https://geocode.search.hereapi.com/v1/geocode?q=" + address + "&apiKey=u5_my8MFpLk1SHZnZJdbacvYtNBl08v8Dfl9dV7xz0g"
  var xlmHttp = new XMLHttpRequest();
  xlmHttp.open("GET", theUrl, false);
 xlmHttp.send(null);
  var json = JSON.parse(xlmHttp.responseText);
  console.log(json.items[0].position.lat); 
  document.getElementById("lat").value = json.items[0].position.lat;
  document.getElementById("long").value = json.items[0].position.lng;
  
}  
