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

After a million different animation attempts... solved inventory groups tree destroy fouc issue by adjusting oppacity on parent.

Browse Source
This commit is contained in:
chouseknecht 2013-10-09 12:31:51 -04:00
parent 832b892528
commit 817be31340
3 changed files with 73 additions and 78 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

10
awx/ui/static/js/helpers/Hosts.js
View File

@ -444,12 +444,12 @@ angular.module('HostsHelper', [ 'RestServices', 'Utilities', 'ListGenerator', 'H
if (scope.hosts[i].has_inventory_sources) {
scope.hosts[i].inventory_sources = 'yes';
scope.hosts[i].has_inv_source_link = '???';
scope.hosts[i].has_inv_source_tip = 'Has an external source. Click to view details.';
scope.hosts[i].has_inv_source_link = '/#/inventories/' + scope['inventory_id'] + '/groups/?has_external_source=true';
scope.hosts[i].has_inv_source_tip = 'Has an external source. Click to view inventory source details.';
}
else {
scope.hosts[i].inventory_sources = 'no';
scope.hosts[i].has_inv_source_link = '???';
scope.hosts[i].has_inv_source_link = '/#/inventories/' + scope['inventory_id'] + '/groups';
scope.hosts[i].has_inv_source_tip = 'Has no external source.';
}
@ -491,9 +491,7 @@ angular.module('HostsHelper', [ 'RestServices', 'Utilities', 'ListGenerator', 'H
scope[InventoryHostsForm.iterator + 'SearchFieldLabel'] = InventoryHostsForm.fields['has_active_failures'].label;
scope[InventoryHostsForm.iterator + 'SearchSelectValue'] = ($routeParams['has_active_failures'] == 'true') ? { value: 1 } : { value: 0 };
}
if ($routeParams['name']) {
console.log('here!');
else if ($routeParams['name']) {
scope[InventoryHostsForm.iterator + 'InputDisable'] = false;
scope[InventoryHostsForm.iterator + 'SearchValue'] = $routeParams['name'];
scope[InventoryHostsForm.iterator + 'SearchField'] = 'name';

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

@ -14,8 +14,8 @@ angular.module('InventoryHelper', [ 'RestServices', 'Utilities', 'OrganizationLi
'InventoryFormDefinition', 'ParseHelper', 'InventorySummaryDefinition'
])
.factory('LoadTreeData', ['Alert', 'Rest', 'Authorization', '$http', 'Wait', 'SortNodes',
function(Alert, Rest, Authorization, $http, Wait, SortNodes) {
.factory('LoadTreeData', ['Alert', 'Rest', 'Authorization', '$http', 'Wait', 'SortNodes', 'HideElement',
function(Alert, Rest, Authorization, $http, Wait, SortNodes, HideElement) {
return function(params) {
var scope = params.scope;
@ -95,8 +95,8 @@ angular.module('InventoryHelper', [ 'RestServices', 'Utilities', 'OrganizationLi
.factory('TreeInit', ['Alert', 'Rest', 'Authorization', '$http', 'LoadTreeData', 'GetBasePath', 'ProcessErrors', 'Wait',
'LoadRootGroups',
function(Alert, Rest, Authorization, $http, LoadTreeData, GetBasePath, ProcessErrors, Wait, LoadRootGroups) {
'LoadRootGroups', 'ShowElement',
function(Alert, Rest, Authorization, $http, LoadTreeData, GetBasePath, ProcessErrors, Wait, LoadRootGroups, ShowElement) {
return function(params) {
var scope = params.scope;
@ -120,7 +120,6 @@ angular.module('InventoryHelper', [ 'RestServices', 'Utilities', 'OrganizationLi
var idx = index;
var selected = (group_idx !== undefined && group_idx !== null) ? group_idx : 'inventory-node';
json_tree_data = treeData;
$(tree_id).jstree({
"core": { //"initially_open":['inventory-node'],
"html_titles": true
@ -157,13 +156,16 @@ angular.module('InventoryHelper', [ 'RestServices', 'Utilities', 'OrganizationLi
});
});
$(tree_id).bind("loaded.jstree", function () {
scope['treeLoading'] = false;
Wait('stop');
$(tree_id).bind("loaded.jstree", function () {
// Force root node styling changes
$('#tree-view').prepend("<div class=\"title\">Group Selector:</div>");
$('#inventory-node ins').first().remove();
$('#inventory-node a ins').first().css('background-image', 'none').append('<i class="icon-sitemap"></i>').css('margin-right','10px');
$('#tree-view').parent().css('opacity','100'); // all our changes are done. display the tree
scope['treeLoading'] = false;
Wait('stop');
scope.$emit('treeLoaded');
});
@ -389,8 +391,8 @@ angular.module('InventoryHelper', [ 'RestServices', 'Utilities', 'OrganizationLi
}])
.factory('RefreshTree', ['Alert', 'Rest', 'Authorization', '$http', 'TreeInit', 'LoadInventory',
function(Alert, Rest, Authorization, $http, TreeInit, LoadInventory) {
.factory('RefreshTree', ['Alert', 'Rest', 'Authorization', '$http', 'TreeInit', 'LoadInventory', 'HideElement',
function(Alert, Rest, Authorization, $http, TreeInit, LoadInventory, HideElement) {
return function(params) {
// Call after an Edit or Add to refresh tree data
@ -398,58 +400,16 @@ angular.module('InventoryHelper', [ 'RestServices', 'Utilities', 'OrganizationLi
var scope = params.scope;
var group_id = params.group_id;
/*
var openId = [];
var selectedId;
if (scope.treeLoadedRemove) {
scope.treeLoadedRemove();
}
scope.treeLoadedRemove = scope.$on('treeLoaded', function() {
// Called recursively to pop the next openId node value and open it.
// Opens the list in reverse so that nodes open in parent then child order,
// drilling down to the last selected node.
var id, node;
if (openId.length > 0) {
id = openId.pop();
node = $('#tree-view li[id="' + id + '"]');
$.jstree._reference('#tree-view').open_node(node, function(){ scope.$emit('treeLoaded'); }, true);
}
else {
if (selectedId !== null && selectedId !== undefined) {
// Click on the previously selected node
node = $('#tree-view li[id="' + selectedId + '"]');
$('#tree-view').jstree('select_node', node);
//$('#tree-view li[id="' + selectedId + '"] a').first().click();
}
}
});
*/
if (scope.inventoryLoadedRemove) {
scope.inventoryLoadedRemove();
}
scope.inventoryLoadedRemove = scope.$on('inventoryLoaded', function() {
// Get the list of open tree nodes starting with the current group and going up
// the tree until we hit the inventory or root node.
/*
function findOpenNodes(node) {
if (node.attr('id') != 'inventory-node') {
if (node.prop('tagName') == 'LI' && (node.hasClass('jstree-open') || node.find('.jstree-clicked'))) {
openId.push(node.attr('id'));
}
findOpenNodes(node.parent());
}
}
selectedId = scope.selectedNode.attr('id');
findOpenNodes(scope.selectedNode);
*/
$('#tree-view').jstree('destroy');
scope.TreeParams.group_id = group_id;
TreeInit(scope.TreeParams);
TreeInit(scope.TreeParams);
});
$('#tree-view').parent().css('opacity','0'); //Hide the tree until all the changes are made
scope.treeLoading = true;
LoadInventory({ scope: scope, doPostSteps: true });

71
awx/ui/static/lib/ansible/Utilities.js
View File

@ -13,7 +13,7 @@ angular.module('Utilities',[])
var scope = angular.element(element).scope();
scope.$destroy();
}
})
})
.factory('ToggleClass', function() {
return function(selector, cssClass) {
@ -25,7 +25,7 @@ angular.module('Utilities',[])
$(selector).addClass(cssClass);
}
}
})
})
.factory('Alert', ['$rootScope', '$location', function($rootScope, $location) {
return function(hdr, msg, cls, action, secondAlert, disableButtons) {
@ -76,7 +76,7 @@ angular.module('Utilities',[])
}
}
}
}])
}])
.factory('ProcessErrors', ['$cookieStore', '$log', '$location', '$rootScope', 'Alert',
function($cookieStore, $log, $location, $rootScope, Alert) {
@ -147,7 +147,7 @@ angular.module('Utilities',[])
Alert(defaultMsg.hdr, defaultMsg.msg);
}
}
}])
}])
.factory('LoadBreadCrumbs', ['$rootScope', '$routeParams', '$location', function($rootScope, $routeParams, $location, Rest) {
return function(crumb) {
@ -218,7 +218,7 @@ angular.module('Utilities',[])
}
}
}
}])
}])
.factory('ReturnToCaller', ['$location', function($location) {
return function(idx) {
@ -233,7 +233,7 @@ angular.module('Utilities',[])
}
$location.path(newpath);
}
}])
}])
.factory('FormatDate', [ function() {
return function(dt) {
@ -246,7 +246,7 @@ angular.module('Utilities',[])
//result += ('000' + dt.getMilliseconds()).slice(-3);
return result;
}
}])
}])
.factory('Wait', [ '$rootScope', function($rootScope) {
return function(directive) {
@ -275,8 +275,45 @@ angular.module('Utilities',[])
$('.spinny, .overlay').fadeOut(1000);
}
}
}])
}])
.factory('HideElement', [ function() {
return function(selector, action) {
// Fade-in a cloack or vail or a specific element
var target = $(selector);
var width = target.css('width');
var height = target.css('height');
var position = target.position();
var parent = target.parent();
var borderRadius = target.css('border-radius');
var backgroundColor = target.css('background-color');
var margin = target.css('margin');
var padding = target.css('padding');
parent.append("<div id=\"curtain-div\" style=\"" +
"position: absolute;" +
"top: " + position.top + "px; " +
"left: " + position.left + "px; " +
"z-index: 1000; " +
"width: " + width + "; " +
"height: " + height + "; " +
"background-color: " + backgroundColor + "; " +
"margin: " + margin + "; " +
"padding: " + padding + "; " +
"border-radius: " + borderRadius + "; " +
"opacity: .75; " +
"display: none; " +
"\"></div>");
$('#curtain-div').show(0, action);
}
}])
.factory('ShowElement', [ function() {
return function() {
// And Fade-out the cloack revealing the element
$('#curtain-div').fadeOut(500, function() { $(this).remove(); });
}
}])
/* DeugForm(form_name)
*
* Use to log the $pristine and $invalid properties of each form element. Helpful when form
@ -285,15 +322,15 @@ angular.module('Utilities',[])
*/
.factory('DebugForm', [ function() {
return function(form_name) {
$('form[name="' + form_name + '"]').find('select, input, button, textarea').each(function(index){
var name = $(this).attr('name');
if (name) {
if (scope['job_templates_form'][name]) {
console.log(name + ' pristine: ' + scope['job_templates_form'][name].$pristine);
console.log(name + ' invalid: ' + scope['job_templates_form'][name].$invalid);
}
}
});
$('form[name="' + form_name + '"]').find('select, input, button, textarea').each(function(index){
var name = $(this).attr('name');
if (name) {
if (scope['job_templates_form'][name]) {
console.log(name + ' pristine: ' + scope['job_templates_form'][name].$pristine);
console.log(name + ' invalid: ' + scope['job_templates_form'][name].$invalid);
}
}
});
}
}]);