dev-resources.site

for different kinds of informations.

Sparky - composable user interfaces for internal services

Published at

7/1/2024

HTML controls

Let's brew some coffee, even though I've been trying to slow down on caffeine recently.

allow_manual_run: true
vars:
  -
    name: Flavor
    default: "latte"
    type: select 
    values: [ espresso, amerikano, latte ]

  -
    name: Topic  
    default: "milk"
    type: select
    values: [ milk, cream, cinnamon ]
    multiple: true

  -
    name: Step3 
    default: "boiled water"
    type: input

This simple Sparky job definition will spin up a simple UI with 3 controls:

In Raku scenario those input parameters are handled like that:

my $flavor = tags()<Flavor>;
my $water = tags()<Step3>;
my @topics = [];

# tags() needs :array modifier
# as multiple choices are passed

for tags(:array)<Topic><> -> $t {
   @topics.push: $t;
};

Simple, huh?

One more coffee, please!

Or maybe you like a tea?

Another cool feature of Sparky is a multi scenario flows or group variables. Let's say you would like to give a choice of coffer or tea, so instead of having 2 job definitions with different sets of variables, let's create just one:

vars:

  # tea vars

  -
    name: Flavor
    default: "black" 
    type: select 
    values: [ black, green ]
    group: [ tea ]

  -
    name: Topic
    default: "milk"
    type: select
    values: [ milk, cream ]
    group: [ tea ]

  # coffee vars

  -
    name: Flavor
    default: "latte"
    type: select 
    values: [ espresso, amerikano, latte ]
    group: [ coffee ]

  -
    name: Topic  
    default: "milk"
    type: select
    values: [ milk, cream, cinnamon ]
    group: [ coffee ]
    multiple: true

  # common vars

  -

    name: Step3
    default: "boiled water"
    type: input
    group: [ tea, coffee ]

# every var
# in group vars
# is a separate
# scenario 

group_vars:
  - tea
  - coffee