html
title: HTML Groups description: The embedded browser widget, local pages, styling and tables published: true editor: markdown
group_html renders HTML pages with the interface's own text, image and table machinery; the client uses it for help, news, the in-game shop and web apps. It works equally well fully offline: pages resolve through the search path, so a help viewer is just local .html files and one window.
An html group extends scroll_text, so it needs the scroll children, plus a backdrop bitmap it can recolor for <body bgcolor>:
<group type="html" id="html" posref="TL TL" x="12" y="-32" w="396" h="386"
url="help_index.html" home="help_index.html" browse_next_time="true" timeout="0"
background_color="28 28 28 255" error_color="255 120 120 255"
background_bitmap_view="black2"
browse_undo="ui:sample:help:content:bt_back" browse_redo="ui:sample:help:content:bt_fwd">
<group id="black" posref="TL TL" sizeref="wh" w="0" h="0" />
<view type="bitmap" id="black2" posref="TL TL" sizeref="wh" w="0" h="0"
texture="blank.tga" scale="true" global_color="false" />
<group id="text_list" type="list" posref="TL TL" x="4" y="-4" space="2" maxelements="2000" ... />
<ctrl type="scroll" id="scroll_bar" posref="TR TR" ... />
</group>Key attributes: url (initial page), home, browse_next_time (defer the first browse to the first frame; set it), timeout (seconds; 0 disables, right for local pages), browse_undo/browse_redo (ids of your Back/Forward buttons; the group freezes/unfreezes them with history state automatically), browse_refresh, title_prefix, form template hooks (form_text_group, form_select_group, checkbox/radio textures) when pages contain forms.
The page's <title> becomes the enclosing container window's title.
Links inside a page emit the browse action handler with name=<full id of the html group>|url=<href>. The conventional handlers browse, browse_undo, browse_redo are client-side; a standalone application registers three one-liners calling browse(), browseUndo(), browseRedo() on the named group (see Embedding). Buttons elsewhere in the UI can navigate the group the same way:
<ctrl ... onclick_l="browse" params_l="name=ui:sample:help:content:html|url=help_widgets.html" />Local resolution accepts bare filenames and file: URLs through the search path; http(s) URLs go through the embedded CURL client where the build provides it.
The legacy per-attribute styling on the group (link_color, text_color, h1_font_size, …) is still parsed, but the modern rendering path styles views from CSS. Without a browser.css on the search path, links render as plain gray text and headings collapse to body size, with only a one-line log warning. Ship one (the client's gamedev/interfaces_v3/browser.css is the reference; the sample carries a copy with the link color adapted) and adjust colors there. A browser_css_file attribute can point at an alternative stylesheet.
Headings, paragraphs, lists, <b>/<em>/<u>, colors, <img> (atlas texture names work as src), anchors, and tables. <table> maps onto the table group widget, so borders, cell padding/spacing, background colors and percentage widths behave like the interface tables they are. Forms (<input>, <select>, <textarea>) instantiate the template groups named on the html group and submit through browse. Scripting inside pages is not a thing; interactivity belongs to the interface around the group.
table groups can also be authored directly in interface XML (<group type="table"> with uppercase <TR>/<TD> children carrying align, bgcolor, colspan, percentage width, …), occasionally handy for grid layouts outside HTML.