OLD | NEW |
1 // Copyright (c) 2011 The Chromium Authors. All rights reserved. | 1 // Copyright (c) 2011 The Chromium Authors. All rights reserved. |
2 // Use of this source code is governed by a BSD-style license that can be | 2 // Use of this source code is governed by a BSD-style license that can be |
3 // found in the LICENSE file. | 3 // found in the LICENSE file. |
4 | 4 |
5 /** | 5 /** |
6 * @fileoverview Card slider implementation. Allows you to create interactions | 6 * @fileoverview Card slider implementation. Allows you to create interactions |
7 * that have items that can slide left to right to reveal additional items. | 7 * that have items that can slide left to right to reveal additional items. |
8 * Works by adding the necessary event handlers to a specific DOM structure | 8 * Works by adding the necessary event handlers to a specific DOM structure |
9 * including a frame, container and cards. | 9 * including a frame, container and cards. |
10 * - The frame defines the boundary of one item. Each card will be expanded to | 10 * - The frame defines the boundary of one item. Each card will be expanded to |
(...skipping 203 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
214 }, | 214 }, |
215 | 215 |
216 /** | 216 /** |
217 * Handle horizontal scrolls to flip between pages. | 217 * Handle horizontal scrolls to flip between pages. |
218 * @private | 218 * @private |
219 */ | 219 */ |
220 onMouseWheel_: function(e) { | 220 onMouseWheel_: function(e) { |
221 if (e.wheelDeltaX == 0) | 221 if (e.wheelDeltaX == 0) |
222 return; | 222 return; |
223 | 223 |
224 var preventDefault = true; | 224 // Prevent OS X 10.7+ history swiping on the NTP. |
225 // If the horizontal scroll didn't change cards (on the far right of | 225 e.preventDefault(); |
226 // the NTP), let the browser take a shot at the event as well. | |
227 if (this.currentCard === 0 && this.mouseWheelScrollAmount_ > 0) | |
228 preventDefault = false; | |
229 if (this.currentCard === this.cards_.length - 1 && | |
230 this.mouseWheelScrollAmount_ < 0) { | |
231 preventDefault = false; | |
232 } | |
233 | 226 |
234 // Mac value feels ok with multitouch trackpads and magic mice | 227 // Mac value feels ok with multitouch trackpads and magic mice |
235 // (with physical scrollwheel, too), but not so great with logitech | 228 // (with physical scrollwheel, too), but not so great with logitech |
236 // mice. | 229 // mice. |
237 var scrollAmountPerPage = cr.isMac ? 400 : 120; | 230 var scrollAmountPerPage = cr.isMac ? 400 : 120; |
238 if (!ntp4.isRTL()) | 231 if (!ntp4.isRTL()) |
239 scrollAmountPerPage *= -1; | 232 scrollAmountPerPage *= -1; |
240 this.mouseWheelScrollAmount_ += e.wheelDeltaX; | 233 this.mouseWheelScrollAmount_ += e.wheelDeltaX; |
241 if (Math.abs(this.mouseWheelScrollAmount_) >= | 234 if (Math.abs(this.mouseWheelScrollAmount_) >= |
242 Math.abs(scrollAmountPerPage)) { | 235 Math.abs(scrollAmountPerPage)) { |
243 var pagesToScroll = this.mouseWheelScrollAmount_ / scrollAmountPerPage; | 236 var pagesToScroll = this.mouseWheelScrollAmount_ / scrollAmountPerPage; |
244 pagesToScroll = | 237 pagesToScroll = |
245 (pagesToScroll > 0 ? Math.floor : Math.ceil)(pagesToScroll); | 238 (pagesToScroll > 0 ? Math.floor : Math.ceil)(pagesToScroll); |
246 var newCardIndex = this.currentCard + pagesToScroll; | 239 var newCardIndex = this.currentCard + pagesToScroll; |
247 newCardIndex = Math.min(this.cards_.length - 1, | 240 newCardIndex = Math.min(this.cards_.length - 1, |
248 Math.max(0, newCardIndex)); | 241 Math.max(0, newCardIndex)); |
249 this.selectCard(newCardIndex, true); | 242 this.selectCard(newCardIndex, true); |
250 this.mouseWheelScrollAmount_ -= pagesToScroll * scrollAmountPerPage; | 243 this.mouseWheelScrollAmount_ -= pagesToScroll * scrollAmountPerPage; |
251 } | 244 } |
252 | 245 |
253 // We got a mouse wheel event, so cancel any pending scroll wheel timeout. | 246 // We got a mouse wheel event, so cancel any pending scroll wheel timeout. |
254 if (this.scrollClearTimeout_ != null) | 247 if (this.scrollClearTimeout_ != null) |
255 clearTimeout(this.scrollClearTimeout_); | 248 clearTimeout(this.scrollClearTimeout_); |
256 // If we didn't use up all the scroll, hold onto it for a little bit, but | 249 // If we didn't use up all the scroll, hold onto it for a little bit, but |
257 // drop it after a delay. | 250 // drop it after a delay. |
258 if (this.mouseWheelScrollAmount_ != 0) { | 251 if (this.mouseWheelScrollAmount_ != 0) { |
259 this.scrollClearTimeout_ = | 252 this.scrollClearTimeout_ = |
260 setTimeout(this.clearMouseWheelScroll_.bind(this), 500); | 253 setTimeout(this.clearMouseWheelScroll_.bind(this), 500); |
261 } | 254 } |
262 | |
263 if (preventDefault) | |
264 e.preventDefault(); | |
265 }, | 255 }, |
266 | 256 |
267 /** | 257 /** |
268 * Resets the amount of horizontal scroll we've seen to 0. See | 258 * Resets the amount of horizontal scroll we've seen to 0. See |
269 * onMouseWheel_. | 259 * onMouseWheel_. |
270 * @private | 260 * @private |
271 */ | 261 */ |
272 clearMouseWheelScroll_: function() { | 262 clearMouseWheelScroll_: function() { |
273 this.mouseWheelScrollAmount_ = 0; | 263 this.mouseWheelScrollAmount_ = 0; |
274 }, | 264 }, |
(...skipping 145 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
420 // Stop listening to any current touch | 410 // Stop listening to any current touch |
421 this.touchHandler_.cancelTouch(); | 411 this.touchHandler_.cancelTouch(); |
422 | 412 |
423 // Ensure we're at a card bounary | 413 // Ensure we're at a card bounary |
424 this.transformToCurrentCard_(true); | 414 this.transformToCurrentCard_(true); |
425 }, | 415 }, |
426 }; | 416 }; |
427 | 417 |
428 return CardSlider; | 418 return CardSlider; |
429 })(); | 419 })(); |
OLD | NEW |