aboutsummaryrefslogtreecommitdiff
path: root/catapult/third_party/polymer/components/app-route/app-route-converter.html
diff options
context:
space:
mode:
Diffstat (limited to 'catapult/third_party/polymer/components/app-route/app-route-converter.html')
-rw-r--r--catapult/third_party/polymer/components/app-route/app-route-converter.html79
1 files changed, 79 insertions, 0 deletions
diff --git a/catapult/third_party/polymer/components/app-route/app-route-converter.html b/catapult/third_party/polymer/components/app-route/app-route-converter.html
new file mode 100644
index 00000000..e16b653f
--- /dev/null
+++ b/catapult/third_party/polymer/components/app-route/app-route-converter.html
@@ -0,0 +1,79 @@
+<!--
+@license
+Copyright (c) 2016 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
+-->
+
+<link rel="import" href="../polymer/polymer.html">
+<link rel="import" href="./app-route-converter-behavior.html">
+
+<!--
+`app-route-converter` provides a means to convert a path and query
+parameters into a route object and vice versa. This produced route object
+is to be fed into route-consuming elements such as `app-route`.
+
+> n.b. This element is intended to be a primitive of the routing system and for
+creating bespoke routing solutions from scratch. To simply include routing in
+an app, please refer to [app-location](https://github.com/PolymerElements/app-route/blob/master/app-location.html)
+and [app-route](https://github.com/PolymerElements/app-route/blob/master/app-route.html).
+
+An example of a route object that describes
+`https://elements.polymer-project.org/elements/app-route-converter?foo=bar&baz=qux`
+and should be passed to other `app-route` elements:
+
+ {
+ prefix: '',
+ path: '/elements/app-route-converter',
+ __queryParams: {
+ foo: 'bar',
+ baz: 'qux'
+ }
+ }
+
+`__queryParams` is private to discourage directly data-binding to it. This is so
+that routing elements like `app-route` can intermediate changes to the query
+params and choose whether to propagate them upstream or not. `app-route` for
+example will not propagate changes to its `queryParams` property if it is not
+currently active. A public queryParams object will also be produced in which you
+should perform data-binding operations.
+
+Example Usage:
+
+ <iron-location path="{{path}}" query="{{query}}"></iron-location>
+ <iron-query-params
+ params-string="{{query}}"
+ params-object="{{queryParams}}">
+ </iron-query-params>
+ <app-route-converter
+ path="{{path}}"
+ query-params="{{queryParams}}"
+ route="{{route}}">
+ </app-route-converter>
+ <app-route route='{{route}}' pattern='/:page' data='{{data}}'>
+ </app-route>
+
+This is a simplified implementation of the `app-location` element. Here the
+`iron-location` produces a path and a query, the `iron-query-params` consumes
+the query and produces a queryParams object, and the `app-route-converter`
+consumes the path and the query params and converts it into a route which is in
+turn is consumed by the `app-route`.
+
+@element app-route-converter
+@demo demo/index.html
+-->
+
+<script>
+ (function() {
+ 'use strict';
+
+ Polymer({
+ is: 'app-route-converter',
+
+ behaviors: [Polymer.AppRouteConverterBehavior]
+ });
+ })();
+</script>