External-Mirrors/awx
2
0
Fork 0
mirror of https://github.com/ansible/awx.git synced 2026-03-23 11:55:04 -02:30
Code Issues Packages Projects Releases Wiki Activity

Details view now working on inventory group edit dialog.

Browse Source
This commit is contained in:
Chris Houseknecht
2014-03-17 13:03:57 -04:00
parent 022f95783f
commit 7521de5904
5 changed files with 82 additions and 17 deletions
Download Patch File Download Diff File Expand all files Collapse all files

55
awx/ui/static/js/helpers/Groups.js
View File

@@ -628,12 +628,14 @@ function(SchedulerInit, Rest, Wait) {
scope = parent_scope.$new(), scope = parent_scope.$new(),
scheduler, scheduler,
target, target,
callback, showForm,
list, list,
restore, detail,
restoreList,
container; container;
Wait('start'); Wait('start');
detail = $('#schedules-detail').hide();
list = $('#schedules-list'); list = $('#schedules-list');
target = $('#schedules-form'); target = $('#schedules-form');
container = $('#schedules-form-container'); container = $('#schedules-form-container');
@@ -642,8 +644,8 @@ function(SchedulerInit, Rest, Wait) {
container.hide(); container.hide();
target.empty(); target.empty();
$('.tooltip').each(function () { $('.tooltip').each(function () {
$(this).remove(); $(this).remove();
}); });
$('.popover').each(function () { $('.popover').each(function () {
$(this).remove(); $(this).remove();
}); });
@@ -651,28 +653,49 @@ function(SchedulerInit, Rest, Wait) {
// Insert the scheduler widget into the hidden div // Insert the scheduler widget into the hidden div
scheduler = SchedulerInit({ scope: scope, requireFutureStartTime: false }); scheduler = SchedulerInit({ scope: scope, requireFutureStartTime: false });
scheduler.inject('schedules-form', false); scheduler.inject('schedules-form', false);
scheduler.injectDetail('schedules-detail', false);
scheduler.clear(); scheduler.clear();
scope.showRRuleDetail = false; scope.showRRuleDetail = false;
parent_scope.schedulesTitle = 'Edit Schedule'; parent_scope.schedulesTitle = 'Edit Schedule';
// display the scheduler widget // display the scheduler widget
callback = function() { showForm = function() {
Wait('stop'); Wait('stop');
container.show('slide', { direction: 'left' }, 500); $('#schedules-overlay').width($('#schedules-tab').width()).height($('#schedules-tab').height()).show();
container.show('slide', { direction: 'left' }, 300);
$('#group-save-button').prop('disabled', true); $('#group-save-button').prop('disabled', true);
target.show();
scope.$apply(function() { scope.$apply(function() {
scheduler.setRRule(schedule.rrule); scheduler.setRRule(schedule.rrule);
scheduler.setName(schedule.name); scheduler.setName(schedule.name);
}); });
}; };
list.hide({ complete: callback, duration: 300 }); //list.hide({ complete: callback, duration: 300 });
setTimeout(function() { showForm(); }, 1000);
restore = function() { restoreList = function() {
$('#group-save-button').prop('disabled', false); $('#group-save-button').prop('disabled', false);
list.show('slide', { direction: 'right' }, 500); list.show('slide', { direction: 'right' }, 500);
$('#schedules-overlay').width($('#schedules-tab').width()).height($('#schedules-tab').height()).hide();
//refresh the list //refresh the list
}; };
parent_scope.showScheduleDetail = function() {
if (parent_scope.formShowing) {
scheduler.isValid();
//$('#schedules-form').hide();
detail.width($('#schedules-form').width()).height($('#schedules-form').height());
target.hide();
detail.show();
parent_scope.formShowing = false;
}
else {
detail.hide();
target.show();
parent_scope.formShowing = true;
}
};
parent_scope.saveScheduleForm = function() { parent_scope.saveScheduleForm = function() {
var newSchedule, var newSchedule,
url = '/static/sample/data/schedules/inventory/data.json'; url = '/static/sample/data/schedules/inventory/data.json';
@@ -686,11 +709,11 @@ function(SchedulerInit, Rest, Wait) {
Rest.post(schedule) Rest.post(schedule)
.success(function(){ .success(function(){
Wait('stop'); Wait('stop');
container.hide('slide', { direction: 'right' }, 500, restore); container.hide('slide', { direction: 'right' }, 500, restoreList);
}) })
.error(function(){ .error(function(){
Wait('stop'); Wait('stop');
container.hide('slide', { direction: 'right' }, 500, restore); container.hide('slide', { direction: 'right' }, 500, restoreList);
}); });
} }
else { else {
@@ -699,7 +722,7 @@ function(SchedulerInit, Rest, Wait) {
}; };
parent_scope.cancelScheduleForm = function() { parent_scope.cancelScheduleForm = function() {
container.hide('slide', { direction: 'right' }, 500, restore); container.hide('slide', { direction: 'right' }, 500, restoreList);
}; };
}; };
}]) }])
@@ -827,11 +850,17 @@ function(SchedulerInit, Rest, Wait) {
resizeStop: function () { resizeStop: function () {
// for some reason, after resizing dialog the form and fields (the content) doesn't expand to 100% // for some reason, after resizing dialog the form and fields (the content) doesn't expand to 100%
var dialog = $('.ui-dialog[aria-describedby="group-modal-dialog"]'), var dialog = $('.ui-dialog[aria-describedby="group-modal-dialog"]'),
content = dialog.find('#group-modal-dialog'); content = dialog.find('#group-modal-dialog'),
w;
content.width(dialog.width() - 28); content.width(dialog.width() - 28);
if ($('#group_tabs .active a').text() === 'Properties') { if ($('#group_tabs .active a').text() === 'Properties') {
textareaResize('group_variables', properties_scope); textareaResize('group_variables', properties_scope);
} }
else if ($('#group_tabs .active a').text() === 'Schedule') {
w = $('#group_tabs').width() - 15;
$('#schedules-overlay').width(w);
$('#schedules-form-container').width(w);
}
}, },
close: function () { close: function () {
// Destroy on close // Destroy on close
@@ -866,6 +895,8 @@ function(SchedulerInit, Rest, Wait) {
} }
} }
else if ($(e.target).text() === 'Schedule') { else if ($(e.target).text() === 'Schedule') {
$('#schedules-overlay').hide();
parent_scope.formShowing = true;
ScheduleList({ scope: parent_scope }); ScheduleList({ scope: parent_scope });
} }
}); });

1
awx/ui/static/js/helpers/Schedules.js
View File

@@ -100,7 +100,6 @@ angular.module('SchedulesHelper', ['Utilities', 'SchedulesHelper'])
Wait('stop'); Wait('stop');
$('#schedulerName').focus(); $('#schedulerName').focus();
$('#rrule_nlp_description').dblclick(function() { $('#rrule_nlp_description').dblclick(function() {
console.log('here!');
setTimeout(function() { scope.$apply(function() { scope.showRRule = (scope.showRRule) ? false : true; }); }, 100); setTimeout(function() { scope.$apply(function() { scope.showRRule = (scope.showRRule) ? false : true; }); }, 100);
}); });
} }

34
awx/ui/static/less/angular-scheduler.less
View File

@@ -9,12 +9,33 @@
#schedules-form-container -inventory group add/edit dialog #schedules-form-container -inventory group add/edit dialog
*/ */
#schedules-tab {
position: relative;
top: 0;
left: 0;
}
#schedules-overlay {
display: none;
position: absolute;
top: 0;
left: 0;
z-index: 100;
background-color: @black;
opacity: 0;
}
#schedules-form-container { #schedules-form-container {
position: absolute;
top: 0;
left: 0;
display: none; display: none;
border: 1px solid #e5e5e5; border: 1px solid #e5e5e5;
border-radius: 4px; border-radius: 4px;
box-shadow: 3px 3px 6px 0 #666; box-shadow: 3px 3px 6px 0 #666;
padding: 0 10px 15px 8px; padding: 0 10px 15px 8px;
background-color: @white;
z-index: 200;
} }
#schedules-title { #schedules-title {
@@ -33,12 +54,23 @@
} }
} }
#schedules-form-container-body {
overflow: auto;
}
#schedules-buttons { #schedules-buttons {
height: 45px;
padding-top: 15px;
text-align: right; text-align: right;
border-top: 1px solid #A6C9E2;
a {
margin-right: 8px;
font-size: 12px;
}
} }
#schedules-detail { #schedules-detail {
display:none; display: none;
} }
#scheduler-modal-dialog, #schedules-form-container { #scheduler-modal-dialog, #schedules-form-container {

3
awx/ui/static/lib/angular-scheduler/lib/angular-scheduler-detail.html
View File

@@ -10,9 +10,10 @@
@chouseknecht @chouseknecht
chouse@ansible.com chouse@ansible.com
--> -->
<div id="scheduler-detail"> <div id="scheduler-detail">
<div class="alert alert-danger" ng-show="!schedulerIsValid"> <div class="alert alert-danger" ng-show="!schedulerIsValid">
<p>The scheduler options are invalid or incomplete. Make the needed changes on the options tab, then come back here to see details.</p> <p>The scheduler options are invalid or incomplete. Make the needed changes, then return here to view occurrence details.</p>
</div> </div>
<div ng-show="schedulerIsValid"> <div ng-show="schedulerIsValid">
<div class="form-group"> <div class="form-group">

6
awx/ui/static/partials/inventory-edit.html
View File

@@ -26,18 +26,20 @@
<div class="tab-pane active" id="properties-tab"></div> <div class="tab-pane active" id="properties-tab"></div>
<div class="tab-pane" id="sources-tab"></div> <div class="tab-pane" id="sources-tab"></div>
<div class="tab-pane" id="schedules-tab"> <div class="tab-pane" id="schedules-tab">
<div id="schedules-overlay"></div>
<div id="schedules-list"></div> <div id="schedules-list"></div>
<div id="schedules-form-container"> <div id="schedules-form-container">
<div id="schedules-title"> <div id="schedules-title">
<h4 ng-bind="schedulesTitle"></h4> <h4 ng-bind="schedulesTitle"></h4>
<button type="button" class="close pull-right" ng-click="cancelScheduleForm()">&times;</button> <button type="button" class="close pull-right" ng-click="cancelScheduleForm()">x</button>
</div> </div>
<div id="schedules-form-container-body"> <div id="schedules-form-container-body">
<div id="schedules-form"></div> <div id="schedules-form"></div>
<div id="schedules-detail"></div> <div id="schedules-detail"></div>
</div> </div>
<div id="schedules-buttons"> <div id="schedules-buttons">
<a id="schedules-flip-link" ng-click="scheduleDetailRotate()" href=""><i class="fa fa-list-ul"> Show Details</i></a> <a id="schedules-flip-link" ng-show="formShowing" ng-click="showScheduleDetail()" href=""><i class="fa fa-list-ul"> Show Details</i></a>
<a id="schedules-flip-link" ng-show="!formShowing" ng-click="showScheduleDetail()" href=""><i class="fa fa-list-ul"> Show Options</i></a>
<button type="button" class="btn btn-default btn-sm" id="reset-button" ng-click="cancelScheduleForm()"><i class="fa fa-times"></i> Cancel</button> <button type="button" class="btn btn-default btn-sm" id="reset-button" ng-click="cancelScheduleForm()"><i class="fa fa-times"></i> Cancel</button>
<button type="button" class="btn btn-primary btn-sm" id="save-button" ng-click="saveScheduleForm()"><i class="fa fa-check"></i> Save</button> <button type="button" class="btn btn-primary btn-sm" id="save-button" ng-click="saveScheduleForm()"><i class="fa fa-check"></i> Save</button>
</div> </div>