<script lang="ts">
import {defineComponent, Ref, ref, SetupContext} from 'vue';
import DebugLog from "./classes/debugger";
import cookiePrompt from "./components/cookiePrompt.vue";
import FileUpload from './components/fileUpload.vue';
import PointCloud from './components/pointcloud.vue';
import Navbar from './components/navbar.vue';
import { RouterView } from 'vue-router';
export default defineComponent({
  components: {cookiePrompt, PointCloud, Navbar},
  setup() {
    var showCookiePrompt:Ref<boolean> = ref(localStorage.getItem('allow-data-storage') == undefined);
      

    // check if data storage was allowed and if check for localstorage settings
    if (localStorage.getItem("allow-data-storage") !== null) {

      if (localStorage.getItem("theme") !== null) {
        document.documentElement.setAttribute('data-theme', localStorage.getItem("theme") ?? "dark");
      }

    } else {
      // if data collection isn't allowed set the default values
      document.documentElement.setAttribute('data-theme', "dark");
    }

    var debugInputs = [
      {logText: "httpAttr: theme", logValue: document.documentElement.getAttribute('data-theme')}, 
      {logText: "storage: allow-data-storage", logValue:localStorage.getItem("allow-data-storage")},
      {logText: "storage theme", logValue: localStorage.getItem("theme")},
    ]
    DebugLog(debugInputs);

    return { showCookiePrompt };
  },
});
</script>

<template>
  <div class="appContainer">
    <Navbar></Navbar>
    <cookiePrompt v-if="showCookiePrompt" @close="showCookiePrompt=false;" style="margin-left:20%;width:90%;"></cookiePrompt>
    <RouterView></RouterView>
  </div>        
</template>

<style scoped>
  body {
    margin: 0;
    padding: 0;
  }
  .appContainer {
    margin: 0 10% 0 10%;
  }
</style>
