extends layout

block head
  link(rel='stylesheet', href='/stylesheets/style.css')
  link(rel='stylesheet', href='https://fonts.googleapis.com/icon?family=Material+Icons')
  link(rel='stylesheet', href='https://code.getmdl.io/1.2.1/material.indigo-pink.min.css')
  script(defer='', src='https://code.getmdl.io/1.2.1/material.min.js')

block content
  #data(style='display: none;')
    each user in users
      .data-user
        .data-type= user.type
        .data-value= user.value
        .data-index= user.index
        .data-other= user.other
        .data-isID= user.isID

  form#search
    .top-bar
      .input-wrapper
        input(type='text', placeholder='Search')
        button.material-icons.fav(tabindex='0', type='button') 
      button#overflow-button(type='button')
        i.material-icons 
        
      ul.mdl-menu.mdl-menu--bottom-right.mdl-js-menu.mdl-js-ripple-effect(for='overflow-button')
        a(href='http://www.meetingpointmco.nl/Roosters-AL/doc/')
          li.mdl-menu__item Oud rooster gebruiken
    .autocomplete-wrapper
      ul.autocomplete
  #week-selector
    #search-space-filler
    .week-wrapper
      input(type='button', value='Vorige')
      span.current Loading...
      input(type='button', value='Volgende')

  iframe(src='/hello', scrolling='no')#schedule

  script(src='/javascripts/bundle.js')
  script.
    if ('serviceWorker' in navigator) {
      navigator.serviceWorker.register('/sw.js').then(function(registration) {
        // Registration was successful
        console.log('ServiceWorker registration successful with scope: ', registration.scope)
      }).catch(function(err) {
        // registration failed :(
        console.log('ServiceWorker registration failed: ', err)
      })
    }