How to use For Loop / If condition / Map with HTML FLow?

[moorsu]

Can you please point me an example for using for - loop / if else / using map to fill the data in htmlflow like the ones used by J2HTML?

[fmcarvalho]

Hi @moorsu,

Short answer.

Example of if/else (Taken from https://htmlflow.org/features#getting-started):

void StocksView(Appendable out, Stock stock) {
  HtmlFlow
   .doc(out)
   .html()
      ….td().of(td -> { if (stock.getChange() < 0) td.attrClass("minus"); }).…
   ...
   .__();
}

Or dynamic view:

HtmlView stocksView = HtmlFlow.view(view -> view
    .html()
        ….td().dynamic<Stock>((td, stock) -> { if (stock.getChange() < 0) td.attrClass("minus"); }).…
    ...
    .__();
  );

An HtmlView is more efficient, renders and store the static blocks once. Render the latter with:

String html = stocksView.render(new Stock(....));
// Or:
stocksView.setOut(System.out).write(new Stock(....));

Foreach example (Taken from https://htmlflow.org/features#dynamic-views):

With Dynamic View:

HtmlView tasksTableView = HtmlFlow.view(page -> page
        .html()
            ...
                .table()
                    .attrClass("table")
                    .tr().th().text("Title").__().th().text("Description").__().th().text("Priority").__().__()
                    .tbody()
                        .<Stream<Task>>dynamic((tbody, tasks) ->
                            tasks.forEach(task -> tbody
                                .tr()
                                    .td().text(task.getTitle()).__()
                                    .td().text(task.getDescription()).__()
                                    .td().text(task.getPriority().toString()).__()
                                .__() // tr
                            ) // forEach
                        ) // dynamic
                    .__() // tbody
                .__() // table
         ....
   );

With HtmlDoc:

void tasksTableDoc(Appendable out, Stream<Task> tasks) {
   HtmlFlow
      .doc(out)
        .html()
            ...
                .table()
                    .attrClass("table")
                    .tr().th().text("Title").__().th().text("Description").__().th().text("Priority").__().__()
                    .tbody()
                        .of(tbody ->
                            tasks.forEach(task -> tbody
                                .tr()
                                    .td().text(task.getTitle()).__()
                                    .td().text(task.getDescription()).__()
                                    .td().text(task.getPriority().toString()).__()
                                .__() // tr
                            ) // forEach
                        ) // dynamic
                    .__() // tbody
                .__() // table
         ....
}

HtmlFlow is unopinionated and you can use any Java control flow you each. We do not need specific builders such as J2html.iff(, each(filter(...,etc.

Whenever you need a Java expression, you can simply chain of(Consumer) or dynamic(BiConsumer) depending on whether you used the factory method HtmlFlow.doc() or HtmlFlow.view(). In the case of a BiConsumer with dynamic, this expression receives the parent Element and an additional parameter, the object model.

I know that HtmlFlow documentation has some quite failures, and you can find many examples spread out in the README, getting-started, unit tests, and others.

[moorsu]

Thanks @fmcarvalho. I will try. Is there any discord channel for htmlflow ?

[fmcarvalho]

@moorsu I am not aware of any Discord channel for HtmlFlow. Usually I try to give quick answers to all issues.

I have to update HtmlFlow documentation with this examples. I will keep this Issue open until there.

[fmcarvalho]

@moorsu Can you please star HtmlFlow project to raise attention from the community. Thanks

[moorsu]

Done. Thanks!

[fmcarvalho]

I included the most common use cases for data binding, if/else, and loops usage, in GitHub README.

Also in https://htmlflow.org/features I have included the same examples implemented with both approaches: HtmlDoc and HtmlView