Skip to content

Commit c6e62e9

Browse files
author
Gordon Smith
committed
Activate/Deactivate fire at wrong time
Issues: Activate/Deactivate events fired at wrong times. When scrolling up the active event was firing too soon. Minor improvements: Add method to jump to page. Prevent tweening on home/end. Pressing F5 should reset to top? Signed-off-by: Gordon Smith <gordon.smith@lexisnexis.com>
1 parent 01546be commit c6e62e9

File tree

1 file changed

+15
-11
lines changed

1 file changed

+15
-11
lines changed

stack.v1.js

Lines changed: 15 additions & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -60,6 +60,7 @@ function stack() {
6060
sectionNext = d3.select(section[0][1]).style("display", "block");
6161

6262
d3.select(window)
63+
.on("beforeunload", function () { scrollTo(0, 0); }) // Reset to top on F5
6364
.on("resize.stack", resize)
6465
.on("scroll.stack", reposition)
6566
.on("keydown.stack", keydown)
@@ -121,32 +122,28 @@ function stack() {
121122

122123
function reposition() {
123124
var y1 = pageYOffset / windowHeight,
124-
i1 = Math.max(0, Math.min(n - 1, Math.floor(y1)));
125+
i1 = Math.max(0, Math.min(n - 1, y1));
126+
i1 = i1 > i ? Math.floor(i1) : Math.ceil(i1);
125127

126128
if (i !== i1) {
127129
if (i1 === i + 1) { // advance one
128130
sectionCurrent.style("display", "none");
129131
sectionCurrent = sectionNext;
130132
sectionNext = d3.select(section[0][i1 + 1]);
131-
dispatchEvent({type: "deactivate"}, i);
132-
if (i1 < n - 1) dispatchEvent({type: "activate"}, i1 + 1);
133133
} else if (i1 === i - 1) { // rewind one
134134
sectionNext.style("display", "none");
135135
sectionNext = sectionCurrent;
136136
sectionCurrent = d3.select(section[0][i1]);
137-
if (i < n - 1) dispatchEvent({type: "deactivate"}, i + 1);
138-
dispatchEvent({type: "activate"}, i1);
139137
} else { // skip
140138
sectionCurrent.style("display", "none");
141139
sectionNext.style("display", "none");
142140
sectionCurrent = d3.select(section[0][i1]);
143141
sectionNext = d3.select(section[0][i1 + 1]);
144-
if (!isNaN(i)) dispatchEvent({type: "deactivate"}, i + 1), dispatchEvent({type: "deactivate"}, i);
145-
dispatchEvent({type: "activate"}, i1);
146-
if (i1 < n - 1) dispatchEvent({type: "activate"}, i1 + 1);
147142
}
148143
sectionCurrent.style("display", "block").style("opacity", 1);
149144
sectionNext.style("display", "block");
145+
if (!isNaN(i)) dispatchEvent({ type: "deactivate" }, i);
146+
if (i1 < n) dispatchEvent({ type: "activate" }, i1);
150147
i = i1;
151148
}
152149

@@ -173,8 +170,11 @@ function stack() {
173170
case 33: // page up
174171
delta = d3.event.metaKey ? -Infinity : -1; break;
175172
case 32: // space
176-
delta = d3.event.shiftKey ? -1 : 1;
177-
break;
173+
delta = d3.event.shiftKey ? -1 : 1; break;
174+
case 36: // home
175+
delta = -Infinity; break;
176+
case 35: // end
177+
delta = Infinity; break;
178178
default: return;
179179
}
180180

@@ -187,7 +187,7 @@ function stack() {
187187
d3.select(document.documentElement)
188188
.interrupt()
189189
.transition()
190-
.duration(500)
190+
.duration(Math.abs(delta) > 1 ? 0 : 500)
191191
.tween("scroll", function() {
192192
var i = d3.interpolateNumber(pageYOffset, yt * windowHeight);
193193
return function(t) { scrollTo(0, i(t)); };
@@ -197,6 +197,10 @@ function stack() {
197197
d3.event.preventDefault();
198198
}
199199

200+
stack.scrollToPage = function (page) {
201+
scrollTo(0, page * windowHeight);
202+
};
203+
200204
stack.size = function(_) {
201205
return arguments.length ? (size = [+_[0], +_[1]], resize(), stack) : size;
202206
};

0 commit comments

Comments
 (0)