import types from '../mutation-types'
// import { mapGetters, mapActions, mapState } from 'vuex'
import socket from '../../scripts/socket'

// initial state
const state = {
  currentSongIndex: 0,
  currentSong: {
    originalName: null,
    fileName: null
  },
  songCount: 0,
  duration: 0,
  position: 0,
  vumeter: {
    left: 0,
    right: 0
  },
  playerState: false,
  playListFinished: false,
  progressBar: {
    max: 0,
    value: 0
  },
  supportsWebPlayer: true,
  webPlayerName: 'announces'
}

// getters
const getters = {
  // ...mapGetters(['options.schedules'])
}

// actions
const actions = {
  getStatus({ commit, state }) {
    socket.emit(`${types.announces.namespace}/${types.announces.events.getStatus}`)
  },

  getWebMediaPlayerStatus({ commit, state }) {
    socket.emit(`${types.announces.namespace}/${types.announces.events.getWebMediaPlayerStatus}`)
  }
}

const mutations = {
  [types.announces.events.getWebMediaPlayerStatus](state, data) {
    let fileSrc = '';
    if (data.src) {
      fileSrc = 'announces/' + data.src;
    }

    let mediaPlayerEventData = {
      key: state.webPlayerName,
      src: fileSrc,
      songName: data.songName,
      isPlaying: data.isPlaying,
      position: data.position
    }
    window.app.$emit('mediaPlayer.addNewPlayer', mediaPlayerEventData)
  },

  [types.announces.events.songChanged](state, data) {
    state.currentSong.originalName = data.originalName
    state.currentSong.fileName = data.fileName
    state.songCount = data.totalFiles
    state.currentSongIndex = data.filePosition
    // Emit to mediaPlayer.changeSong    
    let mediaPlayerEventData = {
      key: state.webPlayerName,
      src: 'announces/' + data.fileName,
      songName: data.originalName
    };
    window.app.$emit('mediaPlayer.changeSong', mediaPlayerEventData)
  },

  [types.announces.events.positionChanged](state, data) {
    state.position = data.position
    state.duration = data.duration
    state.progressBar.max = data.duration
    state.progressBar.value = data.position
    // Emit to mediaPlayer.changePosition
    let mediaPlayerEventData = {
      key: state.webPlayerName,
      position: data.position
    }
    window.app.$emit('mediaPlayer.changePosition', mediaPlayerEventData)
  },

  [types.announces.events.vumeterChanged](state, data) {
    state.vumeter.left = data.left
    state.vumeter.right = data.right
  },

  [types.announces.events.stateChange](state, data) {
    state.playerState = data
  },

  [types.announces.events.announceStarted](state) {
    state.playerState = true
    // Emit to mediaPlayer.changeState
    let mediaPlayerEventData = {
      key: state.webPlayerName,
      isPlaying: true
    }
    window.app.$emit('mediaPlayer.changeState', mediaPlayerEventData)
  },

  [types.announces.events.announceFinished](state) {
    state.playerState = false
    // Cleaning data of the announnce finished after
    state.progressBar.value = 0
    state.currentSong.fileName = ''
    state.currentSong.originalName = ''
    state.currentSongIndex = 0
    state.songCount = 0
    state.duration = '00:00'
    state.position = '00:00'

    // Emit to mediaPlayer.changeState
    let mediaPlayerEventData = {
      key: state.webPlayerName,
      isPlaying: false
    }
    window.app.$emit('mediaPlayer.changeState', mediaPlayerEventData)
  }

  // [types.announces.events.playListFinished] (state, data) {
  //   state.currentSongIndex = 0
  //   state.currentSong.originalName = null
  //   state.currentSong.fileName = null
  //   state.songCount = 0
  //   state.duration = '00:00'
  //   state.position = '00:00'
  //   state.vumeter.left = 0
  //   state.vumeter.right = 0
  //   state.playerState = false
  //   state.playListFinished = true
  // }
}

export default {
  namespaced: true,
  state,
  getters,
  actions,
  mutations
}
