shaba/awx
1
0
Fork 0
mirror of https://github.com/ansible/awx.git synced 2024-10-31 15:21:13 +03:00
Code Releases Activity

Fix truncate text directive to work as elements resize

Browse Source
This commit is contained in:
Joe Fiorini 2015-07-09 17:28:20 -04:00
parent 08ec0c132e
commit 069bb69b00
1 changed files with 24 additions and 1 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

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

@ -25,7 +25,17 @@ function link($compile, scope, element, attrs) {
var fullTextWidth = element[0].scrollWidth;
var elementWidth = element.outerWidth();
if(fullTextWidth > elementWidth) {
// HACK: For some reason many of my divs
// are ending up with a 1px size diff.
// Guessing this is because of 3 cols
// at 33% flex-basis, with 8px padding.
// Perhaps the padding is pushing it over
// in JavaScript but not visually? Using
// threshold to filter those out.
var threshold = 5;
if(fullTextWidth > elementWidth &&
fullTextWidth - elementWidth > threshold) {
return true;
}
@ -49,6 +59,19 @@ function link($compile, scope, element, attrs) {
}
scope.$watch(getText, addTitleIfWrapping);
// HACK: This handles truncating _after_ other elements
// are added that affect the size of this element. I
// 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() {
addTitleIfWrapping(getText());
});
scope.$watch('$destroy', function() {
element.off('resize');
});
}
export default