- Polymer Tutorial
- Polymer - Home
- Polymer - Overview
- Polymer - Installation
- Polymer - Elements
- Polymer - Custom Elements
- Polymer - Shadow DOM and Styling
- Polymer - Events
- Polymer - Data System
- Polymer Useful Resources
- Polymer - Quick Guide
- Polymer - Useful Resources
- Polymer - Discussion
Polymer - Google Client Loader
To load a specific client, Google API with the JavaScript client library Google-client-loader is used.
You can use the polymer_google-client-loader in your application, by running the following command to install it in your project directory.
bower install --save GoogleWebComponents/google-apis
This command will install all the related elements of polymer_google-client-loader under the bower_components folder.
Example
The following example specifies the use of polymer_google-client-loader in Polymer.js. Create a index.html file and add the following code in it.
<html> <head> <script src = "bower_components/webcomponentsjs/webcomponents-lite.js"></script> <link rel = "import" href = "bower_components/google-apis/google-apis.html"> </head> <body> <div id = "loadedmsg"></div> <template id = "googleclient" is = "dom-bind"> <google-client-loader id = "shortener" name = "urlshortener" version = "v1" on-google-api-load = "loadedShortener"> </google-client-loader> <google-js-api on-js-api-load = "msgloaded"> </google-js-api> <google-plusone-api on-api-load = "msgloaded"> </google-plusone-api> </template> <script> var googleclient = document.querySelector('#googleclient'); googleclient.loadedShortener = function(event) { var request = event.target.api.url.get ({ shortUrl: 'http://goo.gl/fbsS' }) request.execute(function(resp) { }); }; googleclient.msgloaded = function(e) { document.querySelector('#loadedmsg').innerHTML += e.target.localName + ' is loaded' + '<br>'; }; </script> </body> </html>
Output
To run the application, navigate to the created project directory and run the following command.
polymer serve
Now open the browser and navigate to http://127.0.0.1:8081/. Following will be the output.
polymer_elements.htm
Advertisements
To Continue Learning Please Login
Login with Google