Toggle the presence of a class based on a boolean flag

[lambda-fairy]

html! {
    ul @for pony in &["Rarity", "Fluttershy", "Pinkie Pie"] {
        li.pink(pony == "Pinkie Pie") { (pony) }
    }
}

It can often be useful to toggle a class based on a boolean flag. Need to be careful with multiple classes.

[TheNeikos]

Multiple classes would just repeat that structure?

html! {
    div.foo(foo).bar(bar) (content)
}

Where foo and bar are boolean values

[lambda-fairy]

Yeah I was thinking that as well.

My issue isn't with the syntax, it's with the implementation. To be specific, if you look at the HTML output, whether or not "bar" has a space before it would depend on the presence of "foo".

I guess that's enough of an edge case that we can ignore it -- having extra spaces in a class attribute is still valid after all. But it still feels kind of weird.

[lambda-fairy]

Whoops -- turns out this syntax is ambiguous. Given the tokens div . foo ( bar ), it'd be impossible to tell whether we want a foo class toggled by bar, or a <div> which contains the value of bar.

I'm open to other suggestions for the syntax.

[TheNeikos]

The obvious alternatives would be [] or {}.

html! {
    div.foo[foo].bar[bar] (content)
}

html! {
    div.foo{foo}.bar{bar} (content)
}

I don't like either much...

Some random ideas:

html! {
    div.foo@(foo).bar@(bar) (content)
}

html! {
    div.foo?(foo).bar?(bar) (content)
}

The last one works as it's . <name> ( <bool> ) which differs due to the dot with content-less attributes.

[lambda-fairy]

@TheNeikos Thanks for writing those out!

I'm actually growing fond of the first alternative, using div.foo[foo]. The expressions involved aren't Renderable -- they're boolean flags -- so it makes sense for them to look different. And since the empty attribute syntax will be changed anyway (#59), we don't need to be consistent with how they work now.

I've pushed the corresponding change to empty attributes as 68feeef, and I'd love to see how that turns out.