addEventListener('DOMContentLoaded', _ => {

  var fmt2 = n => ('0'+n).slice(-2),
    tElem = document.getElementById('timeline'),
    dElem = document.getElementById('dateline'),
    sElem = document.getElementById('status'),
    upd = function() {
      var now = new Date()
      tElem.textContent = [now.getHours(), now.getMinutes(), now.getSeconds()].map(fmt2).join(':')
      dElem.textContent = [now.getFullYear()].concat([now.getMonth()+1, now.getDate()].map(fmt2)).join('-')
      setTimeout(upd, 1000)
    }, runSync = function() {
      sElem.textContent = 'Connecting...'
      RCVD.disconnect()
      RCVD.connect().then(mode => {
        var model = RCVD.getModel()
        console.log('Main setting mode:', mode)
        sElem.textContent = 'Syncing ' + model
        RCVD.sync().then(_ => {
          sElem.textContent = model + ' synced'
          RCVD.disconnect()
        }).catch(e => {console.error(e)})
      }).catch(e => {
        sElem.textContent = 'Failed, please retry!'
        console.error(e)
      })
    }

  addEventListener('keydown', e => {
    if(e.key === 'MicrophoneToggle')
      e.preventDefault()
    else if(e.key === 'Enter') {
      e.preventDefault()
      e.stopPropagation()
      runSync()
    }
  })

  addEventListener('click', e => {
    if(e.target.id === 'syncbtn') {
      e.preventDefault()
      runSync()
    }
  })

  upd()
})