import { observable, action } from 'xmobx/mobx'
import { VideoPresetProps } from './typings'

class VideoState {
  // meta
  @observable isPlaying = false
  @observable hasBeenPlayedAtLeastOnce = false

  // props
  @observable shouldAutoPlay = false
  @observable hasNativeControls = false
  @observable hasPlayButton = false
  @observable shouldShowVideoInformation = false

  defaultProps = {}

  constructor(props: VideoPresetProps) {
    this.setProps(props)
  }

  @action
  setIsPlaying(isPlaying: boolean) {
    this.isPlaying = isPlaying

    if (this.defaultProps.hasNativeControls === true) {
      if (this.defaultProps.hasPlayButton === false && !isPlaying) {
        this.hasNativeControls = true
      } else {
        this.hasNativeControls = isPlaying
      }
    }

    if (this.defaultProps.hasPlayButton === true) {
      this.hasPlayButton = !isPlaying
    }

    if (this.defaultProps.shouldShowVideoInformation === true) {
      this.shouldShowVideoInformation = !isPlaying
    }
  }

  @action.bound
  toggleIsPlaying() {
    this.setIsPlaying(!this.isPlaying)
  }

  // @action
  setProps(props: VideoPresetProps) {
    // storing user props
    this.defaultProps = props
  }
}

export { VideoState }
export default VideoState