Updated Branches: refs/heads/ui-restyle bee273fb0 -> 6a74d23db
listView: implement fixed header when scrolling Project: http://git-wip-us.apache.org/repos/asf/cloudstack/repo Commit: http://git-wip-us.apache.org/repos/asf/cloudstack/commit/6a74d23d Tree: http://git-wip-us.apache.org/repos/asf/cloudstack/tree/6a74d23d Diff: http://git-wip-us.apache.org/repos/asf/cloudstack/diff/6a74d23d Branch: refs/heads/ui-restyle Commit: 6a74d23db5cd585b693e352d00106c13b2bc0e41 Parents: bee273f Author: Brian Federle <brian.fede...@citrix.com> Authored: Wed Oct 2 13:52:08 2013 -0700 Committer: Brian Federle <brian.fede...@citrix.com> Committed: Wed Oct 2 13:52:08 2013 -0700 ---------------------------------------------------------------------- ui/scripts/ui/widgets/listView.js | 37 ++++++++++++++++++++++++++++++++++ 1 file changed, 37 insertions(+) ---------------------------------------------------------------------- http://git-wip-us.apache.org/repos/asf/cloudstack/blob/6a74d23d/ui/scripts/ui/widgets/listView.js ---------------------------------------------------------------------- diff --git a/ui/scripts/ui/widgets/listView.js b/ui/scripts/ui/widgets/listView.js index 5da7253..5498a38 100644 --- a/ui/scripts/ui/widgets/listView.js +++ b/ui/scripts/ui/widgets/listView.js @@ -1881,6 +1881,43 @@ // Infinite scrolling event $listView.bind('scroll', function(event) { + var $fixedElems = $listView.find('.toolbar:first, thead:first'); + var $fixedContainer = $('<div>').addClass('fixed-container'); + + $listView.find('.fixed-container').remove(); + + if ($listView.scrollTop()) { + $fixedElems.addClass('hidden').css({ visibility: 'hidden' }).clone() + .css({ + visibility: 'visible', + width: $listView.width() + }) + .appendTo($fixedContainer); + $fixedContainer.append($('<table>').append($fixedContainer.find('thead'))); + $fixedElems.find('thead').wrap( + $('<table>') + ); + $fixedContainer.find('table').width($listView.find('table tbody').width()); + $fixedContainer.find('.toolbar').width($listView.find('.toolbar.hidden').outerWidth()); + $fixedContainer.find('thead th').each(function() { + var $th = $(this); + var $td = $listView.find('tbody tr:first td').filter(function() { + return $(this).index() === $th.index(); + }); + + $th.width($td.outerWidth()); + }); + $fixedContainer.css({ + position: 'absolute', + width: $fixedElems.outerWidth() + }).prependTo($listView); + } else { + $fixedContainer.remove(); + $fixedElems.removeClass('hidden'); + $listView.find('.toolbar').css('visibility', 'visible'); + $listView.find('thead').css('visibility', 'visible'); + } + if (args.listView && args.listView.disableInfiniteScrolling) return false; if ($listView.find('tr.last, td.loading:visible').size()) return false;
