diff --git a/app/assets/fonts/nds-10px.woff2 b/app/assets/fonts/nds-10px.woff2 index be529bc..adbc80f 100644 Binary files a/app/assets/fonts/nds-10px.woff2 and b/app/assets/fonts/nds-10px.woff2 differ diff --git a/app/assets/images/contact/bottom-screen/bottom-bar.png b/app/assets/images/contact/bottom-screen/bottom-bar.png index ca1bfd5..aedabf7 100644 Binary files a/app/assets/images/contact/bottom-screen/bottom-bar.png and b/app/assets/images/contact/bottom-screen/bottom-bar.png differ diff --git a/app/assets/images/contact/bottom-screen/notification.png b/app/assets/images/contact/bottom-screen/notification.png new file mode 100644 index 0000000..11283c9 Binary files /dev/null and b/app/assets/images/contact/bottom-screen/notification.png differ diff --git a/app/assets/images/contact/bottom-screen/ok-button.png b/app/assets/images/contact/bottom-screen/ok-button.png new file mode 100644 index 0000000..31916cc Binary files /dev/null and b/app/assets/images/contact/bottom-screen/ok-button.png differ diff --git a/app/assets/images/contact/bottom-screen/top-bar.png b/app/assets/images/contact/bottom-screen/top-bar.png index b9c29c1..4d0eab7 100644 Binary files a/app/assets/images/contact/bottom-screen/top-bar.png and b/app/assets/images/contact/bottom-screen/top-bar.png differ diff --git a/app/assets/images/contact/top-screen/left-bar-things.png b/app/assets/images/contact/top-screen/left-bar-things.png index fd65f17..bc305aa 100644 Binary files a/app/assets/images/contact/top-screen/left-bar-things.png and b/app/assets/images/contact/top-screen/left-bar-things.png differ diff --git a/app/components/Contact/BottomScreen/Bars.vue b/app/components/Contact/BottomScreen/Bars.vue index 9e161e9..ca0d5cf 100644 --- a/app/components/Contact/BottomScreen/Bars.vue +++ b/app/components/Contact/BottomScreen/Bars.vue @@ -1,20 +1,31 @@ @@ -29,4 +40,9 @@ useRender((ctx) => { src="/assets/images/contact/bottom-screen/bottom-bar.png" hidden /> + diff --git a/app/components/Contact/BottomScreen/BottomScreen.vue b/app/components/Contact/BottomScreen/BottomScreen.vue index d82747c..b0a76e9 100644 --- a/app/components/Contact/BottomScreen/BottomScreen.vue +++ b/app/components/Contact/BottomScreen/BottomScreen.vue @@ -6,7 +6,17 @@ import Bars from "./Bars.vue"; const store = useContactStore(); -const { selectorPosition } = useButtonNavigation({ +const ACTIONS = { + github: ["Open", "Github profile", "https://github.com/pihkaal"], + email: ["Copy", "Email", "hello@pihkaal.me"], + website: ["Copy", "Website link", "https://pihkaal.me"], + cv: ["Open", "CV", "https://pihkaal.me/cv"], +} as const satisfies Record< + string, + [action: "Copy" | "Open", verb: string, content: string] +>; + +const { selectedButton, selectorPosition } = useButtonNavigation({ buttons: { github: [26, 27, 202, 42], email: [26, 59, 202, 42], @@ -30,8 +40,19 @@ const { selectorPosition } = useButtonNavigation({ }, }, initialButton: "github", - onButtonClick: (buttonName) => { - console.log("Clicked on selected button:", buttonName); + onButtonClick: async (button) => { + const [action, verb, content] = ACTIONS[button]; + if (action === "Copy") { + try { + await navigator.clipboard.writeText(content); + store.pushNotification(`${verb} copied to clipboard`); + } catch (error) { + console.error("Failed to copy to clipboard:", error); + } + } else { + await navigateTo(content, { open: { target: "_blank " } }); + store.pushNotification(`${verb} opened`); + } }, }); @@ -45,5 +66,5 @@ const { selectorPosition } = useButtonNavigation({ :opacity="store.isIntro ? store.intro.stage3Opacity : 1" /> - + diff --git a/app/components/Contact/TopScreen/Notifications.vue b/app/components/Contact/TopScreen/Notifications.vue new file mode 100644 index 0000000..5ba8df1 --- /dev/null +++ b/app/components/Contact/TopScreen/Notifications.vue @@ -0,0 +1,83 @@ + + + diff --git a/app/components/Contact/TopScreen/Title.vue b/app/components/Contact/TopScreen/Title.vue deleted file mode 100644 index 92270d3..0000000 --- a/app/components/Contact/TopScreen/Title.vue +++ /dev/null @@ -1,24 +0,0 @@ - - - diff --git a/app/components/Contact/TopScreen/TopScreen.vue b/app/components/Contact/TopScreen/TopScreen.vue index 2dae452..9d03d30 100644 --- a/app/components/Contact/TopScreen/TopScreen.vue +++ b/app/components/Contact/TopScreen/TopScreen.vue @@ -1,7 +1,7 @@