ListGroups.ejs

<%
// ListGroups
//
// Generates a list of each group (API) from the GroupData JSON and
// returns it. This can be used to create an index of APIs.

const locale = env.locale;
const APIHref = `/${locale}/docs/Web/API/`;
const defaultAPIHref = "/en-US/docs/Web/API/";

// Conveniences to shorten names of some functions

const htmlEscape = mdn.htmlEscape;
const spacesToUnderscores = web.spacesToUnderscores;

// Get the GroupData database

const groupData = web.getJSONData("GroupData")[0];
const groupNames = Object.keys(groupData);
groupNames.sort();

// Start building the lists for each letter

const outputByLetter = {};

for(const name of groupNames) {
  const groupObj = groupData[name];
  const firstLetter = name[0];

  if (!groupObj.overview) {
    continue;
  }
  const overviewName = groupObj.overview;
  const subPath = spacesToUnderscores(htmlEscape(overviewName));
  const defaultGroupUrl = defaultAPIHref + subPath;
  const groupUrl = APIHref + subPath;
  // Get page info from default locale
  // as some pages are not localized yet
  const aPage = await wiki.getPage(defaultGroupUrl);

  let pageBadges = (await page.badges(aPage)).join(" ");

  if (pageBadges.length) {
    pageBadges = `<span class='indexListBadges'> ${pageBadges}</span>`;
  }

  // Finish constructing the HTML and then append it to the text for the corresponding
  // letter group.

  const link = web.smartLink(groupUrl, null, name, null, APIHref, "ListGroups");

  const groupOutput = `<li>${link}${pageBadges}</li>`;

  if (!outputByLetter[firstLetter]) {
    outputByLetter[firstLetter] = groupOutput;
  } else {
    outputByLetter[firstLetter] += groupOutput;
  }
}

// Now output the whole thing

const keys = Object.keys(outputByLetter);

const output = keys.map(letter => `<h3>${letter}</h3>
  <ul>${outputByLetter[letter]}</ul>`).join("\n");

%><div class="index">
  <%-output%>
</div>