const { createApp } = Vue
createApp({
  data() {
    return {
      message: 'Hello Vue!',
      //state: 'undefined',
      heartbeat: false,
      states: {},
    }
  },
  methods: {
    heartbeatActive: function (index) {
      if (index == this.heartbeat) {
        return 'active';
      }
      return '';
    },
    statusblockClosed: function (index) {
      if (this.states[index].closed == true) {
        return 'closed';
      }
      return '';
    },
    update: function () {
      axios.post('/status', {
        heartbeat: this.heartbeat,
      })
      .then((response) => {
        // handle success
        //this.state = response.data.state;
        this.heartbeat = response.data.heartbeat;
        let states = response.data.states
        //for (var key in states) {
        //  if (!states[key]['date']) {
        //    continue;
        //  }
        //  let date = new Date(states[key]['date']);
        //  states[key]['date'] = date;
        //}
        this.states = states;

        console.debug(response.data.states);
        //console.log(response.data);
      })
      .catch(function (error) {
        // handle error
        console.log(error);
      })
      .finally(function () {
        // always executed
      });
    },
  },
  mounted: function() {
    this.update();
    setInterval(() => {
      this.update();
    }, 2000);
  }
}).mount('#app')