Index: polymer_1.0.4/bower_components/google-analytics/google-analytics-dashboard.html |
diff --git a/polymer_1.0.4/bower_components/google-analytics/google-analytics-dashboard.html b/polymer_1.0.4/bower_components/google-analytics/google-analytics-dashboard.html |
new file mode 100644 |
index 0000000000000000000000000000000000000000..9d3b3e0e3b0dd4d918e4e77eb992e3bac1ae9ca7 |
--- /dev/null |
+++ b/polymer_1.0.4/bower_components/google-analytics/google-analytics-dashboard.html |
@@ -0,0 +1,126 @@ |
+<link rel="import" href="../polymer/polymer.html"> |
+<link rel="import" href="../google-signin/google-signin-aware.html"> |
+<!-- |
+Element for grouping Google Analytics elements together. |
+ |
+`<google-analytics-chart>` elements inside a `<google-analytics-dashboard>` |
+element will automatically update as control elements (e.g. |
+`<google-analytics-view-selector>` or `<google-analytics-date-selector>`) |
+update query parameters. |
+ |
+##### Example |
+ |
+ <google-analytics-dashboard> |
+ |
+ <google-analytics-view-selector></google-analytics-view-selector> |
+ <google-analytics-date-selector></google-analytics-date-selector> |
+ |
+ <google-analytics-chart |
+ metrics="ga:sessions" |
+ dimensions="ga:country" |
+ sort="-ga:sessions" |
+ maxResults="5" |
+ chartType="column"> |
+ </google-analytics-chart> |
+ |
+ </google-analytics-dashboard> |
+ |
+--> |
+ |
+ |
+<dom-module id="google-analytics-dashboard"> |
+ <template> |
+ <google-signin-aware |
+ on-google-signin-aware-success="_signedIn" |
+ on-google-signin-aware-signed-out="_signedOut"></google-signin-aware> |
+ <content id="content"></content> |
+ </template> |
+</dom-module> |
+<script> |
+ |
+ (function() { |
+ 'use strict'; |
+ |
+ Polymer({ |
+ |
+ is: 'google-analytics-dashboard', |
+ |
+ properties: { |
+ /** |
+ * The `query` attribute represents the internal query object of this |
+ * dashboard. It is updated when control elements fire the |
+ * `analytics-dashboard-control-change` event and pass along query data. |
+ */ |
+ query: { |
+ type: Object, |
+ value: function() { return {}; } |
+ }, |
+ |
+ /** |
+ * True if user has been authorized |
+ */ |
+ authorized: { |
+ type: Boolean, |
+ value: false, |
+ reflectToAttribute: true |
+ } |
+ |
+ }, |
+ |
+ listeners: { |
+ 'analytics-dashboard-control-change': 'queryUpdated' |
+ }, |
+ |
+ ready: function() { |
+ this.updateChildren(); |
+ }, |
+ |
+ /** |
+ * The `queryUpdated` method is the callback for whenever the |
+ * `analytics-dashboard-control-change` event is fired. It updates the |
+ * query attribute, which is then sent to child charts. |
+ * |
+ * @method queryUpdated |
+ * @param {CustomEvent} event - The event with the query data. |
+ */ |
+ queryUpdated: function(event) { |
+ // Update `this.query` with the passed event data. |
+ Object.keys(event.detail).forEach(function(key) { |
+ this.query[key] = event.detail[key]; |
+ }.bind(this)) |
+ |
+ this.updateChildren(); |
+ }, |
+ |
+ /** |
+ * The `updateChildren` method updates each of this dashboards |
+ * `<google-analytics-chart>` element with its current query value. |
+ * |
+ * @method updateChildren |
+ */ |
+ updateChildren: function() { |
+ if (!this.authorized) { |
+ return; |
+ } |
+ var charts = Polymer.dom(this).querySelectorAll('google-analytics-chart'); |
+ for (var i = 0, chart; chart = charts[i]; i++) { |
+ Object.keys(this.query).forEach(function(key) { |
+ chart[key] = this.query[key]; |
+ }.bind(this)); |
+ } |
+ }, |
+ |
+ _signedIn: function() { |
+ this.authorized = true; |
+ this.updateChildren(); |
+ }, |
+ |
+ _signedOut: function() { |
+ this.authorized = false; |
+ } |
+ |
+ }); |
+ |
+ })(); |
+ |
+</script> |