Permalink
Browse files

fix(scrollspy): Adjustments to the resizeThrottle scheduler (#640)

Adjustments to the resizeThrottle scheduler and additional scheduled event just in case elements are not in document yet.

This may help when elements/components are take out of document and later placed back in, and laso recalculate offsets on resize.
  • Loading branch information...
tmorehouse committed Jul 5, 2017
1 parent 836db33 commit bfaef7d7d578d5c99249786c902edc4f0181a7e3
Showing with 38 additions and 11 deletions.
  1. +38 −11 lib/directives/scrollspy.js
@@ -215,6 +215,7 @@ ScrollSpy.prototype.updateConfig = function (binding) {
this._$root = vm.$root;
}
// Return ourself for easy chaining
return this;
};
@@ -230,6 +231,7 @@ ScrollSpy.prototype.listen = function () {
window.addEventListener('resize', this, false);
}
// Return ourself for easy chaining
return this;
};
@@ -245,6 +247,7 @@ ScrollSpy.prototype.unListen = function () {
window.removeEventListener('resize', this, false);
}
// Return ourself for easy chaining
return this;
};
@@ -289,6 +292,7 @@ ScrollSpy.prototype.refresh = function () {
this._targets.push(item.href);
});
// Return ourself for easy chaining
return this;
};
@@ -331,6 +335,13 @@ ScrollSpy.prototype.process = function () {
}
}
// Return ourself for easy chaining
return this;
};
// Fake a resize event to schedule a refresh/process
ScrollSpy.prototype.scheduleRefresh = function () {
this.handleEvent({type:'resize'});
return this;
};
@@ -360,17 +371,15 @@ ScrollSpy.prototype.handleEvent = function (e) {
const self = this;
function resizeThrottle() {
clearTimeout(this._resizeTimeout);
this._resizeTimeout = setTimeout(() => {
clearTimeout(self._resizeTimeout);
self._resizeTimeout = setTimeout(() => {
self.refresh().process();
}, self._config.throttle || Default.throttle);
}
if (e.type === 'scroll') {
this.process();
} else if (e.type === 'orientationchange') {
this.refresh().process();
} else if (e.type === 'resize') {
} else if (e.type === 'orientationchange' || e.type === 'resize') {
resizeThrottle();
}
};
@@ -538,22 +547,40 @@ export default {
el[BVSS] = new ScrollSpy(el, binding);
},
inserted(el, binding) {
if (isServer || !el[BVSS]) {
if (isServer) {
return;
}
el[BVSS].updateConfig(binding).listen().refresh().process();
if (!el[BVSS]) {
el[BVSS] = new ScrollSpy(el, binding);
el[BVSS].listen();
} else {
el[BVSS].updateConfig(binding).listen();
}
el[BVSS].refresh().process().scheduleRefresh();
},
update(el, binding) {
if (isServer || !el[BVSS]) {
if (isServer) {
return;
}
el[BVSS].updateConfig(binding).refresh().process();
if (!el[BVSS]) {
el[BVSS] = new ScrollSpy(el, binding);
el[BVSS].listen();
} else {
el[BVSS].updateConfig(binding);
}
el[BVSS].refresh().process().scheduleRefresh();
},
componentUpdated(el, binding) {
if (isServer || !el[BVSS]) {
if (isServer) {
return;
}
el[BVSS].updateConfig(binding).refresh().process();
if (!el[BVSS]) {
el[BVSS] = new ScrollSpy(el, binding);
el[BVSS].listen();
} else {
el[BVSS].updateConfig(binding);
}
el[BVSS].refresh().process().scheduleRefresh();
},
unbind(el) {
if (isServer || !el[BVSS]) {

0 comments on commit bfaef7d

Please sign in to comment.