aboutsummaryrefslogtreecommitdiff
path: root/src-vue/src/App.vue
diff options
context:
space:
mode:
authorGeckoEidechse <gecko.eidechse+git@pm.me>2024-12-22 23:55:52 +0100
committerGeckoEidechse <gecko.eidechse+git@pm.me>2024-12-22 23:55:52 +0100
commitf1dee718da95836ffa5c0985c9e8f5643e0f3f6f (patch)
tree24967a28bcae1fc1e5b08da9f58bcc678ed52937 /src-vue/src/App.vue
parentcc5ae684221d3165479d7a68556a2bb6fa81cf3a (diff)
downloadFlightCore-f1dee718da95836ffa5c0985c9e8f5643e0f3f6f.tar.gz
FlightCore-f1dee718da95836ffa5c0985c9e8f5643e0f3f6f.zip
dev: Replace with sample Tauri 2.0 project
as a first step to convert FlightCore to Tauri 2.0
Diffstat (limited to 'src-vue/src/App.vue')
-rw-r--r--src-vue/src/App.vue213
1 files changed, 0 insertions, 213 deletions
diff --git a/src-vue/src/App.vue b/src-vue/src/App.vue
deleted file mode 100644
index 9db6c488..00000000
--- a/src-vue/src/App.vue
+++ /dev/null
@@ -1,213 +0,0 @@
-<script lang="ts">
-import ChangelogView from './views/ChangelogView.vue';
-import DeveloperView from './views/DeveloperView.vue';
-import PlayView from './views/PlayView.vue';
-import ModsView from './views/ModsView.vue';
-import SettingsView from './views/SettingsView.vue';
-import { appWindow } from '@tauri-apps/api/window';
-import { store } from './plugins/store';
-import { Store } from 'tauri-plugin-store-api';
-import { invoke } from "@tauri-apps/api";
-import NotificationButton from "./components/NotificationButton.vue";
-
-export default {
- components: {
- NotificationButton,
- ChangelogView,
- DeveloperView,
- PlayView,
- SettingsView,
- ModsView
- },
- data() {
- return {}
- },
- mounted: async function() {
- store.commit('initialize');
-
- // Initialize interface language
- const persistentStore = new Store('flight-core-settings.json');
- let lang: string | null = await persistentStore.get('lang');
- if (lang === null) {
- lang = navigator.language.substring(0, 2);
- persistentStore.set('lang', lang);
- await persistentStore.save();
- }
- this.$root!.$i18n.locale = lang;
- },
- methods: {
- minimize() {
- appWindow.minimize()
- },
- close() {
- invoke("close_application");
- }
- },
- computed: {
- bgStyle(): string {
- // @ts-ignore
- const shouldBlur = this.$route.path !== "/";
- return `filter: brightness(0.8) ${shouldBlur ? 'blur(5px)' : ''};`;
- }
- }
-}
-</script>
-
-<template>
- <div class="app-inner">
- <div id="fc_bg__container" :style="bgStyle"/>
-
- <nav id="fc_menu-bar" v-if="$route.path !== '/repair'"><!-- Hide menu bar in repair view -->
- <!-- Navigation items -->
- <el-menu
- :default-active="$route.path"
- router
- mode="horizontal"
- id="fc__menu_items"
- data-tauri-drag-region
- >
- <el-menu-item index="/">{{ $t('menu.play') }}</el-menu-item>
- <el-menu-item index="/mods">{{ $t('menu.mods') }}</el-menu-item>
- <el-menu-item index="/changelog">{{ $t('menu.changelog') }}</el-menu-item>
- <el-menu-item index="/settings">{{ $t('menu.settings') }}</el-menu-item>
- <el-menu-item index="/dev" v-if="$store.state.developer_mode">{{ $t('menu.dev') }}</el-menu-item>
- </el-menu>
-
- <!-- Window controls -->
- <div id="fc_window__controls">
- <NotificationButton />
- <el-button color="white" icon="SemiSelect" @click="minimize" circle />
- <el-button color="white" icon="CloseBold" @click="close" circle />
- </div>
- </nav>
-
- <router-view></router-view>
- </div>
-</template>
-
-<style>
-#fc_menu-bar {
- position: fixed;
- z-index: 1;
- top: 0;
- width: 100%;
- height: var(--fc-menu_height);
-}
-
-#fc__menu_bar::before {
- position: absolute;
- content: "";
- inset: 0; /* same as { top: 0; right: 0; bottom: 0; left: 0; } */
- background-image: linear-gradient(to bottom, red, orange);
- z-index: 1;
- opacity: 0;
- transition: opacity 1s linear;
-}
-
-#fc__menu_bar:hover::before {
- opacity: 1;
-}
-
-/* Borders reset */
-#fc__menu_bar, #fc__menu_items {
- border: none !important;
-}
-.app-inner {
- height: 100%;
- width: 100%;
-}
-
-/* Header item */
-#fc__menu_items {
- height: 100%;
- background-color: transparent;
- float: left;
- width: calc(100% - 168px); /* window controls container width */
-}
-
-#fc__menu_items .el-menu-item, #fc__menu_items .el-sub-menu__title {
- color: #b4b6b9;
- border-color: white;
-}
-
-#fc__menu_items > .el-menu-item {
- text-transform: uppercase;
- border: none !important;
- font-family: 'Helvetica Neue', Helvetica, 'PingFang SC', 'Hiragino Sans GB', 'Microsoft YaHei', '微软雅黑', Arial, sans-serif;
- font-weight: bold;
- font-size: large;
- background-color: transparent !important;
-
- border-width: 2px !important;
- border-style: solid !important;
- border-color: transparent !important;
- border-radius: 10px !important;
- transition: none;
-}
-
-#fc__menu_items .el-menu-item:hover, #fc__menu_items .el-sub-menu__title {
- color: #c6c9ce;
- background-color: transparent;
-}
-
-#fc__menu_items .el-menu-item:focus-visible {
- border-color: rgb(160, 207, 255) !important;
-}
-
-#fc__menu_items .el-menu-item.is-active, #fc__menu_items .el-sub-menu.is-active > .el-sub-menu__title {
- color: white !important;
-}
-
-.app-inner > .fc__mods__container {
- overflow-y: auto;
- height: calc(100% - var(--fc-menu_height));
-}
-
-/* Header menu */
-.developer_build {
- background: repeating-linear-gradient(
- 45deg,
- rgba(0, 0, 0, 0.2),
- rgba(0, 0, 0, 0.2) 20px,
- rgba(0, 0, 0, 0.3) 20px,
- rgba(0, 0, 0, 0.3) 40px
- );
-}
-
-/* Window controls */
-#fc_window__controls {
- float: right;
- height: 100%;
-}
-
-#fc_window__controls > button,
-#fc_window__controls > .el-dropdown > button,
-#fc_window__controls > .el-dropdown > .el-badge > button {
- color: white;
- font-size: 20px;
- margin: auto 5px;
- background: none;
- border: none;
- height: 100%;
-}
-
-#fc_window__controls > button:hover,
-#fc_window__controls > .el-dropdown > button:hover,
-#fc_window__controls > .el-dropdown > .el-badge > button:hover {
- color: #c6c9ce;
-}
-
-#fc_window__controls > button:active,
-#fc_window__controls > .el-dropdown > button:active {
- color: #56585a;
-}
-
-#fc_window__controls > button:last-of-type {
- margin-right: 15px;
-}
-
-sup {
- border: none !important;
-}
-
-</style>