#!mojo mojo:sky_viewer
<!--
// 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" />

<sky-element name="file-browser">
<template>
  <style>
    heading {
      font-size: 16px;
    }
  </style>
  <heading>File browser for {{ url }}</heading>
  <template repeat="{{ directories }}">
    <a href="{{}}">{{}}</a>
  </template>
  <template repeat="{{ files }}">
    <a href="{{}}">{{}}</a>
  </template>
</template>
<script>
module.exports = class extends SkyElement {
  created() {
    this.url = '';
    this.files = [];
    this.directories = [];
  }
  attached() {
    this.url = this.ownerDocument.URL;
    var 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();
  }
}.register();
</script>
</sky-element>