Shows an animation, when counting the jobs on Andela's job board.

count-andela-jobs.js

/**
 copy & paste into the browser console
 on https://boards.greenhouse.io/andela
*/

(() => {
  // create display box
  if (!$('#count-popover').length) {
    $('#footer').append(`<div style="position:fixed;height:200px;width:200px;left:calc(50% - 100px);top: calc(50% - 100px);border:2px solid black;background-color: white;font-size: 50px;text-align: center;line-height: 200px;" id="count-popover">0</div>`)
  }
 
  // find all job links
  const links = $('a[data-mapped=true][href]').toArray()

  // create a delay/sleep function
  async function sleep (timeout) {
    return new Promise((resolve, reject) => {
      setTimeout(() => {
        resolve()
      }, timeout)
    })
  }

  /** for each link:
  * - set its bg color
  * - display the count
  * - scroll into view
  * - wait for 50ms
  */
  (async () => {
    for (let i = 0; i < links.length; i++) {
      var link = links[i]
      if (i > 0) {
        $(links[i - 1]).css('background-color', '')
      }
      $(link).css('background-color', 'yellow')
      $('#count-popover').text(i + 1)
      link.scrollIntoView({ block: 'center' })
      await sleep(50)
    }
  })()
})()