Compare commits

..

10 Commits

Author SHA1 Message Date
YouHaveTrouble 6625a5b9de move title styles to global file 2023-06-20 20:06:54 +02:00
YouHaveTrouble cf69b92934 bump version 2023-06-20 19:58:31 +02:00
YouHaveTrouble 005cde4a01 remove debug 2023-06-20 19:57:34 +02:00
YouHaveTrouble 1b94d676e7 minor fixes 2023-06-20 19:56:36 +02:00
YouHaveTrouble 7cda820a99 add metadata 2023-06-20 19:56:28 +02:00
YouHaveTrouble 7281fdab60 dynamically load home view 2023-06-20 19:39:13 +02:00
YouHaveTrouble 3b9441b555 improve loading process 2023-06-20 19:37:27 +02:00
YouHaveTrouble c2abfd6dfd add loading screen to hide loading assets and not yet loaded gamestate 2023-06-20 19:18:50 +02:00
YouHaveTrouble f05c393600 new favicon 2023-06-20 19:18:09 +02:00
YouHaveTrouble 23b6f4b4f8 update packages and fix breaking changes 2023-06-20 18:12:20 +02:00
12 changed files with 710 additions and 644 deletions
+20 -8
View File
@@ -1,18 +1,30 @@
<!DOCTYPE html> <!DOCTYPE html>
<html lang="en"> <html lang="en">
<head> <head>
<meta charset="UTF-8"> <meta charset="UTF-8">
<link rel="icon" href="/favicon.ico"> <link rel="icon" href="/favicon.ico">
<meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Guild Master - Adventurer's guild management game</title> <title>Guild Master - Adventurer's guild management game</title>
<link rel="preconnect" href="https://fonts.googleapis.com"> <link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin> <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=EB+Garamond&display=swap" rel="stylesheet"> <link href="https://fonts.googleapis.com/css2?family=EB+Garamond&display=swap" rel="stylesheet">
<meta name="description"
content="Guild Master is a browser game where you manage your own adventurer's guild!"/>
<meta property="twitter:title" content="Guild Master - Adventurer's guild management game"/>
<meta property="twitter:image" content="https://guildmaster.yht.one/img/compass_rose.png"/>
<meta property="twitter:description"
content="Guild Master is a browser game where you manage your own adventurer's guild!"/>
<meta property="og:title" content="Guild Master - Adventurer's guild management game"/>
<meta property="og:url" content="https://guildmaster.yht.one/"/>
<meta property="og:description"
content="Guild Master is a browser game where you manage your own adventurer's guild!"/>
<meta property="og:image" content="https://guildmaster.yht.one/img/compass_rose.png"/>
</head> </head>
<body> <body>
<div id="app"></div> <div id="app"></div>
<noscript> <noscript>
This is a javascript game. You need to enable javascript for it to work. This is a javascript game. You need to enable javascript for it to work.
</noscript> </noscript>
<script type="module" src="/src/main.ts"></script> <script type="module" src="/src/main.ts"></script>
</body> </body>
+537 -571
View File
File diff suppressed because it is too large Load Diff
+12 -12
View File
@@ -1,6 +1,6 @@
{ {
"name": "adventurers-guild", "name": "adventurers-guild",
"version": "0.7.0", "version": "0.8.0",
"private": true, "private": true,
"scripts": { "scripts": {
"dev": "vite", "dev": "vite",
@@ -11,19 +11,19 @@
}, },
"dependencies": { "dependencies": {
"@vueuse/components": "^9.13.0", "@vueuse/components": "^9.13.0",
"sass": "^1.59.3", "sass": "^1.63.4",
"vue": "^3.2.45", "vue": "^3.3.4",
"vue-router": "^4.1.6" "vue-router": "^4.2.2"
}, },
"devDependencies": { "devDependencies": {
"@types/node": "^18.11.12", "@types/node": "^18.16.18",
"@vitejs/plugin-vue": "^4.0.0", "@vitejs/plugin-vue": "^4.2.3",
"@vue/tsconfig": "^0.1.3", "@vue/tsconfig": "^0.4.0",
"eslint": "^8.36.0", "eslint": "^8.43.0",
"eslint-plugin-vue": "^9.9.0", "eslint-plugin-vue": "^9.15.0",
"npm-run-all": "^4.1.5", "npm-run-all": "^4.1.5",
"typescript": "~4.7.4", "typescript": "~5.1.3",
"vite": "^4.0.0", "vite": "4.3.9",
"vue-tsc": "^1.0.12" "vue-tsc": "^1.8.1"
} }
} }
Binary file not shown.

Before

Width:  |  Height:  |  Size: 4.2 KiB

After

Width:  |  Height:  |  Size: 14 KiB

Before

Width:  |  Height:  |  Size: 92 KiB

After

Width:  |  Height:  |  Size: 92 KiB

+104 -15
View File
@@ -1,7 +1,23 @@
<script setup lang="ts"> <script setup lang="ts">
import {RouterLink, RouterView} from 'vue-router'</script> import {RouterLink, RouterView} from 'vue-router'
import {version} from "../package.json"
</script>
<template> <template>
<section class="loading-screen" :class="{disabled: !loading}">
<div class="title panel note-paper">
<h1>Guild Master</h1>
<h3>Adventurer's guild management game</h3>
<small>v{{ version }}</small>
<div class="lds-ring">
<div></div>
<div></div>
<div></div>
<div></div>
</div>
<h3>Loading assets...</h3>
</div>
</section>
<header> <header>
<nav> <nav>
<RouterLink :to="{name: 'guild'}">Guild</RouterLink> <RouterLink :to="{name: 'guild'}">Guild</RouterLink>
@@ -45,6 +61,7 @@ import AutoFinishQuestsUpgrade from "@/classes/guildUpgrades/AutoFinishQuestsUpg
export default defineComponent({ export default defineComponent({
name: "GuildView", name: "GuildView",
data: () => ({ data: () => ({
loading: true as boolean,
guild: new Guild(1, 500), guild: new Guild(1, 500),
gameTickTask: null as null | number, gameTickTask: null as null | number,
gameSaveTask: null as null | number, gameSaveTask: null as null | number,
@@ -179,13 +196,13 @@ export default defineComponent({
const data = saveData.adventurers[id]; const data = saveData.adventurers[id];
try { try {
const adventurer = new Adventurer( const adventurer = new Adventurer(
data.id, data.id,
data.name, data.name,
data.portrait, data.portrait,
data.attackExponent ?? 1.1, data.attackExponent ?? 1.1,
data.level ?? 1, data.level ?? 1,
data.exp ?? 0, data.exp ?? 0,
data.prestige ?? 0, data.prestige ?? 0,
); );
adventurer.busy = data.busy; adventurer.busy = data.busy;
adventurers[data.id] = adventurer; adventurers[data.id] = adventurer;
@@ -231,13 +248,24 @@ export default defineComponent({
} }
}, },
async mounted() { async mounted() {
this.quests = await loadAvailableQuests(); console.debug("Loading game data")
this.adventurersDatabase = await loadAdventurersForHire(); const promises = await Promise.all([
this.loadGame(); loadAvailableQuests(),
loadAdventurersForHire(),
]);
this.quests = promises[0] as { [key: string]: { [key: string]: Quest } };
this.adventurersDatabase = promises[1] as Array<Adventurer>;
console.debug("Game data loaded!")
this.loadGame();
this.adventurersDatabase = removeAlreadyHiredAdventurers(this.adventurersDatabase, this.adventurers); this.adventurersDatabase = removeAlreadyHiredAdventurers(this.adventurersDatabase, this.adventurers);
this.gameSaveTask = setInterval(() => { // Wait a second to make sure at least most images load in behind the loader
setTimeout(() => {
this.loading = false;
}, 1000);
this.gameSaveTask = Number(setInterval(() => {
saveGame(new GameData({ saveGame(new GameData({
adventurers: this.adventurers, adventurers: this.adventurers,
guild: this.guild, guild: this.guild,
@@ -246,9 +274,10 @@ export default defineComponent({
lastRecruitAction: this.lastRecruitHandled, lastRecruitAction: this.lastRecruitHandled,
adventurerForHireId: this.adventurerForHire?.id ?? null, adventurerForHireId: this.adventurerForHire?.id ?? null,
})); }));
}, 10 * 1000) }, 10 * 1000));
this.gameTickTask = setInterval(() => {
this.gameTickTask = Number(setInterval(() => {
this.updateMissives(); this.updateMissives();
const now = Number(new Date()); const now = Number(new Date());
@@ -336,7 +365,7 @@ export default defineComponent({
} }
} }
}, 250); }, 250));
}, },
beforeUnmount() { beforeUnmount() {
@@ -390,4 +419,64 @@ nav {
} }
.loading-screen {
position: fixed;
top: 0;
left: 0;
width: 100vw;
height: 100vh;
z-index: 5;
user-select: none;
background-size: 25rem;
background-color: rgba(87, 50, 20, 0.45);
background-image: url("/img/background/wood/cut_wood_background.png");
background-blend-mode: darken;
background-repeat: repeat;
display: flex;
justify-content: center;
align-items: center;
transition: opacity 0.25s linear;
&.disabled {
opacity: 0;
pointer-events: none;
}
.lds-ring {
display: inline-block;
position: relative;
width: 80px;
height: 80px;
}
.lds-ring div {
box-sizing: border-box;
display: block;
position: absolute;
width: 64px;
height: 64px;
margin: 8px;
border: 8px solid;
border-radius: 50%;
animation: lds-ring 1.2s cubic-bezier(0.5, 0, 0.5, 1) infinite;
border-color: #000 transparent transparent transparent;
}
.lds-ring div:nth-child(1) {
animation-delay: -0.45s;
}
.lds-ring div:nth-child(2) {
animation-delay: -0.3s;
}
.lds-ring div:nth-child(3) {
animation-delay: -0.15s;
}
@keyframes lds-ring {
0% {
transform: rotate(0deg);
}
100% {
transform: rotate(360deg);
}
}
}
</style> </style>
+30
View File
@@ -82,3 +82,33 @@ body {
filter: brightness(1.2); filter: brightness(1.2);
} }
} }
.title {
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
padding-block: 2.5rem;
text-align: center;
width: 100%;
max-width: 45rem;
gap: 0.5rem;
h1 {
font-size: 4rem;
line-height: 0.75;
white-space: pre-wrap;
margin: 0;
}
h3 {
margin: 0;
line-height: 0.9;
}
small {
font-size: 0.9rem;
font-weight: bold;
line-height: 0.25;
}
}
+1 -1
View File
@@ -2,7 +2,7 @@ import { createApp } from 'vue'
import App from './App.vue' import App from './App.vue'
import router from './router' import router from './router'
import './assets/main.scss' import '@/assets/main.scss'
const app = createApp(App) const app = createApp(App)
+4 -5
View File
@@ -1,5 +1,4 @@
import {createRouter, createWebHashHistory} from 'vue-router' import {createRouter, createWebHashHistory} from 'vue-router'
import HomeView from '../views/HomeView.vue'
const router = createRouter({ const router = createRouter({
history: createWebHashHistory(import.meta.env.BASE_URL), history: createWebHashHistory(import.meta.env.BASE_URL),
@@ -7,22 +6,22 @@ const router = createRouter({
{ {
path: '/', path: '/',
name: 'guild', name: 'guild',
component: HomeView component: () => import('@/views/HomeView.vue')
}, },
{ {
path: '/quests', path: '/quests',
name: 'quests', name: 'quests',
component: () => import('../views/QuestView.vue') component: () => import('@/views/QuestView.vue')
}, },
{ {
path: '/adventurers', path: '/adventurers',
name: 'adventurers', name: 'adventurers',
component: () => import('../views/AdventurerView.vue') component: () => import('@/views/AdventurerView.vue')
}, },
{ {
path: '/technical', path: '/technical',
name: 'technical', name: 'technical',
component: () => import('../views/TechnicalView.vue') component: () => import('@/views/TechnicalView.vue')
} }
] ]
}) })
-30
View File
@@ -80,36 +80,6 @@ main {
} }
} }
.title {
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
padding-block: 2.5rem;
text-align: center;
width: 100%;
max-width: 45rem;
gap: 0.5rem;
h1 {
font-size: 4rem;
line-height: 0.75;
white-space: pre-wrap;
margin: 0;
}
h3 {
margin: 0;
line-height: 0.9;
}
small {
font-size: 0.9rem;
font-weight: bold;
line-height: 0.25;
}
}
.coffer { .coffer {
text-align: center; text-align: center;
+1 -1
View File
@@ -1,5 +1,5 @@
{ {
"extends": "@vue/tsconfig/tsconfig.node.json", "extends": "@vue/tsconfig/tsconfig.json",
"include": ["vite.config.*", "vitest.config.*", "cypress.config.*", "playwright.config.*"], "include": ["vite.config.*", "vitest.config.*", "cypress.config.*", "playwright.config.*"],
"compilerOptions": { "compilerOptions": {
"composite": true, "composite": true,
+1 -1
View File
@@ -1,5 +1,5 @@
{ {
"extends": "@vue/tsconfig/tsconfig.web.json", "extends": "@vue/tsconfig/tsconfig.json",
"include": ["env.d.ts", "src/**/*", "src/**/*.vue"], "include": ["env.d.ts", "src/**/*", "src/**/*.vue"],
"compilerOptions": { "compilerOptions": {
"baseUrl": ".", "baseUrl": ".",