diff --git a/ui/src/components/Calendar.vue b/ui/src/components/Calendar.vue index d10b671..441fcd9 100644 --- a/ui/src/components/Calendar.vue +++ b/ui/src/components/Calendar.vue @@ -2,9 +2,21 @@ - - {{ figure_caption }} - + + + + {{ figure_caption }} + + + + + + @@ -12,6 +24,7 @@ v-for="(door, index) in doors" :key="`door-${index}`" :door="door" + :visible="show_doors" @doorClick="door_click" @doorSuccess="door_success" @doorFailure="door_failure" @@ -30,12 +43,14 @@ import { Door } from "@/lib/door"; import { Options, Vue } from "vue-class-component"; import MultiModal from "./MultiModal.vue"; +import BulmaButton from "./bulma/Button.vue"; import CalendarDoor from "./calendar/CalendarDoor.vue"; import ThouCanvas from "./calendar/ThouCanvas.vue"; @Options({ components: { MultiModal, + BulmaButton, ThouCanvas, CalendarDoor, }, @@ -47,6 +62,7 @@ export default class extends Vue { public readonly doors!: Door[]; private readonly idle_caption = "Finde die Türchen auf dem Adventskalender!"; + public show_doors = false; private multi_modal?: MultiModal; public figure_caption = this.idle_caption; diff --git a/ui/src/components/calendar/CalendarDoor.vue b/ui/src/components/calendar/CalendarDoor.vue index 2a161d8..532fb56 100644 --- a/ui/src/components/calendar/CalendarDoor.vue +++ b/ui/src/components/calendar/CalendarDoor.vue @@ -1,9 +1,11 @@ + {{ door.day }} @@ -19,11 +21,16 @@ import SVGRect from "./SVGRect.vue"; }, props: { door: Door, + visible: { + type: Boolean, + default: false, + }, }, emits: ["doorClick", "doorSuccess", "doorFailure"], }) export default class extends Vue { public door!: Door; + public visible!: boolean; public on_click() { this.$emit("doorClick");