From 7a7f1ce03223795c7582e7b77c33d4f85c792956 Mon Sep 17 00:00:00 2001 From: chris Houseknecht Date: Wed, 22 Jan 2014 16:05:02 -0500 Subject: [PATCH] AC-948 applied CSS ellipsis to long group names and long host names on inventory edit. --- awx/ui/static/js/helpers/Groups.js | 6 +- awx/ui/static/js/helpers/Lookup.js | 4 +- awx/ui/static/js/helpers/search.js | 12 +- awx/ui/static/js/lists/InventoryGroups.js | 2 +- awx/ui/static/js/lists/InventoryHosts.js | 2 +- awx/ui/static/js/lists/InventorySummary.js | 170 --------------------- awx/ui/static/less/ansible-ui.less | 12 +- awx/ui/static/lib/ansible/directives.js | 3 - 8 files changed, 24 insertions(+), 187 deletions(-) delete mode 100644 awx/ui/static/js/lists/InventorySummary.js diff --git a/awx/ui/static/js/helpers/Groups.js b/awx/ui/static/js/helpers/Groups.js index db91ae80bd..f62ea7398a 100644 --- a/awx/ui/static/js/helpers/Groups.js +++ b/awx/ui/static/js/helpers/Groups.js @@ -180,7 +180,7 @@ angular.module('GroupsHelper', [ 'RestServices', 'Utilities', 'ListGenerator', ' case 'never updated': stat = 'never'; stat_class = 'icon-cloud-na disabled'; - status_tip = 'Sync not performed. Click to start it now.'; + status_tip = 'Sync not performed. Click to start it now.'; break; case 'none': case '': @@ -831,8 +831,10 @@ angular.module('GroupsHelper', [ 'RestServices', 'Utilities', 'ListGenerator', ' } //Clean up - if (scope.searchCleanUp) + if (scope.searchCleanUp) { scope.searchCleanup(); + } + scope.formModalActionDisabled = false; scope.showGroupHelp = false; //get rid of the Hint diff --git a/awx/ui/static/js/helpers/Lookup.js b/awx/ui/static/js/helpers/Lookup.js index d99763123a..ac0dd7a203 100644 --- a/awx/ui/static/js/helpers/Lookup.js +++ b/awx/ui/static/js/helpers/Lookup.js @@ -51,6 +51,9 @@ angular.module('LookUpHelper', [ 'RestServices', 'Utilities', 'SearchHelper', 'P $('#lookup-modal').on('hidden.bs.modal', function() { // If user clicks cancel without making a selection, make sure that field values are // in synch. + if (listScope.searchCleanup) { + listScope.searchCleanup(); + } if (scope[field] == '' || scope[field] == null) { scope[form.fields[field].sourceModel + '_' + form.fields[field].sourceField] = ''; if (!scope.$$phase) { @@ -103,7 +106,6 @@ angular.module('LookUpHelper', [ 'RestServices', 'Utilities', 'SearchHelper', 'P } } } - SearchInit({ scope: listScope, set: list.name, list: list, url: defaultUrl }); PaginateInit({ scope: listScope, list: list, url: defaultUrl, mode: 'lookup' }); diff --git a/awx/ui/static/js/helpers/search.js b/awx/ui/static/js/helpers/search.js index a760cd2ce9..56f6ff4881 100644 --- a/awx/ui/static/js/helpers/search.js +++ b/awx/ui/static/js/helpers/search.js @@ -233,11 +233,13 @@ angular.module('SearchHelper', ['RestServices', 'Utilities', 'RefreshHelper']) //finalize and execute the query scope[iterator + 'Page'] = (page) ? parseInt(page) - 1 : 0; - if (/\/$/.test(url)) { - url += '?' + scope[iterator + 'SearchParams']; - } - else { - url += '&' + scope[iterator + 'SearchParams']; + if (scope[iterator + 'SearchParams']) { + if (/\/$/.test(url)) { + url += '?' + scope[iterator + 'SearchParams']; + } + else { + url += '&' + scope[iterator + 'SearchParams']; + } } url = url.replace(/\&\&/,'&'); url += (scope[iterator + 'PageSize']) ? '&page_size=' + scope[iterator + 'PageSize'] : ""; diff --git a/awx/ui/static/js/lists/InventoryGroups.js b/awx/ui/static/js/lists/InventoryGroups.js index f712e10b79..5aa136a611 100644 --- a/awx/ui/static/js/lists/InventoryGroups.js +++ b/awx/ui/static/js/lists/InventoryGroups.js @@ -28,7 +28,7 @@ angular.module('InventoryGroupsDefinition', []) ngClick: "\{\{ 'showHosts(' + group.id + ',' + group.group_id + ', false)' \}\}", ngClass: "group.selected_class", hasChildren: true, - columnClass: 'col-lg-9', + columnClass: 'col-lg-9 ellipsis', nosort: true, awDroppable: "\{\{ group.isDroppable \}\}", awDraggable: "\{\{ group.isDraggable \}\}", diff --git a/awx/ui/static/js/lists/InventoryHosts.js b/awx/ui/static/js/lists/InventoryHosts.js index c2d57ab7f5..1a9760c02f 100644 --- a/awx/ui/static/js/lists/InventoryHosts.js +++ b/awx/ui/static/js/lists/InventoryHosts.js @@ -26,7 +26,7 @@ angular.module('InventoryHostsDefinition', []) label: 'Hosts', ngClick: "editHost(\{\{ host.id \}\})", searchPlaceholder: "search_place_holder", - columnClass: 'col-lg-9', + columnClass: 'col-lg-9 ellipsis', dataHostId: "\{\{ host.id \}\}", dataType: "host", awDraggable: "true" diff --git a/awx/ui/static/js/lists/InventorySummary.js b/awx/ui/static/js/lists/InventorySummary.js deleted file mode 100644 index 928218bf45..0000000000 --- a/awx/ui/static/js/lists/InventorySummary.js +++ /dev/null @@ -1,170 +0,0 @@ -/********************************************* - * Copyright (c) 2014 AnsibleWorks, Inc. - * - * InventorySummary.js - * - * Summary of groups contained within an inventory - * - */ -angular.module('InventorySummaryDefinition', []) - .value( - 'InventorySummary', { - - name: 'groups', - iterator: 'group', - editTitle: '{{ inventory_name | capitalize }}', - showTitle: true, - well: true, - index: false, - hover: true, - - fields: { - name: { - key: true, - label: 'Group', - ngClick: "\{\{ 'GroupsEdit(' + group.id + ')' \}\}", - columnClass: 'col-lg-3 col-md3 col-sm-2' - }, - failed_hosts: { - label: 'Failed Hosts', - ngHref: "\{\{ group.failed_hosts_link \}\}", - badgeIcon: "\{\{ 'icon-failures-' + group.failed_hosts_class \}\}", - badgeNgHref: "\{\{ group.failed_hosts_link \}\}", - badgePlacement: 'left', - badgeToolTip: "\{\{ group.failed_hosts_tip \}\}", - badgeTipPlacement: 'top', - awToolTip: "\{\{ group.failed_hosts_tip \}\}", - dataPlacement: "top", - searchable: false, - excludeModal: true, - sortField: "hosts_with_active_failures" - }, - status: { - label: 'Status', - ngClick: "viewUpdateStatus(\{\{ group.id \}\})", - searchType: 'select', - badgeIcon: "\{\{ 'icon-cloud-' + group.status_badge_class \}\}", - badgeToolTip: "\{\{ group.status_badge_tooltip \}\}", - awToolTip: "\{\{ group.status_badge_tooltip \}\}", - dataPlacement: 'top', - badgeTipPlacement: 'top', - badgePlacement: 'left', - searchOptions: [ - { name: "failed", value: "failed" }, - { name: "never", value: "never updated" }, - { name: "n/a", value: "none" }, - { name: "successful", value: "successful" }, - { name: "updating", value: "updating" }], - sourceModel: 'inventory_source', - sourceField: 'status' - }, - last_updated: { - label: 'Last
Updated', - sourceModel: 'inventory_source', - sourceField: 'last_updated', - searchable: false, - nosort: false - }, - source: { - label: 'Source', - searchType: 'select', - searchOptions: [ - { name: "ec2", value: "ec2" }, - { name: "none", value: "" }, - { name: "rax", value: "rax" }], - sourceModel: 'inventory_source', - sourceField: 'source', - searchOnly: true - }, - has_external_source: { - label: 'Has external source?', - searchType: 'in', - searchValue: 'ec2,rax', - searchOnly: true, - sourceModel: 'inventory_source', - sourceField: 'source' - }, - has_active_failures: { - label: 'Has failed hosts?', - searchSingleValue: true, - searchType: 'boolean', - searchValue: 'true', - searchOnly: true - }, - last_update_failed: { - label: 'Update failed?', - searchType: 'select', - searchSingleValue: true, - searchValue: 'failed', - searchOnly: true, - sourceModel: 'inventory_source', - sourceField: 'status' - } - }, - - actions: { - create: { - label: 'Create New', - mode: 'all', - icon: 'icon-plus', - 'class': "btn-success btn-xs", - ngClick: "createGroup()", - ngHide: "groupCreateHide", - ngDisabled: 'grpBtnDisabled', - awToolTip: "Create a new top-level group", - dataPlacement: 'top' - }, - help: { - dataPlacement: 'top', - icon: "icon-question-sign", - mode: 'all', - 'class': 'btn-xs btn-info btn-help', - awToolTip: - //"
" + - //"

Need help getting started creating your inventory?

Click here for help.

", - "

Need help getting started creating your inventory?

Click here for help.

", - iconSize: 'large', - ngClick: "showHelp()", - id: "inventory-summary-help" - }, - refresh: { - dataPlacement: 'top', - icon: "icon-refresh", - mode: 'all', - 'class': 'btn-xs btn-primary', - awToolTip: "Refresh the page", - ngClick: "refresh()", - iconSize: 'large' - }, - stream: { - 'class': "btn-primary btn-xs activity-btn", - ngClick: "showActivity()", - awToolTip: "View Activity Stream", - dataPlacement: "top", - icon: "icon-comments-alt", - mode: 'all', - iconSize: 'large', - ngShow: "user_is_superuser" - } - }, - - fieldActions: { - group_update: { - label: 'Update', - icon: 'icon-cloud-download', - "class": 'btn-xs btn-success', - ngClick: 'updateGroup(\{\{ group.id \}\})', - awToolTip: "\{\{ group.update_tooltip \}\}", - ngClass: "group.update_class" - }, - cancel: { - label: 'Cancel', - icon: 'icon-minus-sign', - ngClick: "cancelUpdate(\{\{ group.id \}\}, '\{\{ group.name \}\}')", - "class": 'btn-danger btn-xs delete-btn', - awToolTip: "\{\{ group.cancel_tooltip \}\}", - ngClass: "group.cancel_class" - } - } - }); - \ No newline at end of file diff --git a/awx/ui/static/less/ansible-ui.less b/awx/ui/static/less/ansible-ui.less index 342d4a9638..a719c2da67 100644 --- a/awx/ui/static/less/ansible-ui.less +++ b/awx/ui/static/less/ansible-ui.less @@ -55,12 +55,20 @@ body.modal-open { .pad-left-lg { padding-left: 50px; } .normal-weight { font-weight: normal; } .no-bullets { list-style: none; } +.nowrap { white-space: nowrap; } .capitalize { text-transform: capitalize; } .grey-txt { color: @grey; } .red-txt { color: @red; } a.red-txt:hover { color: @red; } //make red links (for things like cancel) .text-center { text-align: center !important; } +/* Used on inventory groups/hosts lists for long names */ +.ellipsis { + white-space: nowrap; + overflow: hidden; + text-overflow: ellipsis; +} + a { color: @blue; text-decoration: none; @@ -202,10 +210,6 @@ hr { display: inline-block; } -.nowrap { - white-space: nowrap; -} - /* help collapse */ h4.panel-title { font-size: 14px; diff --git a/awx/ui/static/lib/ansible/directives.js b/awx/ui/static/lib/ansible/directives.js index 0fbff2c2b0..5c17cff42a 100644 --- a/awx/ui/static/lib/ansible/directives.js +++ b/awx/ui/static/lib/ansible/directives.js @@ -622,6 +622,3 @@ angular.module('AWDirectives', ['RestServices', 'Utilities', 'AuthService', 'Job } }]); - - -