// Was die Seite sich über den Neustart hinaus merkt: Reiter, Ansicht,
// der Schalter für gesehene Filme und der Hostmodus. Alles im localStorage,
// alles je Browser.
import { onMounted, onUnmounted, ref, watch } from 'vue'

const TAB_IDS = [
  'netflix', 'canon', 'search', 'aehnlich', 'wheel', 'merkliste', 'watched',
  'wuensche', 'verwaltung', 'stream',
]

function gemerkt(schluessel, standard) {
  const wert = ref(localStorage.getItem(schluessel) ?? standard)
  watch(wert, (neu) => localStorage.setItem(schluessel, neu))
  return wert
}

export function useEinstellungen() {
  // Kompakt zeigt viele Karten nebeneinander, Details dafür mehr je Film
  const ansicht = gemerkt('filmabend_ansicht', 'kompakt')

  // Schon gelaufene Filme stehen beim Aussuchen nur im Weg — ab Werk raus.
  // Wer sie sehen will, schaltet um; das bleibt über den Neustart erhalten.
  const ohneGesehene = ref(localStorage.getItem('filmabend_ohne_gesehene') !== 'aus')
  watch(ohneGesehene, (an) =>
    localStorage.setItem('filmabend_ohne_gesehene', an ? 'an' : 'aus')
  )

  // Nach dem Neuladen soll derselbe Reiter offen sein
  const zuletzt = localStorage.getItem('filmabend_tab')
  const activeTab = ref(TAB_IDS.includes(zuletzt) ? zuletzt : 'netflix')
  watch(activeTab, (id) => localStorage.setItem('filmabend_tab', id))

  // Wer den Abend leitet, darf ziehen und die Runde leeren. Kein Login —
  // die Tastenkombination reicht, die Seite steht ohnehin nur Freunden offen.
  const host = ref(localStorage.getItem('filmabend_host') === '1')

  // Die Verwaltung verschwindet mit dem Hostmodus. Bleibt sie offen, sieht
  // ein Gast sie weiter, ohne dass ein Reiter markiert wäre.
  watch(host, (an) => {
    const weg = an ? 'merkliste' : 'verwaltung'
    if (activeTab.value === weg) activeTab.value = 'netflix'
  })

  function tastatur(e) {
    // e.code statt e.key: mit drei Zusatztasten liefert das Layout sonst
    // je nach System ein anderes Zeichen
    if (e.ctrlKey && e.shiftKey && e.altKey && e.code === 'KeyS') {
      e.preventDefault()
      host.value = !host.value
      localStorage.setItem('filmabend_host', host.value ? '1' : '0')
    }
  }

  onMounted(() => window.addEventListener('keydown', tastatur))
  onUnmounted(() => window.removeEventListener('keydown', tastatur))

  return { ansicht, ohneGesehene, activeTab, host }
}