<!--
Copyright 2014 Google Inc. All rights reserved.

Use of this source code is governed by a BSD-style
license that can be found in the COPYING file or at
https://developers.google.com/open-source/licenses/bsd
-->

<html>
<head>
<title>XHR event logger</title>
<script src="util_main.js"></script>
<script>
var events = [];

function run() {
  events = [];

  function pushToLog(type) {
    if (events.length != 0 && type === events[events.length - 1].type) {
      events[events.length - 1].count += 1;
    } else {
      events.push({type: type, count: 1});
    }
  }

  var xhr = new XMLHttpRequest();

  function getProgressEventDump(e) {
    return '(' + e.lengthComputable + ', ' + e.loaded + ', ' + e.total + ')';
  }

  var dumpProgressEvent = getBoolFromCheckBox('dumpprogressevent');

  function log(e) {
    var type = e.type;
    if (type === 'readystatechange') {
      type += e.target.readyState;
    }
    if (dumpProgressEvent && (e instanceof ProgressEvent)) {
      type += getProgressEventDump(e);
    }
    pushToLog(type);
  };

  function logUpload(e) {
    var type = e.type;
    if (dumpProgressEvent && (e instanceof ProgressEvent)) {
      type += getProgressEventDump(e);
    }
    pushToLog('upload' + type);
  }

  if (getBoolFromCheckBox('upload')) {
    var upload = xhr.upload;
    upload.onloadstart = logUpload;
    upload.onprogress = logUpload;
    upload.onabort = logUpload;
    upload.onerror = logUpload;
    upload.onload = logUpload;
    upload.ontimeout = logUpload;
    upload.onloadend = logUpload;
  }

  xhr.onreadystatechange = log;
  xhr.onloadstart = log;
  xhr.onprogress = log;
  xhr.onabort = log;
  xhr.onerror = log;
  xhr.onload = log;
  xhr.ontimeout = log;
  xhr.onloadend = log;

  xhr.open('POST', '/073be001e10950692ccbf3a2ad21c245_receive',
           getBoolFromCheckBox('async'));
  var size = getIntFromInput('size');
  var chunkedMode = 'none';
  if (getBoolFromCheckBox('chunkedresponse')) {
    chunkedMode = 'chunked';
  }
  xhr.send(size + ' ' + chunkedMode);
}

function print() {
  var result = '';
  for (var i = 0; i < events.length; ++i) {
    var event = events[i];
    result += event.type + ' * ' + event.count + '\n';
  }
  document.getElementById('log').value = result;
}
</script>

<body>
  <textarea id="log" rows="10" cols="40" readonly></textarea>
  <br/>
  Size: <input type="text" id="size" value="65536"><br/>
  <input type="checkbox" id="chunkedresponse">
  <label for="chunkedresponse">Use Chunked T-E for response</label><br/>
  <input type="checkbox" id="upload">
  <label for="upload">Upload progress</label><br/>
  <input type="checkbox" id="dumpprogressevent">
  <label for="dumpprogressevent">
    Dump lengthComputable/loaded/total</label><br/>
  <input type="checkbox" id="async" checked>
  <label for="async">Async</label><br/>
  <input type="button" onclick="run()" value="Run XHR">
  <input type="button" onclick="print()" value="Print log">
</body>
</html>