import paperMixin from './mx-paper-mixin'

export default {
  mixins:[paperMixin],
  mounted() {
    this.$el.focus()
  },
  methods: {

    shortcutGoNext() {
      if (this.isUserInputting()) return
      if (this.isDialogVisible()) return
      if (this.allowAnswer) {
        if (this.eventIsQuestionLocalFinished(this.currentQuestion)) {
          if (this.hasNext) {
            this.forceBlur()
            this.goNextAction()
          } else {
            this.triggerAutoCommitQuestion()
          }
        } else {
          let input = document.getElementsByTagName('textarea')
          if (!input?.length) return
          input = input[0]
          input.focus()
          input.scrollIntoView()
        }
      } else if (this.allowScore) {
        if (this.isUserScoring()) {
          if (this.currentQuestion._score == null) return
          this.forceBlur()
          this.eventScoreQuestion(this.currentQuestionOptions)
        } else {
          this.forceBlur()
          this.goNextAction()
        }
      } else if (this.hasNext) {
        this.forceBlur()
        this.goNextAction()
      }
    },
    shortcutGoPrev() {
      if (this.isUserInputting()) return
      if (this.isUserScoring()) return
      if (this.isDialogVisible()) return
      if (this.hasPrevious) {
        this.forceBlur()
        this.goPreviousAction()
      }
    },
    isUserInputting() {
      const ele = document.activeElement
      if (!ele) return false
      return ele.localName === 'textarea'
    },
    isUserScoring() {
      const ele = document.activeElement
      if (!ele) return false
      return ele.localName === 'input' && ele.type == 'text' && ele.className.startsWith('el-input__inner')
    },
    isDialogVisible() {
      const dialogs = document.getElementsByClassName('el-dialog__wrapper')
      for (let idx = 0; idx < dialogs.length; idx++) {
        const ele = dialogs[idx]
        if (ele.style.display != 'none' &&
          getComputedStyle(ele).visibility == 'visible') {
          console.log('getComputedStyle', ele)
          return true
        }
      }
      return false
    }
  }
}
