Mirrors
/
Zelda64Recomp
mirror of https://github.com/Mr-Wiseguy/Zelda64Recomp.git
0
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

global description handler and impl

This commit is contained in:
thecozies 2024-04-04 08:32:22 -05:00
parent 6848645854
commit 56504a71b4
5 changed files with 112 additions and 88 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

7
assets/config_menu.rml
View File

@ -22,9 +22,6 @@
flex: 1;
text-align: center;
}
#tab_graphics:selected {
nav-down:#res_auto;
}
</style>
<link type="text/template" href="config_menu/general.rml" />
<link type="text/template" href="config_menu/controls.rml" />
@ -38,7 +35,7 @@
<div class="centered-page" onclick="close_config_menu_backdrop">
<div class="centered-page__modal">
<tabset class="tabs" id="config_tabset">
<tab class="tab" autofocus>
<tab class="tab" autofocus id="tab_general">
<div>General</div>
<div class="tab__indicator"></div>
</tab>
@ -59,7 +56,7 @@
<panel class="config" data-model="graphics_model">
<template src="config-menu__graphics" />
</panel>
<tab class="tab">
<tab class="tab" id="tab_sound">
<div>Sound</div>
<div class="tab__indicator"></div>
</tab>

22
assets/config_menu/general.rml
View File

@ -6,35 +6,45 @@
<div class="config__hz-wrapper">
<!-- Options -->
<div class="config__wrapper">
<div class="config-option">
<!-- targeting mode -->
<div class="config-option" data-event-mouseover="set_cur_config_index(0)">
<label class="config-option__title">Targeting Mode</label>
<div class="config-option__list">
<input
type="radio"
data-event-blur="set_cur_config_index(-1)"
data-event-focus="set_cur_config_index(0)"
name="targeting_mode"
data-checked="targeting_mode"
value="Switch"
id="tm_switch"
style="nav-up: #tab_general; nav-down: #rumble_strength_input"
/>
<label class="config-option__tab-label" for="tm_switch">Switch</label>
<input
type="radio"
data-event-blur="set_cur_config_index(-1)"
data-event-focus="set_cur_config_index(0)"
name="targeting_mode"
data-checked="targeting_mode"
value="Hold"
id="tm_hold"
style="nav-up: #tab_general; nav-down: #rumble_strength_input"
/>
<label class="config-option__tab-label" for="tm_hold">Hold</label>
</div>
</div>
<div class="config-option">
<!-- rumble strength -->
<div class="config-option" data-event-mouseover="set_cur_config_index(1)">
<label class="config-option__title">Rumble Strength</label>
<div class="config-option__range-wrapper config-option__list">
<label class="config-option__range-label">{{rumble_strength}}</label>
<input
class="nav-vert"
data-event-blur="set_cur_config_index(-1)"
data-event-focus="set_cur_config_index(1)"
id="rumble_strength_input"
type="range"
min="0"
@ -47,11 +57,11 @@
</div>
<!-- Descriptions -->
<div class="config__wrapper">
<p data-if="0 == 0">
First.
<p data-if="cur_config_index == 0">
Whether or not targeting is done incorrectly, or targets while you hold the button.
</p>
<p data-if="1 == 1">
Second.
<p data-if="cur_config_index == 1">
How much your controller go brrrrr
</p>
</div>
</div>

112
assets/config_menu/graphics.rml
View File

@ -4,13 +4,13 @@
<body>
<form class="config__form">
<div class="config__hz-wrapper">
<div class="config__wrapper" data-event-mouseout="set_current_gfx_description(-1)">
<div class="config-option" data-event-mouseover="set_current_gfx_description(0)">
<div class="config__wrapper" data-event-mouseout="set_cur_config_index(-1)">
<div class="config-option" data-event-mouseover="set_cur_config_index(0)">
<label class="config-option__title">Resolution</label>
<div class="config-option__list">
<input type="radio"
data-event-blur="set_current_gfx_description(-1)"
data-event-focus="set_current_gfx_description(0)"
data-event-blur="set_cur_config_index(-1)"
data-event-focus="set_cur_config_index(0)"
name="resolution"
data-checked="res_option"
value="Original"
@ -20,8 +20,8 @@
/>
<label class="config-option__tab-label" for="res_original">Original</label>
<input type="radio"
data-event-blur="set_current_gfx_description(-1)"
data-event-focus="set_current_gfx_description(0)"
data-event-blur="set_cur_config_index(-1)"
data-event-focus="set_cur_config_index(0)"
name="resolution"
data-checked="res_option"
value="Original2x"
@ -31,8 +31,8 @@
/>
<label class="config-option__tab-label" for="res_2x">Original 2x</label>
<input type="radio"
data-event-blur="set_current_gfx_description(-1)"
data-event-focus="set_current_gfx_description(0)"
data-event-blur="set_cur_config_index(-1)"
data-event-focus="set_cur_config_index(0)"
name="resolution"
data-checked="res_option"
value="Auto"
@ -44,12 +44,12 @@
</div>
</div>
<div class="config-option" data-event-mouseover="set_current_gfx_description(1)">
<div class="config-option" data-event-mouseover="set_cur_config_index(1)">
<label class="config-option__title">Downsampling Quality</label>
<div class="config-option__list">
<input type="radio"
data-event-blur="set_current_gfx_description(-1)"
data-event-focus="set_current_gfx_description(1)"
data-event-blur="set_cur_config_index(-1)"
data-event-focus="set_cur_config_index(1)"
name="downsampling"
data-attrif-disabled="res_option == 'Auto'"
data-checked="ds_option"
@ -59,8 +59,8 @@
/>
<label class="config-option__tab-label" for="ds_windowed">Off</label>
<input type="radio"
data-event-blur="set_current_gfx_description(-1)"
data-event-focus="set_current_gfx_description(1)"
data-event-blur="set_cur_config_index(-1)"
data-event-focus="set_cur_config_index(1)"
name="downsampling"
data-attrif-disabled="res_option == 'Auto'"
data-checked="ds_option"
@ -70,8 +70,8 @@
/>
<label class="config-option__tab-label" for="ds_2x">2x</label>
<input type="radio"
data-event-blur="set_current_gfx_description(-1)"
data-event-focus="set_current_gfx_description(1)"
data-event-blur="set_cur_config_index(-1)"
data-event-focus="set_cur_config_index(1)"
name="downsampling"
data-attrif-disabled="res_option == 'Auto'"
data-checked="ds_option"
@ -84,12 +84,12 @@
</div>
</div>
<div class="config-option" data-event-mouseover="set_current_gfx_description(2)">
<div class="config-option" data-event-mouseover="set_cur_config_index(2)">
<label class="config-option__title">Aspect Ratio</label>
<div class="config-option__list">
<input type="radio"
data-event-blur="set_current_gfx_description(-1)"
data-event-focus="set_current_gfx_description(2)"
data-event-blur="set_cur_config_index(-1)"
data-event-focus="set_cur_config_index(2)"
name="aspectratio"
data-checked="ar_option"
value="Original"
@ -99,8 +99,8 @@
/>
<label class="config-option__tab-label" for="ar_original">Original</label>
<input type="radio"
data-event-blur="set_current_gfx_description(-1)"
data-event-focus="set_current_gfx_description(2)"
data-event-blur="set_cur_config_index(-1)"
data-event-focus="set_cur_config_index(2)"
name="aspectratio"
data-checked="ar_option"
value="Expand"
@ -112,12 +112,12 @@
</div>
</div>
<div class="config-option" data-event-mouseover="set_current_gfx_description(3)">
<div class="config-option" data-event-mouseover="set_cur_config_index(3)">
<label class="config-option__title">Window Mode</label>
<div class="config-option__list">
<input type="radio"
data-event-blur="set_current_gfx_description(-1)"
data-event-focus="set_current_gfx_description(3)"
data-event-blur="set_cur_config_index(-1)"
data-event-focus="set_cur_config_index(3)"
name="windowmode"
data-checked="wm_option"
value="Windowed"
@ -126,8 +126,8 @@
/>
<label class="config-option__tab-label" for="wm_windowed">Windowed</label>
<input type="radio"
data-event-blur="set_current_gfx_description(-1)"
data-event-focus="set_current_gfx_description(3)"
data-event-blur="set_cur_config_index(-1)"
data-event-focus="set_cur_config_index(3)"
name="windowmode"
data-checked="wm_option"
value="Fullscreen"
@ -138,12 +138,12 @@
</div>
</div>
<div class="config-option" data-event-mouseover="set_current_gfx_description(4)">
<div class="config-option" data-event-mouseover="set_cur_config_index(4)">
<label class="config-option__title">Framerate</label>
<div class="config-option__list">
<input type="radio"
data-event-blur="set_current_gfx_description(-1)"
data-event-focus="set_current_gfx_description(4)"
data-event-blur="set_cur_config_index(-1)"
data-event-focus="set_cur_config_index(4)"
name="refreshrate"
data-checked="rr_option"
value="Original"
@ -152,8 +152,8 @@
/>
<label class="config-option__tab-label" for="rr_original">Original</label>
<input type="radio"
data-event-blur="set_current_gfx_description(-1)"
data-event-focus="set_current_gfx_description(4)"
data-event-blur="set_cur_config_index(-1)"
data-event-focus="set_cur_config_index(4)"
name="refreshrate"
data-checked="rr_option"
value="Display"
@ -162,8 +162,8 @@
/>
<label class="config-option__tab-label" for="rr_display">Display</label>
<input type="radio"
data-event-blur="set_current_gfx_description(-1)"
data-event-focus="set_current_gfx_description(4)"
data-event-blur="set_cur_config_index(-1)"
data-event-focus="set_cur_config_index(4)"
name="refreshrate"
data-checked="rr_option"
value="Manual"
@ -175,8 +175,8 @@
<div data-if="rr_option=='Manual'" class="config-option__range-wrapper config-option__list">
<label class="config-option__range-label">{{rr_manual_value}}</label>
<input
data-event-blur="set_current_gfx_description(-1)"
data-event-focus="set_current_gfx_description(4)"
data-event-blur="set_cur_config_index(-1)"
data-event-focus="set_cur_config_index(4)"
id="rr_manual_input"
type="range"
min="20"
@ -187,12 +187,12 @@
</div>
</div>
<div class="config-option" data-event-mouseover="set_current_gfx_description(5)">
<div class="config-option" data-event-mouseover="set_cur_config_index(5)">
<label class="config-option__title">MS Anti-Aliasing</label>
<div class="config-option__list">
<input type="radio"
data-event-blur="set_current_gfx_description(-1)"
data-event-focus="set_current_gfx_description(5)"
data-event-blur="set_cur_config_index(-1)"
data-event-focus="set_cur_config_index(5)"
name="antialiasing"
data-checked="msaa_option"
value="None"
@ -201,8 +201,8 @@
/>
<label class="config-option__tab-label" for="msaa_none">None</label>
<input type="radio"
data-event-blur="set_current_gfx_description(-1)"
data-event-focus="set_current_gfx_description(5)"
data-event-blur="set_cur_config_index(-1)"
data-event-focus="set_cur_config_index(5)"
name="antialiasing"
data-attrif-disabled="!msaa2x_supported"
data-checked="msaa_option"
@ -212,8 +212,8 @@
/>
<label class="config-option__tab-label" for="msaa_2x">2x</label>
<input type="radio"
data-event-blur="set_current_gfx_description(-1)"
data-event-focus="set_current_gfx_description(5)"
data-event-blur="set_cur_config_index(-1)"
data-event-focus="set_cur_config_index(5)"
name="antialiasing"
data-attrif-disabled="!msaa4x_supported"
data-checked="msaa_option"
@ -222,18 +222,16 @@
data-attr-style="rr_option=='Manual' ? 'nav-up: #rr_manual_input; nav-down: #hr_full' : 'nav-up: #rr_manual; nav-down: #hr_full'"
/>
<label class="config-option__tab-label" for="msaa_4x">4x</label>
<!-- <input type="radio" data-event-blur="set_current_gfx_description(-1)" name="antialiasing" data-checked="msaa_option" value="MSAA8X" id="msaa_8x" style="nav-right:none;nav-down:#apply_button"/>
<label class="config-option__tab-label" for="msaa_8x">8x</label> -->
<div class="config-option__details" data-if="!sample_positions_supported">Not available (missing sample positions support)</div>
</div>
</div>
<div class="config-option" data-event-mouseover="set_current_gfx_description(6)">
<div class="config-option" data-event-mouseover="set_cur_config_index(6)">
<label class="config-option__title">HUD Placement</label>
<div class="config-option__list">
<input type="radio"
data-event-blur="set_current_gfx_description(-1)"
data-event-focus="set_current_gfx_description(6)"
data-event-blur="set_cur_config_index(-1)"
data-event-focus="set_cur_config_index(6)"
name="hr-option"
data-checked="hr_option"
value="Original"
@ -242,8 +240,8 @@
/>
<label class="config-option__tab-label" for="hr_original">Original</label>
<input type="radio"
data-event-blur="set_current_gfx_description(-1)"
data-event-focus="set_current_gfx_description(6)"
data-event-blur="set_cur_config_index(-1)"
data-event-focus="set_cur_config_index(6)"
name="hr-option"
data-checked="hr_option"
value="Clamp16x9"
@ -252,8 +250,8 @@
/>
<label class="config-option__tab-label" for="hr_16_9">16:9</label>
<input type="radio"
data-event-blur="set_current_gfx_description(-1)"
data-event-focus="set_current_gfx_description(6)"
data-event-blur="set_cur_config_index(-1)"
data-event-focus="set_cur_config_index(6)"
name="hr-option"
data-checked="hr_option"
value="Full"
@ -266,34 +264,34 @@
</div>
<div class="config__wrapper">
<p data-if="cur_gfx_description == 0">
<p data-if="cur_config_index == 0">
Sets the output resolution of the game. Original matches the game's original 240p resolution. Original 2x will render at 480p. Auto will scale based on the game window's resolution.
</p>
<p data-if="cur_gfx_description == 1">
<p data-if="cur_config_index == 1">
Renders at a higher resolution and scales it down to the output resolution for increased quality. Only available in Original and Original 2x resolution.
<br />
<br />
Note: 4x downsampling quality at Original 2x resolution may cause performance issues on low end devices, as it will cause the game to render at almost 4k internal resolution.
</p>
<p data-if="cur_gfx_description == 2">
<p data-if="cur_config_index == 2">
Sets the horizontal aspect ratio. Original uses the game's original 4:3 aspect ratio. Expand will adjust to match the game window's aspect ratio.
</p>
<p data-if="cur_gfx_description == 3">
<p data-if="cur_config_index == 3">
Sets whether the game should display on a Window or Fullscreen. You can also use Alt + Enter to toggle this option.
</p>
<p data-if="cur_gfx_description == 4">
<p data-if="cur_config_index == 4">
Sets the game's output framerate. This option does not affect gameplay.
<br />
<br />
Note: If you have issues with Display mode while using an external frame limiter, use Manual mode instead and configure it to that same frame limit.
</p>
<p data-if="cur_gfx_description == 5">
<p data-if="cur_config_index == 5">
Sets the multisample anti-aliasing (MSAA) quality level. This reduces jagged edges in the final image at the expense of rendering performance.
<br />
<br />
Note: This option won't be available if your GPU does not support programmable MSAA sample positions, as it is currently required to avoid rendering glitches.
</p>
<p data-if="cur_gfx_description == 6">
<p data-if="cur_config_index == 6">
Adjusts the placement of HUD elements to fit the selected aspect ratio. Expand will use the aspect ratio of the game's output window.
</p>
</div>

22
assets/config_menu/sound.rml
View File

@ -6,40 +6,48 @@
<div class="config__hz-wrapper">
<!-- Options -->
<div class="config__wrapper">
<div class="config-option">
<div class="config-option" data-event-mouseover="set_cur_config_index(0)">
<label class="config-option__title">Background Music Volume</label>
<div class="config-option__range-wrapper config-option__list">
<label class="config-option__range-label">{{bgm_volume}}</label>
<input
data-event-blur="set_cur_config_index(-1)"
data-event-focus="set_cur_config_index(0)"
class="nav-vert"
id="bgm_volume_input"
type="range"
min="0"
max="100"
style="flex: 1; margin: 0dp;"
style="flex: 1; margin: 0dp; nav-up: #tab_sound; nav-down: #lhb_on;"
data-value="bgm_volume"
/>
</div>
</div>
<div class="config-option">
<div class="config-option" data-event-mouseover="set_cur_config_index(1)">
<label class="config-option__title">Low Health Beeps</label>
<div class="config-option__list">
<input
type="radio"
data-event-blur="set_cur_config_index(-1)"
data-event-focus="set_cur_config_index(1)"
name="lhb"
data-checked="low_health_beeps_enabled"
value="1"
id="lhb_on"
style="nav-up: #bgm_volume_input"
/>
<label class="config-option__tab-label" for="lhb_on">On</label>
<input
type="radio"
data-event-blur="set_cur_config_index(-1)"
data-event-focus="set_cur_config_index(1)"
name="lhb"
data-checked="low_health_beeps_enabled"
value="0"
id="lhb_off"
style="nav-up: #bgm_volume_input"
/>
<label class="config-option__tab-label" for="lhb_off">Off</label>
</div>
@ -47,11 +55,11 @@
</div>
<!-- Descriptions -->
<div class="config__wrapper">
<p data-if="0 == 0">
First.
<p data-if="cur_config_index == 0">
Controls the overall volume of background music
</p>
<p data-if="1 == 1">
Second.
<p data-if="cur_config_index == 1">
Toggles whether or not the low-health beeping sound plays.
</p>
</div>
</div>

37
src/ui/ui_config.cpp
View File

@ -70,7 +70,7 @@ void bind_atomic(Rml::DataModelConstructor& constructor, Rml::DataModelHandle ha
static int scanned_binding_index = -1;
static int scanned_input_index = -1;
static int focused_input_index = -1;
static int focused_gfx_index = -1;
static int focused_config_option_index = -1;
static bool msaa2x_supported = false;
static bool msaa4x_supported = false;
@ -292,6 +292,22 @@ public:
recomp::do_warp(debug_context.area_index, debug_context.scene_index, debug_context.entrance_index);
});
}
void bind_config_list_events(Rml::DataModelConstructor &constructor) {
constructor.BindEventCallback("set_cur_config_index",
[](Rml::DataModelHandle model_handle, Rml::Event& event, const Rml::VariantList& inputs) {
int option_index = inputs.at(0).Get<size_t>();
// watch for mouseout being overzealous during event bubbling, only clear if the event's attached element matches the current
if (option_index == -1 && event.GetType() == "mouseout" && event.GetCurrentElement() != event.GetTargetElement()) {
return;
}
focused_config_option_index = option_index;
model_handle.DirtyVariable("cur_config_index");
});
constructor.Bind("cur_config_index", &focused_config_option_index);
}
void make_graphics_bindings(Rml::Context* context) {
Rml::DataModelConstructor constructor = context->CreateDataModel("graphics_model");
if (!constructor) {
@ -303,6 +319,7 @@ public:
std::this_thread::sleep_for(50ms);
}
new_options = ultramodern::get_graphics_config();
bind_config_list_events(constructor);
constructor.BindFunc("res_option",
[](Rml::Variant& out) { get_option(new_options.res_option, out); },
@ -368,18 +385,6 @@ public:
}
out = "";
});
constructor.BindEventCallback("set_current_gfx_description",
[](Rml::DataModelHandle model_handle, Rml::Event& event, const Rml::VariantList& inputs) {
int gfx_index = inputs.at(0).Get<size_t>();
// watch for mouseout being overzealous during event bubbling, only clear if the event's attached element matches the current
if (gfx_index == -1 && event.GetType() == "mouseout" && event.GetCurrentElement() != event.GetTargetElement()) {
return;
}
focused_gfx_index = gfx_index;
model_handle.DirtyVariable("cur_gfx_description");
});
constructor.Bind("cur_gfx_description", &focused_gfx_index);
constructor.Bind("msaa2x_supported", &msaa2x_supported);
constructor.Bind("msaa4x_supported", &msaa4x_supported);
@ -568,6 +573,8 @@ public:
if (!constructor) {
throw std::runtime_error("Failed to make RmlUi data model for the control options menu");
}
bind_config_list_events(constructor);
constructor.Bind("rumble_strength", &control_options_context.rumble_strength);
bind_option(constructor, "targeting_mode", &control_options_context.targeting_mode);
@ -580,6 +587,8 @@ public:
if (!constructor) {
throw std::runtime_error("Failed to make RmlUi data model for the sound options menu");
}
bind_config_list_events(constructor);
sound_options_model_handle = constructor.GetModelHandle();
@ -593,6 +602,8 @@ public:
throw std::runtime_error("Failed to make RmlUi data model for the debug menu");
}
bind_config_list_events(constructor);
// Bind the debug mode enabled flag.
constructor.Bind("debug_enabled", &debug_context.debug_enabled);