shaba/awx
1
0
Fork 0
mirror of https://github.com/ansible/awx.git synced 2024-11-02 09:51:09 +03:00
Code Releases Activity

Latest inventory group dialog changes. Finished styling schedule widget slide-in.

Browse Source
This commit is contained in:
Chris Houseknecht 2014-03-13 16:49:23 -04:00
parent 7ba7d3c940
commit df696b0199
7 changed files with 90 additions and 37 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

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

@ -544,7 +544,8 @@ function(ScheduleEdit, SchedulesList, GenerateList, SearchInit, PaginateInit, Re
// Clean up // Clean up
$('#schedules-list').hide().empty(); $('#schedules-list').hide().empty();
$('#schedules-form').hide().empty(); $('#schedules-form-container').hide();
$('#schedules-form').empty();
$('.tooltip').each(function () { $('.tooltip').each(function () {
$(this).remove(); $(this).remove();
}); });
@ -556,11 +557,12 @@ function(ScheduleEdit, SchedulesList, GenerateList, SearchInit, PaginateInit, Re
list = angular.copy(SchedulesList); list = angular.copy(SchedulesList);
delete list.fields.dtend; delete list.fields.dtend;
delete list.actions.stream; delete list.actions.stream;
list.well = false;
scope = GenerateList.inject(list, { scope = GenerateList.inject(list, {
mode: 'edit', mode: 'edit',
id: 'schedules-list', id: 'schedules-list',
breadCrumbs: false, breadCrumbs: false,
searchSize: 'col-lg-5 col-md-5 col-sm-6 col-xs-6' searchSize: 'col-lg-6 col-md-5 col-sm-5 col-xs-5'
}); });
$('#schedules-list').show(); $('#schedules-list').show();
@ -627,13 +629,18 @@ function(SchedulerInit, Rest, Wait) {
scheduler, scheduler,
target, target,
callback, callback,
restore; list,
restore,
container;
Wait('start'); Wait('start');
list = $('#schedules-list');
target = $('#schedules-form'); target = $('#schedules-form');
container = $('#schedules-form-container');
// Clean up any lingering stuff // Clean up any lingering stuff
target.empty().hide(); container.hide();
target.empty();
$('.tooltip').each(function () { $('.tooltip').each(function () {
$(this).remove(); $(this).remove();
}); });
@ -642,29 +649,31 @@ function(SchedulerInit, Rest, Wait) {
}); });
// Insert the scheduler widget into the hidden div // Insert the scheduler widget into the hidden div
scheduler = SchedulerInit({ scope: scope }); scheduler = SchedulerInit({ scope: scope, requireFutureStartTime: false });
scheduler.inject('schedules-form', true); scheduler.inject('schedules-form', false);
scheduler.clear();
scope.showRRuleDetail = false; scope.showRRuleDetail = false;
parent_scope.schedulesTitle = 'Edit Schedule';
// display the scheduler widget // display the scheduler widget
callback = function() { callback = function() {
Wait('stop'); Wait('stop');
target.show('slide', { direction: 'left' }, 500); container.show('slide', { direction: 'left' }, 500);
$('#group-save-button').prop('disabled', true); $('#group-save-button').prop('disabled', true);
scope.$apply(function() { scope.$apply(function() {
scheduler.setRRule(schedule.rrule); scheduler.setRRule(schedule.rrule);
scheduler.setName(schedule.name); scheduler.setName(schedule.name);
}); });
}; };
$('#schedules-list').hide({ complete: callback, duration: 300 }); list.hide({ complete: callback, duration: 300 });
restore = function() { restore = function() {
$('#group-save-button').prop('disabled', false); $('#group-save-button').prop('disabled', false);
$('#schedules-list').show('slide', { direction: 'right' }, 500); list.show('slide', { direction: 'right' }, 500);
//refresh the list //refresh the list
}; };
scope.saveForm = 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';
if (scheduler.isValid()) { if (scheduler.isValid()) {
@ -677,11 +686,11 @@ function(SchedulerInit, Rest, Wait) {
Rest.post(schedule) Rest.post(schedule)
.success(function(){ .success(function(){
Wait('stop'); Wait('stop');
target.hide('slide', { direction: 'right' }, 500, restore); container.hide('slide', { direction: 'right' }, 500, restore);
}) })
.error(function(){ .error(function(){
Wait('stop'); Wait('stop');
target.hide('slide', { direction: 'right' }, 500, restore); container.hide('slide', { direction: 'right' }, 500, restore);
}); });
} }
else { else {
@ -689,9 +698,8 @@ function(SchedulerInit, Rest, Wait) {
} }
}; };
scope.resetForm = function() { parent_scope.cancelScheduleForm = function() {
scheduler.setRRule(schedule.rrule); container.hide('slide', { direction: 'right' }, 500, restore);
scheduler.setName(schedule.name);
}; };
}; };
}]) }])
@ -859,7 +867,7 @@ function(SchedulerInit, Rest, Wait) {
} }
} }
else if ($(e.target).text() === 'Schedule') { else if ($(e.target).text() === 'Schedule') {
ScheduleList({ scope: modal_scope }); ScheduleList({ scope: parent_scope });
} }
}); });

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

@ -22,15 +22,15 @@ angular.module('SchedulesHelper', ['Utilities', 'SchedulesHelper'])
if (ww > 1199) { if (ww > 1199) {
// desktop // desktop
x = 675; x = 675;
y = (625 > wh) ? wh - 20 : 625; y = (675 > wh) ? wh - 20 : 675;
maxrows = 20; maxrows = 20;
} else if (ww <= 1199 && ww >= 768) { } else if (ww <= 1199 && ww >= 768) {
x = 550; x = 550;
y = (625 > wh) ? wh - 15 : 625; y = (675 > wh) ? wh - 15 : 675;
maxrows = 15; maxrows = 15;
} else { } else {
x = (ww - 20); x = (ww - 20);
y = (625 > wh) ? wh : 625; y = (675 > wh) ? wh : 675;
maxrows = 10; maxrows = 10;
} }
@ -206,6 +206,7 @@ angular.module('SchedulesHelper', ['Utilities', 'SchedulesHelper'])
$('#form-container').empty(); $('#form-container').empty();
scheduler = SchedulerInit({ scope: scope }); scheduler = SchedulerInit({ scope: scope });
scheduler.inject('form-container', false); scheduler.inject('form-container', false);
scheduler.clear();
ShowSchedulerModal({ scope: scope }); ShowSchedulerModal({ scope: scope });
scope.showRRuleDetail = false; scope.showRRuleDetail = false;

2
awx/ui/static/js/lists/Schedules.js
View File

@ -15,7 +15,7 @@ angular.module('SchedulesListDefinition', [])
iterator: 'schedule', iterator: 'schedule',
selectTitle: '', selectTitle: '',
editTitle: 'Schedules', editTitle: 'Schedules',
well: false, well: true,
index: true, index: true,
hover: true, hover: true,

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

@ -6,17 +6,38 @@
*/ */
/* /*
#schedules-form -inventory group add/edit dialog #schedules-form-container -inventory group add/edit dialog
*/ */
#schedules-form { #schedules-form-container {
border: 1px solid #ddd; display: none;
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: 8px 10px 15px 8px; padding: 0 10px 15px 8px;
} }
#scheduler-modal-dialog, #schedules-form { #schedules-title {
border-bottom: 1px solid #e5e5e5;
padding-bottom: 8px;
margin-bottom: 20px;
margin-top: 0;
h4 {
display: inline-block;
margin: 0;
}
button {
display: inline-block;
/*margin-top: -10px;*/
}
}
#schedules-buttons {
text-align: right;
}
#scheduler-modal-dialog, #schedules-form-container {
display: none; display: none;
overflow-x: hidden; overflow-x: hidden;
overflow-y: auto; overflow-y: auto;
@ -97,8 +118,7 @@
.error-pull-up { .error-pull-up {
position: relative; position: relative;
top: -15px; top: -23px;
margin-bottom: 15px;
} }
.red-text { .red-text {

2
awx/ui/static/less/ansible-ui.less
View File

@ -203,7 +203,7 @@ textarea {
left: 0; left: 0;
z-index: 1999; z-index: 1999;
background-color: @black; background-color: @black;
opacity: .4; opacity: 0;
} }
/* TB tooltip overrides */ /* TB tooltip overrides */

27
awx/ui/static/lib/angular-scheduler/lib/angular-scheduler.js vendored
View File

@ -35,7 +35,8 @@ angular.module('AngularScheduler', ['underscore'])
function($log, $filter, $timezones, LoadLookupValues, SetDefaults, CreateObject, _, useTimezone, showUTCField) { function($log, $filter, $timezones, LoadLookupValues, SetDefaults, CreateObject, _, useTimezone, showUTCField) {
return function(params) { return function(params) {
var scope = params.scope; var scope = params.scope,
requireFutureStartTime = params.requireFutureStartTime || false;
scope.schedulerShowTimeZone = useTimezone; scope.schedulerShowTimeZone = useTimezone;
scope.schedulerShowUTCStartTime = showUTCField; scope.schedulerShowUTCStartTime = showUTCField;
@ -167,7 +168,7 @@ angular.module('AngularScheduler', ['underscore'])
scope.setDefaults(); scope.setDefaults();
} }
return CreateObject(scope); return CreateObject(scope, requireFutureStartTime);
}; };
}]) }])
@ -179,11 +180,12 @@ angular.module('AngularScheduler', ['underscore'])
*/ */
.factory('CreateObject', ['AngularScheduler.useTimezone', '$filter', 'GetRule', 'Inject', 'SetDefaults', '$timezones', 'SetRule', .factory('CreateObject', ['AngularScheduler.useTimezone', '$filter', 'GetRule', 'Inject', 'SetDefaults', '$timezones', 'SetRule',
function(useTimezone, $filter, GetRule, Inject, SetDefaults, $timezones, SetRule) { function(useTimezone, $filter, GetRule, Inject, SetDefaults, $timezones, SetRule) {
return function(scope) { return function(scope, requireFutureST) {
var fn = function() { var fn = function() {
this.scope = scope; this.scope = scope;
this.useTimezone = useTimezone; this.useTimezone = useTimezone;
this.requireFutureStartTime = requireFutureST;
// Evaluate user intput and build options for passing to rrule // Evaluate user intput and build options for passing to rrule
this.getOptions = function() { this.getOptions = function() {
@ -280,23 +282,23 @@ angular.module('AngularScheduler', ['underscore'])
else { else {
timeNow = now.getTime(); timeNow = now.getTime();
} }
if (timeNow >= timeFuture) { if (this.requireFutureStartTime && timeNow >= timeFuture) {
this.scope.startDateError("Start date and time must be in the future"); this.scope.startDateError("Start time must be in the future");
validity = false; validity = false;
} }
} }
else { else {
this.scope.startDateError("Invalid start date and time"); this.scope.startDateError("Invalid start time");
validity = false; validity = false;
} }
} }
catch(e) { catch(e) {
this.scope.startDateError("Invalid start date and time"); this.scope.startDateError("Invalid start time");
validity = false; validity = false;
} }
} }
else { else {
this.scope.startDateError("Provide a valid start date and time"); this.scope.startDateError("Provide a start time");
validity = false; validity = false;
} }
return validity; return validity;
@ -349,6 +351,15 @@ angular.module('AngularScheduler', ['underscore'])
this.getUserTimezone = function() { this.getUserTimezone = function() {
return $timezones.getLocal(); return $timezones.getLocal();
}; };
// futureStartTime setter/getter
this.setRequireFutureStartTime = function(opt) {
this.requireFutureStartTime = opt;
};
this.getRequireFutureStartTime = function() {
return this.requireFutureStartTime;
};
}; };
return new fn(); return new fn();
}; };

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

@ -27,7 +27,20 @@
<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-list"></div> <div id="schedules-list"></div>
<div id="schedules-form"></div> <div id="schedules-form-container">
<div id="schedules-title">
<h4 ng-bind="schedulesTitle"></h4>
<button type="button" class="close pull-right" ng-click="cancelScheduleForm()">&times;</button>
</div>
<div id="schedules-form"></div>
<div id="schedules-buttons">
<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>
</div>
</div>
<div id="schedules-detail">
</div>
</div> </div>
</div> </div>
</div> </div>