<script setup="setup">

const { getRandomUUID } = useCrypto()
const { etherFetch } = useEtherpadApi()
const { poskrolaj } = useUi()

const route = useRoute()

const revisionId = ref(null)
const obrazec = ref(null)

revisionId.value = route.params.guid ? route.params.guid : getRandomUUID()

// Ustvari nov, prazen pad
// @TODO parameter za seranje linka?
const resp = await etherFetch('/createPad', {
  padID: revisionId.value,
  text: ''
})

const onZapri = () => { navigateTo(localePath('manifest') + '#skrol') }

onMounted(() => {
  poskrolaj(obrazec.value)
})

</script>

<template>
  <section class="okvir" ref="obrazec">
    <PojemForm
      :pojem="{ nov: true }"
      :revisionId="revisionId"
      :zapriLabel="$t('Nazaj')"
      :onZapri="onZapri" />
  </section>
</template>

<style scoped>
section.okvir {
  max-width: 608px;
}
form.pojem {
  width: 100%;
}
</style>
