google-domain-user-picker

Easily choose a user from a Google Apps Domain.

Built with Polymer.

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.

License

Copyright 2015 Google Inc. All Rights Reserved.

Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at

    http://www.apache.org/licenses/LICENSE-2.0

Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.