api-console-assets
Version:
This repo only exists to publish api console components to npm
1,013 lines (967 loc) • 35.3 kB
HTML
<!--
@license
Copyright 2016 The Advanced REST client authors <arc@mulesoft.com>
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.
-->
<link rel="import" href="../polymer/polymer.html">
<link rel="import" href="../iron-flex-layout/iron-flex-layout.html">
<link rel="import" href="../iron-pages/iron-pages.html">
<link rel="import" href="../paper-dropdown-menu/paper-dropdown-menu.html">
<link rel="import" href="../paper-item/paper-item.html">
<link rel="import" href="../paper-listbox/paper-listbox.html">
<link rel="import" href="../auth-methods/auth-methods.html">
<link rel="import" href="../iron-collapse/iron-collapse.html">
<link rel="import" href="../paper-ripple/paper-ripple.html">
<link rel="import" href="../arc-icons/arc-icons.html">
<link rel="import" href="../iron-icon/iron-icon.html">
<link rel="import" href="../events-target-behavior/events-target-behavior.html">
<!--
`<authorization-panel>` The authorization panel used in the request panel.
It is a set of forms that allow set up the authorization method for a HTTP request.
The element do not perform authorization. Depending on selected method there are
different ways of dealing with the authorization.
### Auth methods availability
By default the element will display all authorization methods available in it.
Currently they are:
- basic
- digest
- OAuth 2.0
If `securedBy` property is set (which is the `securedBy` property of the RAML's
definition produced by [raml-js-parser](https://elements.advancedrestclient.com/elements/raml-js-parser)
and [raml-json-enhance](https://elements.advancedrestclient.com/elements/raml-json-enhance))
then it will show only those methods that are supported by this known endpoint.
See this element's documentation for more information.
Detailed information about authorization methods can be find in the [auth-methods documentation page](https://elements.advancedrestclient.com/elements/auth-methods).
### Basic authorization
The element sends the `request-header-changed` custom event to inform any other
element that is listening to this event that header value has changed
(Authorization in this case). The `raml-headers-form` is an example of an
element that is listening for this event and change request headers value
when auth data change.
### OAuth 2.0
The [Oauth 2 form](https://elements.advancedrestclient.com/elements/auth-methods?active=auth-method-oauth2)
sends the `oauth2-token-requested` custom event with the OAuth settings provided
by the user.
Any element / hosting app can handle this event and perform authorization.
ARC elements provides the [oauth2-authorization](https://elements.advancedrestclient.com/elements/oauth-authorization) element
(from the `oauth-authorization` repo) that can be placed anywhere in the DOM
(from current element where `authorization-panel` is attached up to
the body) and perform OAuth athorization.
However it can be also done by any other element / app or even server.
See `<oauth2-authorization>` for detailed documentation.
Note: OAuth 2.0 server flow probably will not work in regular browser
environment because main providers aren't setting CORS headers. Therefore the
request will be canceled by the browser.
To make it work, handle the `oauth2-token-requested` fired from the inside of this element.
If it's browser flow type (implicit) then the `oauth2-authorization` element can be used.
For other other types, handle and cancel the event and use server to handle token exchange.
The ARC elements offers a [Chrome extension](https://github.com/advanced-rest-client/api-console-extension)
that once installed will propxy auth requests and made the exchange even for
the server flow. The application should use [api-console-ext-comm](https://github.com/advanced-rest-client/api-console-ext-comm)
element to communicate with the extension.
#### `redirect-url` property for OAuth 2.0
OAuth protocol requires to define a redirect URL that is registered in the
OAuth provider. The redirect URL should point to a page that will pass the URL
parameters to the opener page (OAuth 2 panel).
If you application uses the [oauth-authorization](https://elements.advancedrestclient.com/elements/oauth-authorization)
element then it provides a popup that pases the data back to the application.
In this case your redirect URL would be `https://your.domain.com/bower_components/oauth-authorization/oauth-popup.html`.
User have to change OAuth provider's settings and adjust the redirect URL to
point to this page.
You can also use the [oauth-popup.html](https://github.com/advanced-rest-client/oauth-authorization/blob/stage/oauth-popup.html)
to build your own page.
### OAuth 1.0a
Oauth 1a is not currently supported. The form is ready and available but there's no
authorization method in the ARC components set.
### Digest Authentication
When the user provide all required information for Digest authorization then
this element will fire `request-header-changed` custom event which will do the
same thing as in case of basic authorization.
### Example
```
<authorization-panel redirect-url="http://domain.com/bower_components/oauth-authorization/oauth-popup.html"></authorization-panel>
```
### Styling
`<authorization-panel>` provides the following custom properties and mixins for styling:
Custom property | Description | Default
----------------|-------------|----------
`--authorization-panel` | Mixin applied to the element | `{}`
`--stepper-step-number-background-color` | Background color of the step number (if selected auth method support this) | `#3D8099`
`--stepper-step-number-color` | Color of the step number (if selected auth method support this) | `#fff`
`--stepper-step-title-color` | Color of the label of the step (if selected auth method support this) | `#3D8099`
`--stepper-step-selection-label-color` | Color of the label of closed section (with selected option) | `rgba(0, 0, 0, 0.54)`
`--stepper-line-color` | Left hand side line color of the stepper. | `rgba(0, 0, 0, 0.12)`
`--arc-font-body1` | Theme mixin, Mixin applied to the elements that are containg text | ``
@group UI Elements
@element authorization-panel
@demo demo/index.html Basic usage
@demo demo/raml.html Usage with RAML
-->
<dom-module id="authorization-panel">
<template>
<style>
:host {
display: block;
@apply --authorization-panel;
}
#container {
position: relative;
}
.stepper {
@apply --layout-horizontal;
@apply --layout-center;
padding: 12px 0;
position: relative;
pointer-events: none;
}
.stepper.active {
pointer-events: all;
cursor: pointer;
}
.stepper.disabled {
pointer-events: none ;
}
.edit-icon {
visibility: hidden;
}
.active:not(.disabled) .step-header:hover .edit-icon {
visibility: visible;
}
.step {
display: inline-block;
background-color: var(--stepper-step-number-background-color, #3D8099);
color: var(--stepper-step-number-color, #fff);
font-size: 14px;
@apply --layout-center-center;
@apply --layout-horizontal;
width: 24px;
height: 24px;
border-radius: 50%;
margin-right: 12px;
}
.step-header {
position: relative;
@apply --layout-flex;
}
.step-title {
@apply --arc-font-body1;
display: block;
color: var(--stepper-step-title-color, #3D8099);
font-size: 16px;
font-weight: 500;
}
.step-selection {
@apply --arc-font-body1;
color: var(--stepper-step-selection-label-color, rgba(0, 0, 0, 0.54));
position: absolute;
bottom: -16px;
}
paper-ripple {
color: var(--stepper-step-title-color, #3D8099);
}
.step-content {
@apply --layout-horizontal;
@apply --arc-font-body1;
margin-bottom: 12px;
min-height: 32px;
}
.line {
width: 11px;
border-right: 1px var(--stepper-line-color, rgba(0, 0, 0, 0.12)) solid;
margin-right: 24px;
}
.method-title {
@apply --arc-font-subhead;
}
iron-collapse {
width: 100%;
@apply --authorization-step-collapse;
}
</style>
<div id="container">
<template is="dom-if" if="[[!noSteps]]">
<div class$="[[_computeStepperClass(isSelected, renderSelector)]]" on-tap="_clearCelection">
<span class="step">1</span>
<span class="step-header">
<span class="step-title">
Authorization method
<iron-icon icon="arc:edit" class="edit-icon"></iron-icon>
</span>
<span class="step-selection" hidden$="[[!isSelected]]">[[_computeSelectedLabel(selected)]]</span>
</span>
<paper-ripple noink="[[noink]]"></paper-ripple>
</div>
<div class="step-content">
<div class="line"></div>
<iron-collapse opened="[[!isSelected]]">
<div class="content">
<paper-dropdown-menu label="Authorization method">
<paper-listbox class="dropdown-content" selected="{{selected}}" attr-for-selected="data-type">
<template is="dom-repeat" items="[[authMethods]]">
<paper-item data-type$="[[item.id]]">[[item.name]]</paper-item>
</template>
</paper-listbox>
</paper-dropdown-menu>
</div>
</iron-collapse>
</div>
</template>
<template is="dom-if" if="[[noSteps]]">
<template is="dom-if" if="[[renderSelector]]">
<paper-dropdown-menu label="Authorization method">
<paper-listbox class="dropdown-content" selected="{{selected}}" attr-for-selected="data-type">
<template is="dom-repeat" items="[[authMethods]]">
<paper-item data-type$="[[item.id]]">[[item.name]]</paper-item>
</template>
</paper-listbox>
</paper-dropdown-menu>
</template>
<template is="dom-if" if="[[!renderSelector]]">
<h4 class="method-title">[[_computeSelectedLabel(selected)]]</h4>
</template>
</template>
<iron-pages id="authPanelSelector" selected="[[selected]]" attr-for-selected="data-type" hidden$="[[!isSelected]]" selected-attribute="opened">
<div data-type="none"></div>
<auth-method-basic events-target="[[eventsTarget]]" data-type="basic" no-stepper="[[noSteps]]" attr-for-opened="opened"></auth-method-basic>
<auth-method-digest events-target="[[eventsTarget]]" data-type="digest" no-stepper="[[noSteps]]" attr-for-opened="opened"></auth-method-digest>
<auth-method-oauth1 events-target="[[eventsTarget]]" data-type="oauth1" no-stepper="[[noSteps]]" redirect-url="[[redirectUrl]]" raml-settings="[[_computeSettings(securedBy, 'OAuth 1.0')]]" attr-for-opened="opened"></auth-method-oauth1>
<auth-method-oauth2 events-target="[[eventsTarget]]" data-type="oauth2" no-stepper="[[noSteps]]" redirect-url="[[redirectUrl]]" raml-settings="[[_computeSettings(securedBy, 'OAuth 2.0')]]" attr-for-opened="opened"></auth-method-oauth2>
<auth-method-ntlm events-target="[[eventsTarget]]" data-type="ntlm" no-stepper="[[noSteps]]" attr-for-opened="opened"></auth-method-ntlm>
<template is="dom-repeat" items="[[customSchemes]]">
<auth-method-custom events-target="[[eventsTarget]]" data-type$="[[item]]" no-stepper="[[noSteps]]" raml-settings="[[_computeSettings(securedBy, item)]]" attr-for-opened="opened"></auth-method-custom>
</template>
</iron-pages>
</div>
</template>
<script>
Polymer({
is: 'authorization-panel',
behaviors: [ArcBehaviors.EventsTargetBehavior],
/**
* Fired when auth settings change.
*
* It will be fired when any of types is currently selected and
* any value of any property has changed.
*
* @event authorization-settings-changed
* @param {Object} settings Current auth settings. It depends on enabled `type`.
* @param {String} type Enabled auth type. For example `basic`, `ntlm` or `oauth2`.
*/
/**
* Fired when the authorization type changed.
* Note that the `settings` property may not be updated at the moment of of
* firing the event.
*
* This event is cancelable. If handler cancels the event the operation
* is stopped and selection is set to previous value.
*
* @event authorization-type-changed
* @param {String} type Current auth type
*/
/**
* Fired when the request header changed and all listeners should update
* header value.
*
* @event request-header-changed
* @param {String} name Name of the header that has changed
* @param {String} value Header new value
*/
/**
* Fired when the query param changed and all listeners should update
* parameters / URL value.
*
* @event query-parameter-changed
* @param {String} name Name of the header that has changed
* @param {String} value Header new value
*/
properties: {
/**
* Selected authorization type. Can be onle of `basic`, `digest`, `oauth1`,
* `oauth2`, `none` and `ntlm`.
*/
selected: {
type: String,
notify: true,
observer: '_selectedChanged'
},
/**
* Computed value. `true` when authorization method has been selected.
*/
isSelected: {
type: Boolean,
value: false,
computed: '_computeIsSelected(selected)'
},
/**
* Set to true to inform the element that authorization is required
* for an endpoint.
* It computes this value automatically when RAML security scheme is set.
* It can be set to `true` only if selected authorization method
* requires user to authenticate the call.
* It can be `false` if selected method is `none`, meaning RAML spec
* allows no authorization.
*/
authRequired: {
type: Boolean,
value: false,
notify: true
},
/**
* Determines if the user propertly provided authorization data into the
* authorization form.
* For OAuth 1/2 authorization methods it means that the token (and
* token secret for OAuth 1) is set.
* This property is only relevant when `authRequired` is set to true.
* Application should override `authRequired` state if it's set to true.
*
* For example the application can show a warning message to the user that
* authorization is required when `authRequired` is true and hide the
* information when `authVaid` is `true` even if `authRequired` is `true`.
*/
authValid: {
type: Boolean,
value: true,
notify: true,
computed: '_computeAuthValid(settings.valid, selected, authRequired)'
},
/**
* Current settings of selected auth type.
* Can be `undefined` if the user hasn't filled all required fields in the
* form. of if RAML settings allows no authorization and user selectd this
* option.
*/
settings: {
type: Object,
readOnly: true,
notify: true
},
/**
* A definition of the RAML `securedBy` node of the method.
* If set it will limit number of authorization methods rendered by this
* element to show only those which are defined in the RAML spec.
*/
securedBy: {
type: Object,
observer: '_securedByChanged'
},
/**
* The OAuth2 redirect URL to be set in the OAuth2 form pane.
*/
redirectUrl: String,
/**
* List of currently available authorization methods.
* Value computed when `securedBy` property change to a list of auth
* methods defined in RAML for selected endpoint and supported by this
* element.
*/
authMethods: Array,
/**
* If true then the numbered steps aren't rendered.
*/
noSteps: {
type: Boolean,
value: false
},
/**
* List of currently available custom security schemes declared in
* the RAML API spec file.
*/
customSchemes: Array,
/**
* Computed value. If true then type selector is not rendered.
*/
renderSelector: {
type: Boolean,
value: true,
readOnly: true
},
// If true then the ripple effect on step title is disabled.
noink: Boolean
},
/**
* List of authorization methods supported by this element.
*
* @return {Array}
*/
get supportedMethods() {
return [{
'id': 'none',
'name': 'No authorization'
}, {
'id': 'basic',
'name': 'Basic authorization'
}, {
'id': 'ntlm',
'name': 'NTLM'
}, {
'id': 'digest',
'name': 'Digest Authentication'
}, {
'id': 'oauth2',
'name': 'Oauth 2.0'
}, {
'id': 'oauth1',
'name': 'Oauth 1.0'
}];
},
observers: [
'_authSettingsChanged(selected, settings.*)'
],
// Overrides ArcBehaviors.EventsTargetBehavior
_attachListeners: function() {},
_detachListeners: function() {},
ready: function() {
if (!this.authMethods) {
this.set('authMethods', this.supportedMethods);
}
this._updateValidationState();
},
listeners: {
'auth-settings-changed': '_authSettingsHandler',
'authorization-settings-changed': '_onAuthSettingsChanged'
},
/**
* Updates validation state for the selected form.
* When element is initializing and RAML's `securedBy` property is set
* during the initialization time, events with settings are fired before the form
* is ready.
*/
_updateValidationState: function() {
if (!this.selected || !this.settings || this.selected === 'none') {
this.set('settings.valid', true);
return;
}
var panel = this.$$('#authPanelSelector [data-type="' + this.selected + '"]');
if (!panel) {
console.warn('The auth panel for %s not set', this.selected);
return;
}
var state = panel.validate();
if (state && this.selected === 'oauth2') {
if (this.settings && !this.settings.settings.tokenValue) {
state = false;
}
}
this.set('settings.valid', state);
},
_authSettingsHandler: function(e) {
var type = e.detail.type;
if (type === 'x-custom') {
type = e.detail.name;
}
if (type !== this.selected) {
return;
}
this._setSettings(e.detail);
},
// Fires the `authorization-settings-changed` event when something change
_authSettingsChanged: function(selected, record) {
if (!selected || !record || !record.base) {
return;
}
var set = record.base;
this._notifySettings(set, selected);
},
/**
* Notifies settings change if currently selected method is the same as
* `settings.type`.
*
* @param {Object} settings Authorization settings to notify.
* @param {String} selected Currently selected method name.
* @return {CustomEvent} The event fired to the listeners.
*/
_notifySettings: function(settings, selected) {
if (!settings) {
return this.fire('authorization-settings-changed', {
settings: undefined,
valid: this.authVaid || false,
type: selected
});
}
var type = settings.type;
if (type === 'x-custom') {
type = settings.name;
}
if (type !== selected) {
return;
}
return this.fire('authorization-settings-changed', {
settings: settings.settings,
valid: settings.valid,
type: this.selected
});
},
/**
* Fires the `authorization-type-changed` event when the selection change.
*/
_selectedChanged: function(selected, oldValue) {
var event = this.fire('authorization-type-changed', {
type: selected
}, {
cancelable: true
});
if (event.defaultPrevented) {
return this.set('selected', oldValue);
}
this.async(function() {
this._updateSettingsForPanel(selected);
}, 1);
},
/**
* Pulls settings from a panel and sets `settings` property with read value.
*
* @param {String} panel Authorization panel name
*/
_updateSettingsForPanel: function(panel) {
var settings;
switch (panel) {
case 'none':
settings = {
valid: true
};
break;
default:
settings = this._readCurrentSettings();
break;
}
if (!settings) {
settings = {
valid: false
};
}
this._setSettings(settings);
this._notifySettings(settings, this.selected);
},
/**
* A handler called when the `securedBy` property changes.
* It sets up the list of available auth methods
*/
_securedByChanged: function(secured) {
if (!secured || !secured.length) {
// If no RAML then show them all.
this.set('authRequired', false);
return this._updateMethodsSelection();
}
var state = {
none: false,
oauth1: false,
oauth2: false,
basic: false,
ntlm: false,
digest: false,
custom: false,
customData: []
};
// When one of `secured` antries is null, then no authorization
// is possible among having an authorization.
for (var i = 0, len = secured.length; i < len; i++) {
// has unexpanded data, use raml-json-enhance!
if (typeof secured[i] === 'string') {
continue;
}
if (!secured[i]) {
state.none = true;
continue;
}
switch (secured[i].type) {
case 'OAuth 1.0': state.oauth1 = true; break;
case 'OAuth 2.0': state.oauth2 = true; break;
case 'Basic Authentication': state.basic = true; break;
case 'Digest Authentication': state.digest = true; break;
case 'Pass Through': break;
default:
if (secured[i].type && secured[i].type.indexOf('x-') === 0) {
state.custom = true;
state.customData.push({
name: secured[i].name,
type: secured[i].type
});
} else {
console.warn('Unsupported auth method', secured[i]);
}
}
}
this._updateMethodsSelection(state);
this._updateValidationState();
var isRequired = !!(this.authMethods && this.authMethods.length);
this.set('authRequired', isRequired);
},
/**
* Updates number of possible type selection when RAML definition change.
*
* @param {Object} state A map where keys are auth types and values is
* the boolean value of the state. True for show the auth option in the
* selector.
*/
_updateMethodsSelection: function(state) {
// makes a copy of the array. Otherwise `this.supportedMethods`
// may change
var available = this.supportedMethods.map(function(item) {
return item;
});
if (!state) {
this.set('authMethods', available);
return;
}
for (var key in state) {
if (!state[key]) {
delete state[key];
}
}
var allowedKeys = Object.keys(state);
var i;
for (i = available.length - 1; i >= 0; i--) {
if (allowedKeys.indexOf(available[i].id) === -1) {
available.splice(i, 1);
}
}
this.customSchemes = undefined;
if (state.custom) {
var ids = [];
state.customData.forEach(function(data) {
available.push({
id: data.name,
name: data.name,
isCustom: true
});
ids.push(data.name);
});
this.customSchemes = ids;
}
this.set('authMethods', available);
this._ensureSelection();
this._manageSelectorSate(available);
},
/**
* Sets `renderSelector` property depending on number of allowed
* authorization methods. Sets value to `true` only if there's more than
* one authorization method available.
*
* @param {Array} authMethods Available authorization methods.
*/
_manageSelectorSate: function(authMethods) {
var state = !!(authMethods && authMethods.length && authMethods.length > 1);
this._setRenderSelector(state);
},
/**
* Ensures that authorization method is selected.
* It selects first available method if there's no selection or selection
* is invalid.
*/
_ensureSelection: function() {
var available = this.authMethods;
var current = this.selected;
for (var i = available.length - 1; i >= 0; i--) {
if (available[i].id === current) {
return;
}
}
if (available && available[0]) {
this.set('selected', available[0].id);
} else {
this.set('selected', '');
}
},
/**
* Computes settings for the auth panel if RAML's `securedBy`
* property is set and the `type` matches one of the defined types.
*
* @param {Array} secured The `securedBy` value.
* @param {String} type RAML's one of predefined authorization types.
* @return {Object|undefined} A scheme definition object if `type` matches.
*/
_computeSettings: function(secured, type) {
if (!secured || !secured.length || !type) {
return undefined;
}
for (var i = 0, len = secured.length; i < len; i++) {
if (secured[i] && (secured[i].type === type || secured[i].name === type)) {
return secured[i];
}
}
},
// Computes value for `isSelected` property.
_computeIsSelected: function(selected) {
return !!selected;
},
/**
* Computes label for step title.
* @param {String} selected ID of selected method.
* @return {String} Label for selection.
*/
_computeSelectedLabel: function(selected) {
switch (selected) {
case 'none': return 'No authorization';
case 'basic': return 'Basic authorization';
case 'digest': return 'Digest authorization';
case 'oauth2': return 'OAuth 2.0 authorization';
case 'oauth1': return 'OAuth 1.0 authorization';
case 'ntlm': return 'NTLM authorization';
default:
var cMethod = this._findCustomMethod(selected);
if (cMethod) {
return 'Custom authorization ' + cMethod.name;
}
return selected;
}
},
/**
* [description]
* @param {[type]} name [description]
* @return {[type]} [description]
*/
_findCustomMethod: function(name) {
var am = this.authMethods;
if (!name || !am || !am.length) {
return;
}
for (var i = 0, len = am.length; i < len; i++) {
if (am[i].isCustom && am[i].name === name) {
return am[i];
}
}
},
// Computes class name for stepper depending on selection.
_computeStepperClass: function(isSelected, renderSelector) {
var cls = 'stepper';
if (isSelected) {
cls += ' active';
}
if (!renderSelector) {
cls += ' disabled';
}
return cls;
},
// Resets `selected` property.
_clearCelection: function() {
if (!this.renderSelector) {
return;
}
this.set('selected', '');
},
/**
* Computes value for the `authValid` property.
* Authorization is valid when form panel reports it is valid and
* an auth method is selected.
*
* @param {Boolean} formValid Reported state
* @param {String} selected Selected auth method
* @return {Boolean} True if is valid and selected
*/
_computeAuthValid: function(formValid, selected, authRequired) {
if (!selected && authRequired) {
return false;
}
if (!selected && !authRequired) {
return true;
}
if (!formValid) {
return false;
}
return true;
},
/**
* Forces element to read settings from currently selected element.
*
* @return {Object|undefined} Settings object or undefined.
*/
_readCurrentSettings: function() {
if (!this.selected || this.selected === 'none') {
return;
}
var panel = this.$$('#authPanelSelector [data-type="' + this.selected + '"]');
if (!panel) {
// Custom scheme can be unavailable yet.
return;
}
var settings = panel.settings;
var validationResult = panel.validate();
var detail = {
settings: settings,
type: this.selected,
valid: validationResult
};
return detail;
},
/**
* The function will determine if current settings are valid for selected
* method. If they are it will send a header / query parameter change
* request event so the corresponding editors update their values.
*
* It will determine if either headers or query parameters should
* be updated from RAML spec or from default behavior for given method.
*/
_onAuthSettingsChanged: function(e) {
var settings = e.detail;
if (!settings) {
return;
}
var type = settings.type;
if (!type) {
return;
}
var method = this._getSecuredMethod(type);
switch (type) {
case 'none': break;
case 'basic': this._handleBasicSettings(settings); break;
case 'oauth2': this._handleOauth2Settings(settings, method); break;
case 'oauth1': break;
case 'digest': this._handleDigestSettings(settings); break;
case 'ntlm': break;
default:
var cMethod = this._findCustomMethod(type);
if (cMethod) {
/* Auth panel updates headers and query parameters by its own. */
return;
}
console.warn('Unsupported auth method', type);
}
},
/**
* Handles the case when basic settings changed.
*
* @param {Object} settings Basic auth settings object
*/
_handleBasicSettings: function(settings) {
settings = settings || {};
var value = (settings.settings && settings.settings.hash) ?
'Basic ' + settings.settings.hash : '';
this.fire('request-header-changed', {
name: 'authorization',
value: value
}, {
cancelable: true
});
},
/**
* Handles the case when OAuth2 settings changed.
*
* @param {Object} settings Oauth2 auth settings object
* @param {Object?} secureMethod If set, it's RAML's auth definition.
* If this parameter is not defined then default behavior will be to
* notify listeners to set Authorization header with Bearer token.
*/
_handleOauth2Settings: function(settings, secureMethod) {
settings = settings || {};
settings = settings.settings || {};
var token = settings.tokenValue;
if (!token) {
return this.set('settings.valid', false);
}
var transportType = 'header';
var paramName = 'authorization';
if (secureMethod) {
if (secureMethod.describedBy) {
var desc = secureMethod.describedBy;
if (desc.headers && desc.headers.length) {
paramName = desc.headers[0].name;
} else if (desc.queryParameters && desc.queryParameters.length) {
paramName = desc.queryParameters[0].name;
transportType = 'query-parameter';
}
}
}
if (transportType === 'header') {
this.fire('request-header-changed', {
name: paramName,
value: token ? 'Bearer ' + token : ''
}, {
cancelable: true
});
} else if (transportType === 'query-parameter') {
this.fire('query-parameter-changed', {
name: paramName,
value: token ? token : ''
}, {
cancelable: true
});
}
},
/**
* Handles the case when digest auth method settings changed.
*
* @param {Object} settings Digest auth method settings object
* It can be either username and password (that will be passed to
* transport method) then this function do nothing or list of Authorization
* header parameters.
*/
_handleDigestSettings: function(settings) {
if (!settings.valid) {
return this.fire('request-header-changed', {
name: 'authorization',
value: ''
});
}
if (!settings.settings) {
return;
}
var data = settings.settings;
if (data.username && data.password) {
return;
}
var value = 'Digest ';
var names = Object.getOwnPropertyNames(data);
names.forEach(function(name) {
value += name + '="' + data[name] + '", ';
});
value = value.substr(0, value.length - 2);
this.fire('request-header-changed', {
name: 'authorization',
value: value
}, {
cancelable: true
});
},
/**
* Gets selected security scheme for selected type.
*
* @param {String} type One of `basic`, `oauth1`, `oauth2`
* @return {Object} Corresponding security scheme for given type or undefined if not found.
*/
_getSecuredMethod: function(type) {
var securedBy = this.securedBy;
if (!securedBy || !securedBy.length) {
return;
}
var securityMethodsMapping = {
'OAuth 1.0': 'oauth1',
'OAuth 2.0': 'oauth2',
'Basic Authentication': 'basic',
'Digest Authentication': 'digest',
'Pass Through': 'passthrough'
};
for (var i = 0, len = securedBy.length; i < len; i++) {
var method = securedBy[i];
if (!method) {
continue;
}
if (securityMethodsMapping[method.type] === type) {
return method;
}
}
},
/**
* If selected authorization type is `oauth1` or `oauth2` it calls
* `authorize()` function of selected panel.
* If other method is selected it does nothing.
*/
forceTokenAuthorization: function() {
var type = this.selected;
if (['oauth1','oauth2'].indexOf(type) === -1) {
console.warn('forceTokenAuthorization can be only called for OAuth types');
return;
}
var panel = this.$$('#authPanelSelector [data-type="' + this.selected + '"]');
panel.authorize();
}
});
</script>
</dom-module>