From d7c0f161d539f6b1d4ca3c71de96f65b185c9381 Mon Sep 17 00:00:00 2001 From: Geoffrey Broadwell Date: Sun, 25 Feb 2024 16:59:55 -0800 Subject: [PATCH] Factor StandardForm role out of OptionalUI screen --- lib/MUGS/App/TUI/OptionalUI.rakumod | 28 ++--------- lib/MUGS/App/TUI/Translations/Test.rakumod | 26 +++++++--- lib/MUGS/UI/TUI/Layout/StandardScreen.rakumod | 49 +++++++++++++++++++ 3 files changed, 70 insertions(+), 33 deletions(-) diff --git a/lib/MUGS/App/TUI/OptionalUI.rakumod b/lib/MUGS/App/TUI/OptionalUI.rakumod index a97663e..8046b26 100644 --- a/lib/MUGS/App/TUI/OptionalUI.rakumod +++ b/lib/MUGS/App/TUI/OptionalUI.rakumod @@ -7,7 +7,7 @@ use MUGS::UI::TUI::Layout::StandardScreen; #| Optional UI elements form -class OptionalUI does MUGS::UI::TUI::Layout::StandardScreen { +class OptionalUI does MUGS::UI::TUI::Layout::StandardForm { has Str:D $.grid-name = 'optional-ui'; has $.breadcrumb = 'optional-ui' ¢¿ 'Optional Elements'; has $.title = 'optional-ui' ¢¿ 'Optional UI Elements | MUGS'; @@ -15,17 +15,13 @@ class OptionalUI does MUGS::UI::TUI::Layout::StandardScreen { has @.hints; # XXXX: Just to satisfy role requirements for now - method content-layout($builder, $max-width, $max-height) { + method form-layout($builder, $max-width, $max-height) { ¢'optional-ui'; - # Subsection and button pad styling + # Subsection styling my %subsection = :minimize-h, margin-width => (0, 0, 1, 0); - my %right-pad = padding-width => (0, 1, 0, 0),; with $builder { - # Center vertically - .node(), - # XXXX: Set up field hints # XXXX: Translate plain text fields # XXXX: Make into proper (semantic) subsections @@ -65,30 +61,12 @@ class OptionalUI does MUGS::UI::TUI::Layout::StandardScreen { id => 'no-menu-headers', label => ¿'None'), ), - - # XXXX: Split out into help/save/cancel helper routine - .divider(line-style => 'light1', style => %( set-h => 1, ), ), - .node(style => %( :minimize-h, ), - .button(:$.form, id => 'help', style => %right-pad, - label => ¿'HELP!', - process-input => { self.goto-help }), - .button(:$.form, id => 'save', style => %right-pad, - label => ¿'Save Changes', - process-input => { self.save-changes }), - .button(:$.form, id => 'cancel', - label => ¿'Cancel and Go Back', - process-input => { self.goto-prev-screen }), - .node(), - ), - .node(), } } method save-changes() { # XXXX: Actually save changes! :-) # XXXX: Save for MUGS-UI-TUI, MUGS-Core, or Terminal-Widgets? - - self.goto-prev-screen; } method focus-on-content(Bool:D :$redraw = False) { diff --git a/lib/MUGS/App/TUI/Translations/Test.rakumod b/lib/MUGS/App/TUI/Translations/Test.rakumod index 368896d..78cf111 100644 --- a/lib/MUGS/App/TUI/Translations/Test.rakumod +++ b/lib/MUGS/App/TUI/Translations/Test.rakumod @@ -7,6 +7,8 @@ unit module MUGS::App::TUI::Translations::Test; #| context descriptions to assist translators sub translation-contexts() is export { constant @contexts = + { moniker => 'standard-form', + desc => 'Standard form buttons and button hints' }, { moniker => 'main-menu', desc => 'Main Menu entries, hints, titles, and breadcrumbs' }, { moniker => 'settings-menu', @@ -29,6 +31,22 @@ sub translation-contexts() is export { # Easy to notice, and tests widening every screen element sub trans-pig() { constant %trans = + standard-form => { + # Buttons + 'HELP!' => 'ELPHAY!', + 'Save Changes' => 'Avesay Angeschay', + 'Cancel and Go Back' => 'Ancelcay andway Ogay Ackbay', + + # Form element hints + 'View help info related to this form' + => 'Iewvay elphay infoway elatedray otay isthay ormfay', + + 'Save changes from this form' + => 'Avesay angeschay omfray isthay ormfay', + + 'Discard changes from this form and go back to previous screen' + => 'Iscarday angeschay omfray isthay ormfay andway ogay ackbay otay eviouspray eenscray', + }, main-menu => { # Breadcrumbs / title 'Main' => 'Ainmay', @@ -194,16 +212,8 @@ sub trans-pig() { 'Small' => 'Allsmay', 'None' => 'Onenay', - # Buttons - 'HELP!' => 'ELPHAY!', - 'Save Changes' => 'Avesay Angeschay', - 'Cancel and Go Back' => 'Ancelcay andway Ogay Ackbay', - # Form element hints # XXXX: FILL IN - - 'View help info related to optional UI elements' - => 'Iewvay elphay infoway elatedray otay optionalway UIWAY elementsway', }, ; } diff --git a/lib/MUGS/UI/TUI/Layout/StandardScreen.rakumod b/lib/MUGS/UI/TUI/Layout/StandardScreen.rakumod index 6fcc3a8..52c8f5d 100644 --- a/lib/MUGS/UI/TUI/Layout/StandardScreen.rakumod +++ b/lib/MUGS/UI/TUI/Layout/StandardScreen.rakumod @@ -215,3 +215,52 @@ does MUGS::UI::TUI::Layout::HintFooter { @crumbs.map({ ~$locale.translate($_) }).join(' > ') } } + + +#| A standard form with HELP!/Save/Cancel buttons +role MUGS::UI::TUI::Layout::StandardForm +does MUGS::UI::TUI::Layout::StandardScreen { + + ### Required methods + + #| Save changes from the current form + method save-changes() { ... } + + #| Current form object + method form() { ... } + + + #| Define the overall layout of a standard form + method content-layout($builder, $max-width, $max-height) { + ¢'standard-form'; + + my %right-pad = padding-width => (0, 1, 0, 0),; + + with $builder { + # Center vertically + .node(), + + # Main form + |self.form-layout($builder, $max-width, $max-height), + + # HELP!/Save/Cancel buttons + .divider(line-style => 'light1', style => %( set-h => 1, ), ), + .node(style => %( :minimize-h, ), + .button(:$.form, id => 'help', style => %right-pad, + label => ¿'HELP!', + process-input => { self.goto-help }), + .button(:$.form, id => 'save', style => %right-pad, + label => ¿'Save Changes', + # XXXX: Confirmation of successful save? + process-input => { self.save-changes; + self.goto-prev-screen }), + .button(:$.form, id => 'cancel', + label => ¿'Cancel and Go Back', + process-input => { self.goto-prev-screen }), + .node(), + ), + + .node(), + } + } +}