import { defineStore } from 'pinia'
import { ref } from 'vue'

export const usePlayerStore = defineStore('player', () => {
  const isPlaying = ref(false)
  const currentTrack = ref(null)
  const currentTrackUrl = ref(null)
  const position = ref(0)
  const duration = ref(0)
  const volume = ref(100)

  function setPlayerState(state) {
    isPlaying.value = state.is_playing
    position.value = state.position
    if (state.current_track_id) {
      currentTrack.value = { id: state.current_track_id }
    }
    if (state.track_url) {
      currentTrackUrl.value = state.track_url
    }
  }

  function setTrack(track, url) {
    currentTrack.value = track
    currentTrackUrl.value = url
    position.value = 0
  }

  function setPosition(pos) {
    position.value = pos
  }

  function setDuration(dur) {
    duration.value = dur
  }

  function setVolume(vol) {
    volume.value = vol
    localStorage.setItem('volume', vol)
  }

  function play() {
    isPlaying.value = true
  }

  function pause() {
    isPlaying.value = false
  }

  // Load saved volume
  const savedVolume = localStorage.getItem('volume')
  if (savedVolume) {
    volume.value = parseInt(savedVolume)
  }

  return {
    isPlaying,
    currentTrack,
    currentTrackUrl,
    position,
    duration,
    volume,
    setPlayerState,
    setTrack,
    setPosition,
    setDuration,
    setVolume,
    play,
    pause,
  }
})