mrkd
7/26/2014 - 8:48 PM

display-chat-json.html

display-chat-json.html
content_copyfile_download
<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>Chat</title>
  <link rel="stylesheet" href="normalize.css">
</head>
<body>
<style>
td {
  padding: 5px;
  background: white: ;
  border-bottom: 4px solid #eee;
}

tr:nth-child(even) {
  background-color: red;
}


tr:nth-child(odd) {
  background-color: white;
}
</style>
<script>
/* autolink text */
(function() {
  var autoLink,
    __slice = [].slice;

  autoLink = function() {
    var k, linkAttributes, option, options, pattern, v;
    options = 1 <= arguments.length ? __slice.call(arguments, 0) : [];

    pattern = /(^|[\s\n]|<br\/?>)((?:https?|ftp):\/\/[\-A-Z0-9+\u0026\u2019@#\/%?=()~_|!:,.;]*[\-A-Z0-9+\u0026@#\/%=~()_|])/gi;
    if (!(options.length > 0)) {
      return this.replace(pattern, "$1<a href='$2'>$2</a>");
    }
    option = options[0];
    linkAttributes = ((function() {
      var _results;
      _results = [];
      for (k in option) {
        v = option[k];
        if (k !== 'callback') {
          _results.push(" " + k + "='" + v + "'");
        }
      }
      return _results;
    })()).join('');
    return this.replace(pattern, function(match, space, url) {
      var link;
      link = (typeof option.callback === "function" ? option.callback(url) : void 0) || ("<a href='" + url + "'" + linkAttributes + ">" + url + "</a>");
      return "" + space + link;
    });
  };

  String.prototype['autoLink'] = autoLink;

}).call(this);

  var xhr = new XMLHttpRequest();
  var config = {
    url: 'export.json'
  };
  console.log("GET config.url: " + config.url);
  xhr.open('GET', config.url, true);
  xhr.send();
  xhr.onreadystatechange = function() {
    console.log("xhr status: " + xhr.status);
    if (xhr.status == 200 && xhr.readyState == 4) {
      var data = JSON.parse(xhr.responseText);
      console.log("call printChat.");
      printChat(data);
    } else {
      console.log("Error - data: " + data);
    }

  }

  function printChat(data) {
    var out = '';
    for (id in data) {
      var msg = data[id];
      if (msg.text) {
        out += '<tr><td>' + msg.name.replace(' ', '&nbsp;') + '</td><td>' + msg.text.autoLink() + '</td></tr>'
      }
    }
    document.getElementById('chat').innerHTML = out;
  }
</script>
<table cellpadding="0" cellspacing="0" border="0" id="chat"></table>
</body>
</html>