import { defineComponent, ref, onMounted, watch, computed } from 'vue'

import { useGlobalStore } from '@store/globalStore'
import { useRoute } from 'vue-router'
import { useUserStore } from '@store/UserStore'

import { Logo } from '@/components/logo'

import { LandingFooter } from '@/components/LandingFooter'
import { CMyPageElem } from '@/components/CMyPageElem/index'

import { tools } from '@src/store/Modules/tools'
import { static_data } from '@src/db/static_data'
import { toolsext } from '@src/store/Modules/toolsext'
import { Screen } from 'quasar'
import { CCardCarousel, CEventsCalendar, CMyElem, COpenStreetMap } from '@components'
import MixinBase from '@src/mixins/mixin-base'
import { firstimagehome } from '@src/db/static_data'
import MixinMetaTags from '@/mixins/mixin-metatags'

export default defineComponent({
  name: 'home_kolibrilab',
  components: { Logo, LandingFooter, CMyPageElem, CMyElem },

  setup() {
    const userStore = useUserStore()
    const globalStore = useGlobalStore()

    const { setmeta } = MixinMetaTags()

    const { setValDb, getValDb } = MixinBase()

    function getheightgallery() {
      if (tools.isMobile())
        return '400px'
      else
        return '600px'
    }

    function created() {
      //
    }

    created()

    return {
      tools,
      toolsext,
      static_data,
      getheightgallery,
      getValDb,
      globalStore,
      setmeta,
    }
  },
})