main.js

const helpText = `<div class="popup-text">
  <p class="popup-text">Use the menus in the top left of each dashboard tile to manipulate the tiles.</p>
  <p class="popup-text">Use the back button in the top left of the page to navigate backward in the dashboard.</p>
  <p class="popup-text">Use the global menu button in the top right to access the global menu.</p>
</div>`
// Load from value in config.js
window.dashboard = Dashboard.create(userSettings);

document.getElementById("refresh-button").querySelector("a").onclick = (() => {
  window.location.reload();
  dashboard.tiles.start();
});
document.getElementById("sources-button").querySelector("a").onclick = ((event) => {
  event.preventDefault();
  const template = createFromTemplate("sources-js");
  const code = template.querySelector("pre");
  fetch("config.js").then((got) =>
    got.text().then((text) =>
      code.innerText = text
    )
  ).catch((error) =>
    code.innerText = "Failed to load 'config.js'."
  );
  dashboard.popup("Configuration", template);
  dashboard.menu.hide();
});
// Back out of all alternate views on back button click.
document.getElementById("back-button").querySelector("a").onclick = ((event) => {
  event.preventDefault();
  dashboard.menu.defocus();
  dashboard.menu.hide();
  dashboard.tiles.defocus();
});
document.getElementById("top-bar-back-button").onclick = ((event) => {
  event.preventDefault();
  dashboard.menu.defocus();
  dashboard.menu.hide();
  dashboard.tiles.defocus();
});
// Show help popup on help button click.
document
  .getElementById("help-button")
  .querySelector("a")
  .onclick = ((event) => {
    event.preventDefault();
    dashboard.popup("Help", helpText);
    dashboard.menu.hide();
  });
// Prep update button.
const updateButton = document.getElementById("update-button");
updateButton.querySelector("a").href = projectReleasesUrl;
updateButton.querySelector("a").target = "_blank";
// Reload on window resize.
window.addEventListener("resize", (() => window.location.reload()));
// Load Initial Data
dashboard.start();
// Show global menu on menu button click.
document.getElementById("global-menu-icon").onclick = (
  (event) => {
    event.preventDefault();
    dashboard.menu.show();
  }
);
if (dashboard.feeds.length > 0) {
  // Unhide the RSS ticker div.
  const ticker = document.querySelector("#feed-ticker");
  ticker.classList.remove("hidden");
  // Call the function to fetch and display feeds.
  dashboard.feeds.fetch();
  // Add event listeners for pause and resume ticker motion.
  const tickerContainer = document.querySelector("#feeds-container");
  tickerContainer.addEventListener("mouseenter", () => {            
    tickerContainer.style.animationPlayState = "paused";
  });
  tickerContainer.addEventListener("mouseleave", () => {            
    tickerContainer.style.animationPlayState = "running";
  });
}
// Update the top bar every second for the seconds display in the times.
setInterval((() => dashboard.topBar.show()), 1000);

// Run the check when the application starts
checkForUpdates();