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

[system_tracking] Remove truncation of fact values

Browse Source 
This is a temporary fix until we can get a permanent fix to the
performance issues we have with rendering this much data to the DOM. For
more info see my comment on https://trello.com/c/QrbeaZfK.
This commit is contained in:
Joe Fiorini 2015-07-10 11:22:40 -04:00
parent 069bb69b00
commit c52ec1197b
4 changed files with 21 additions and 14 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

9
awx/ui/static/js/shared/truncated-text.directive.js
View File

@ -1,4 +1,5 @@
/* jshint unused: vars */
import {addResizeListener, removeResizeListener} from 'tower/shared/element-resize';
function link($compile, scope, element, attrs) {
@ -65,12 +66,14 @@ function link($compile, scope, element, attrs) {
// wanted to leave this as a regular event binding, but
// was running into issues with the resized element getting
// removed from the DOM after truncating! No idea why yet.
element.resize(function() {
function resizeListener() {
addTitleIfWrapping(getText());
});
}
addResizeListener(element[0], resizeListener);
scope.$watch('$destroy', function() {
element.off('resize');
removeResizeListener(element[0], resizeListener);
});
}

5
awx/ui/static/js/shared/utilities/truncated-text.less
View File

@ -2,3 +2,8 @@
overflow: hidden;
text-overflow: ellipsis;
}
.u-wrappedText {
white-space: normal;
word-wrap: break-word;
}

3
awx/ui/static/js/system-tracking/fact-data-table/fact-data-table.block.less
View File

@ -9,7 +9,7 @@
margin-bottom: 0.5em;
align-items: center;
transition: background-color 100ms, border-color 100ms;
max-height: 36px;
// max-height: 36px;
border: solid 1px #fff;
&:hover {
background-color: #ebebeb;
@ -31,7 +31,6 @@
&-column {
padding: 8px;
flex: 1 0 33%;
white-space: nowrap;
align-self: flex-start;
&--offsetLeft {
margin-left: 33%;

18
awx/ui/static/js/system-tracking/fact-data-table/fact-data-table.partial.html
View File

@ -28,20 +28,20 @@
<div class="FactDataTable-row FactDataTable-row--flexible" ng-if="group.containsValueArray">
<span class="FactDataTable-column">{{group.facts.keyName}}</span>
<span class="FactDataTable-column FactDataTable-columnArray">
<span class="FactDataTable-columnMember" truncated-text ng-repeat="value in group.facts.value1">
<span class="FactDataTable-columnMember u-wrappedText" ng-repeat="value in group.facts.value1" style="position: relative;">
{{value}}
</span>
</span>
<span class="FactDataTable-column FactDataTable-columnArray" ng-if="!singleResultView">
<span class="FactDataTable-columnMember" truncated-text ng-repeat="value in group.facts.value2">
<span class="FactDataTable-columnMember u-wrappedText" ng-repeat="value in group.facts.value2" style="position: relative;">
{{value}}
</span>
</span>
</div>
<div class="FactDataTable-row" ng-if="!group.containsValueArray">
<span class="FactDataTable-column">{{group.facts.keyName}}</span>
<span class="FactDataTable-column">{{group.facts.value1}}</span>
<span class="FactDataTable-column" ng-if="!singleResultView">{{group.facts.value2}}</span>
<span class="FactDataTable-column u-wrappedText" style="position: relative;">{{group.facts.value1}}</span>
<span class="FactDataTable-column u-wrappedText" ng-if="!singleResultView" style="position: relative;">{{group.facts.value2}}</span>
</div>
</div>
</div>
@ -60,13 +60,13 @@
<span class="FactDatum-keyName FactDataTable-column" ng-if="!fact.isArrayMember">
{{fact.keyName}}
</span>
<span class="FactDatum-keyName FactDataTable-column" ng-if="fact.isArrayMember">
<span class="FactDatum-keyName FactDataTable-column u-wrappedText" ng-if="fact.isArrayMember">
{{fact.keyPath[0]}}.{{fact.keyName}}
</span>
<span class="FactDatum-value FactDataTable-column" truncated-text>
<span class="FactDatum-value FactDataTable-column u-wrappedText" style="position: relative;">
{{fact.value1}}
</span>
<span class="FactDatum-value FactDataTable-column" truncated-text ng-if="!singleResultView">
<span class="FactDatum-value FactDataTable-column u-wrappedText" ng-if="!singleResultView" style="position: relative;">
{{fact.value2}}
</span>
</div>
@ -78,10 +78,10 @@
<span class="FactDataTable-column FactDatum-keyName" ng-if="fact.isArrayMember">
{{fact.keyPath[0]}}.{{fact.keyName}}
</span>
<span class="FactDataTable-column FactDatum-value" truncated-text>
<span class="FactDataTable-column FactDatum-value u-wrappedText" style="position: relative;">
{{fact.value1}}
</span>
<span class="FactDataTable-column FactDatum-value" truncated-text ng-if="!singleResultView">
<span class="FactDataTable-column FactDatum-value u-wrappedText" ng-if="!singleResultView" style="position: relative;">
{{fact.value2}}
</span>
</div>