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

init mod menu + bem class + button presets

This commit is contained in:
thecozies 2024-09-13 10:13:52 -05:00
parent 110e7acbb9
commit b817205ed9
15 changed files with 263 additions and 8 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
CMakeLists.txt
View File

@ -171,6 +171,8 @@ set (SOURCES
${CMAKE_SOURCE_DIR}/src/ui/elements/ElementOptionTypeRadioTabs.cpp
${CMAKE_SOURCE_DIR}/src/ui/elements/ElementOptionTypeRange.cpp
${CMAKE_SOURCE_DIR}/src/ui/elements/ElementOptionTypeTextField.cpp
${CMAKE_SOURCE_DIR}/src/ui/elements/ElementModMenu.cpp
${CMAKE_SOURCE_DIR}/src/ui/elements/presets.cpp
${CMAKE_SOURCE_DIR}/rsp/aspMain.cpp
${CMAKE_SOURCE_DIR}/rsp/njpgdspMain.cpp

4
assets/config_menu/controls.rml
View File

@ -71,7 +71,7 @@
data-event-blur="set_input_row_focus(-1)"
data-event-focus="set_input_row_focus(i)"
data-event-click="clear_input_bindings(i)"
class="icon-button icon-button--danger"
class="icon-button icon-button--error"
data-attr-style="i == 0 ? 'nav-up:#cont_kb_toggle' : 'nav-up:auto'"
>
<svg src="icons/Trash.svg" />
@ -81,7 +81,7 @@
data-event-blur="set_input_row_focus(-1)"
data-event-focus="set_input_row_focus(i)"
data-event-click="reset_single_input_binding_to_default(i)"
class="icon-button icon-button--danger"
class="icon-button icon-button--error"
data-attr-style="i == 0 ? 'nav-up:#cont_kb_toggle' : 'nav-up:auto'"
>
<svg src="icons/Reset.svg" />

1
assets/launcher.rml
View File

@ -61,6 +61,7 @@
<label>v{{version_number}}</label>
</div>
</div>
<recomp-mod-menu />
</div>
</body>
</rml>

2
assets/recomp.rcss
View File

File diff suppressed because one or more lines are too long

4
assets/scss/styles/components/IconButton.scss
View File

@ -2,7 +2,7 @@
/*
<button
class="icon-button icon-button--danger"
class="icon-button icon-button--error"
>
<svg src="icons/Trash.svg" />
</button>
@ -82,7 +82,7 @@ $icon-button-size: 56 - ($border-width-thickness-num * 2);
@include create-icon-button-variation($color-success);
}
&--danger {
&--error {
@include create-icon-button-variation($color-error);
}

87
assets/scss/styles/components/ModMenu.scss Normal file
View File

@ -0,0 +1,87 @@
.mod-menu {
display: flex;
position: absolute;
top: 0;
right: 0;
bottom: 0;
left: 0;
flex-direction: row;
align-items: center;
justify-content: center;
padding: space($page-margin);
background-color: $color-modal-overlay;
&__modal-wrapper {
display: flex;
position: relative;
flex: 1 1 100%;
flex-direction: column;
width: 100%;
max-width: space($base-modal-max-width);
height: 100%;
margin: auto;
border-width: $border-width-thickness;
border-radius: $border-radius-modal;
border-color: $color-border;
background: $color-bg-shadow;
}
&__modal-header {
display: flex;
position: relative;
flex: 1 1 auto;
flex-direction: row;
align-items: center;
justify-content: space-between;
width: 100%;
height: auto;
padding: space(16);
border-bottom-width: $border-width-thickness;
border-top-left-radius: $border-radius-modal;
border-top-right-radius: $border-radius-modal;
border-bottom-color: $color-border;
background-color: $color-bg-overlay;
}
&__modal-body {
display: flex;
position: relative;
flex: 1 1 auto;
flex-direction: row;
align-items: center;
justify-content: center;
width: 100%;
height: auto;
}
&__list {
display: block;
position: relative;
flex: 1 1 100%;
flex-direction: column;
align-items: center;
justify-content: center;
height: 100%;
margin: 0;
padding: 0;
border-bottom-left-radius: $border-radius-modal;
background-color: $color-bg-shadow;
}
&__list-scroll {
flex: 1 1 100%;
width: 100%;
height: 100%;
max-height: 100%;
overflow-y: auto;
}
&__details {
display: block;
position: relative;
flex: 1 1 100%;
height: 100%;
border-bottom-right-radius: $border-radius-modal;
background-color: $color-bg-overlay;
}
}

1
assets/scss/styles/components/_components.scss
View File

@ -14,3 +14,4 @@
@import "./Toggle";
@import "./BottomLeft";
@import "./Prompt";
@import "./ModMenu";

1
include/recomp_ui.h
View File

@ -8,6 +8,7 @@
#include "RmlUi/Core.h"
#include "../src/ui/util/hsv.h"
#include "../src/ui/util/bem.h"
namespace Rml {
class ElementDocument;

66
src/ui/elements/ElementModMenu.cpp Normal file
View File

@ -0,0 +1,66 @@
#include "ElementModMenu.h"
#include "presets.h"
#include "librecomp/mods.hpp"
#include <string>
namespace recompui {
static const BEM mod_menu_bem("mod-menu");
static const std::string cls_base = mod_menu_bem.get_block();
static const std::string cls_modal_wrapper = mod_menu_bem.el("modal-wrapper");
static const std::string cls_modal_header = mod_menu_bem.el("modal-header");
static const std::string cls_modal_body = mod_menu_bem.el("modal-body");
static const std::string cls_list = mod_menu_bem.el("list");
static const std::string cls_list_scroll = mod_menu_bem.el("list-scroll");
static const std::string cls_details = mod_menu_bem.el("details");
static Rml::Element *add_div_with_class(Rml::ElementDocument *doc, Rml::Element *parent_el, const std::string& cls) {
Rml::Element *el = parent_el->AppendChild(doc->CreateElement("div"));
el->SetClass(cls.c_str(), true);
return el;
}
ElementModMenu::ElementModMenu(const Rml::String& tag) : Rml::Element(tag)
{
SetAttribute("recomp-store-element", true);
Rml::ElementDocument *doc = GetOwnerDocument();
SetClass(mod_menu_bem.block, true);
{
Rml::Element *modal_wrapper_el = add_div_with_class(doc, this, cls_modal_wrapper);
{
Rml::Element *header_el = add_div_with_class(doc, modal_wrapper_el, cls_modal_header);
{
add_button(doc, header_el, "Refresh", ButtonVariant::Primary);
add_icon_button(doc, header_el, "icons/X.svg", ButtonVariant::Tertiary);
}
Rml::Element *body_el = add_div_with_class(doc, modal_wrapper_el, cls_modal_body);
{
Rml::Element *list_el = add_div_with_class(doc, body_el, cls_list);
{
Rml::Element *list_el_scroll = add_div_with_class(doc, list_el, cls_list_scroll);
{
std::vector<recomp::mods::ModDetails> mods = recomp::mods::get_mod_details("mm");
for (auto& mod : mods) {
Rml::Element *mod_el = list_el_scroll->AppendChild(doc->CreateElement("div"));
mod_el->SetInnerRML(mod.mod_id);
}
} // list_el_scroll
} // list_el
Rml::Element *details_el = add_div_with_class(doc, body_el, cls_details);
details_el->SetInnerRML("two");
}
}
}
}
ElementModMenu::~ElementModMenu()
{
}
} // namespace Rml

15
src/ui/elements/ElementModMenu.h Normal file
View File

@ -0,0 +1,15 @@
#ifndef RECOMPUI_ELEMENT_MOD_MENU_H
#define RECOMPUI_ELEMENT_MOD_MENU_H
#include "common.h"
namespace recompui {
class ElementModMenu : public Rml::Element {
public:
ElementModMenu(const Rml::String& tag);
virtual ~ElementModMenu();
};
} // namespace recompui
#endif

39
src/ui/elements/presets.cpp Normal file
View File

@ -0,0 +1,39 @@
#include "presets.h"
namespace recompui {
static const BEM button_bem("button");
Rml::Element *add_button(Rml::ElementDocument *doc, Rml::Element *parent_el, const Rml::String contents, ButtonVariant variant, bool isLarge) {
Rml::Element *button = parent_el->AppendChild(doc->CreateElement("button"));
button->SetClass(button_bem.get_block(), true);
button->SetClass(button_bem.mod(button_variants.at(variant)), true);
if (isLarge) {
button->SetClass(button_bem.mod("large"), true);
}
if (contents != "") {
button->SetInnerRML(contents);
}
return button;
}
static const BEM icon_button_bem("icon-button");
Rml::Element *add_icon_button(Rml::ElementDocument *doc, Rml::Element *parent_el, const std::string &svg_src, ButtonVariant variant) {
Rml::Element *button = parent_el->AppendChild(doc->CreateElement("button"));
button->SetClass(icon_button_bem.get_block(), true);
button->SetClass(icon_button_bem.mod(button_variants.at(variant)), true);
{
Rml::Element *icon = button->AppendChild(doc->CreateElement("svg"));
icon->SetClass(icon_button_bem.el("icon"), true);
icon->SetAttribute("src", svg_src);
}
return button;
}
} // namespace recompui

11
src/ui/elements/presets.h Normal file
View File

@ -0,0 +1,11 @@
#ifndef RECOMPUI_ELEMENTS_PRESETS
#define RECOMPUI_ELEMENTS_PRESETS
#include "common.h"
namespace recompui {
Rml::Element *add_button(Rml::ElementDocument *doc, Rml::Element *parent_el, const Rml::String contents = "", ButtonVariant variant = ButtonVariant::Primary, bool isLarge = false);
Rml::Element *add_icon_button(Rml::ElementDocument *doc, Rml::Element *parent_el, const std::string &svg_src, ButtonVariant variant = ButtonVariant::Tertiary);
} // namespace recompui
#endif

4
src/ui/ui_elements.cpp
View File

@ -19,12 +19,10 @@ static RecompElementConfig custom_elements[] = {
CUSTOM_ELEMENT("recomp-option-type-textfield", recompui::ElementOptionTypeTextField),
CUSTOM_ELEMENT("recomp-option-type-radio-tabs", recompui::ElementOptionTypeRadioTabs),
CUSTOM_ELEMENT("recomp-option-type-range", recompui::ElementOptionTypeRange),
CUSTOM_ELEMENT("recomp-mod-menu", recompui::ElementModMenu),
};
void recompui::register_custom_elements() {
recomp::config::set_config_store_value_and_default("ligma_balls", "hello!", "whats up");
recomp::config::set_config_store_default_value("ligma_balls2", "12345");
recomp::config::set_config_store_value("ligma_balls3", "hello!");
for (auto& element_config : custom_elements) {
Rml::Factory::RegisterElementInstancer(element_config.tag, element_config.instancer.get());
}

1
src/ui/ui_elements.h
View File

@ -14,6 +14,7 @@
#include "elements/ElementOptionTypeRange.h"
#include "elements/ElementOptionTypeTextField.h"
#include "elements/ElementDescription.h"
#include "elements/ElementModMenu.h"
namespace recompui {
void register_custom_elements();

33
src/ui/util/bem.h Normal file
View File

@ -0,0 +1,33 @@
#ifndef RECOMPUI_ELEMENTS_BEM
#define RECOMPUI_ELEMENTS_BEM
#include <string>
namespace recompui {
// BEM base class
class BEM {
public:
std::string block;
BEM(const std::string &block) : block(block) {}
virtual ~BEM() = default;
const std::string get_block() const {
return block;
}
const std::string el(const std::string &element) const {
return block + "__" + element;
}
const BEM bem_el(const std::string &element) const {
return BEM(el(element));
}
const std::string mod(const std::string &modifier) const {
return block + "--" + modifier;
}
};
} // namespace recompui
#endif