← Back to dashboard

BAMT parser demo — from document to catalog render

This page fetches one of the three illustrative BAMT XML documents below with fetch(), parses it with the browser's DOMParser, and draws Application Catalog tiles purely from what's inside that file — nothing on screen is hardcoded to a specific scenario. Edit one of the XML files and reload the page to see the render change accordingly.

The XML documents are illustrative only — modeled on the DVB Application Information Table (AIT) family (ETSI TS 102 809), the closest publicly documented real-world standard for this job, because the actual ABNT NBR 25602 BAMT/BALD schema isn't in this repository. Don't treat the field names below as certified TV 3.0 syntax. The exact icon-count threshold this page uses to switch grouped/expanded (30) is also illustrative — the real rule lives in the composition profiles of ABNT NBR 25608 §8.2, which aren't reproduced here.

How this simulation works

  1. What a BAMT is, in this simulation: a broadcaster's signaling document listing which Bootstrap Applications exist, how they're grouped, which virtual channel and icon each one uses, and flags like MandatoryVisible (always-visible) or a grouping's total member count. A real receiver reads this to build the Application Catalog screen. This demo reproduces just enough of that shape to make three specific test cases (below) concrete and inspectable.
  2. The three tabs each load a different real XML file, each reproducing one G001 test case: 001_010 ("Grouped listing mode") has 3 real member apps plus 42 filler icons — 45 total, above the illustrative grouped/expanded threshold, so the grouping renders collapsed behind one icon; 001_011 ("Expanded listing mode") is identical except for 12 fillers instead of 42 — 15 total, below the threshold, so the same 3 apps render as individual tiles; 001_012 ("Always-visible in a grouping") has no filler pool at all — it always renders as one collapsed grouping icon, with a star badge marking which member is pinned via GroupingIcon/@representativeApplicationIdRef.
  3. The mock TV screen (left) is redrawn from scratch on every tab switch, purely by reading the current XML's <Application>, <FillerPool> and <GroupingIcon> elements — colored tiles are the real member apps, gray tiles are filler padding used only to hit a target icon count. A collapsed grouping tile is clickable and expands in place to show its real members.
  4. Click any colored (non-filler) tile to "enter" that app: the demo reads TransportProtocol/@baseUrl straight from the XML for that <Application> element and loads that exact path's real index.html in the "App preview" panel below the raw source — identity card and all, not a mock-up.
  5. "Parsed fields" (bottom left) lists exactly which values the render above was computed from — ColorCode, groupingType, the filler count, the computed total icon count and resulting listing mode (for 001_010/001_011), or representativeApplicationIdRef and each member's MandatoryVisible flag (for 001_012) — plus every member's virtual channel.
  6. "Raw source" (top right) is the literal contents of the currently selected XML file, syntax-highlighted client-side. It's the ground truth for everything rendered on the left — if a value in "Parsed fields" looks surprising, it's read directly from what you see there.
Application Catalog

Parsed fields

Raw source —

Loading…

App preview