mirror of
https://github.com/thepaperpilot/Advent-Incremental.git
synced 2025-01-19 12:01:37 +00:00
Merge branch 'main' of https://github.com/thepaperpilot/Advent-Incremental into main
This commit is contained in:
commit
20cefa8684
7 changed files with 148 additions and 57 deletions
|
@ -20,15 +20,16 @@
|
|||
</div>
|
||||
</div>
|
||||
<Modal
|
||||
:model-value="main.loreBody.value !== ''"
|
||||
@update:model-value="() => (main.loreBody.value = '')"
|
||||
:modelValue="main.showLoreModal.value"
|
||||
@update:model-value="value => (main.showLoreModal.value = value)"
|
||||
>
|
||||
<template v-slot:header
|
||||
><h2>{{ main.loreTitle.value }}</h2></template
|
||||
>
|
||||
<template v-slot:body>
|
||||
{{ main.loreBody.value }}
|
||||
<div v-if="!main.days[main.day.value - 1].opened.value">
|
||||
<component v-if="loreBody" :is="loreBody" />
|
||||
<div v-if="main.loreScene.value !== -1">
|
||||
<Scene :day="main.loreScene.value" />
|
||||
<br />
|
||||
You can help continue the <i>advent</i>ure at:
|
||||
<a href="https://discord.gg/WzejVAx" class="info-modal-discord-link">
|
||||
|
@ -44,9 +45,11 @@
|
|||
<script setup lang="ts">
|
||||
import { main } from "data/projEntry";
|
||||
import projInfo from "data/projInfo.json";
|
||||
import Scene from "data/Scene.vue";
|
||||
import type { GenericLayer } from "game/layers";
|
||||
import { layers } from "game/layers";
|
||||
import player from "game/player";
|
||||
import { computeOptionalComponent } from "util/vue";
|
||||
import { computed, toRef, unref } from "vue";
|
||||
import Layer from "./Layer.vue";
|
||||
import Modal from "./Modal.vue";
|
||||
|
@ -56,6 +59,8 @@ const tabs = toRef(player, "tabs");
|
|||
const layerKeys = computed(() => Object.keys(layers));
|
||||
const useHeader = projInfo.useHeader;
|
||||
|
||||
const loreBody = computeOptionalComponent(main.loreBody);
|
||||
|
||||
function gatherLayerProps(layer: GenericLayer) {
|
||||
const { display, minimized, minWidth, name, color, minimizable, nodes } = layer;
|
||||
return { display, minimized, minWidth, name, color, minimizable, nodes };
|
||||
|
|
51
src/data/Scene.vue
Normal file
51
src/data/Scene.vue
Normal file
|
@ -0,0 +1,51 @@
|
|||
<template>
|
||||
<div class="scene">
|
||||
<img v-if="day >= 0" :src="tree" class="scene-item" style="left: 10%; bottom: 10%" />
|
||||
<img v-if="day >= 1" :src="workshop" class="scene-item" style="left: 40%; bottom: 12%" />
|
||||
<img
|
||||
v-if="day >= 2"
|
||||
:src="coal"
|
||||
class="scene-item"
|
||||
style="left: 65%; bottom: 12%; width: 40px; height: 40px"
|
||||
/>
|
||||
<img v-if="day >= 3" :src="elves" class="scene-item" style="left: 52%; bottom: 12%" />
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
import tree from "./symbols/tree.png";
|
||||
import workshop from "./symbols/sws.png";
|
||||
import coal from "./symbols/coal.png";
|
||||
import elves from "./symbols/elf.png";
|
||||
|
||||
defineProps<{
|
||||
day: number;
|
||||
}>();
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
.scene {
|
||||
width: 600px;
|
||||
height: 300px;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.scene::after {
|
||||
content: "";
|
||||
position: absolute;
|
||||
width: 100%;
|
||||
height: 20%;
|
||||
border-radius: 50% / 100%;
|
||||
border-bottom-left-radius: 0;
|
||||
border-bottom-right-radius: 0;
|
||||
bottom: 0;
|
||||
background: white;
|
||||
}
|
||||
|
||||
.scene-item {
|
||||
width: 80px;
|
||||
height: 80px;
|
||||
position: absolute;
|
||||
z-index: 1;
|
||||
}
|
||||
</style>
|
|
@ -532,12 +532,7 @@ const layer = createLayer(id, function (this: BaseLayer) {
|
|||
|
||||
watchEffect(() => {
|
||||
if (main.day.value === day && Decimal.gte(totalCoal.value, totalCoalGoal)) {
|
||||
main.loreTitle.value = "Day complete!";
|
||||
main.loreBody.value =
|
||||
"Santa looks at all the coal you've gathered and tells you you've done well! He says you should take the rest of the day off so you're refreshed for tomorrow's work. Good Job!";
|
||||
main.day.value = day + 1;
|
||||
main.minimized.value = false;
|
||||
player.devSpeed = 0;
|
||||
main.completeDay();
|
||||
}
|
||||
});
|
||||
|
||||
|
|
|
@ -276,12 +276,7 @@ const layer = createLayer(id, function (this: BaseLayer) {
|
|||
Decimal.gte(totalElves.value, 6) &&
|
||||
Decimal.gte(coal.coal.value, coalGoal)
|
||||
) {
|
||||
main.loreTitle.value = "Day complete!";
|
||||
main.loreBody.value =
|
||||
"The workshop now hums with the bustling elves working everything. They can take it from here - you deserve a break after such a long day! Good Job!";
|
||||
main.day.value = day + 1;
|
||||
main.minimized.value = false;
|
||||
player.devSpeed = 0;
|
||||
main.completeDay();
|
||||
}
|
||||
});
|
||||
|
||||
|
|
|
@ -623,12 +623,7 @@ const layer = createLayer(id, function (this: BaseLayer) {
|
|||
|
||||
watchEffect(() => {
|
||||
if (main.day.value === day && Decimal.gte(totalLogs.value, totalLogGoal)) {
|
||||
main.loreTitle.value = "Day complete!";
|
||||
main.loreBody.value =
|
||||
"Santa looks at all the wood you've gathered and tells you you've done well! He says you should take the rest of the day off so you're refreshed for tomorrow's work. Good Job!";
|
||||
main.day.value = day + 1;
|
||||
main.minimized.value = false;
|
||||
player.devSpeed = 0;
|
||||
main.completeDay();
|
||||
}
|
||||
});
|
||||
|
||||
|
|
|
@ -157,12 +157,7 @@ const layer = createLayer(id, function (this: BaseLayer) {
|
|||
|
||||
watchEffect(() => {
|
||||
if (main.day.value === day && Decimal.gte(foundationProgress.value, 100)) {
|
||||
main.loreTitle.value = "Day complete!";
|
||||
main.loreBody.value =
|
||||
"The workshop complete, Santa once again dismisses you for the day. With a strong foundation, this workshop should suffice for supporting future work toward this impossible mission. Good Job!";
|
||||
main.day.value = day + 1;
|
||||
main.minimized.value = false;
|
||||
player.devSpeed = 0;
|
||||
main.completeDay();
|
||||
}
|
||||
});
|
||||
|
||||
|
|
|
@ -1,5 +1,5 @@
|
|||
import Spacer from "components/layout/Spacer.vue";
|
||||
import { Component, GatherProps, GenericComponent, jsx } from "features/feature";
|
||||
import { CoercableComponent, Component, GatherProps, GenericComponent, jsx } from "features/feature";
|
||||
import { BaseLayer, createLayer, GenericLayer, layers } from "game/layers";
|
||||
import { persistent } from "game/persistence";
|
||||
import type { PlayerData } from "game/player";
|
||||
|
@ -26,6 +26,7 @@ export interface Day extends VueFeature {
|
|||
layer: string | null;
|
||||
symbol: string;
|
||||
story: string;
|
||||
completedStory: string;
|
||||
opened: Ref<boolean>;
|
||||
shouldNotify: ProcessedComputable<boolean>;
|
||||
}
|
||||
|
@ -33,8 +34,10 @@ export interface Day extends VueFeature {
|
|||
export const main = createLayer("main", function (this: BaseLayer) {
|
||||
const day = persistent<number>(1);
|
||||
|
||||
const showLoreModal = ref<boolean>(false);
|
||||
const loreScene = ref<number>(-1);
|
||||
const loreTitle = ref<string>("");
|
||||
const loreBody = ref<string>("");
|
||||
const loreBody = ref<CoercableComponent | undefined>();
|
||||
|
||||
function createDay(
|
||||
optionsFunc: () => {
|
||||
|
@ -43,6 +46,7 @@ export const main = createLayer("main", function (this: BaseLayer) {
|
|||
layer: string | null;
|
||||
symbol: string;
|
||||
story: string;
|
||||
completedStory: string;
|
||||
}
|
||||
): Day {
|
||||
const opened = persistent<boolean>(false);
|
||||
|
@ -58,15 +62,23 @@ export const main = createLayer("main", function (this: BaseLayer) {
|
|||
shouldNotify,
|
||||
[Component]: Day as GenericComponent,
|
||||
[GatherProps]: function (this: Day) {
|
||||
const { day, layer, symbol, opened, shouldNotify, story } = this;
|
||||
const { day, layer, symbol, opened, shouldNotify, story, completedStory } =
|
||||
this;
|
||||
return {
|
||||
day,
|
||||
symbol,
|
||||
opened,
|
||||
shouldNotify,
|
||||
onOpenLore() {
|
||||
loreTitle.value = unref(layers[layer ?? "trees"]?.name ?? "");
|
||||
loreBody.value = story;
|
||||
const completed = main.day.value > day - 1;
|
||||
loreScene.value = completed ? day - 1 : -1;
|
||||
const title = unref(layers[layer ?? "trees"]?.name ?? "");
|
||||
loreTitle.value = completed ? `${title} - Completed!` : title;
|
||||
loreBody.value = completed
|
||||
? `${story}<hr style="
|
||||
margin: 10px 0;"/>${completedStory}`
|
||||
: story;
|
||||
showLoreModal.value = true;
|
||||
},
|
||||
onOpenLayer() {
|
||||
// 1468 is because two tabs with minWidth of 700px plus the minimized calendar of 60px plus 2 dividers of 4px each
|
||||
|
@ -87,9 +99,11 @@ export const main = createLayer("main", function (this: BaseLayer) {
|
|||
onUnlockLayer() {
|
||||
opened.value = true;
|
||||
setTimeout(() => {
|
||||
loreScene.value = -1;
|
||||
loreTitle.value = unref(layers[layer ?? "trees"]?.name ?? "");
|
||||
loreBody.value = story;
|
||||
player.devSpeed = null;
|
||||
showLoreModal.value = true;
|
||||
}, 1000);
|
||||
}
|
||||
};
|
||||
|
@ -104,177 +118,218 @@ export const main = createLayer("main", function (this: BaseLayer) {
|
|||
shouldNotify: false,
|
||||
layer: "trees",
|
||||
symbol: treeSymbol,
|
||||
story: "Oh no! Santa forgot about Christmas and it's only 25 days away! He's asked for your help due to your history getting large quantities of things in short amounts of time. Unfortunately you're really starting from scratch here - let's start with getting wood, which you'll need for everything from building workshops to wrapping paper to many of the toys themselves!"
|
||||
story: "Oh no! Santa forgot about Christmas and it's only 25 days away! He's asked for your help due to your history getting large quantities of things in short amounts of time. Unfortunately you're really starting from scratch here - let's start with getting wood, which you'll need for everything from building workshops to wrapping paper to many of the toys themselves!",
|
||||
completedStory:
|
||||
"Santa looks at all the wood you've gathered and tells you you've done well! He says you should take the rest of the day off so you're refreshed for tomorrow's work. Good Job!"
|
||||
})),
|
||||
createDay(() => ({
|
||||
day: 2,
|
||||
shouldNotify: false,
|
||||
layer: "workshop",
|
||||
symbol: workshopSymbol,
|
||||
story: "Santa looked over your tree farm and was impressed with how much you could accomplish in just one day. Today's goal is to get a workshop built up for the elves to work in - and apparently, they need quite a lot of space to work!"
|
||||
story: "Santa looked over your tree farm and was impressed with how much you could accomplish in just one day. Today's goal is to get a workshop built up for the elves to work in - and apparently, they need quite a lot of space to work!",
|
||||
completedStory:
|
||||
"The workshop complete, Santa once again dismisses you for the day. With a strong foundation, this workshop should suffice for supporting future work toward this impossible mission. Good Job!"
|
||||
})),
|
||||
createDay(() => ({
|
||||
day: 3,
|
||||
shouldNotify: false,
|
||||
layer: "coal",
|
||||
symbol: coalSymbol,
|
||||
story: "Santa tells you that unfortunately there are quite a few naughty children out there this year, and he's going to need you to gather as much coal as you can for him to give out."
|
||||
story: "Santa tells you that unfortunately there are quite a few naughty children out there this year, and he's going to need you to gather as much coal as you can for him to give out.",
|
||||
completedStory:
|
||||
"Santa looks at all the coal you've gathered and tells you you've done well! He says you should take the rest of the day off so you're refreshed for tomorrow's work. Good Job!"
|
||||
})),
|
||||
createDay(() => ({
|
||||
day: 4,
|
||||
shouldNotify: false,
|
||||
layer: "elves",
|
||||
symbol: elfSymbol,
|
||||
story: "Alright, it seems you finally have enough things setup to start bringing in the elves! Unfortunately, it seems they'll need to be retrained on how to help, since they're out of practice by 11 months!"
|
||||
story: "Alright, it seems you finally have enough things setup to start bringing in the elves! Unfortunately, it seems they'll need to be retrained on how to help, since they're out of practice by 11 months!",
|
||||
completedStory:
|
||||
"The workshop now hums with the bustling elves working everything. They can take it from here - you deserve a break after such a long day! Good Job!"
|
||||
})),
|
||||
createDay(() => ({
|
||||
day: 5,
|
||||
shouldNotify: false,
|
||||
layer: null,
|
||||
symbol: "",
|
||||
story: ""
|
||||
story: "",
|
||||
completedStory: ""
|
||||
})),
|
||||
createDay(() => ({
|
||||
day: 6,
|
||||
shouldNotify: false,
|
||||
layer: null,
|
||||
symbol: "",
|
||||
story: ""
|
||||
story: "",
|
||||
completedStory: ""
|
||||
})),
|
||||
createDay(() => ({
|
||||
day: 7,
|
||||
shouldNotify: false,
|
||||
layer: null,
|
||||
symbol: "",
|
||||
story: ""
|
||||
story: "",
|
||||
completedStory: ""
|
||||
})),
|
||||
createDay(() => ({
|
||||
day: 8,
|
||||
shouldNotify: false,
|
||||
layer: null,
|
||||
symbol: "",
|
||||
story: ""
|
||||
story: "",
|
||||
completedStory: ""
|
||||
})),
|
||||
createDay(() => ({
|
||||
day: 9,
|
||||
shouldNotify: false,
|
||||
layer: null,
|
||||
symbol: "",
|
||||
story: ""
|
||||
story: "",
|
||||
completedStory: ""
|
||||
})),
|
||||
createDay(() => ({
|
||||
day: 10,
|
||||
shouldNotify: false,
|
||||
layer: null,
|
||||
symbol: "",
|
||||
story: ""
|
||||
story: "",
|
||||
completedStory: ""
|
||||
})),
|
||||
createDay(() => ({
|
||||
day: 11,
|
||||
shouldNotify: false,
|
||||
layer: null,
|
||||
symbol: "",
|
||||
story: ""
|
||||
story: "",
|
||||
completedStory: ""
|
||||
})),
|
||||
createDay(() => ({
|
||||
day: 12,
|
||||
shouldNotify: false,
|
||||
layer: null,
|
||||
symbol: "",
|
||||
story: ""
|
||||
story: "",
|
||||
completedStory: ""
|
||||
})),
|
||||
createDay(() => ({
|
||||
day: 13,
|
||||
shouldNotify: false,
|
||||
layer: null,
|
||||
symbol: "",
|
||||
story: ""
|
||||
story: "",
|
||||
completedStory: ""
|
||||
})),
|
||||
createDay(() => ({
|
||||
day: 14,
|
||||
shouldNotify: false,
|
||||
layer: null,
|
||||
symbol: "",
|
||||
story: ""
|
||||
story: "",
|
||||
completedStory: ""
|
||||
})),
|
||||
createDay(() => ({
|
||||
day: 15,
|
||||
shouldNotify: false,
|
||||
layer: null,
|
||||
symbol: "",
|
||||
story: ""
|
||||
story: "",
|
||||
completedStory: ""
|
||||
})),
|
||||
createDay(() => ({
|
||||
day: 16,
|
||||
shouldNotify: false,
|
||||
layer: null,
|
||||
symbol: "",
|
||||
story: ""
|
||||
story: "",
|
||||
completedStory: ""
|
||||
})),
|
||||
createDay(() => ({
|
||||
day: 17,
|
||||
shouldNotify: false,
|
||||
layer: null,
|
||||
symbol: "",
|
||||
story: ""
|
||||
story: "",
|
||||
completedStory: ""
|
||||
})),
|
||||
createDay(() => ({
|
||||
day: 18,
|
||||
shouldNotify: false,
|
||||
layer: null,
|
||||
symbol: "",
|
||||
story: ""
|
||||
story: "",
|
||||
completedStory: ""
|
||||
})),
|
||||
createDay(() => ({
|
||||
day: 19,
|
||||
shouldNotify: false,
|
||||
layer: null,
|
||||
symbol: "",
|
||||
story: ""
|
||||
story: "",
|
||||
completedStory: ""
|
||||
})),
|
||||
createDay(() => ({
|
||||
day: 20,
|
||||
shouldNotify: false,
|
||||
layer: null,
|
||||
symbol: "",
|
||||
story: ""
|
||||
story: "",
|
||||
completedStory: ""
|
||||
})),
|
||||
createDay(() => ({
|
||||
day: 21,
|
||||
shouldNotify: false,
|
||||
layer: null,
|
||||
symbol: "",
|
||||
story: ""
|
||||
story: "",
|
||||
completedStory: ""
|
||||
})),
|
||||
createDay(() => ({
|
||||
day: 22,
|
||||
shouldNotify: false,
|
||||
layer: null,
|
||||
symbol: "",
|
||||
story: ""
|
||||
story: "",
|
||||
completedStory: ""
|
||||
})),
|
||||
createDay(() => ({
|
||||
day: 23,
|
||||
shouldNotify: false,
|
||||
layer: null,
|
||||
symbol: "",
|
||||
story: ""
|
||||
story: "",
|
||||
completedStory: ""
|
||||
})),
|
||||
createDay(() => ({
|
||||
day: 24,
|
||||
shouldNotify: false,
|
||||
layer: null,
|
||||
symbol: "",
|
||||
story: ""
|
||||
story: "",
|
||||
completedStory: ""
|
||||
}))
|
||||
];
|
||||
|
||||
function completeDay() {
|
||||
loreScene.value = day.value - 1;
|
||||
loreTitle.value = "Day Complete!";
|
||||
loreBody.value = days[day.value - 1].completedStory;
|
||||
showLoreModal.value = true;
|
||||
day.value++;
|
||||
main.minimized.value = false;
|
||||
player.devSpeed = 0;
|
||||
}
|
||||
|
||||
return {
|
||||
name: "Calendar",
|
||||
days,
|
||||
day,
|
||||
loreScene,
|
||||
loreTitle,
|
||||
loreBody,
|
||||
showLoreModal,
|
||||
completeDay,
|
||||
minWidth: 700,
|
||||
display: jsx(() => (
|
||||
<>
|
||||
|
|
Loading…
Add table
Reference in a new issue