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

trying to make codemirror editable

Browse Source
This commit is contained in:
Keith Grant 2019-03-15 11:42:46 -04:00
parent 74869494f9
commit 43ef4183df
8 changed files with 69 additions and 27 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

19
awx/ui/client/lib/components/code-mirror/code-mirror.directive.js
View File

@ -11,21 +11,30 @@ function atCodeMirrorController (
ParseVariableString
) {
const vm = this;
const variables = `${$scope.name}_variables`;
const variablesName = `${$scope.name}_variables`;
function init (vars, name) {
console.log('init', $scope, vars);
if ($scope.disabled === 'true') {
$scope.disabled = true;
} else if ($scope.disabled === 'false') {
$scope.disabled = false;
}
$scope[variables] = ParseVariableString(_.cloneDeep(vars));
$scope.variablesName = variablesName;
// $scope[variablesName] = ParseVariableString(_.cloneDeep(vars));
$scope.variables = {
value: ParseVariableString(_.cloneDeep(vars)),
};
$scope.value = $scope.variables.value;
$scope.parseType = ParseType;
const options = {
scope: $scope,
variable: variables,
variable: 'value', // variablesName,
parse_variable: ParseVariable,
field_id: name,
readOnly: $scope.disabled
readOnly: $scope.disabled,
onChange: (value) => {
console.log('change', value);
},
};
ParseTypeChange(options);
}
@ -41,7 +50,7 @@ function atCodeMirrorController (
vm.expanded = false;
}
vm.variables = variables;
// vm.variablesName = variablesName;
vm.name = $scope.name;
vm.modalName = `${vm.name}_modal`;
vm.strings = strings;

6
awx/ui/client/lib/components/code-mirror/code-mirror.partial.html
View File

@ -44,15 +44,15 @@
<textarea
ng-disabled="disabled"
rows="6"
ng-model="variables"
name="variables"
ng-model="variables.value"
name="variablesName"
class="form-control Form-textArea"
id="{{ vm.name }}">
</textarea>
<at-code-mirror-modal
name="{{ vm.modalName }}"
ng-if="vm.expanded"
variables="{{ variables }}"
variables="variables"
tooltip="{{ tooltip || vm.strings.get('code_mirror.tooltip.TOOLTIP') }}"
label="{{ label || vm.strings.get('code_mirror.label.VARIABLES') }}"
disabled="{{ disabled || false }}"

21
awx/ui/client/lib/components/code-mirror/modal/code-mirror-modal.directive.js
View File

@ -11,10 +11,10 @@ function atCodeMirrorModalController (
$scope,
strings,
ParseTypeChange,
ParseVariableString
// ParseVariableString
) {
const vm = this;
const variables = `${$scope.name}_variables`;
const variablesName = `${$scope.name}_variables`;
function resize () {
if ($scope.disabled === 'true') {
$scope.disabled = true;
@ -28,7 +28,7 @@ function atCodeMirrorModalController (
}
function toggle () {
$scope.parseTypeChange('parseType', variables);
$scope.parseTypeChange('parseType', variablesName);
setTimeout(resize, 0);
}
@ -39,11 +39,12 @@ function atCodeMirrorModalController (
$scope.disabled = false;
}
$(CodeMirrorModalID).modal('show');
$scope[variables] = ParseVariableString(_.cloneDeep(vars));
// $scope[variablesName] = ParseVariableString(_.cloneDeep(vars));
$scope.parseType = ParseType;
$scope.value = $scope.variables.value;
const options = {
scope: $scope,
variable: variables,
variable: 'value', // variablesName,
parse_variable: ParseVariable,
field_id: name,
readOnly: $scope.disabled
@ -58,15 +59,19 @@ function atCodeMirrorModalController (
$(`${CodeMirrorModalID} .modal-dialog`).on('resize', resize);
}
vm.variables = variables;
vm.variablesName = variablesName;
vm.name = $scope.name;
vm.strings = strings;
vm.toggle = toggle;
$scope.close = () => {
$scope.variables.value = $scope.value;
$scope.closeFn();
};
if ($scope.init) {
$scope.init = init;
}
angular.element(document).ready(() => {
init($scope.variables, $scope.name);
init($scope.variablesName, $scope.name);
});
}
@ -90,7 +95,7 @@ function atCodeMirrorModal () {
label: '@',
labelClass: '@',
tooltip: '@',
variables: '@',
variables: '=',
name: '@',
closeFn: '&'
}

7
awx/ui/client/lib/components/code-mirror/modal/code-mirror-modal.partial.html
View File

@ -46,13 +46,16 @@
<div class="at-RowItem-tag at-RowItem-tag--header atCodeMirror-badge" ng-show="disabled === 'true' || disabled === true">
{{ vm.strings.get('label.READONLY')}}
</div>
<button type="button" class="close" ng-click="closeFn()">
<button type="button" class="close" ng-click="close()">
<i class="fa fa-times-circle"></i>
</button>
</div>
</div>
</div>
<div class="modal-body">
{{extra_variables}}
:
{{variables.value}}
<textarea
ng-disabled="disabled"
ng-model="extra_variables"
@ -63,7 +66,7 @@
</div>
<div class="modal-footer">
<div class="CodeMirror-modalControls">
<button ng-click="closeFn()" class="btn btn-sm btn-default">Close</button>
<button ng-click="close()" class="btn btn-sm btn-default">Close</button>
</div>
</div>
</div>

12
awx/ui/client/src/inventories-hosts/inventories/standard-inventory/edit/inventory-edit.controller.js
View File

@ -40,12 +40,12 @@ function InventoriesEdit($scope, $location,
$scope.instance_groups = InstanceGroupsData;
$scope.canRemediate = CanRemediate;
ParseTypeChange({
scope: $scope,
variable: 'inventory_variables',
parse_variable: 'parseType',
field_id: 'inventory_inventory_variables'
});
// ParseTypeChange({
// scope: $scope,
// variable: 'inventory_variables',
// parse_variable: 'parseType',
// field_id: 'inventory_inventory_variables'
// });
OrgAdminLookup.checkForRoleLevelAdminAccess(inventoryData.organization, 'inventory_admin_role')
.then(function(canEditOrg){

16
awx/ui/client/src/inventories-hosts/inventories/standard-inventory/inventory.form.js
View File

@ -66,13 +66,27 @@ function(i18n) {
dataContainer: 'body',
control: '<instance-groups-multiselect instance-groups="instance_groups" field-is-disabled="!(inventory_obj.summary_fields.user_capabilities.edit || canAdd)"></instance-groups-multiselect>',
},
// inventory_variables: {
// realName: 'variables',
// label: i18n._('Variables'),
// type: 'textarea',
// class: 'Form-formGroup--fullWidth',
// rows: 6,
// "default": "---",
// awPopOver: i18n._('Enter inventory variables using either JSON or YAML syntax. Use the radio button to toggle between the two. Refer to the Ansible Tower documentation for example syntax.'),
// dataTitle: i18n._('Variables'),
// dataPlacement: 'right',
// dataContainer: 'body',
// ngDisabled: '!(inventory_obj.summary_fields.user_capabilities.edit || canAdd)' // TODO: get working
// },
inventory_variables: {
realName: 'variables',
label: i18n._('Variables'),
type: 'textarea',
type: 'code_mirror',
class: 'Form-formGroup--fullWidth',
rows: 6,
"default": "---",
variables: 'inventory_variables',
awPopOver: i18n._('Enter inventory variables using either JSON or YAML syntax. Use the radio button to toggle between the two. Refer to the Ansible Tower documentation for example syntax.'),
dataTitle: i18n._('Variables'),
dataPlacement: 'right',

13
awx/ui/client/src/shared/form-generator.js
View File

@ -1364,6 +1364,17 @@ angular.module('FormGenerator', [GeneratorHelpers.name, 'Utilities', listGenerat
html += "</div>\n";
}
if (field.type === 'code_mirror') {
html += '<at-code-mirror ';
html += `id="${form.name}_${fld}" `;
html += `class="${field.class}" `;
html += `label="${field.label}" `;
html += `tooltip="${field.awPopOver}" `;
html += `name="${field.realName}" `;
html += `variables="{{ ${field.variables} }}" `;
html += '></at-code-mirror>';
}
if (field.type === 'custom') {
let labelOptions = {};
@ -1475,7 +1486,7 @@ angular.module('FormGenerator', [GeneratorHelpers.name, 'Utilities', listGenerat
} else {
relatedTabSelected = this.form.activeEditState ? `$state.includes('${this.form.activeEditState}.${itm}') || $state.includes('${this.form.stateTree}.edit.${itm}')` : `$state.includes('${this.form.stateTree}.edit.${itm}')`;
}
html += `ng-class="{'is-selected' : ${relatedTabSelected}` ;
if(this.form.related[itm].disabled){
html += `, 'Form-tab--disabled' : ${this.form.related[itm].disabled }`;

2
awx/ui/client/src/shared/parse/parse-type-change.factory.js
View File

@ -94,7 +94,7 @@ export default
// convert json to yaml
try {
removeField(fld);
json_obj = JSON.parse(scope[fld]);
if ($.isEmptyObject(json_obj)) {
scope[fld] = '---';