External-Mirrors/awx
2
0
Fork 0
mirror of https://github.com/ansible/awx.git synced 2026-01-16 20:30:46 -03:30
Code Issues Packages Projects Releases Wiki Activity

Cleanup inconsistencies in directives and dead code

Browse Source
This commit is contained in:
gconsidine 2017-05-25 11:46:15 -04:00
parent 19fa782fb4
commit a322fe97f6
39 changed files with 426 additions and 453 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

15
awx/ui/client/features/credentials/add-credentials.controller.js
View File

@ -8,14 +8,17 @@ function AddCredentialsController (models) {
omit: ['user', 'team', 'inputs']
});
vm.form.credential_type.data = credentialType.categorizeByKind();
vm.form.credential_type.placeholder = 'Select A Type';
vm.form.credential_type._data = credentialType.getResults();
vm.form.credential_type._placeholder = 'Select A Type';
vm.form.credential_type._display = 'name';
vm.form.credential_type._key = 'id';
vm.form.credential_type._exp = 'type as type.name group by type.kind for type in state._data';
vm.form.inputs = {
get: credentialType.getTypeFromName,
source: vm.form.credential_type,
reference: 'vm.form.inputs',
key: 'inputs'
_get: credentialType.mergeInputProperties,
_source: vm.form.credential_type,
_reference: 'vm.form.inputs',
_key: 'inputs'
};
vm.form.save = credential.post;

4
awx/ui/client/features/credentials/add-credentials.view.html
View File

@ -12,9 +12,9 @@
<at-input-text col="4" tab="2" state="vm.form.description"></at-input-text>
<at-input-select col="4" tab="3" state="vm.form.credential_type"></at-input-select>
<at-dynamic-input-group col="4" tab="4" state="vm.form.inputs">
<at-input-group col="4" tab="4" state="vm.form.inputs">
Type Details
</at-dynamic-input-group>
</at-input-group>
<at-action-group col="12" pos="right">
<at-form-action type="cancel"></at-form-action>

6
awx/ui/client/features/credentials/index.view.html
View File

@ -1,8 +1,6 @@
<div ui-view="edit"></div>
<div ui-view="add"></div>
<at-panel>
<at-panel-body>
<div class="panel at-Panel">
<div ui-view="list"></div>
</at-panel-body>
</at-panel>
</div>

4
awx/ui/client/lib/components/_index.less
View File

@ -1,8 +1,4 @@
@import 'action/_index';
@import 'badge/_index';
@import 'dynamic/_index';
@import 'input/_index';
@import 'panel/_index';
@import 'popover/_index';
@import 'toggle/_index';

4
awx/ui/client/lib/components/action/action-group.partial.html
View File

@ -1,5 +1,5 @@
<div class="col-sm-{{ col }} at-ActionGroup">
<div class="pull-{{ pos }}">
<div class="col-sm-{{::col }} at-ActionGroup">
<div class="pull-{{::pos }}">
<ng-transclude></ng-transclude>
</div>
</div>

8
awx/ui/client/lib/components/badge/_index.less
View File

@ -1,8 +0,0 @@
.at-Badge {
font-size: @at-font-size;
padding: 0 @at-space-2x;
margin: 0;
background-color: @at-gray;
color: @at-white;
border-radius: @at-border-radius;
}

12
awx/ui/client/lib/components/badge/badge.directive.js
View File

@ -1,12 +0,0 @@
function atBadge () {
return {
restrict: 'E',
transclude: true,
templateUrl: 'static/partials/components/badge/badge.partial.html',
scope: {
config: '='
}
};
}
export default atBadge;

8
awx/ui/client/lib/components/badge/badge.partial.html
View File

@ -1,8 +0,0 @@
<div class="at-Badge">
<div ng-if="config.text">
{{ config.text }}
</div>
<ng-if="!config" ng-transclude></ng-transclude>
</div>

27
awx/ui/client/lib/components/dynamic/_index.less
View File

@ -1,27 +0,0 @@
.at-DynamicInputGroup {
padding: 0;
margin: 0;
margin: @at-space-6x 0 0 0;
}
.at-DynamicInputGroup-border {
position: absolute;
width: @at-inset-width;
height: 100%;
background: @at-gray;
left: -@at-inset-width;
}
.at-DynamicInputGroup-title {
.at-mixin-Heading(@at-font-size-2x);
margin-top: 0;
margin-left: @at-space-5x;
margin-bottom: @at-space-4x;
}
.at-DynamicInputGroup-divider {
clear: both;
margin: 0;
padding: 0;
height: @at-space-6x;
}

139
awx/ui/client/lib/components/dynamic/input-group.directive.js
View File

@ -1,139 +0,0 @@
function atDynamicInputGroupLink (scope, el, attrs, controllers) {
let dynamicController = controllers[0];
let formController = controllers[1];
let element = el[0].getElementsByClassName('at-DynamicInputGroup-container')[0];
dynamicController.init(scope, formController, element);
}
function AtDynamicInputGroupController ($scope, $compile) {
let vm = this || {};
let form;
let scope;
let state;
let source;
let element;
vm.init = (_scope_, _form_, _element_) => {
form = _form_;
scope = _scope_;
element = _element_;
state = scope.state || {};
source = state.source;
$scope.$watch('state.source.value', vm.update);
};
vm.isValidSource = () => {
if (!source.value || source.value === state.value) {
return false;
}
return true;
};
vm.update = () => {
if (!vm.isValidSource()) {
return;
}
if (state.components) {
vm.clear();
}
state.value = source.value;
let inputs = state.get(source.value);
let components = vm.createComponentConfigs(inputs);
vm.insert(components);
state.components = components;
vm.compile(components);
};
vm.createComponentConfigs = inputs => {
let components = [];
inputs.forEach((input, i) => {
if (input.type === 'string') {
if (input.secret && input.multiline) {
input.component = 'at-input-textarea';
} else if (input.secret) {
input.component = 'at-input-secret';
} else if (input.multiline) {
input.component = 'at-input-textarea';
} else {
input.component = 'at-input-text';
}
}
components.push(Object.assign({
element: vm.createElement(input, i),
key: 'inputs',
dynamic: true
}, input));
});
return components;
};
vm.createElement = (input, index) => {
let tabindex = Number(scope.tab) + index;
let element =
`<${input.component} col="${scope.col}" tab="${tabindex}"
state="${state.reference}.components[${index}]">
</${input.component}>`;
return angular.element(element);
};
vm.insert = components => {
let group = document.createElement('div');
let divider = angular.element(`<div class="at-DynamicInputGroup-divider"></div>`)[0];
for (let i = 0; i < components.length; i++) {
if (i !== 0 && (i % (12 / scope.col)) === 0) {
group.appendChild(divider);
}
group.appendChild(components[i].element[0]);
}
element.appendChild(group);
};
vm.compile = components => {
components.forEach(component => $compile(component.element[0])(scope.$parent));
};
vm.clear = () => {
form.deregisterDynamicComponents(state.components);
element.innerHTML = '';
};
}
AtDynamicInputGroupController.$inject = ['$scope', '$compile'];
function atDynamicInputGroup (pathService) {
return {
restrict: 'E',
replace: true,
transclude: true,
require: ['atDynamicInputGroup', '^^atForm'],
templateUrl: pathService.getPartialPath('components/dynamic/input-group'),
controller: AtDynamicInputGroupController,
controllerAs: 'vm',
link: atDynamicInputGroupLink,
scope: {
state: '=',
col: '@',
tab: '@'
}
};
}
atDynamicInputGroup.$inject = ['PathService'];
export default atDynamicInputGroup;

11
awx/ui/client/lib/components/dynamic/input-group.partial.html
View File

@ -1,11 +0,0 @@
<div ng-show="state.value" class="col-sm-12 at-DynamicInputGroup">
<div class="at-DynamicInputGroup-border"></div>
<div class="at-DynamicInputGroup-inset">
<div class="row">
<div class="col-xs-12">
<h4 class="at-DynamicInputGroup-title"><ng-transclude></ng-transclude></h4>
</div>
</div>
<div class="at-DynamicInputGroup-container"></div>
</div>
</div>

44
awx/ui/client/lib/components/form/form.directive.js
View File

@ -59,17 +59,19 @@ function AtFormController (eventService) {
let data = vm.components
.filter(component => component.category === 'input')
.reduce((values, component) => {
if (!component.state.value) {
if (!component.state._value) {
return values;
}
if (component.state.dynamic) {
values[component.state.key] = values[component.state.key] || [];
values[component.state.key].push({
[component.state.id]: component.state.value
if (component.state._key && typeof component.state._value === 'object') {
values[component.state._id] = component.state._value[component.state._key];
} else if (component.state._group) {
values[component.state._key] = values[component.state._key] || [];
values[component.state._key].push({
[component.state._id]: component.state._value
});
} else {
values[component.state.id] = component.state.value;
values[component.state._id] = component.state._value;
}
return values;
@ -87,25 +89,39 @@ function AtFormController (eventService) {
};
vm.onSaveError = err => {
let handled;
if (err.status === 400) {
vm.setValidationErrors(err.data);
handled = vm.setValidationErrors(err.data);
}
if (!handled) {
// TODO: launch modal for unexpected error type
}
};
vm.setValidationErrors = errors => {
let errorMessageSet = false;
for (let id in errors) {
vm.components
.filter(component => component.category === 'input')
.forEach(component => {
if (component.state.id === id) {
component.state.rejected = true;
component.state.isValid = false;
component.state.message = errors[id].join(' ');
if (component.state._id === id) {
errorMessageSet = true;
component.state._rejected = true;
component.state._isValid = false;
component.state._message = errors[id].join(' ');
}
});
}
vm.check();
if (errorMessageSet) {
vm.check();
}
return errorMessageSet;
};
vm.validate = () => {
@ -116,7 +132,7 @@ function AtFormController (eventService) {
continue;
}
if (!vm.components[i].state.isValid) {
if (!vm.components[i].state._isValid) {
isValid = false;
break;
}
@ -133,7 +149,7 @@ function AtFormController (eventService) {
}
};
vm.deregisterDynamicComponents = components => {
vm.deregisterInputGroup = components => {
for (let i = 0; i < components.length; i++) {
for (let j = 0; j < vm.components.length; j++) {
if (components[i] === vm.components[j].state) {

16
awx/ui/client/lib/components/index.js
View File

@ -1,10 +1,10 @@
import actionGroup from './action/action-group.directive';
import badge from './badge/badge.directive';
import dynamicInputGroup from './dynamic/input-group.directive';
import form from './form/form.directive';
import formAction from './form/action.directive';
import inputGroup from './input/group.directive';
import inputLabel from './input/label.directive';
import inputSearch from './input/search.directive';
import inputMessage from './input/message.directive';
import inputNumber from './input/number.directive';
import inputSelect from './input/select.directive';
import inputSecret from './input/secret.directive';
import inputText from './input/text.directive';
@ -13,20 +13,18 @@ import panel from './panel/panel.directive';
import panelHeading from './panel/heading.directive';
import panelBody from './panel/body.directive';
import popover from './popover/popover.directive';
import toggleButton from './toggle/button.directive';
import toggleContent from './toggle/content.directive';
import BaseInputController from './input/base.controller';
angular
.module('at.lib.components', [])
.directive('atActionGroup', actionGroup)
.directive('atBadge', badge)
.directive('atDynamicInputGroup', dynamicInputGroup)
.directive('atForm', form)
.directive('atFormAction', formAction)
.directive('atInputGroup', inputGroup)
.directive('atInputLabel', inputLabel)
.directive('atInputSearch', inputSearch)
.directive('atInputMessage', inputMessage)
.directive('atInputNumber', inputNumber)
.directive('atInputSecret', inputSecret)
.directive('atInputSelect', inputSelect)
.directive('atInputText', inputText)
@ -35,8 +33,6 @@ angular
.directive('atPanelHeading', panelHeading)
.directive('atPanelBody', panelBody)
.directive('atPopover', popover)
.directive('atToggleButton', toggleButton)
.directive('atToggleContent', toggleContent)
.service('BaseInputController', BaseInputController);

65
awx/ui/client/lib/components/input/_index.less
View File

@ -15,6 +15,14 @@
}
}
.at-Input-button {
width: 72px;
&, &:active, &:hover, &:focus {
background-color: @at-white;
}
}
.at-Input--focus {
border-color: @at-blue;
}
@ -25,6 +33,34 @@
}
}
.at-InputGroup {
padding: 0;
margin: 0;
margin: @at-space-6x 0 0 0;
}
.at-InputGroup-border {
position: absolute;
width: @at-inset-width;
height: 100%;
background: @at-gray;
left: -@at-inset-width;
}
.at-InputGroup-title {
.at-mixin-Heading(@at-font-size-2x);
margin-top: 0;
margin-left: @at-space-5x;
margin-bottom: @at-space-4x;
}
.at-InputGroup-divider {
clear: both;
margin: 0;
padding: 0;
height: @at-space-6x;
}
.at-InputLabel-name {
color: @at-gray-dark-4x;
font-size: @at-font-size-2x;
@ -32,6 +68,13 @@
text-transform: uppercase;
}
.at-InputMessage--rejected {
font-size: @at-font-size;
color: @at-red;
margin: @at-space-3x 0 0 0;
padding: 0;
}
.at-InputLabel-required {
color: @at-red;
font-weight: @at-font-weight-2x;
@ -40,7 +83,7 @@
margin: @at-space-3x @at-space 0 0;
}
.at-InputGroup {
.at-InputSelect {
position: relative;
width: 100%;
@ -55,10 +98,6 @@
}
}
.at-InputSelect {
position: relative;
}
.at-InputSelect-input {
position: relative;
z-index: 2;
@ -71,19 +110,13 @@
position: absolute;
z-index: 1;
top: 0;
}
.at-Input-button {
width: 72px;
& > optgroup {
text-transform: uppercase;
&, &:active, &:hover, &:focus {
background-color: @at-white;
& > option {
text-transform: none;
}
}
}
.at-InputMessage--rejected {
font-size: @at-font-size;
color: @at-red;
margin: @at-space-3x 0 0 0;
padding: 0;
}

18
awx/ui/client/lib/components/input/base.controller.js
View File

@ -7,9 +7,9 @@ function BaseInputController () {
scope.state = scope.state || {};
scope.state.required = scope.state.required || false;
scope.state.isValid = scope.state.isValid || false;
scope.state.disabled = scope.state.disabled || false;
scope.state._required = scope.state.required || false;
scope.state._isValid = scope.state.isValid || false;
scope.state._disabled = scope.state.disabled || false;
form.register(type, scope);
@ -17,13 +17,13 @@ function BaseInputController () {
let isValid = true;
let message = '';
if (scope.state.required && !scope.state.value) {
if (scope.state._required && !scope.state._value) {
isValid = false;
message = REQUIRED_INPUT_MISSING_MESSAGE;
}
if (scope.state.validate) {
let result = scope.state.validate(scope.state.value);
let result = scope.state._validate(scope.state._value);
if (!result.isValid) {
isValid = false;
@ -40,10 +40,10 @@ function BaseInputController () {
vm.check = () => {
let result = vm.validate();
if (result.isValid !== scope.state.isValid) {
scope.state.rejected = !result.isValid;
scope.state.isValid = result.isValid;
scope.state.message = result.message;
if (result.isValid !== scope.state._isValid) {
scope.state._rejected = !result.isValid;
scope.state._isValid = result.isValid;
scope.state._message = result.message;
form.check();
}

139
awx/ui/client/lib/components/input/group.directive.js Normal file
View File

@ -0,0 +1,139 @@
function atInputGroupLink (scope, el, attrs, controllers) {
let groupController = controllers[0];
let formController = controllers[1];
let element = el[0].getElementsByClassName('at-InputGroup-container')[0];
groupController.init(scope, formController, element);
}
function AtInputGroupController ($scope, $compile) {
let vm = this || {};
let form;
let scope;
let state;
let source;
let element;
vm.init = (_scope_, _form_, _element_) => {
form = _form_;
scope = _scope_;
element = _element_;
state = scope.state || {};
source = state._source;
$scope.$watch('state._source._value', vm.update);
};
vm.isValidSource = () => {
if (!source._value || source._value === state._value) {
return false;
}
return true;
};
vm.update = () => {
if (!vm.isValidSource()) {
return;
}
if (state._group) {
vm.clear();
}
state._value = source._value;
let inputs = state._get(source._value);
let group = vm.createComponentConfigs(inputs);
vm.insert(group);
state._group = group;
vm.compile(group);
};
vm.createComponentConfigs = inputs => {
let group = [];
inputs.forEach((input, i) => {
if (input.type === 'string') {
if (input.secret && input.multiline) {
input._component = 'at-input-textarea';
} else if (input.secret) {
input._component = 'at-input-secret';
} else if (input.multiline) {
input._component = 'at-input-textarea';
} else {
input._component = 'at-input-text';
}
}
group.push(Object.assign({
_element: vm.createElement(input, i),
_key: 'inputs',
_group: true
}, input));
});
return group;
};
vm.createElement = (input, index) => {
let tabindex = Number(scope.tab) + index;
let element =
`<${input._component} col="${scope.col}" tab="${tabindex}"
state="${state._reference}._group[${index}]">
</${input._component}>`;
return angular.element(element);
};
vm.insert = group => {
let container = document.createElement('div');
let divider = angular.element(`<div class="at-InputGroup-divider"></div>`)[0];
for (let i = 0; i < group.length; i++) {
if (i !== 0 && (i % (12 / scope.col)) === 0) {
container.appendChild(divider);
}
container.appendChild(group[i]._element[0]);
}
element.appendChild(container);
};
vm.compile = group => {
group.forEach(component => $compile(component._element[0])(scope.$parent));
};
vm.clear = () => {
form.deregisterInputGroup(state._group);
element.innerHTML = '';
};
}
AtInputGroupController.$inject = ['$scope', '$compile'];
function atInputGroup (pathService) {
return {
restrict: 'E',
replace: true,
transclude: true,
require: ['atInputGroup', '^^atForm'],
templateUrl: pathService.getPartialPath('components/input/group'),
controller: AtInputGroupController,
controllerAs: 'vm',
link: atInputGroupLink,
scope: {
state: '=',
col: '@',
tab: '@'
}
};
}
atInputGroup.$inject = ['PathService'];
export default atInputGroup;

13
awx/ui/client/lib/components/input/group.partial.html Normal file
View File

@ -0,0 +1,13 @@
<div ng-show="state._value" class="col-sm-12 at-InputGroup">
<div class="at-InputGroup-border"></div>
<div class="at-InputGroup-inset">
<div class="row">
<div class="col-sm-12">
<h4 class="at-InputGroup-title">
<ng-transclude></ng-transclude>
</h4>
</div>
</div>
<div class="at-InputGroup-container"></div>
</div>
</div>

6
awx/ui/client/lib/components/input/label.directive.js
View File

@ -1,12 +1,8 @@
function atInputLabel (pathService) {
return {
restrict: 'E',
transclude: true,
replace: true,
templateUrl: pathService.getPartialPath('components/input/label'),
scope: {
state: '='
}
templateUrl: pathService.getPartialPath('components/input/label')
};
}

11
awx/ui/client/lib/components/input/message.directive.js Normal file
View File

@ -0,0 +1,11 @@
function atInputMessage (pathService) {
return {
restrict: 'E',
replace: true,
templateUrl: pathService.getPartialPath('components/input/message'),
};
}
atInputMessage.$inject = ['PathService'];
export default atInputMessage;

4
awx/ui/client/lib/components/input/message.partial.html Normal file
View File

@ -0,0 +1,4 @@
<p ng-if="state._rejected && !state._isValid" class="at-InputMessage--rejected">
{{ state._message }}
</p>

54
awx/ui/client/lib/components/input/number.directive.js Normal file
View File

@ -0,0 +1,54 @@
const DEFAULT_STEP = '1';
const DEFAULT_MIN = '0';
const DEFAULT_MAX = '1000000000';
const DEFAULT_PLACEHOLDER = '';
function atInputNumberLink (scope, element, attrs, controllers) {
let formController = controllers[0];
let inputController = controllers[1];
if (scope.tab === '1') {
element.find('input')[0].focus();
}
inputController.init(scope, element, formController);
}
function AtInputNumberController (baseInputController) {
let vm = this || {};
vm.init = (scope, element, form) => {
baseInputController.call(vm, 'input', scope, element, form);
scope.state._step = scope.state._step || DEFAULT_STEP;
scope.state._min = scope.state._min || DEFAULT_MIN;
scope.state._max = scope.state._max || DEFAULT_MAX;
scope.state._placeholder = scope.state._placeholder || DEFAULT_PLACEHOLDER;
vm.check();
};
}
AtInputNumberController.$inject = ['BaseInputController'];
function atInputNumber (pathService) {
return {
restrict: 'E',
transclude: true,
replace: true,
require: ['^^atForm', 'atInputNumber'],
templateUrl: pathService.getPartialPath('components/input/number'),
controller: AtInputNumberController,
controllerAs: 'vm',
link: atInputNumberLink,
scope: {
state: '=',
col: '@',
tab: '@'
}
};
}
atInputNumber.$inject = ['PathService'];
export default atInputNumber;

19
awx/ui/client/lib/components/input/number.partial.html Normal file
View File

@ -0,0 +1,19 @@
<div class="col-sm-{{::col}}">
<div class="form-group at-u-flat">
<at-input-label></at-input-label>
<input type="number"
class="form-control at-Input"
ng-class="{ 'at-Input--rejected': state.rejected }"
ng-model="state._value"
ng-attr-min="state._min"
ng-attr-max="state._max"
ng-attr-step="state._step"
ng-attr-tabindex="{{ tab || undefined }}"
ng-attr-placeholder="{{::state._placeholder || undefined }}"
ng-change="vm.check()"
ng-disabled="state._disabled || form.disabled" />
<at-input-message></at-input-message>
</div>
</div>

22
awx/ui/client/lib/components/input/search.directive.js
View File

@ -1,22 +0,0 @@
// TODO: i18n
function atInputSearch (pathService) {
function link (scope) {
scope.config = scope.config || {};
scope.config.placeholder = scope.config.placeholder || 'SEARCH';
}
return {
restrict: 'E',
transclude: true,
templateUrl: pathService.getPartialPath('components/input/search'),
link,
scope: {
config: '='
}
};
}
atInputSearch.$inject = ['PathService'];
export default atInputSearch;

10
awx/ui/client/lib/components/input/search.partial.html
View File

@ -1,10 +0,0 @@
<div class="input-group at-InputSearch">
<input type="text"
class="form-control at-InputSearch-field"
placeholder="{{ config.placeholder }}" />
<div class="input-group-btn">
<button class="btn at-Button--default at-Button--icon" type="button">
<span class="fa fa-search"></span>
</button>
</div>
</div>

23
awx/ui/client/lib/components/input/secret.partial.html
View File

@ -1,23 +1,26 @@
<div class="col-sm-{{::col}}">
<div class="form-group at-u-flat">
<at-input-label state="state"></at-input-label>
<at-input-label></at-input-label>
<div class="input-group">
<span class="input-group-btn">
<button class="btn at-ButtonHollow--white at-Input-button"
ng-disabled="state.disabled || form.disabled" ng-click="vm.toggle()">
ng-disabled="state._disabled || form.disabled"
ng-click="vm.toggle()">
{{ buttonText }}
</button>
</span>
<input type="{{ type }}" class="form-control at-Input" ng-model="state.value"
ng-class="{ 'at-Input--rejected': state.rejected }"
ng-attr-maxlength="{{ state.options.max_length || undefined }}"
<input type="{{ type }}"
class="form-control at-Input"
ng-model="state._value"
ng-class="{ 'at-Input--rejected': state._rejected }"
ng-attr-maxlength="{{ state.max_length || undefined }}"
ng-attr-tabindex="{{ tab || undefined }}"
ng-attr-placeholder="{{::state.placeholder || undefined }}"
ng-attr-placeholder="{{::state._placeholder || undefined }}"
ng-change="vm.check()"
ng-disabled="state.disabled || form.disabled" />
ng-disabled="state._disabled || form.disabled" />
</div>
<p ng-if="state.rejected && !state.isValid" class="at-InputMessage--rejected">
{{ state.message }}
</p>
<at-input-message></at-input-message>
</div>
</div>

1
awx/ui/client/lib/components/input/select.directive.js
View File

@ -1,6 +1,7 @@
function atInputSelectLink (scope, element, attrs, controllers) {
let formController = controllers[0];
let inputController = controllers[1];
if (scope.tab === '1') {
elements.select.focus();
}

33
awx/ui/client/lib/components/input/select.partial.html
View File

@ -1,28 +1,25 @@
<div class="col-sm-{{::col}}">
<div class="form-group at-u-flat">
<at-input-label state="state"></at-input-label>
<div class="at-InputGroup at-InputSelect">
<input type="text" class="form-control at-Input at-InputSelect-input"
placeholder="{{ state.placeholder | uppercase }}"
<at-input-label></at-input-label>
<div class="at-InputSelect">
<input type="text"
class="form-control at-Input at-InputSelect-input"
placeholder="{{state._placeholder || undefined }}"
ng-class="{ 'at-Input--rejected': state.rejected }"
ng-model="state.value"
ng-disabled="state.disabled || form.disabled"
ng-model="state._value[state._display]"
ng-disabled="state._disabled || form.disabled"
ng-change="vm.check()" />
<select class="form-control at-InputSelect-select" ng-model="state.value"
<select class="form-control at-InputSelect-select"
ng-model="state._value"
ng-attr-tabindex="{{ tab || undefined }}"
ng-disabled="state.disabled || form.disabled">
<optgroup ng-repeat="group in state.data"
label="{{::group.category | uppercase }}">
<option ng-repeat="item in group.data" value="{{ item.name }}">
{{ item.name }}
</option>
</optgroup>
</select>
ng-disabled="state._disabled || form.disabled"
ng-options="{{ state._exp }}"></select>
<i class="fa" ng-class="{ 'fa-chevron-down': !open, 'fa-chevron-up': open }"></i>
</div>
<p ng-if="state.rejected && !state.isValid" class="at-InputMessage--rejected">
{{ state.message }}
</p>
<at-input-message></at-input-message>
</div>
</div>

24
awx/ui/client/lib/components/input/text.partial.html
View File

@ -1,17 +1,17 @@
<div class="col-sm-{{::col}}">
<div class="form-group at-u-flat">
<at-input-label state="state"></at-input-label>
<input type="text" class="form-control at-Input"
ng-class="{ 'at-Input--rejected': state.rejected }"
ng-model="state.value"
ng-attr-maxlength="{{ state.options.max_length || undefined }}"
ng-attr-tabindex="{{ tab || undefined }}"
ng-attr-placeholder="{{::state.placeholder || undefined }}"
ng-change="vm.check()"
ng-disabled="state.disabled || form.disabled" />
<at-input-label></at-input-label>
<p ng-if="state.rejected && !state.isValid" class="at-InputMessage--rejected">
{{ state.message }}
</p>
<input type="text"
class="form-control at-Input"
ng-class="{ 'at-Input--rejected': state._rejected }"
ng-model="state._value"
ng-attr-maxlength="{{ state.max_length || undefined }}"
ng-attr-tabindex="{{ tab || undefined }}"
ng-attr-placeholder="{{::state._placeholder || undefined }}"
ng-change="vm.check()"
ng-disabled="state._disabled || form.disabled" />
<at-input-message></at-input-message>
</div>
</div>

20
awx/ui/client/lib/components/input/textarea.partial.html
View File

@ -1,16 +1,16 @@
<div class="col-sm-{{::col}}">
<div class="form-group at-u-flat">
<at-input-label state="state"></at-input-label>
<textarea class="form-control at-Input" ng-model="state.value"
ng-class="{ 'at-Input--rejected': state.rejected }"
ng-attr-maxlength="{{ state.options.max_length || undefined }}"
<at-input-label></at-input-label>
<textarea class="form-control at-Input"
ng-model="state._value"
ng-class="{ 'at-Input--rejected': state._rejected }"
ng-attr-maxlength="{{ state.max_length || undefined }}"
ng-attr-tabindex="{{ tab || undefined }}"
ng-attr-placeholder="{{::state.placeholder || undefined }}"
ng-attr-placeholder="{{::state._placeholder || undefined }}"
ng-change="vm.check()"
ng-disabled="state.disabled || form.disabled" />
</textarea>
<p ng-if="state.rejected && !state.isValid" class="at-InputMessage--rejected">
{{ state.message }}
</p>
ng-disabled="state._disabled || form.disabled" /></textarea>
<at-input-message></at-input-message>
</div>
</div>

5
awx/ui/client/lib/components/panel/body.directive.js
View File

@ -3,10 +3,7 @@ function atPanelBody (pathService) {
restrict: 'E',
replace: true,
transclude: true,
templateUrl: pathService.getPartialPath('components/panel/body'),
scope: {
state: '='
}
templateUrl: pathService.getPartialPath('components/panel/body')
};
}

25
awx/ui/client/lib/components/panel/panel.directive.js
View File

@ -1,27 +1,44 @@
function atPanelLink (scope, el, attrs, controllers) {
let panelController = controllers[0];
panelController.init(scope, el);
}
function AtPanelController ($state) {
let vm = this;
let scope;
let el;
vm.init = (_scope_, _el_) => {
scope = _scope_;
el = _el_;
};
vm.dismiss = () => {
$state.go('^');
};
vm.use = scope => {
scope.dismiss = this.dismiss;
vm.use = child => {
child.dismiss = vm.dismiss;
};
}
AtPanelController.$inject = ['$state'];
function atPanel (pathService) {
function atPanel (pathService, _$animate_) {
return {
restrict: 'E',
replace: true,
require: ['atPanel'],
transclude: true,
templateUrl: pathService.getPartialPath('components/panel/panel'),
controller: AtPanelController,
controllerAs: 'vm',
link: atPanelLink,
scope: {
state: '='
state: '=',
animate: '@'
}
};
}

2
awx/ui/client/lib/components/panel/panel.partial.html
View File

@ -1,3 +1,3 @@
<div class="panel panel-default at-Panel">
<ng-transclude></ng-transclude>
<ng-transclude></ng-transclude>
</div>

32
awx/ui/client/lib/components/toggle/_index.less
View File

@ -1,32 +0,0 @@
.at-ToggleButton {
&, &:focus {
border-color: @at-gray-light;
background-color: @at-white;
}
&:hover {
background-color: @at-gray-light-2x;
}
& > span:hover {
border-color: @at-gray-light;
background-color: inherit;
}
}
.at-ToggleButton--show {
&, &:hover, &:focus {
background-color: @at-blue;
border-color: @at-blue;
color: @at-white;
}
}
.at-ToggleContent-well {
margin: @at-space-2x 0 0 0;
padding: @at-space-3x;
border-radius: @at-border-radius;
border: 1px solid transparent;
background-color: @at-gray-light-2x;
color: @at-gray-dark-2x;
}

12
awx/ui/client/lib/components/toggle/button.directive.js
View File

@ -1,12 +0,0 @@
function atToggleButton () {
return {
restrict: 'E',
transclude: true,
templateUrl: 'static/partials/components/toggle/button.partial.html',
scope: {
config: '='
}
};
}
export default atToggleButton;

9
awx/ui/client/lib/components/toggle/button.partial.html
View File

@ -1,9 +0,0 @@
<button class="btn btn-default at-Button at-ToggleButton"
ng-class="{ 'at-ToggleButton--show': config.show }"
ng-click="config.show = !config.show">
<span ng-if="config.button">
{{ config.button.text }}
</span>
<ng-transclude ng-if="!config.button"></ng-transclude>
</button>

12
awx/ui/client/lib/components/toggle/content.directive.js
View File

@ -1,12 +0,0 @@
function atToggleContent () {
return {
restrict: 'E',
transclude: true,
templateUrl: 'static/partials/component/toggle/content.partial.html',
scope: {
config: '='
}
};
}
export default atToggleContent;

10
awx/ui/client/lib/components/toggle/content.partial.html
View File

@ -1,10 +0,0 @@
<div ng-show="config.show" class="row">
<div ng-if="config.content" class="col-sm-12">
<div class="well at-ToggleContent-well">
{{ config.content.text }}
</div>
</div>
<ng-transclude ng-if="!config.content"></ng-transclude>
</div>

10
awx/ui/client/lib/models/CredentialType.js
View File

@ -15,16 +15,6 @@ function CredentialTypeModel (BaseModel) {
}));
};
this.getTypeFromName = name => {
let type = this.model.get.data.results.filter(result => result.name === name);
if (!type.length) {
return null;
}
return this.mergeInputProperties(type[0]);
};
this.mergeInputProperties = type => {
return type.inputs.fields.map(field => {
if (!type.inputs.required || type.inputs.required.indexOf(field.id) === -1) {

2
awx/ui/client/src/app.js
View File

@ -72,6 +72,7 @@ import footer from './footer/main';
import scheduler from './scheduler/main';
import instanceGroups from './instance-groups/main';
import 'angular-animate';
import '../lib/components';
import '../lib/models';
import '../lib/services';
@ -136,6 +137,7 @@ var tower = angular.module('Tower', [
'AWDirectives',
'features',
'ngAnimate',
'at.lib.components',
'at.lib.models',
'at.lib.services',