Index: polymer_1.2.3/iron-ajax/demo/index.html |
diff --git a/polymer_1.2.3/iron-ajax/demo/index.html b/polymer_1.2.3/iron-ajax/demo/index.html |
new file mode 100644 |
index 0000000000000000000000000000000000000000..a21d9a7a1a0a0b1a4eb44335c5330a1c03aa013c |
--- /dev/null |
+++ b/polymer_1.2.3/iron-ajax/demo/index.html |
@@ -0,0 +1,59 @@ |
+<!doctype html> |
+<!-- |
+Copyright (c) 2015 The Polymer Project Authors. All rights reserved. |
+This code may only be used under the BSD style license found at http://polymer.github.io/LICENSE.txt |
+The complete set of authors may be found at http://polymer.github.io/AUTHORS.txt |
+The complete set of contributors may be found at http://polymer.github.io/CONTRIBUTORS.txt |
+Code distributed by Google as part of the polymer project is also |
+subject to an additional IP rights grant found at http://polymer.github.io/PATENTS.txt |
+--> |
+<html> |
+<head> |
+ |
+ <title>iron-ajax</title> |
+ |
+ <script src="../../webcomponentsjs/webcomponents-lite.js"></script> |
+ <link rel="import" href="../iron-ajax.html"> |
+ <link rel="import" href="../../iron-image/iron-image.html"> |
+ <link rel="import" href="../../paper-styles/demo-pages.html"> |
+ <style> |
+ iron-image { |
+ background-color: lightgray; |
+ margin: 1em; |
+ } |
+ .horizontal-section { |
+ max-width: 300px; |
+ margin-bottom: 24px; |
+ } |
+ </style> |
+</head> |
+<body unresolved> |
+ <h1>Video Feed</h1> |
+ <div class="horizontal-section-container"> |
+ <template is="dom-bind" id="app"> |
+ <iron-ajax auto |
+ url="https://www.googleapis.com/youtube/v3/search" |
+ params='{"part":"snippet", "q":"polymer", "key": "AIzaSyAuecFZ9xJXbGDkQYWBmYrtzOGJD-iDIgI", "type": "video"}' |
+ handle-as="json" |
+ last-response="{{ajaxResponse}}"></iron-ajax> |
+ |
+ <template is="dom-repeat" items="[[ajaxResponse.items]]"> |
+ <div class="horizontal-section"> |
+ <h2><a href="[[url(item.id.videoId)]]" target="_blank">[[item.snippet.title]]</a></h2> |
+ <iron-image src="[[item.snippet.thumbnails.high.url]]" width="256" height="256" sizing="cover" preload fade></iron-image> |
+ <p>[[item.snippet.description]]</p> |
+ </div> |
+ </template> |
+ |
+ </template> |
+ </div> |
+ |
+ <script> |
+ var app = document.querySelector('#app'); |
+ |
+ app.url = function (videoId) { |
+ return 'https://www.youtube.com/watch?v=' + videoId; |
+ }; |
+ </script> |
+</body> |
+</html> |