<head>
  <link rel="stylesheet" href="../themes/pace-theme-barber-shop.css" />

  <script>
    paceOptions = {
      elements: true
    };
  </script>
  <script src="../pace.js"></script>
  <script>
    function load(time){
      var x = new XMLHttpRequest()
      x.open('GET', "http://localhost:5646/walter/" + time, true);
      x.send();
    };

    load(20);
    load(100);
    load(500);
    load(2000);
    load(3000);

    setTimeout(function(){
      Pace.ignore(function(){
        load(3100);
      });
    }, 4000);

    Pace.on('hide', function(){
      console.log('done');
    });

  </script>
</head>
<body></body>

<head>
  <link rel="stylesheet" href="../themes/pace-theme-barber-shop.css" />

  <script>
    paceOptions = {
      elements: true
    };
  </script>
  <script src="../pace.js"></script>
  <script>
    function load(time){
      var x = new XMLHttpRequest()
      x.open('GET', "http://localhost:5646/walter/" + time, true);
      x.send();
    };

    load(20);
    load(100);
    load(500);
    load(2000);
    load(3000);

    setTimeout(function(){
      Pace.ignore(function(){
        load(3100);
      });
    }, 4000);

    Pace.on('hide', function(){
      console.log('done');
    });
  </script>

<body>
  <input id="range" type="range" min="0" max="100">
  <script>
    range.addEventListener('input', function(){
      var progress = document.querySelector('.pace-progress');
      progress.setAttribute('data-progress-text', range.value + '%');
      progress.setAttribute('style', '-webkit-transform: translate3d(' + range.value + '%, 0px, 0px)');
    });
  </script>

Add a range input to make testing easier
Add a range input to make testing easier