dash-frontend: Donation screen, translation keys for welcome screen

This commit is contained in:
Aleksander 2026-07-02 19:25:20 +02:00
parent 6090be3d9c
commit c3f762a0f3
17 changed files with 230 additions and 32 deletions

View File

@ -0,0 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewBox="0 0 24 24"><!-- Icon from Iconoir by Luca Burgio - https://github.com/iconoir-icons/iconoir/blob/main/LICENSE --><g fill="none" stroke="currentColor" stroke-linejoin="round" stroke-width="1.5"><path d="M16 6.28a2.28 2.28 0 0 1-.662 1.606c-.976.984-1.923 2.01-2.936 2.958a.597.597 0 0 1-.822-.017l-2.918-2.94a2.28 2.28 0 0 1 0-3.214a2.277 2.277 0 0 1 3.232 0L12 4.78l.106-.107A2.276 2.276 0 0 1 16 6.28Z"/><path stroke-linecap="round" d="m18 20l3.824-3.824a.6.6 0 0 0 .176-.424V10.5A1.5 1.5 0 0 0 20.5 9v0a1.5 1.5 0 0 0-1.5 1.5V15"/><path stroke-linecap="round" d="m18 16l.858-.858a.48.48 0 0 0 .142-.343v0a.49.49 0 0 0-.268-.433l-.443-.221a2 2 0 0 0-2.308.374l-.895.895a2 2 0 0 0-.586 1.414V20M6 20l-3.824-3.824A.6.6 0 0 1 2 15.752V10.5A1.5 1.5 0 0 1 3.5 9v0A1.5 1.5 0 0 1 5 10.5V15"/><path stroke-linecap="round" d="m6 16l-.858-.858A.5.5 0 0 1 5 14.799v0c0-.183.104-.35.268-.433l.443-.221a2 2 0 0 1 2.308.374l.895.895a2 2 0 0 1 .586 1.414V20"/></g></svg>

After

Width:  |  Height:  |  Size: 1.0 KiB

View File

@ -0,0 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewBox="0 0 256 256"><!-- Icon from SVG Logos by Gil Barbara - https://raw.githubusercontent.com/gilbarbara/logos/master/LICENSE.txt --><path fill="#b8d3f4" d="M209.765 128.15c0 16.013-4.9 31.34-13.266 44.575l33.447 33.447a128.9 128.9 0 0 0 25.783-77.35c0-29.265-9.754-55.751-26.47-77.336l-32.776 32.729a79.44 79.44 0 0 1 13.267 43.888z"/><path fill="#7fadf2" d="M127.513 210.355c-45.367-.086-82.125-36.838-82.22-82.205c.069-45.386 36.835-82.166 82.22-82.252c16.732 0 32.058 4.901 44.607 13.267l32.744-32.776A128.97 128.97 0 0 0 127.514.636C57.123.636 0 57.76 0 128.15c0 70.359 57.124 127.513 127.513 127.513a125.13 125.13 0 0 0 77.351-26.501l-33.447-33.431c-11.861 9.754-27.157 14.624-43.904 14.624"/></svg>

After

Width:  |  Height:  |  Size: 772 B

File diff suppressed because one or more lines are too long

After

Width:  |  Height:  |  Size: 9.5 KiB

View File

@ -0,0 +1,31 @@
<layout>
<include src="../t_group_box.xml" />
<elements>
<div position="absolute" width="100%" height="100%" padding="4">
<!-- <rectangle width="100%" height="100%" color="#000000" round="6"/> -->
</div>
<div margin="32" flex_direction="column" align_items="center" gap="16">
<div gap="16" align_items="center" width="100%">
<sprite color="#FFAAAA" src_builtin="dashboard/donate.svg" min_width="64" min_height="64"/>
<label wrap="1" size="20" translation="DONATE.DESCRIPTION"/>
</div>
<label weight="bold" size="24" translation="DONATE.THANK_YOU"/>
<div flex_direction="column" gap="8" align_items="center" margin_top="16">
<Button id="btn_donate" tooltip="DONATE.BUTTON_TOOLTIP" align_self="baseline">
<image src_builtin="dashboard/opencollective_logo.svg" width="252" height="42" margin="8" margin_left="16" margin_right="16"/>
</Button>
<label text="opencollective.com/wayvr-org" color="~color-accent"/>
</div>
<!--
<rectangle color="#FFFFFF33" width="100%" height="2"/>
<rectangle macro="group_box" align_self="start" width="100%">
<label weight="bold" size="18" translation="DONATE.CURRENT_SUPPORTERS"/>
</rectangle>
-->
</div>
</elements>
</layout>

View File

@ -8,7 +8,7 @@
align_items="center"
flex_grow="1"
gap="24">
<sprite src_builtin="dashboard/wayvr_dashboard.png" width="96" height="96" />
<image src_builtin="dashboard/splash.png" width="300" height="89" />
<label id="label_hello" size="32" weight="bold" />
<!-- main button list -->
@ -19,9 +19,15 @@
<MenuButton id="btn_settings" icon="dashboard/settings.svg" translation="SETTINGS" />
</div>
<Button id="btn_welcome_screen" macro="home_button" tooltip="APP_SETTINGS.SHOW_WELCOME_SCREEN">
<sprite src_builtin="dashboard/welcome.svg" width="32" height="32" margin="16"/>
</Button>
<div gap="8">
<Button id="btn_welcome_screen" macro="home_button" tooltip="APP_SETTINGS.SHOW_WELCOME_SCREEN">
<sprite src_builtin="dashboard/welcome.svg" width="32" height="32" margin="16"/>
</Button>
<Button id="btn_donate" macro="home_button" tooltip="DONATE.SUPPORT_US">
<sprite src_builtin="dashboard/opencollective.svg" width="32" height="32" margin="16"/>
</Button>
</div>
</div>
</elements>
</layout>

View File

@ -3,17 +3,17 @@
<template name="PageTitle">
<div position="absolute" align_self="start" justify_self="center" width="100%" margin_top="16" gap="8" align_items="center" justify_content="center">
<sprite width="48" height="48" src_builtin="${icon}" color="#FFFFFF"/>
<label size="28" weight="bold" text="${title}" shadow="#000000" shadow_x="3" shadow_y="3" />
<label size="28" weight="bold" translation="${translation}" shadow="#000000" shadow_x="3" shadow_y="3" />
</div>
</template>
<!-- text -->
<template name="TextDesc">
<label wrap="1" text="${text}" size="20" width="500" shadow="#000000" weight="bold"/>
<label wrap="1" translation="${translation}" size="20" width="500" shadow="#000000" weight="bold"/>
</template>
<template name="TextDescBig">
<label text="${text}" size="24" shadow="#000000" weight="bold"/>
<label translation="${translation}" size="24" shadow="#000000" weight="bold"/>
</template>
<macro name="video_overlay_component" looping="1" width="100%" height="auto" max_height="100%" aspect_ratio="1.777777" position="relative"/>

View File

@ -4,11 +4,16 @@
<rectangle color="#FFFFFF11" width="100%" height="2"/>
<label weight="bold" size="32" text="Hi there!"/>
<label weight="bold" size="20" text="Thank you for installing WayVR ❤️"/>
<label weight="bold" size="32" translation="WELCOME.GREETING"/>
<label weight="bold" size="20" translation="WELCOME.THANKS_FOR_INSTALLING"/>
<label size="20" margin_top="16" text="Let us guide you through your first steps."/>
<label size="20" text="Press &quot;Next&quot; button below to get started."/>
<label size="20" margin_top="16" translation="WELCOME.GUIDE_INTRO"/>
<label size="20" translation="WELCOME.NEXT_BUTTON"/>
<div gap="4" align_items="center">
<sprite min_width="16" min_height="16" src_builtin="dashboard/info.svg"/>
<label wrap="1" size="14" translation="WELCOME.REPOSITION_THIS_WINDOW_BY_GRABBING"/>
</div>
<div height="42"/> <!-- empty space -->
</elements>

View File

@ -5,9 +5,9 @@
<rectangle color="#103142" width="100%" height="100%" position="absolute"/>
<Video macro="video_overlay_component" src_builtin="video/onboarding_watch.ivf" aspect_ratio="1.0">
<div macro="video_overlay_content">
<PageTitle icon="dashboard/watch.svg" title="Watch"/>
<PageTitle icon="dashboard/watch.svg" translation="WELCOME.WATCH"/>
<div position="relative" align_self="end" padding="16">
<TextDesc text="Look at your left wrist. That's your watch."/>
<TextDesc translation="WELCOME.LOOK_AT_LEFT_WRIST"/>
</div>
</div>
</Video>

View File

@ -4,9 +4,9 @@
<elements>
<Video macro="video_overlay_component" src_builtin="video/onboarding_double_press.ivf">
<div macro="video_overlay_content">
<PageTitle icon="dashboard/panorama.svg" title="Working Set"/>
<PageTitle icon="dashboard/panorama.svg" translation="WELCOME.WORKING_SET"/>
<div position="relative" align_self="end" padding="16">
<TextDesc text="Double-press B (on Index) or Y (on Meta) to toggle the visibility of your workspace. Try it now."/>
<TextDesc translation="WELCOME.DOUBLE_PRESS_TO_TOGGLE"/>
</div>
</div>
</Video>

View File

@ -4,14 +4,14 @@
<elements>
<Video macro="video_overlay_component" src_builtin="video/onboarding_laser_colors.ivf">
<div macro="video_overlay_content">
<PageTitle icon="dashboard/click.svg" title="Laser Colors"/>
<PageTitle icon="dashboard/click.svg" translation="WELCOME.LASER_COLORS"/>
<div position="relative" flex_direction="row" gap="16" margin="16" align_self="end" justify_self="end" align_items="center">
<rectangle flex_direction="column" gap="8" padding="8" round="4" border_color="~color_accent" border="2" >
<label size="16" weight="bold" color="#00FFFF" text="— Regular Mode: Blue laser"/>
<label size="16" weight="bold" color="#FFAA00" text="— Right-click Mode: Orange laser" />
<label size="16" weight="bold" color="#FF88FF" text="— Middle-click Mode: Purple laser" />
<label size="16" weight="bold" color="#00FFFF" translation="WELCOME.REGULAR_MODE_BLUE_LASER"/>
<label size="16" weight="bold" color="#FFAA00" translation="WELCOME.RIGHT_CLICK_MODE_ORANGE_LASER"/>
<label size="16" weight="bold" color="#FF88FF" translation="WELCOME.MIDDLE_CLICK_MODE_PURPLE_LASER"/>
</rectangle>
<label wrap="1" size="18" width="450" weight="bold" shadow="#000000" text="Much of the functionality in WayVR depends on what color of laser is used to interact with a UI element. You don't need to press these buttons, just touch them!"/>
<label wrap="1" size="18" width="450" weight="bold" shadow="#000000" translation="WELCOME.LASER_FUNCTIONALITY"/>
</div>
</div>
</Video>

View File

@ -5,13 +5,13 @@
<rectangle color="#0A2939" width="100%" height="100%" position="absolute"/>
<Video macro="video_overlay_component" src_builtin="video/onboarding_center_marker.ivf" aspect_ratio="1.33333">
<div macro="video_overlay_content">
<PageTitle icon="dashboard/panorama.svg" title="Moving your set"/>
<PageTitle icon="dashboard/panorama.svg" translation="WELCOME.MOVING_YOUR_SET"/>
<div position="relative" align_self="end" padding="16" flex_direction="column" gap="4">
<label shadow="#000000" size="14" weight="bold" wrap="1" color="#aaffcc" text="— Grab it with one hand to move your set."/>
<label shadow="#000000" size="14" weight="bold" wrap="1" color="#ccaaff" text="— Grab it with both hands if you want to move a specific overlay in your set."/>
<label shadow="#000000" size="14" weight="bold" wrap="1" color="#aaffcc" translation="WELCOME.GRAB_ONE_HAND"/>
<label shadow="#000000" size="14" weight="bold" wrap="1" color="#ccaaff" translation="WELCOME.GRAB_BOTH_HANDS"/>
<div align_items="center" gap="8">
<sprite src_builtin="dashboard/info.svg" width="24" height="24" color="#ffff00"/>
<label shadow="#000000" size="16" weight="bold" wrap="1" color="#ffff00" text="Center marker determines the center or your set."/>
<label shadow="#000000" size="16" weight="bold" wrap="1" color="#ffff00" translation="WELCOME.CENTER_MARKER"/>
</div>
</div>
</div>

View File

@ -5,14 +5,14 @@
<div flex_direction="row" align_items="center">
<image src_builtin="dashboard/check_3d.png" width="256" height="256"/>
<div flex_direction="column" gap="8" max_width="480">
<TextDescBig text="You're all set!"/>
<label size="16" wrap="1" text="These basics will allow you to start using WayVR with ease."/>
<label size="16" wrap="1" text="There are many other features worth customizing. For more information, check the documentation at"/>
<TextDescBig translation="WELCOME.ALL_SET"/>
<label size="16" wrap="1" translation="WELCOME.BASICS"/>
<label size="16" wrap="1" translation="WELCOME.FEATURES_DOCUMENTATION"/>
<div flex_direction="row" align_items="center" gap="8">
<sprite src_builtin="dashboard/globe.svg" width="24" height="24" color="~color_accent"/>
<label size="20" weight="bold" text="wayvr.org" color="~color_accent"/>
</div>
<Button margin_top="16" sprite_src_builtin="dashboard/home.svg" id="btn_home_screen" text="Go back to Home screen" min_height="32" align_self="baseline"/>
<Button margin_top="16" sprite_src_builtin="dashboard/home.svg" id="btn_home_screen" translation="WELCOME.GO_BACK_HOME" min_height="32" align_self="baseline"/>
</div>
</div>
</elements>

View File

@ -167,7 +167,6 @@
"ENABLE_WATCH": "Enable watch",
"SETS_ON_WATCH": "Sets on watch",
"SHOW_WELCOME_SCREEN": "Show welcome screen",
"SHOW_WELCOME_SCREEN_HELP": "Show welcome screen on next start",
"SKYBOX": "Skybox",
"SKYMAP_ALREADY_DOWNLOADED": "This skymap is already downloaded. Select desired action.",
"SPACE_DRAG": "Space drag",
@ -221,7 +220,38 @@
"CREATION_DATE": "Creation date",
"DEBUG_INFO": "Debug info",
"DISPLAY_BRIGHTNESS": "Display brightness",
"DONATE": {
"SUPPORT_US": "Support us",
"DESCRIPTION": "We're a small team of 2 developers building WayVR in our free time. If you enjoy using this software, please consider supporting us - every donation helps us keep going.",
"THANK_YOU": "Thank you!",
"BUTTON_TOOLTIP": "Donate via Open Collective",
"CURRENT_SUPPORTERS": "Current Supporters"
},
"DOWNLOADER": "Downloader",
"WELCOME": {
"GREETING": "Hi there!",
"THANKS_FOR_INSTALLING": "Thank you for installing WayVR!",
"GUIDE_INTRO": "Let us guide you through your first steps.",
"NEXT_BUTTON": "Press \"Next\" button below to get started.",
"WATCH": "Watch",
"LOOK_AT_LEFT_WRIST": "Look at your left wrist. That's your watch.",
"WORKING_SET": "Working Set",
"DOUBLE_PRESS_TO_TOGGLE": "Double-press B (on Index) or Y (on Meta) to toggle the visibility of your workspace. Try it now.",
"LASER_COLORS": "Laser Colors",
"REGULAR_MODE_BLUE_LASER": "— Regular Mode: Blue laser",
"REPOSITION_THIS_WINDOW_BY_GRABBING": "Reposition this window using your controller's grip action.",
"RIGHT_CLICK_MODE_ORANGE_LASER": "— Right-click Mode: Orange laser",
"MIDDLE_CLICK_MODE_PURPLE_LASER": "— Middle-click Mode: Purple laser",
"LASER_FUNCTIONALITY": "Much of the functionality in WayVR depends on what color of laser is used to interact with a UI element. You don't need to press these buttons, just touch them!",
"MOVING_YOUR_SET": "Moving your set",
"GRAB_ONE_HAND": "Grab it with one hand to move your set.",
"GRAB_BOTH_HANDS": "Grab it with both hands if you want to move a specific overlay in your set.",
"CENTER_MARKER": "Center marker determines the center or your set.",
"ALL_SET": "You're all set!",
"BASICS": "These basics will allow you to start using WayVR with ease.",
"FEATURES_DOCUMENTATION": "There are many other features worth customizing. For more information, check the documentation at",
"GO_BACK_HOME": "Go back to Home screen"
},
"DOWNLOAD_AGAIN": "Download again",
"DOWNLOADING_FILE": "Downloading file...",
"FAILED_TO_LAUNCH_APPLICATION": "Failed to launch a application:",

View File

@ -29,8 +29,8 @@ use wlx_common::{
use crate::{
assets,
tab::{
apps::TabApps, games::TabGames, home::TabHome, monado::TabMonado, settings::TabSettings, welcome::TabWelcome, Tab,
TabType,
Tab, TabType, apps::TabApps, donate::TabDonate, games::TabGames, home::TabHome, monado::TabMonado,
settings::TabSettings, welcome::TabWelcome,
},
util::{
popup_manager::{MountPopupOnceParams, PopupManager, PopupManagerParams},
@ -414,6 +414,7 @@ impl<T: 'static> Frontend<T> {
TabType::Games => ("GAMES", "dashboard/games.svg"),
TabType::Monado => ("MONADO_RUNTIME", "dashboard/monado.svg"),
TabType::Settings => ("SETTINGS", "dashboard/settings.svg"),
TabType::Donate => ("DONATE.SUPPORT_US", "dashboard/opencollective.svg"),
};
self.set_tab_title(tab_translation, icon_path)?;
@ -425,6 +426,7 @@ impl<T: 'static> Frontend<T> {
TabType::Games => Box::new(TabGames::new(self, widget_content.id)?),
TabType::Monado => Box::new(TabMonado::new(self, widget_content.id)?),
TabType::Settings => Box::new(TabSettings::new(self, widget_content.id, data)?),
TabType::Donate => Box::new(TabDonate::new(self, widget_content.id, data)?),
};
self.current_tab = Some(tab);

View File

@ -0,0 +1,64 @@
use std::{marker::PhantomData, rc::Rc};
use wgui::{
assets::AssetPath,
components::button::ComponentButton,
globals::WguiGlobals,
layout::{Layout, WidgetID},
parser::{Fetchable, ParseDocumentParams, ParserState, TemplateParams},
task::Tasks,
};
use crate::{
frontend::{Frontend, FrontendTask, FrontendTasks},
tab::{Tab, TabType},
};
#[derive(Clone)]
#[allow(clippy::enum_variant_names)]
enum Task {}
pub struct TabDonate<T> {
#[allow(dead_code)]
pub state: ParserState,
marker: PhantomData<T>,
tasks: Tasks<Task>,
frontend_tasks: FrontendTasks,
}
impl<T> Tab<T> for TabDonate<T> {
fn get_type(&self) -> TabType {
TabType::Donate
}
fn update(&mut self, frontend: &mut Frontend<T>, _time_ms: u32, _user_data: &mut T) -> anyhow::Result<()> {
for task in self.tasks.drain() {
match task {}
}
Ok(())
}
}
fn doc_params(globals: &WguiGlobals) -> ParseDocumentParams<'_> {
ParseDocumentParams {
globals: globals.clone(),
path: AssetPath::BuiltIn("gui/tab/donate.xml"),
extra: Default::default(),
}
}
impl<T> TabDonate<T> {
pub fn new(frontend: &mut Frontend<T>, parent_id: WidgetID, _data: &mut T) -> anyhow::Result<Self> {
let state = wgui::parser::parse_from_assets(&doc_params(&frontend.globals), &mut frontend.layout, parent_id)?;
let tasks = Tasks::<Task>::new();
Ok(Self {
state,
marker: PhantomData,
tasks,
frontend_tasks: frontend.tasks.clone(),
})
}
}

View File

@ -71,6 +71,7 @@ impl<T> TabHome<T> {
let btn_monado = state.fetch_component_as::<ComponentButton>("btn_monado")?;
let btn_settings = state.fetch_component_as::<ComponentButton>("btn_settings")?;
let btn_welcome_screen = state.fetch_component_as::<ComponentButton>("btn_welcome_screen")?;
let btn_donate = state.fetch_component_as::<ComponentButton>("btn_donate")?;
let tasks = &mut frontend.tasks;
tasks.handle_button(&btn_apps, FrontendTask::SetTab(TabType::Apps));
@ -78,6 +79,7 @@ impl<T> TabHome<T> {
tasks.handle_button(&btn_monado, FrontendTask::SetTab(TabType::Monado));
tasks.handle_button(&btn_settings, FrontendTask::SetTab(TabType::Settings));
tasks.handle_button(&btn_welcome_screen, FrontendTask::SetTab(TabType::Welcome));
tasks.handle_button(&btn_donate, FrontendTask::SetTab(TabType::Donate));
Ok(Self {
state,

View File

@ -1,6 +1,7 @@
use crate::frontend::Frontend;
pub mod apps;
pub mod donate;
pub mod games;
pub mod home;
pub mod monado;
@ -15,12 +16,13 @@ pub enum TabType {
Monado,
Settings,
Welcome,
Donate,
}
impl TabType {
pub fn get_preferred_padding(&self) -> f32 {
match self {
TabType::Welcome => 0.0,
TabType::Welcome | TabType::Donate => 0.0,
_ => 16.0,
}
}