globalThis.renderFns = require '../pug.json'
globalThis.stylFns   = require '../styl.json'

debug.log "000"
document.head.insertAdjacentHTML 'beforeend','<meta charset="UTF-8">'
document.head.insertAdjacentHTML 'beforeend','<meta name="viewport" content="width=device-width, initial-scale=1.0">'

document.head.insertAdjacentHTML('beforeend','<style>'+stylFns['main.css']+'</style>')
document.head.insertAdjacentHTML('beforeend','<style  type="text/tailwindcss">'+stylFns['app/temp.styl']+'</style>')

document.head.insertAdjacentHTML('beforeend','<title> Кохи Борбад - Концертный зал Душанбе</title>')

debug.log "001"
# Маршруты
routes = [
  { path: '/', component: require 'app/pages/Home' }
  { path: '/events', component: require 'app/pages/Events' }
  #{ path: '/about', component: require 'app/pages/About' }
  #{ path: '/contacts', component: require 'app/pages/Contacts' }
]
tailwind.config = require '../tailwind.config.js'
debug.log "002"
# Глобальное состояние темы
app = Vue.createApp
  name: 'app'
  data: ()->
        return  {}
  beforeMount: ()->
        debug.log "start beforeMount"
        globalThis._ = @
  render: (new Function '_ctx', '_cache', renderFns['app/temp.pug'])()
  mounted: ->
    # Предзагрузка темы
    if localStorage.theme == 'dark' || (!('theme' in localStorage) && window.matchMedia('(prefers-color-scheme: dark)').matches)
      @theme = 'dark'
      document.documentElement.classList.add('dark')
    else
      @theme = 'light'
      document.documentElement.classList.remove('dark')
  methods:
    toggleTheme: ->
      @theme = if @theme == 'light' then 'dark' else 'light'
      localStorage.setItem 'theme', @theme
      document.documentElement.classList.toggle 'dark'
      @$emit 'theme-changed', @theme
  components:
      'themetoggle':    require 'app/shared/ThemeToggle'
      'multilevelmenu': require 'app/shared/MultiLevelMenu'
      'imageslider': require 'app/shared/ImageSlider'
app.use(VueRouter.createRouter({
  routes: routes
  history: VueRouter.createWebHistory()
  scrollBehavior: (to, from, savedPosition) ->
    if savedPosition
      return savedPosition
    else
      return { x: 0, y: 0 }
}))


app.mount('body')