Index: polymer_1.2.3/bower_components/iron-page-url/demo/index.html |
diff --git a/polymer_1.2.3/bower_components/iron-page-url/demo/index.html b/polymer_1.2.3/bower_components/iron-page-url/demo/index.html |
new file mode 100644 |
index 0000000000000000000000000000000000000000..b1f66cf29dc3ee0145a680f2f8efe1380434a75a |
--- /dev/null |
+++ b/polymer_1.2.3/bower_components/iron-page-url/demo/index.html |
@@ -0,0 +1,121 @@ |
+<!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-page-url</title> |
+ |
+ <script src="../../webcomponentsjs/webcomponents-lite.js"></script> |
+ <link rel="import" href="../../polymer/polymer.html"> |
+ <link rel="import" href="../iron-page-url.html"> |
+ <link rel="import" href="../../paper-styles/typography.html"> |
+ <link rel="import" href="../../iron-flex-layout/iron-flex-layout.html"> |
+ <link rel="import" href="../../paper-input/paper-input.html"> |
+ <link rel="import" href="../../paper-slider/paper-slider.html"> |
+ <link rel="stylesheet" href="../../paper-styles/demo.css"> |
+</head> |
+<body> |
+ |
+ <dom-module id="iron-page-url-demo"> |
+ <template> |
+ <style> |
+ div.inputs { |
+ margin-bottom: 15px; |
+ } |
+ label { |
+ display: inline-block; |
+ width: 100px; |
+ } |
+ |
+ h3 { |
+ padding: 0; |
+ margin: 0; |
+ } |
+ |
+ .inputs, .history_entries { |
+ @apply(--layout-vertical); |
+ @apply(--layout-flex); |
+ padding: 20px; |
+ max-width: 500px; |
+ } |
+ |
+ .container { |
+ @apply(--layout-horizontal); |
+ } |
+ </style> |
+ <iron-page-url path="{{path}}" hash="{{hash}}" query="{{query}}" |
+ dwell-time="{{dwellTime}}"> |
+ </iron-page-url> |
+ |
+ <div class="container"> |
+ <div class="inputs"> |
+ <h3>URL</h3> |
+ <paper-input label="path" value="{{path}}" always-float-label> |
+ </paper-input> |
+ <paper-input label="hash" value="{{hash}}" always-float-label> |
+ </paper-input> |
+ <paper-input label='query' value='{{query}}' always-float-label> |
+ </paper-input> |
+ </div> |
+ <div class="history_entries"> |
+ <h3>Dwell Time</h3> |
+ <p> |
+ iron-page-url won't add extraneous entries to the browser's history |
+ when changes come in quick successino. |
+ </p> |
+ <p> |
+ A new history entry will only be added if iron-query-url stays in |
+ the same state longer than dwellTime. |
+ </p> |
+ <div> |
+ <label>History added: </label> |
+ {{historyElementsAdded}} entries |
+ </div> |
+ <div> |
+ <label>Dwell time:</label> |
+ {{inSeconds(dwellTime)}}s |
+ </div> |
+ <paper-slider min="-1" max="5000" value="2000" step="100" |
+ immediate-value="{{dwellTime}}"> |
+ </paper-slider> |
+ </div> |
+ </div> |
+ </template> |
+ <script> |
+ Polymer({ |
+ is: 'iron-page-url-demo', |
+ properties: { |
+ historyElementsAdded: { |
+ type: Number |
+ } |
+ }, |
+ observers: [ |
+ 'checkHistorySize(path, hash, query, startingHistoryLength)' |
+ ], |
+ ready: function() { |
+ this.startingHistoryLength = window.history.length; |
+ }, |
+ checkHistorySize: function() { |
+ this.historyElementsAdded = |
+ window.history.length - this.startingHistoryLength; |
+ }, |
+ inSeconds: function(dwellTime) { |
+ if (dwellTime === -1) { |
+ return -1; |
+ } |
+ return (Math.round(dwellTime / 100) / 10) |
+ } |
+ }); |
+ </script> |
+ </dom-module> |
+ |
+ <iron-page-url-demo></iron-page-url-demo> |
+</body> |
+</html> |