Convert the directory listing to run on top of the platform

sky/examples/file-browser.sky

+<!--
+// 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 }}">

[rafaelw, 2014/11/03 20:06:04]

if you want this to work now, you can just do

<template repeat="{{ directories }}">
  <a href="{{}}">{{}}</a>
</template>

i.e. it's only the "named" scoping that's not hooked up. repeating works. {{}}
is |this| value

same below.

+    <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>