diff --git a/bower.json b/bower.json deleted file mode 100644 index d854f69..0000000 --- a/bower.json +++ /dev/null @@ -1,47 +0,0 @@ -{ - "name": "google-apis", - "version": "2.0.1", - "description": "Web components to load Google API libraries", - "homepage": "https://elements.polymer-project.org/elements/google-apis?active=google-js-api", - "main": "google-apis.html", - "authors": [ - "Scott Miles ", - "Eric Bidelman " - ], - "license": "Apache-2.0", - "ignore": [ - "/.*", - "/test/" - ], - "keywords": [ - "web-component", - "web-components", - "polymer", - "google", - "apis" - ], - "dependencies": { - "polymer": "Polymer/polymer#1.9 - 2", - "iron-jsonp-library": "PolymerElements/iron-jsonp-library#1 - 2" - }, - "devDependencies": { - "iron-component-page": "PolymerElements/iron-component-page#1 - 2" - }, - "variants": { - "1.x": { - "dependencies": { - "polymer": "Polymer/polymer#^1.0.0", - "iron-jsonp-library": "PolymerElements/iron-jsonp-library#^1.0.0" - }, - "devDependencies": { - "iron-component-page": "PolymerElements/iron-component-page#^1.0.0" - }, - "resolutions": { - "webcomponentsjs": "^0.7" - } - } - }, - "resolutions": { - "webcomponentsjs": "^1.0.0" - } -} diff --git a/demo/index.html b/demo/index.html index 0455cbb..cbea597 100644 --- a/demo/index.html +++ b/demo/index.html @@ -5,7 +5,7 @@ google-apis Demo - +
@@ -26,26 +26,27 @@ - +// Polymer 2.0 compatibility +bind.loadedShortener = t.loadedShortener; +bind.loaded = t.loaded; + diff --git a/google-apis.html b/google-apis.js similarity index 57% rename from google-apis.html rename to google-apis.js index 29f9883..0336979 100644 --- a/google-apis.html +++ b/google-apis.js @@ -1,16 +1,17 @@ - +*/ +/* Load all Google APIs, for backwards compatibility */ - - - - - - - diff --git a/google-client-loader.html b/google-client-loader.html deleted file mode 100644 index cbbb6d0..0000000 --- a/google-client-loader.html +++ /dev/null @@ -1,236 +0,0 @@ - - - - - - - - diff --git a/google-client-loader.js b/google-client-loader.js new file mode 100644 index 0000000..c174cc7 --- /dev/null +++ b/google-client-loader.js @@ -0,0 +1,204 @@ +import { Polymer } from '../polymer/lib/legacy/polymer-fn.js'; +import './google-js-api.js'; + +// Stores whether the API client is done loading. +let _clientLoaded = false; + +// Loaders and loading statuses for all APIs, indexed by API name. +// This helps prevent multiple loading requests being fired at the same time +// by multiple google-api-loader elements. +const _statuses = {}; +const _loaders = {}; + +Polymer({ + + is: 'google-client-loader', + + /** + * Fired when the requested API is loaded. Override this name + * by setting `successEventName`. + * @event google-api-load + */ + + /** + * Fired if an error occurs while loading the requested API. Override this name + * by setting `errorEventName`. + * @event google-api-load-error + */ + + properties: { + /** + * Name of the API to load, e.g. 'urlshortener'. + * + * You can find the full list of APIs on the + * Google APIs + * Explorer. + */ + name: String, + + /** + * Version of the API to load, e.g. 'v1'. + */ + version: String, + + /** + * App Engine application ID for loading a Google Cloud Endpoints API. + */ + appId: String, + + /** + * Root URL where to load the API from, e.g. 'http://host/apis'. + * For App Engine dev server this would be something like: + * 'http://localhost:8080/_ah/api'. + * Overrides 'appId' if both are specified. + */ + apiRoot: String, + + /** + * Name of the event fired when API library is loaded. + */ + successEventName: { + type: String, + value: 'google-api-load', + }, + + /** + * Name of the event fired when there is an error loading the library. + */ + errorEventName: { + type: String, + value: 'google-api-load-error', + }, + }, + + hostAttributes: { + hidden: true, // remove from rendering tree. + }, + + // Used to fix events potentially being fired multiple times by + // iron-jsonp-library. + _waiting: false, + + /** + * Returns the loaded API. + */ + get api() { + if (window.gapi && window.gapi.client && + window.gapi.client[this.name]) { + return window.gapi.client[this.name]; + } + return undefined; + }, + + /** + * Wrapper for `gapi.auth`. + */ + get auth() { + return gapi.auth; + }, + + ready() { + this._loader = document.createElement('google-js-api'); + + if (!this.shadowRoot) { this.attachShadow({ mode: 'open' }); } + this.shadowRoot.appendChild(this._loader); + + this.listen(this._loader, 'js-api-load', '_loadClient'); + }, + + detached() { + this.unlisten(this._loader, 'js-api-load', '_loadClient'); + }, + + _loadClient() { + gapi.load('client', this._doneLoadingClient.bind(this)); + }, + + _handleLoadResponse(response) { + if (response && response.error) { + _statuses[this.name] = 'error'; + this._fireError(response); + } else { + _statuses[this.name] = 'loaded'; + this._fireSuccess(); + } + }, + + _fireSuccess() { + this.fire( + this.successEventName, + { name: this.name, version: this.version }, + ); + }, + + _fireError(response) { + if (response && response.error) { + this.fire(this.errorEventName, { + name: this.name, + version: this.version, + error: response.error, + }); + } else { + this.fire(this.errorEventName, { + name: this.name, + version: this.version, + }); + } + }, + + _doneLoadingClient() { + _clientLoaded = true; + // Fix for API client load event being fired multiple times by + // iron-jsonp-library. + if (!this._waiting) { + this._loadApi(); + } + }, + + _createSelfRemovingListener(eventName) { + var handler = function () { + _loaders[this.name].removeEventListener(eventName, handler); + this._loadApi(); + }.bind(this); + + return handler; + }, + + _loadApi() { + if (_clientLoaded && this.name && this.version) { + this._waiting = false; + // Is this API already loaded? + if (_statuses[this.name] == 'loaded') { + this._fireSuccess(); + // Is a different google-api-loader already loading this API? + } else if (_statuses[this.name] == 'loading') { + this._waiting = true; + _loaders[this.name].addEventListener( + this.successEventName, + this._createSelfRemovingListener(this.successEventName), + ); + _loaders[this.name].addEventListener( + this.errorEventName, + this._createSelfRemovingListener(this.errorEventName), + ); + // Did we get an error when we tried to load this API before? + } else if (_statuses[this.name] == 'error') { + this._fireError(null); + // Otherwise, looks like we're loading a new API. + } else { + let root; + if (this.apiRoot) { + root = this.apiRoot; + } else if (this.appId) { + root = `https://${this.appId}.appspot.com/_ah/api`; + } + _statuses[this.name] = 'loading'; + _loaders[this.name] = this; + gapi.client.load( + this.name, this.version, + this._handleLoadResponse.bind(this), root, + ); + } + } + }, +}); diff --git a/google-js-api.html b/google-js-api.js similarity index 56% rename from google-js-api.html rename to google-js-api.js index 3b05a10..4947281 100644 --- a/google-js-api.html +++ b/google-js-api.js @@ -1,16 +1,13 @@ - - - - - - - +}); diff --git a/google-legacy-loader.html b/google-legacy-loader.html deleted file mode 100644 index 02e7a5c..0000000 --- a/google-legacy-loader.html +++ /dev/null @@ -1,55 +0,0 @@ - - - - - - - diff --git a/google-legacy-loader.js b/google-legacy-loader.js new file mode 100644 index 0000000..39ea100 --- /dev/null +++ b/google-legacy-loader.js @@ -0,0 +1,50 @@ +import { Polymer } from '../polymer/lib/legacy/polymer-fn.js'; +/* +Copyright (c) 2014 The Polymer Project Authors. All rights reserved. +This code may only be used under the BSD style license found at https://polymer.github.io/LICENSE.txt +The complete set of authors may be found at https://polymer.github.io/AUTHORS.txt +The complete set of contributors may be found at https://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 https://polymer.github.io/PATENTS.txt +*/ +/* +Dynamically loads the legacy Google JavaScript API Loader (https://developers.google.com/loader/). + +Fires `api-load` event when ready. +*/ +Polymer({ + + is: 'google-legacy-loader', + + behaviors: [ + Polymer.IronJsonpLibraryBehavior, + ], + + properties: { + + /** @private */ + libraryUrl: { + type: String, + value: 'https://www.google.com/jsapi?callback=%%callback%%', + }, + + /** + * Fired when the API library is loaded and available. + * @event js-api-load + */ + /** + * Name of event fired when library is loaded and available. + */ + notifyEvent: { + type: String, + value: 'api-load', + }, + }, + + /** + * Wrapper for `google` API namespace. + */ + get api() { + return google; + }, +}); diff --git a/google-maps-api.html b/google-maps-api.html deleted file mode 100644 index fb9bbac..0000000 --- a/google-maps-api.html +++ /dev/null @@ -1,150 +0,0 @@ - - - - - - - diff --git a/google-maps-api.js b/google-maps-api.js new file mode 100644 index 0000000..45d22b8 --- /dev/null +++ b/google-maps-api.js @@ -0,0 +1,146 @@ +import './../iron-jsonp-library/iron-jsonp-library.js'; +import { Polymer } from '../polymer/lib/legacy/polymer-fn.js'; +/* +Copyright (c) 2014 The Polymer Project Authors. All rights reserved. +This code may only be used under the BSD style license found at https://polymer.github.io/LICENSE.txt +The complete set of authors may be found at https://polymer.github.io/AUTHORS.txt +The complete set of contributors may be found at https://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 https://polymer.github.io/PATENTS.txt +*/ +/** +Dynamically loads the Google Maps JavaScript API, firing the `api-load` event when ready. + +#### Example + + + + +Any number of components can use `` elements, and the library will only be loaded once. + +@summary Element wrapper around Google Maps API. +*/ +Polymer({ + + is: 'google-maps-api', + + behaviors: [ + Polymer.IronJsonpLibraryBehavior, + ], + + properties: { + + /** @private */ + mapsUrl: { + type: String, + value: 'https://maps.googleapis.com/maps/api/js?callback=%%callback%%', + }, + + /** + * A Maps API key. To obtain an API key, see developers.google.com/maps/documentation/javascript/tutorial#api_key. + */ + apiKey: { + type: String, + value: '', + }, + + /** + * A Maps API for Business Client ID. To obtain a Maps API for Business Client ID, see developers.google.com/maps/documentation/business/. + * If set, a Client ID will take precedence over an API Key. + */ + clientId: { + type: String, + value: '', + }, + + /** + * Version of the Maps API to use. + */ + version: { + type: String, + value: '3.exp', + }, + + /** + * The localized language to load the Maps API with. For more information + * see https://developers.google.com/maps/documentation/javascript/basics#Language + * + * Note: the Maps API defaults to the preffered language setting of the browser. + * Use this parameter to override that behavior. + */ + language: { + type: String, + value: '', + }, + /** + * If true, sign-in is enabled. + * See https://developers.google.com/maps/documentation/javascript/signedin#enable_sign_in + */ + signedIn: { + type: Boolean, + value: false, + }, + + /** + * Fired when the Maps API library is loaded and ready. + * @event api-load + */ + /** + * Name of event fired when library is loaded and available. + */ + notifyEvent: { + type: String, + value: 'api-load', + }, + + /** @private */ + libraryUrl: { + type: String, + computed: '_computeUrl(mapsUrl, version, apiKey, clientId, language, signedIn)', + }, + }, + + _computeUrl(mapsUrl, version, apiKey, clientId, language, signedIn) { + let url = `${mapsUrl}&v=${version}`; + + // Always load all Maps API libraries. + url += '&libraries=drawing,geometry,places,visualization'; + + if (apiKey && !clientId) { + url += `&key=${apiKey}`; + } + + if (clientId) { + url += `&client=${clientId}`; + } + + // Log a warning if the user is not using an API Key or Client ID. + if (!apiKey && !clientId) { + const warning = 'No Google Maps API Key or Client ID specified. ' + + 'See https://developers.google.com/maps/documentation/javascript/get-api-key ' + + 'for instructions to get started with a key or client id.'; + console.warn(warning); + } + + if (language) { + url += `&language=${language}`; + } + + if (signedIn) { + url += `&signed_in=${signedIn}`; + } + return url; + }, + + /** + * Provides the google.maps JS API namespace. + */ + get api() { + return google.maps; + }, +}); diff --git a/google-plusone-api.html b/google-plusone-api.html deleted file mode 100644 index 205658e..0000000 --- a/google-plusone-api.html +++ /dev/null @@ -1,54 +0,0 @@ - - - - - - - diff --git a/google-plusone-api.js b/google-plusone-api.js new file mode 100644 index 0000000..2381555 --- /dev/null +++ b/google-plusone-api.js @@ -0,0 +1,49 @@ +import { Polymer } from '../polymer/lib/legacy/polymer-fn.js'; +/* +Copyright (c) 2014 The Polymer Project Authors. All rights reserved. +This code may only be used under the BSD style license found at https://polymer.github.io/LICENSE.txt +The complete set of authors may be found at https://polymer.github.io/AUTHORS.txt +The complete set of contributors may be found at https://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 https://polymer.github.io/PATENTS.txt +*/ +/* +Dynamically loads the Google+ JavaScript API, firing the `api-load` event when ready. + +Any number of components can use `` elements, and the library will only be loaded once. +*/ +Polymer({ + + is: 'google-plusone-api', + + behaviors: [ + Polymer.IronJsonpLibraryBehavior, + ], + + properties: { + + /** @private */ + libraryUrl: { + type: String, + value: 'https://apis.google.com/js/plusone.js?onload=%%callback%%', + }, + + /** + * Fired when the API library is loaded and available. + * @event js-api-load + */ + /** + * Name of event fired when library is loaded and available. + */ + notifyEvent: { + type: String, + value: 'api-load', + }, + + }, + + get api() { + return gapi; + }, + +}); diff --git a/google-realtime-api.html b/google-realtime-api.html deleted file mode 100644 index a41fb51..0000000 --- a/google-realtime-api.html +++ /dev/null @@ -1,57 +0,0 @@ - - - - - - - diff --git a/google-realtime-api.js b/google-realtime-api.js new file mode 100644 index 0000000..2240008 --- /dev/null +++ b/google-realtime-api.js @@ -0,0 +1,52 @@ +import { Polymer } from '../polymer/lib/legacy/polymer-fn.js'; +/* +Copyright (c) 2014 The Polymer Project Authors. All rights reserved. +This code may only be used under the BSD style license found at https://polymer.github.io/LICENSE.txt +The complete set of authors may be found at https://polymer.github.io/AUTHORS.txt +The complete set of contributors may be found at https://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 https://polymer.github.io/PATENTS.txt +*/ +/* +Dynamically loads the Google Drive Realtime API, firing the `api-load` event when ready. + +Any number of components can use `` elements, and the library will only be loaded once. +*/ +Polymer({ + + is: 'google-realtime-api', + + behaviors: [ + Polymer.IronJsonpLibraryBehavior, + ], + + properties: { + + /** @private */ + libraryUrl: { + type: String, + value: 'https://apis.google.com/js/drive-realtime.js?onload=%%callback%%', + }, + + /** + * Fired when the API library is loaded and available. + * @event api-load + */ + /** + * Name of event fired when library is loaded and available. + */ + notifyEvent: { + type: String, + value: 'api-load', + }, + + }, + + /** + * Returns `gapi.drive.realtime` + */ + get api() { + return gapi.drive.realtime; + }, + +}); diff --git a/google-youtube-api.html b/google-youtube-api.html deleted file mode 100644 index 7f8960d..0000000 --- a/google-youtube-api.html +++ /dev/null @@ -1,61 +0,0 @@ - - - - - - - diff --git a/google-youtube-api.js b/google-youtube-api.js new file mode 100644 index 0000000..3102b9b --- /dev/null +++ b/google-youtube-api.js @@ -0,0 +1,56 @@ +import { Polymer } from '../polymer/lib/legacy/polymer-fn.js'; +/* +Copyright (c) 2014 The Polymer Project Authors. All rights reserved. +This code may only be used under the BSD style license found at https://polymer.github.io/LICENSE.txt +The complete set of authors may be found at https://polymer.github.io/AUTHORS.txt +The complete set of contributors may be found at https://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 https://polymer.github.io/PATENTS.txt +*/ +/* +Dynamically loads the Google Youtube Iframe API, firing the `api-load` event when ready. + +Any number of components can use `` elements, and the library will only be loaded once. + +https://developers.google.com/youtube/iframe_api_reference +*/ +Polymer({ + + is: 'google-youtube-api', + + behaviors: [ + Polymer.IronJsonpLibraryBehavior, + ], + + properties: { + + /** @private */ + libraryUrl: { + type: String, + value: 'https://www.youtube.com/iframe_api', + }, + + /** + * Fired when the API library is loaded and available. + * @event api-load + */ + /** + * Name of event fired when library loads. + */ + notifyEvent: { + type: String, + value: 'api-load', + }, + + callbackName: { + type: String, + value: 'onYouTubeIframeAPIReady', + }, + + }, + + get api() { + return YT; + }, + +}); diff --git a/package.json b/package.json new file mode 100644 index 0000000..74407d0 --- /dev/null +++ b/package.json @@ -0,0 +1,26 @@ +{ + "name": "@polymer/google-apis", + "flat": true, + "version": "3.0.0", + "description": "Web components to load Google API libraries", + "contributors": [ + "Scott Miles ", + "Eric Bidelman ", + "Ed Medvedev " + ], + "keywords": [ + "web-component", + "web-components", + "polymer", + "google", + "apis" + ], + "main": "google-apis.html", + "license": "Apache-2.0", + "homepage": "https://elements.polymer-project.org/elements/google-apis?active=google-js-api", + "dependencies": { + "@polymer/polymer": "^3.0.0-pre.1", + "@polymer/iron-jsonp-library": "^3.0.0-pre.1" + }, + "devDependencies": {} +}