Convert the directory listing to run on top of the platform

Previously we were using string concatenation to build up the directory
listing. Now we fetch some JSON from the server and use data binding to inflate
a directory listing.

This exmaple doesn't work yet because we're missing support for
template@repeat, but hopefully we'll get that soon.

Also, added support for setRequestHeader to XMLHttpRequest.

R=rafaelw@chromium.org

Review URL: https://codereview.chromium.org/688413005

examples/file-browser.sky

@@ -0,0 +1,41 @@
+<!--
+// Copyright 2014 The Chromium Authors. All rights reserved.
+// Use of this source code is governed by a BSD-style license that can be
+// found in the LICENSE file.
+-->
+<import src="../framework/sky-element/sky-element.sky" as="SkyElement" />
+<import src="../framework/xmlhttprequest.sky" as="XMLHttpRequest" />
+
+<template>
+  <style>
+    heading {
+      font-size: 16px;
+    }
+  </style>
+  <heading>File browser for {{ url }}</heading>
+  <template repeat="{{ directory in directories }}">
+    <a href="{{ directory }}">{{ directory }}</a>
+  </template>
+  <template repeat="{{ file in files }}">
+    <a href="{{ file }}">{{ file }}</a>
+  </template>
+</template>
+<script>
+SkyElement({
+  name: 'file-browser',
+  url: '',
+  files: [],
+  directories: [],
+  attached: function() {
+    this.url = this.ownerDocument.URL;
+    var xhr = this.xhr_ = new XMLHttpRequest();
+    xhr.open('GET', this.url + '?format=json');
+    xhr.onload = (function() {
+      var listing = JSON.parse(xhr.responseText);
+      this.files = listing.files;
+      this.directories = listing.directories;
+    }).bind(this);
+    xhr.send();
+  }
+});
+</script>