api-console-assets
Version:
This repo only exists to publish api console components to npm
111 lines (100 loc) • 7.04 kB
HTML
<!--
@license
Copyright (c) 2015 The Polymer Project Authors. All rights reserved.
This code may only be used under the BSD style license found at http://polymer.github.io/LICENSE.txt
The complete set of authors may be found at http://polymer.github.io/AUTHORS.txt
The complete set of contributors may be found at http://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 http://polymer.github.io/PATENTS.txt
-->
<html>
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<meta name="viewport" content="width=device-width, minimum-scale=1.0, initial-scale=1, user-scalable=yes">
<title>oauth2-scope-selector demo</title>
<script src="../../webcomponentsjs/webcomponents-lite.js"></script>
<link rel="import" href="../../iron-demo-helpers/demo-pages-shared-styles.html">
<link rel="import" href="../../arc-demo-helpers/arc-demo-snippet.html">
<link rel="import" href="../oauth2-scope-selector.html">
<style is="custom-style" include="demo-pages-shared-styles">
:root {
--arc-font-body1: {
@apply(--paper-font-body1);
}
--accent-color: #FF5040;
}
.vertical-section-container {
max-width: 600px;
}
</style>
</head>
<body unresolved>
<div class="vertical-section-container centered">
<h3>The `oauth2-scope-selector`</h3>
<arc-demo-snippet>
<template>
<oauth2-scope-selector></oauth2-scope-selector>
</template>
</arc-demo-snippet>
<h3>With predefined scopes</h3>
<arc-demo-snippet scopes='["user", "user:email", "user:follow", "public_repo", "repo", "repo_deployment", "repo:status", "delete_repo", "notifications", "gist", "read:repo_hook", "write:repo_hook", "admin:repo_hook", "admin:org_hook", "read:org", "write:org", "admin:org", "read:public_key", "write:public_key", "admin:public_key", "read:gpg_key", "write:gpg_key", "admin:gpg_key"]'>
<template>
<oauth2-scope-selector allowed-scopes="[[scopes]]"></oauth2-scope-selector>
</template>
</arc-demo-snippet>
<h3>Allow only pre-defined scopes</h3>
<arc-demo-snippet scopes='["user", "user:email", "user:follow", "public_repo", "repo", "repo_deployment", "repo:status", "delete_repo", "notifications", "gist", "read:repo_hook", "write:repo_hook", "admin:repo_hook", "admin:org_hook", "read:org", "write:org", "admin:org", "read:public_key", "write:public_key", "admin:public_key", "read:gpg_key", "write:gpg_key", "admin:gpg_key"]'>
<template>
<h4>Select GitHub scope.</h4>
<oauth2-scope-selector allowed-scopes="[[scopes]]" prevent-custom-scopes></oauth2-scope-selector>
</template>
</arc-demo-snippet>
<h3>Pre-selected scopes</h3>
<arc-demo-snippet selected='["user:email", "public_repo"]' scopes='["user", "user:email", "user:follow", "public_repo", "repo", "repo_deployment", "repo:status", "delete_repo", "notifications", "gist", "read:repo_hook", "write:repo_hook", "admin:repo_hook", "admin:org_hook", "read:org", "write:org", "admin:org", "read:public_key", "write:public_key", "admin:public_key", "read:gpg_key", "write:gpg_key", "admin:gpg_key"]'>
<template>
<h4>Select GitHub scope.</h4>
<oauth2-scope-selector allowed-scopes="[[scopes]]" scopes="{{selected}}" prevent-custom-scopes></oauth2-scope-selector>
</template>
</arc-demo-snippet>
<h3>With description</h3>
<arc-demo-snippet>
<template>
<oauth2-scope-selector id="withDescription" prevent-custom-scopes></oauth2-scope-selector>
<script>
// jscs:disable maximumLineLength
var scopes = [
{'label': 'user', 'description': 'Grants read/write access to profile info only. Note that this scope includes user:email and user:follow.'},
{'label': 'user:email', 'description': 'Grants read access to a user\'s email addresses.'},
{'label': 'user:follow', 'description': 'Grants access to follow or unfollow other users.'},
{'label': 'public_repo', 'description': 'Grants read/write access to code, commit statuses, collaborators, and deployment statuses for public repositories and organizations. Also required for starring public repositories.'},
{'label': 'repo', 'description': 'Grants read/write access to code, commit statuses, repository invitations, collaborators, and deployment statuses for public and private repositories and organizations.'},
{'label': 'repo_deployment', 'description': 'Grants access to deployment statuses for public and private repositories. This scope is only necessary to grant other users or services access to deployment statuses, without granting access to the code.'},
{'label': 'repo:status', 'description': 'Grants read/write access to public and private repository commit statuses. This scope is only necessary to grant other users or services access to private repository commit statuses without granting access to the code.'},
{'label': 'delete_repo', 'description': 'Grants access to delete adminable repositories.'},
{'label': 'notifications', 'description': 'Grants read access to a user\'s notifications. repo also provides this access.'},
{'label': 'gist', 'description': 'Grants write access to gists.'},
{'label': 'read:repo_hook', 'description': 'Grants read and ping access to hooks in public or private repositories.'},
{'label': 'write:repo_hook', 'description': 'Grants read, write, and ping access to hooks in public or private repositories.'},
{'label': 'admin:repo_hook', 'description': 'Grants read, write, ping, and delete access to hooks in public or private repositories.'},
{'label': 'admin:org_hook', 'description': 'Grants read, write, ping, and delete access to organization hooks. '},
{'label': 'read:org', 'description': 'Read-only access to organization, teams, and membership.'},
{'label': 'write:org', 'description': 'Publicize and unpublicize organization membership.'},
{'label': 'admin:org', 'description': 'Fully manage organization, teams, and memberships.'},
{'label': 'read:public_key', 'description': 'List and view details for public keys.'},
{'label': 'write:public_key', 'description': 'Create, list, and view details for public keys.'},
{'label': 'admin:public_key', 'description': 'Fully manage public keys.'},
{'label': 'read:gpg_key', 'description': 'List and view details for GPG keys.'},
{'label': 'write:gpg_key', 'description': 'Create, list, and view details for GPG keys.'},
{'label': 'admin:gpg_key', 'description': 'Fully manage GPG keys.'}
];
var element = document.getElementById('withDescription');
element.allowedScopes = scopes;
element.scopes = ['user:email', 'public_repo'];
</script>
</template>
</arc-demo-snippet>
</div>
</body>
</html>