Status UI pattern

Summary

Beginner-friendly status banner pattern (detect + allow-list).

• Exports: (none) — this page documents a small pattern, not a shipped standalone helper file
• Depends on: RTO_form_api.js, RTO_connector.js, RTO_domainList.js
• Uses data attributes: none

What it is

A very small, beginner-friendly status UI pattern that shows:

• Extension detected / not detected
• Host allowed / not allowed

There is no standalone RTO_status_ui.js file in the current local helper set. Use the shipped helpers below and build the banner directly in your page.

Files to load

• ../RTO_helpers/RTO_form_api.js
• ../RTO_helpers/RTO_connector.js
• ../RTO_helpers/RTO_domainList.js

Example

<div id="rtoStatus" style="padding:12px;border:1px solid #d0d7de;border-radius:12px">Checking RTO...</div>

<script src="../RTO_helpers/RTO_form_api.js"></script>
<script src="../RTO_helpers/RTO_connector.js"></script>
<script src="../RTO_helpers/RTO_domainList.js"></script>
<script>
RTOconnectOnce(1500).then(function(connected){
  var host = location.hostname;
  var box = document.getElementById("rtoStatus");

  if(!connected){
    box.textContent = "RTO extension not detected.";
    return;
  }

  return RTOAllowlist.has(host).then(function(allowed){
    box.textContent = allowed
      ? "RTO ready on " + host
      : "RTO detected, but " + host + " is not allow-listed yet.";
  });
});
</script>

Why this page exists

• It keeps the beginner-friendly status banner pattern documented, without pretending there is a local helper file that is not shipped.
• For allow-list checks, prefer location.hostname so the stored host matches the helper behavior.
• If you want one-file loading instead, you can build the same pattern with RTO.min.js.

Next

• Helpers index
• API reference