const web = new Vue({
  el: '#web',
  data: {
    word: '',
    timer: undefined,
    definitions: null,
    is_word: null
  },
  methods: {
    searchWord: function() {
      if(!this.word) return;
      if(this.timer) {
        clearTimeout(this.timer);
        this.timer = undefined;
      }
      console.log(this.word);
      fetch(`/def?w=${this.word}`)
        .then((response) => {
          this.is_word = response.ok;

          if( response.ok ) {
            response.arrayBuffer().then(res => {
              this.definitions = msgpack.decode(new Uint8Array(res));
              console.log(this.definitions);
            });
          }
      })
    }
  },
  watch: {
    word: function(w) {
      if( w === '' ) {
        this.is_word = null;
      }
      if(this.timer) {
        clearTimeout(this.timer);
        this.timer = undefined;
      }
      this.timer = setTimeout(this.searchWord, 800);
    }
  }
});