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

Added custom scroll bar to inventory groups container. Moved group container auto-resize and height calc function to helper methods. Now using full window height, pushing footer off the page. Changed custom sroll directive to use the dark-thin theme.

Browse Source
This commit is contained in:
chouseknecht
2014-05-20 14:04:36 -04:00
parent e03a7792ca
commit 77ccfc49f2
5 changed files with 58 additions and 48 deletions
Download Patch File Download Diff File Expand all files Collapse all files

43
awx/ui/static/js/helpers/inventory.js
View File

@@ -14,26 +14,31 @@ angular.module('InventoryHelper', ['RestServices', 'Utilities', 'OrganizationLis
'InventoryHelper', 'InventoryFormDefinition', 'ParseHelper', 'SearchHelper', 'VariablesHelper', 'InventoryHelper', 'InventoryFormDefinition', 'ParseHelper', 'SearchHelper', 'VariablesHelper',
]) ])
.factory('WatchInventoryWindowResize', ['ApplyEllipsis', .factory('GetContainerHeight', [ function() {
function (ApplyEllipsis) { return function() {
return $(window).height() - $('.main-menu').outerHeight() - $('#main_tabs').outerHeight() - $('#breadcrumbs').outerHeight() -
$('.site-footer').outerHeight() - $('#groups-container .list-actions').outerHeight() - $('#groups-table-header').height() - 15;
};
}])
.factory('SetGroupContainerHeight', [ 'GetContainerHeight', function(GetContainerHeight) {
return function() {
var height;
if ($(window).width() > 1210) {
height = GetContainerHeight();
$('#groups-container .list-table-container').height(height);
}
else {
$('#groups-container .list-table-container').height('auto');
}
$('#groups-container .list-table-container').mCustomScrollbar("update");
};
}])
.factory('WatchInventoryWindowResize', ['ApplyEllipsis', 'SetGroupContainerHeight',
function (ApplyEllipsis, SetGroupContainerHeight) {
return function () { return function () {
// Call to set or restore window resize // Call to set or restore window resize
SetGroupContainerHeight();
function setGroupsHeight() {
// Attempt to set the group height
var height;
if ($(window).width() > 1210) {
height = $(window).height() - $('.main-menu').outerHeight() - $('#main_tabs').outerHeight() - $('#breadcrumbs').outerHeight() -
($('.site-footer').outerHeight() * 2) - $('#groups-container .list-actions').outerHeight() - $('#groups-table-header').height() - 20;
$('#groups-container .list-table-container').height(height);
}
else {
$('#groups-container .list-table-container').height('auto');
}
}
setGroupsHeight();
$(window).resize(_.debounce(function() { $(window).resize(_.debounce(function() {
// Hack to stop group-name div slipping to a new line // Hack to stop group-name div slipping to a new line
$('#groups_table .name-column').each(function () { $('#groups_table .name-column').each(function () {
@@ -46,7 +51,7 @@ angular.module('InventoryHelper', ['RestServices', 'Utilities', 'OrganizationLis
}); });
ApplyEllipsis('#groups_table .group-name a'); ApplyEllipsis('#groups_table .group-name a');
ApplyEllipsis('#hosts_table .host-name a'); ApplyEllipsis('#hosts_table .host-name a');
setGroupsHeight(); SetGroupContainerHeight();
}, 500)); }, 500));
}; };
} }

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

@@ -17,6 +17,7 @@ angular.module('InventoryGroupsDefinition', [])
hasChildren: true, hasChildren: true,
filterBy: '{ show: true }', filterBy: '{ show: true }',
'class': 'table-no-border', 'class': 'table-no-border',
awCustomScroll: true,
fields: { fields: {
name: { name: {
@@ -64,6 +65,7 @@ angular.module('InventoryGroupsDefinition', [])
fieldActions: { fieldActions: {
columnClass: 'col-lg-2 col-md-2 col-sm-2 col-xs-3', columnClass: 'col-lg-2 col-md-2 col-sm-2 col-xs-3',
label: false,
sync_status: { sync_status: {
mode: 'all', mode: 'all',

2
awx/ui/static/lib/ansible/directives.js
View File

@@ -729,7 +729,7 @@ angular.module('AWDirectives', ['RestServices', 'Utilities', 'AuthService', 'Job
scrollButtons: { scrollButtons: {
enable: true enable: true
}, },
theme: 'dark-thick', theme: 'dark-thin',
mouseWheel: true, mouseWheel: true,
scrollInertia: 300, scrollInertia: 300,
callbacks: { callbacks: {

7
awx/ui/static/lib/ansible/list-generator.js
View File

@@ -287,7 +287,9 @@ angular.module('ListGenerator', ['GeneratorHelpers'])
} }
// table header row // table header row
html += "<div class=\"list-table-container\">\n"; html += "<div class=\"list-table-container\"";
html += (list.awCustomScroll) ? " aw-custom-scroll " : "";
html += ">\n";
html += "<table id=\"" + list.name + "_table\" "; html += "<table id=\"" + list.name + "_table\" ";
html += "class=\"table table-condensed"; html += "class=\"table table-condensed";
html += (list['class']) ? " " + list['class'] : ""; html += (list['class']) ? " " + list['class'] : "";
@@ -473,7 +475,8 @@ angular.module('ListGenerator', ['GeneratorHelpers'])
} }
if (options.mode === 'select' || options.mode === 'lookup') { if (options.mode === 'select' || options.mode === 'lookup') {
html += "<th>Select</th>"; html += "<th>Select</th>";
} else if (options.mode === 'edit' && list.fieldActions) { } else if (options.mode === 'edit' && list.fieldActions &&
(list.fieldActions.label === undefined || list.fieldActions.label)) {
html += "<th class=\"actions-column"; html += "<th class=\"actions-column";
html += (list.fieldActions && list.fieldActions.columnClass) ? " " + list.fieldActions.columnClass : ""; html += (list.fieldActions && list.fieldActions.columnClass) ? " " + list.fieldActions.columnClass : "";
html += "\">Actions</th>\n"; html += "\">Actions</th>\n";