const puppeteer = require('puppeteer');

async function scrapeUrl(url) {
  // Launch a new browser instance.
  //const browser = await puppeteer.launch({ headless: false });
  const browser = await puppeteer.launch();

  // Create a new page in the browser.
  const page = await browser.newPage();

  // Navigate to the URL.
  await page.goto(url, {waitUntil: 'networkidle2'});

  // Enter the password
  await page.type('input[name="password"]', 'hardcodedpasswordrule,notunliketunnelsnakes');

  // Wait for the sign in button to be ready
  await page.waitForSelector('#btn_login')

  // Click the sign in button
  await page.click('#btn_login');

  // Wait for the next page to load
  await page.waitForNavigation({
        waitUntil: 'networkidle0',
  });

  // Click the connected devices tab
  await page.click('#wrapper > main > div > div.inner_l > ul > li:nth-child(2) > a');

  // Wait for the DOM to settle. Specifically, javascript populates
  // the desired values on the page every now and then, and none
  // of the other wait/timeout methods I tried actually made things
  // wait in the correct manner for actual data to get captured.

  await waitForDOMToSettle(page);

  // Extract the desired values

  const pageTitle = await page.title();
  const currdev = await page.$eval(('.connectedUserCount'), span => span.textContent);
  const curremrg = await page.$eval(('.emergencyUserCount'), span => span.textContent);
  const peakdev_1hr = await page.$eval(('.peakConnectedUserCount'), span => span.textContent);
  const peakdev_24hr = await page.$eval(('.peakConnectedUserCount24'), span => span.textContent);

  // Print the results

  console.log(`Page Title: ${pageTitle}`);
  console.log(`Current devices connected:  ${currdev}`);
  console.log(`Current emergency calls:    ${curremrg}`);
  console.log(`Peak connections 1hr:       ${peakdev_1hr}`);
  console.log(`Peak connections 24hr:      ${peakdev_24hr}`);

  // Close the browser instance.
  await browser.close();
}

// Replace 'https://example.com' with the URL you want to scrape.
scrapeUrl('http://pi2.rustytel.net:8020/#devices');






const waitForDOMToSettle = (page, timeoutMs = 30000, debounceMs = 1000) =>
  page.evaluate(
    (timeoutMs, debounceMs) => {
      let debounce = (func, ms = 1000) => {
        let timeout;
        return (...args) => {
          console.log("in debounce, clearing timeout again");
          clearTimeout(timeout);
          timeout = setTimeout(() => {
            func.apply(this, args);
          }, ms);
        };
      };
      return new Promise((resolve, reject) => {
        let mainTimeout = setTimeout(() => {
          observer.disconnect();
          reject(new Error("Timed out whilst waiting for DOM to settle"));
        }, timeoutMs);

        let debouncedResolve = debounce(async () => {
          observer.disconnect();
          clearTimeout(mainTimeout);
          resolve();
        }, debounceMs);

        const observer = new MutationObserver(() => {
          debouncedResolve();
        });
        const config = {
          attributes: true,
          childList: true,
          subtree: true,
        };
        observer.observe(document.body, config);
      });
    },
    timeoutMs,
    debounceMs
  );