Morning Relay by Shuntaro Tanigawa

morning-relay.jade

html
  title Morning Relay by Shuntaro Tanigawa
  script(src="//cdnjs.cloudflare.com/ajax/libs/jquery/2.1.3/jquery.min.js")
body.world
  #kamchatka.place
    .person.guy.is-dreaming.giraffe
      .clock
        audio(src="alarm-kamchatka-boy.mp3").alarm
  #mexico.place
    .person.maiden.is-waiting(for="bus")
      .clock
        audio(src="alarm-mexico-maiden.mp3").alarm
    #bus
  #new-york.place
    .person.girl.is-rollingover.is-smiling
      .clock
        audio(src="alarm-new-york-girl.mp3").alarm
  #rome.place
    .person.boy.is-winking.pillar-capital
      .clock
        audio(src="alarm-rome-boy.mp3").alarm

morning-relay.js

$(function () {
  function enterMorning(place) {
    place.addClass('is-morning').attr('aria-live', 'assertive').trigger('morning');
  }

  function leaveMorning(place) {
    place.removeClass('is-morning').attr('aria-live', 'polite');
  }

  function relayMorning() {
    var morningPlace = $('.world').find('is-morning');
    var nextMorningPlace = morningPlace.next() || $('.world:first-child');
    
    leaveMorning(morningPlace);
    enterMorning(nextMorningPlace);
  }
  
  // event listeners
  $('.world .place .person').bind('morning', function () {
    $('.alarm', this).play();
  })

  // bootstrap
  setInterval(relayMorning, 1000 * 60 * 60 * 6); // every 6 hours; TODO: fix TZ bug
  enterMorning($('#kamchatka'));
})