OLD | NEW |
| (Empty) |
1 <!-- | |
2 Copyright 2014 The Chromium Authors. All rights reserved. | |
3 Use of this source code is governed by a BSD-style license that can be | |
4 found in the LICENSE file. | |
5 --> | |
6 | |
7 <!-- | |
8 Makes all links in a component view navigation aware. This will trap | |
9 clicks to links in that component and then redirect the navigation to the | |
10 <ct-router> component by dispatching a "navigate" event. | |
11 | |
12 To use, just add the component to the <template> inside all components that | |
13 use <a href> where the link should switch to a different view. | |
14 | |
15 ex. | |
16 <ct-view-handler></ct-view-handler> | |
17 --> | |
18 <polymer-element name="ct-view-handler"> | |
19 <template> | |
20 <style> | |
21 :host { display: none; } | |
22 </style> | |
23 </template> | |
24 <script> | |
25 Polymer("ct-view-handler", { | |
26 created: function() { | |
27 this.handleClick = this.handleClick.bind(this); | |
28 }, | |
29 | |
30 attached: function() { | |
31 this.scope = this.enclosingTreeScope(); | |
32 this.scope.addEventListener("click", this.handleClick); | |
33 }, | |
34 | |
35 detached: function() { | |
36 this.scope.removeEventListener("click", this.handleClick); | |
37 }, | |
38 | |
39 handleClick: function(event) { | |
40 if (event.metaKey || event.ctrlKey || event.button == 1) | |
41 return; | |
42 var a = this.findEnclosingLink(event.target); | |
43 if (!a) | |
44 return; | |
45 if (!a.href.startsWith(window.location.origin)) | |
46 return; | |
47 event.preventDefault(); | |
48 this.asyncFire("navigate", { | |
49 url: a.pathname + a.search + a.hash | |
50 }); | |
51 }, | |
52 | |
53 findEnclosingLink: function(node) { | |
54 while (node && node.nodeName != "A") | |
55 node = node.parentNode; | |
56 return node; | |
57 }, | |
58 | |
59 enclosingTreeScope: function() { | |
60 var scope = this; | |
61 while (scope.parentNode) | |
62 scope = scope.parentNode; | |
63 return scope; | |
64 }, | |
65 }); | |
66 </script> | |
67 </polymer-element> | |
OLD | NEW |