Skip to content
This repository has been archived by the owner on Sep 10, 2022. It is now read-only.

<google-domain-user-picker 1.0.0

Latest
Latest
Compare
Choose a tag to compare
@addyosmani addyosmani released this 26 Sep 09:06
v1.0.0
a7705c5

Easily choose a user from a Google Apps Domain.

Installation

bower install --save GoogleWebComponents/google-domain-user-picker

then import it like so

<link rel="import" href="../google-domain-user-picker/google-domain-user-picker.html">

Usage

With an access_token

<google-domain-user-picker access-token="<my_token>"
                           on-select-user="onUserSelected">
</google-domain-user-picker>

or, with google-signin

<google-domain-user-picker on-select-user="onUserSelected">
</google-domain-user-picker>

Check out the demo pages for more detailed examples.

Details

The demos have detailed usage within and outside of a Polymer app/element.

Available properties:

Property Description
accessToken the accessToken that will be used when making authenticated requests to the Google Admin SDK API
placeholder placeholder text for the main input element
minLength minimum input text required to search for a user
maxResults the maximum number of results to show
lastUser the last user chosen from the input
value current value of the input - settable and gettable
defaultProfileImage image url shown when a user does not have a profile picture

Available methods:

Method Description
clearResults clears the results of the picker

Available events:

Event Description Format
select-user fired when a user is selected by the mouse or enter key {name: String, email: String, id: String, image: String}
focus-user fired when a user is focused by the mouse or arrow keys {name: String, email: String, id: String, image: String}
error fired when there is an error with the picker String

The provided access token must have the https://www.googleapis.com/auth/admin.directory.user.readonly scope.

Apps Script

google-domain-user-picker can also be used within a Google Apps Script add-on with some additional setup. To use this component in your Apps Script add-on:

Include the element and the webcomponents shim. These must be served over https.

<script src="https://example.com/webcomponentsjs/webcomponents-lite.js"></script>
<link rel="import" href="https://example.com/google-domain-user-picker/google-domain-user-picker.html">

In your Code.gs, create a function that returns the user's access_token.

function accessToken() {
  return ScriptApp.getOAuthToken();
}

On your client side javascript, acquire this token via

google.script.run.withSuccessHandler(function(accessToken) {
  document.querySelector('google-domain-user-picker').setAttribute('access-token', accessToken);
}).accessToken();

An important note is that to request the https://www.googleapis.com/auth/admin.directory.user.readonly scope, your Apps Script add-on must pretend to access that service through Apps Script itself.

To do this, follow this guide to enable the AdminDirectory service.

Then create a function in Code.gs like so:

function fakeAdminDirectoryCall() {
  AdminDirectory.Users.list();
}

There's no need to ever run that function, unless you'd like to; google-domain-user-picker handles talking to the Admin Directory API.

Assets 2
Loading