<script setup>
import radiomanifest from "@radiomanifest/radiomanifest";
import { useRadioStore } from "../js/store";
const store = useRadioStore();
setTimeout(() => {
  let i = 0;
  for (const url of Object.keys(store.radios)) {
    i++;
    store.startFetchingRadio(url);
    setTimeout(() => {
      radiomanifest.get(url).then((data) => {
        store.updateRadio(url, data);
      });
    }, i * 2000);
  }
}, 100);
</script>
<template>
  <f7-page name="home">
    <!-- Page content-->
    <f7-block-title>Radio</f7-block-title>
    <f7-list>
      <f7-list-item
        v-for="(radio, url) in store.radios"
        :key="radio.name"
        :link="`/radio/${encodeURIComponent(url)}`"
        :title="radio.name"
      />
    </f7-list>
  </f7-page>
</template>
