Lenaisten/advent22
4
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity

add calendar_background_image into store

Browse source
This commit is contained in:
Jörn-Michael Miehe 2023-11-11 01:44:13 +00:00
parent 835bc6d2d0
commit a63344dfe1
4 changed files with 13 additions and 4 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

2
ui/src/components/Calendar.vue
View file

@ -29,7 +29,7 @@
<figure> <figure>
<div class="image is-unselectable"> <div class="image is-unselectable">
<img :src="$advent22.api_url('user/background_image')" /> <img :src="store.calendar_background_image" />
<ThouCanvas> <ThouCanvas>
<CalendarDoor <CalendarDoor
v-for="(door, index) in doors" v-for="(door, index) in doors"

4
ui/src/components/editor/DoorChooser.vue
View file

@ -11,7 +11,7 @@
</ul> </ul>
</div> </div>
<figure class="image is-unselectable"> <figure class="image is-unselectable">
<img :src="$advent22.api_url('user/background_image')" /> <img :src="store.calendar_background_image" />
<ThouCanvas> <ThouCanvas>
<PreviewDoor <PreviewDoor
v-for="(door, index) in doors" v-for="(door, index) in doors"
@ -25,6 +25,7 @@
<script lang="ts"> <script lang="ts">
import { Door } from "@/lib/door"; import { Door } from "@/lib/door";
import { advent22Store } from "@/plugins/store";
import { Options, Vue } from "vue-class-component"; import { Options, Vue } from "vue-class-component";
import ThouCanvas from "../calendar/ThouCanvas.vue"; import ThouCanvas from "../calendar/ThouCanvas.vue";
@ -41,5 +42,6 @@ import PreviewDoor from "./PreviewDoor.vue";
}) })
export default class extends Vue { export default class extends Vue {
public doors!: Door[]; public doors!: Door[];
public readonly store = advent22Store();
} }
</script> </script>

4
ui/src/components/editor/DoorPlacer.vue
View file

@ -9,7 +9,7 @@
</ul> </ul>
</div> </div>
<figure class="image is-unselectable"> <figure class="image is-unselectable">
<img :src="$advent22.api_url('user/background_image')" /> <img :src="store.calendar_background_image" />
<DoorCanvas :doors="doors" /> <DoorCanvas :doors="doors" />
</figure> </figure>
</div> </div>
@ -17,6 +17,7 @@
<script lang="ts"> <script lang="ts">
import { Door } from "@/lib/door"; import { Door } from "@/lib/door";
import { advent22Store } from "@/plugins/store";
import { Options, Vue } from "vue-class-component"; import { Options, Vue } from "vue-class-component";
import DoorCanvas from "./DoorCanvas.vue"; import DoorCanvas from "./DoorCanvas.vue";
@ -31,5 +32,6 @@ import DoorCanvas from "./DoorCanvas.vue";
}) })
export default class extends Vue { export default class extends Vue {
public doors!: Door[]; public doors!: Door[];
public readonly store = advent22Store();
} }
</script> </script>

7
ui/src/plugins/store.ts
View file

@ -17,6 +17,7 @@ type State = {
is_touch_device: boolean; is_touch_device: boolean;
is_admin: boolean; is_admin: boolean;
site_config: SiteConfigModel; site_config: SiteConfigModel;
calendar_background_image: string | undefined;
calendar_aspect_ratio: number; calendar_aspect_ratio: number;
user_doors: Door[]; user_doors: Door[];
next_door_target: number | null; next_door_target: number | null;
@ -40,6 +41,7 @@ export const advent22Store = defineStore({
content: "", content: "",
footer: "", footer: "",
}, },
calendar_background_image: undefined,
calendar_aspect_ratio: 1, calendar_aspect_ratio: 1,
user_doors: [], user_doors: [],
next_door_target: null, next_door_target: null,
@ -73,10 +75,11 @@ export const advent22Store = defineStore({
Promise.all([ Promise.all([
this.advent22.api_get<SiteConfigModel>("user/site_config"), this.advent22.api_get<SiteConfigModel>("user/site_config"),
this.advent22.api_get_blob("user/background_image"),
this.advent22.api_get<DoorSaved[]>("user/doors"), this.advent22.api_get<DoorSaved[]>("user/doors"),
this.advent22.api_get<number | null>("user/next_door"), this.advent22.api_get<number | null>("user/next_door"),
]) ])
.then(([site_config, user_doors, next_door]) => { .then(([site_config, background_image, user_doors, next_door]) => {
document.title = site_config.title; document.title = site_config.title;
if (site_config.subtitle !== "") if (site_config.subtitle !== "")
@ -84,6 +87,8 @@ export const advent22Store = defineStore({
this.site_config = site_config; this.site_config = site_config;
this.calendar_background_image = background_image;
this.user_doors.length = 0; this.user_doors.length = 0;
for (const door_saved of user_doors) { for (const door_saved of user_doors) {
this.user_doors.push(Door.load(door_saved)); this.user_doors.push(Door.load(door_saved));