Chromium Code Reviews
chromiumcodereview-hr@appspot.gserviceaccount.com (chromiumcodereview-hr) | Please choose your nickname with Settings | Help | Chromium Project | Gerrit Changes | Sign out
(336)

Unified Diff: polymer_1.0.4/bower_components/google-analytics/google-analytics-view-selector.html

Issue 1205703007: Add polymer 1.0 to npm_modules (Closed) Base URL: https://chromium.googlesource.com/infra/third_party/npm_modules.git@master
Patch Set: Renamed folder to 1.0.4 Created 5 years, 6 months ago
Use n/p to move between diff chunks; N/P to move between comments. Draft comments are only viewable by you.
Jump to:
View side-by-side diff with in-line comments
Download patch
Index: polymer_1.0.4/bower_components/google-analytics/google-analytics-view-selector.html
diff --git a/polymer_1.0.4/bower_components/google-analytics/google-analytics-view-selector.html b/polymer_1.0.4/bower_components/google-analytics/google-analytics-view-selector.html
new file mode 100644
index 0000000000000000000000000000000000000000..8f3b02669ab713928bdab8125628b76326003ab6
--- /dev/null
+++ b/polymer_1.0.4/bower_components/google-analytics/google-analytics-view-selector.html
@@ -0,0 +1,275 @@
+<link rel="import" href="../polymer/polymer.html">
+<link rel="import" href="account-summaries-import.html">
+<link rel="import" href="google-analytics-loader.html">
+
+<!--
+Element for selecting the view ID (ids) value for queries inside a
+`<google-analytics-dashboard>` element.
+
+##### Example
+
+ <google-analytics-dashboard>
+
+ <google-analytics-view-selector></google-analytics-view-selector>
+
+ <google-analytics-chart
+ metrics="ga:sessions"
+ dimensions="ga:date">
+ </google-analytics-chart>
+
+ </google-analytics-dashboard>
+
+@element google-analytics-view-selector
+@extends google-analytics-base
+@blurb Element for selecting the ids value for Google Analytics queries
+@status alpha
+@homepage https://googlewebcomponents.github.io/google-analytics
+-->
+
+<dom-module id="google-analytics-view-selector">
+ <style>
+ select {
+ color: inherit;
+ font: inherit;
+ margin: 0;
+ }
+ </style>
+ <template>
+ <google-analytics-loader all-ready="{{setupReady}}"></google-analytics-loader>
+ <span class="control">
+ <label for="account">Account</label>
+ <select id="account"
+ on-change="updateAccount"
+ value="{{account.id}}">
+ <template is="dom-repeat" items="{{accounts}}">
+ <option value="{{item.id}}">{{item.name}}</option>
+ </template>
+ </select>
+ </span>
+ <span class="control">
+ <label>Property</label>
+ <select id="property"
+ on-change="updateProperty"
+ value="{{property.id}}">
+ <template is="dom-repeat" items="{{account.properties}}">
+ <option value="{{item.id}}">{{item.name}}</option>
+ </template>
+ </select>
+ </span>
+ <span class="control">
+ <label>View</label>
+ <select id="view"
+ on-change="updateView"
+ value="{{view.id}}">
+ <template is="dom-repeat" items="{{property.views}}">
+ <option value="{{item.id}}">{{item.name}}</option>
+ </template>
+ </select>
+ </span>
+ </template>
+</dom-module>
+<script>
+
+ (function() {
+ 'use strict';
+
+ Polymer({
+
+ is: 'google-analytics-view-selector',
+
+ /**
+ * Fired when the users changes the view
+ *
+ * @param {Object} query The updated query params.
+ * @event analytics-dashboard-control-change
+ */
+
+ properties: {
+
+ /**
+ * The `ids` attribute, when found is used to preselect the chosen
+ * account, property, and view.
+ *
+ * See the <a href="https://developers.google.com/analytics/devguides/reporting/core/v3/reference#ids">Core Reporting API parameter reference</a> for more details.
+ *
+ * @property ids
+ * @type string
+ */
+ ids: {
+ type: String,
+ observer: 'idsChanged',
+ notify: true
+ },
+
+ /**
+ * The `summaries` attribute contains an account summaries utility object
+ * with various helper methods for quickly getting account data.
+ *
+ * See the <a href="https://github.com/googleanalytics/javascript-api-utils">Github repo</a> for more details.
+ *
+ * @property summaries
+ * @type Object
+ */
+ summaries: {
+ type: Object,
+ value: null
+ },
+
+ /**
+ * The `account` attribute is the currently selected account.
+ *
+ * @property account
+ * @type Object
+ */
+ account: {
+ type: Object,
+ observer: 'accountChanged'
+ },
+
+ /**
+ * The `property` attribute is the currently selected property.
+ *
+ * @property property
+ * @type Object
+ */
+ property: {
+ type: Object,
+ observer: 'propertyChanged'
+ },
+
+ /**
+ * The `view` attribute is the currently selected view.
+ *
+ * @property view
+ * @type Object
+ */
+ view: {
+ type: Object,
+ observer: 'viewChanged'
+ },
+
+ /**
+ * True if setup is ready
+ *
+ * @attribute setupReady
+ * @type Boolean
+ */
+ setupReady: {
+ type: Boolean,
+ observer: 'setupReadyChanged'
+ }
+
+ },
+
+ setupReadyChanged: function(newVal, oldVal) {
+ if (newVal) {
+ gaApiUtils.accountSummaries.get().then(function(accountSummaries) {
+ this.summaries = accountSummaries;
+ this.accounts = accountSummaries.all();
+
+ if (this.ids) {
+ // Manually call `idsChanged` here. The first change event will
+ // likely happen prior to fetching the accountSummaries data.
+ this.idsChanged(null, this.ids);
+ } else {
+ // When there's no `ids` set, just select the first account,
+ // which will trigger change events and set the property and view.
+ this.account = this.accounts[0];
+ }
+ }.bind(this));
+ }
+ else {
+ this.summaries = null;
+ this.accounts = null;
+ this.account = null;
+ this.property = null;
+ this.view = null;
+ this.ids = null;
+ }
+ },
+
+ /**
+ * The `updateAccount` method is bound to the change event on the
+ * account `<select>`. It updates the property and view `<select>`s based
+ * on the new account data. It also updates the `ids` attribute.
+ */
+ updateAccount: function() {
+ this.account = this.summaries.getAccount(this.$.account.value);
+ },
+
+ /**
+ * The `updateProperty` method is bound to the change event on the
+ * property `<select>`. It updates the view `<select>` based
+ * on the new property data. It also updates the `ids` attribute.
+ */
+ updateProperty: function() {
+ this.property = this.summaries.getProperty(this.$.property.value);
+ },
+
+ /**
+ * The `updateView` method is bound to the change event on the
+ * view `<select>`. It updates the `ids` attribute.
+ */
+ updateView: function() {
+ this.view = this.summaries.getView(this.$.view.value);
+ },
+
+ accountChanged: function(newAccount, oldAccount) {
+ if (newAccount) {
+ this.property = newAccount.properties[0];
+ }
+ },
+
+ propertyChanged: function(newProperty, oldProperty) {
+ if (newProperty) {
+ this.view = newProperty.views[0];
+ // this.view = Path.get('views[0]').getValueFrom(newProperty);
+ }
+ },
+
+ viewChanged: function(newView, oldView) {
+ this.ids = newView && 'ga:' + newView.id;
+ },
+
+ idsChanged: function(newIds, oldIds) {
+ // When `ids` is set or updated prior to fetching the account
+ // summaries, do nothing.
+ if (!this.summaries) return;
+
+ var viewId = newIds && newIds.slice(3);
+ var account = this.summaries.getAccountByViewId(viewId);
+ var property = this.summaries.getPropertyByViewId(viewId);
+ var view = this.summaries.getView(viewId);
+
+ // Make sure the account data is valid before firing any events.
+ if (account && property && view) {
+ this.account = account;
+ this.property = property;
+ this.view = view;
+
+ this.fireChangeEvent();
+ }
+ // If the account data isn't valid, and there's no previous value
+ // to fall back to, default to the first account.
+ else if (!oldIds) {
+ this.account = this.summaries.all()[0];
+ }
+ },
+
+ /**
+ * Fire a change event passing all the currently stored data.
+ */
+ fireChangeEvent: function() {
+ this.fire('analytics-dashboard-control-change', {
+ ids: this.ids,
+ account: this.account,
+ property: this.property,
+ view: this.view
+ });
+ }
+
+ });
+
+ })();
+
+</script>

Powered by Google App Engine
This is Rietveld 408576698