Skip to content
This repository has been archived by the owner on Sep 5, 2024. It is now read-only.

Commit

Permalink
fix(select): greatly improve scroll disable compatability
Browse files Browse the repository at this point in the history
closes #2180, closes #2206
  • Loading branch information
rschmukler committed Apr 12, 2015
1 parent 360e2b6 commit 614630d
Showing 1 changed file with 31 additions and 12 deletions.
43 changes: 31 additions & 12 deletions src/components/select/select.js
Original file line number Diff line number Diff line change
Expand Up @@ -675,13 +675,13 @@ function SelectProvider($$interimElementProvider) {
});

/* @ngInject */
function selectDefaultOptions($mdSelect, $mdConstant, $$rAF, $mdUtil, $mdTheming, $timeout, $window) {
function selectDefaultOptions($mdSelect, $mdConstant, $$rAF, $mdUtil, $mdTheming, $timeout, $window, $document) {
return {
parent: 'body',
onShow: onShow,
onRemove: onRemove,
hasBackdrop: true,
disableParentScroll: $mdUtil.floatingScrollbars(),
disableParentScroll: true,
themable: true
};

Expand Down Expand Up @@ -733,11 +733,21 @@ function SelectProvider($$interimElementProvider) {
if (opts.disableParentScroll) {
opts.disableTarget = opts.parent.find('md-content');
if (!opts.disableTarget.length) opts.disableTarget = opts.parent;
if ($mdUtil.floatingScrollbars()) {
opts.disableTarget.css('margin-right', '16px');
opts.lastDisableCss = opts.disableTarget.attr('style');
var heightOffset = opts.disableTarget[0].scrollTop;
if (heightOffset == 0 && (heightOffset = $document[0].documentElement.scrollTop)) {
opts.restoreScrollOnDocElement = true;
}
opts.disableTargetOffset = heightOffset;
opts.disableTarget.css({
overflow: 'hidden',
position: 'fixed',
width: '100%',
top: (-1 * heightOffset) + 'px'
});
if (!$mdUtil.floatingScrollbars()) {
opts.disableTarget.parent().css('overflow-y', 'scroll');
}
opts.lastOverflow = opts.disableTarget.css('overflow');
opts.disableTarget.css('overflow', 'hidden');
}
// Only activate click listeners after a short time to stop accidental double taps/clicks
// from clicking the wrong item
Expand Down Expand Up @@ -860,12 +870,6 @@ function SelectProvider($$interimElementProvider) {
.removeClass('md-clickable');
opts.target.attr('aria-expanded', 'false');

if (opts.disableParentScroll && $mdUtil.floatingScrollbars()) {
opts.disableTarget.css('overflow', opts.lastOverflow);
opts.disableTarget.css('margin-right', '0px');
delete opts.lastOverflow;
delete opts.disableTarget;
}

angular.element($window).off('resize', opts.resizefn);
angular.element($window).off('orientationchange', opts.resizefn);
Expand All @@ -881,6 +885,21 @@ function SelectProvider($$interimElementProvider) {
opts.parent[0].removeChild(element[0]); // use browser to avoid $destroy event
opts.backdrop && opts.backdrop.remove();
if (opts.restoreFocus) opts.target.focus();
if (opts.disableParentScroll) {
opts.disableTarget.attr('style', opts.lastDisableCss || '');
if (opts.restoreScrollOnDocElement) {
$document[0].documentElement.scrollTop = opts.disableTargetOffset;
} else {
opts.disableTarget[0].scrollTop = opts.disableTargetOffset;
}
if (!$mdUtil.floatingScrollbars()) {
opts.disableTarget.parent().css('overflow-y', 'auto');
}
delete opts.lastDisableCss;
delete opts.disableTarget;
delete opts.disableTargetOffset;
delete opts.restoreScrollOnDocElement;
}
});
}

Expand Down

2 comments on commit 614630d

@hodeyp
Copy link

@hodeyp hodeyp commented on 614630d Apr 13, 2015

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

@rschmukler this commit has broken the md-select directive. On the demo pages when you open the select the page is scrolling down approx. 20-30px. On my app it is scrolling down 300-400px, adding a min-width to the select of 653px even thought the widest text is only 80px. It also seems to be doing some odd stuff to background colors?

@jgoux
Copy link

@jgoux jgoux commented on 614630d Apr 13, 2015

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Issue opened here : #2283

Please sign in to comment.