Chromium Code Reviews
chromiumcodereview-hr@appspot.gserviceaccount.com (chromiumcodereview-hr) | Please choose your nickname with Settings | Help | Chromium Project | Gerrit Changes | Sign out
(11)

Side by Side Diff: ui/file_manager/file_manager/foreground/js/ui/scrollbar.js

Issue 2135163002: Scroll the attached view when wheel spinned on top of a scroll button. (Closed) Base URL: https://chromium.googlesource.com/chromium/src.git@master
Patch Set: Fix comment indent Created 4 years, 5 months ago
Use n/p to move between diff chunks; N/P to move between comments. Draft comments are only viewable by you.
Jump to:
View unified diff | Download patch
« no previous file with comments | « no previous file | no next file » | no next file with comments »
Toggle Intra-line Diffs ('i') | Expand Comments ('e') | Collapse Comments ('c') | Show Comments Hide Comments ('s')
OLDNEW
1 // Copyright (c) 2013 The Chromium Authors. All rights reserved. 1 // Copyright (c) 2013 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 * Creates a new scroll bar element. 6 * Creates a new scroll bar element.
7 * @extends {HTMLDivElement} 7 * @extends {HTMLDivElement}
8 * @constructor 8 * @constructor
9 */ 9 */
10 var ScrollBar = cr.ui.define('div'); 10 var ScrollBar = cr.ui.define('div');
(...skipping 33 matching lines...) Expand 10 before | Expand all | Expand 10 after
44 * Initializes the DOM structure of the scrollbar. 44 * Initializes the DOM structure of the scrollbar.
45 */ 45 */
46 ScrollBar.prototype.decorate = function() { 46 ScrollBar.prototype.decorate = function() {
47 this.classList.add('scrollbar'); 47 this.classList.add('scrollbar');
48 this.button_ = util.createChild(this, 'scrollbar-button', 'div'); 48 this.button_ = util.createChild(this, 'scrollbar-button', 'div');
49 this.mode = ScrollBar.Mode.VERTICAL; 49 this.mode = ScrollBar.Mode.VERTICAL;
50 this.idleTimerId_ = 0; 50 this.idleTimerId_ = 0;
51 51
52 this.button_.addEventListener('mousedown', 52 this.button_.addEventListener('mousedown',
53 this.onButtonPressed_.bind(this)); 53 this.onButtonPressed_.bind(this));
54 this.button_.addEventListener('wheel', this.onWheel_.bind(this));
54 window.addEventListener('mouseup', this.onMouseUp_.bind(this)); 55 window.addEventListener('mouseup', this.onMouseUp_.bind(this));
55 window.addEventListener('mousemove', this.onMouseMove_.bind(this)); 56 window.addEventListener('mousemove', this.onMouseMove_.bind(this));
56 }; 57 };
57 58
58 /** 59 /**
59 * Initialize a scrollbar. 60 * Initialize a scrollbar.
60 * 61 *
61 * @param {Element} parent Parent element, must have a relative or absolute 62 * @param {Element} parent Parent element, must have a relative or absolute
62 * positioning. 63 * positioning.
63 * @param {Element=} opt_scrollableArea Element with scrollable contents. 64 * @param {Element=} opt_scrollableArea Element with scrollable contents.
(...skipping 15 matching lines...) Expand all
79 this.view_.addEventListener('scroll', this.onScroll_.bind(this)); 80 this.view_.addEventListener('scroll', this.onScroll_.bind(this));
80 this.view_.addEventListener('relayout', this.onRelayout_.bind(this)); 81 this.view_.addEventListener('relayout', this.onRelayout_.bind(this));
81 this.domObserver_ = new MutationObserver(this.onDomChanged_.bind(this)); 82 this.domObserver_ = new MutationObserver(this.onDomChanged_.bind(this));
82 this.domObserver_.observe( 83 this.domObserver_.observe(
83 this.view_, 84 this.view_,
84 /** @type {MutationObserverInit} */ ({subtree: true, attributes: true})); 85 /** @type {MutationObserverInit} */ ({subtree: true, attributes: true}));
85 this.onRelayout_(); 86 this.onRelayout_();
86 }; 87 };
87 88
88 /** 89 /**
90 * Handles scroll by a mouse wheel.
91 *
92 * @param {Event} event Mouse event.
93 * @private
94 */
95 ScrollBar.prototype.onWheel_ = function(event) {
96 var scrollPosition = this.view_.scrollTop + event.deltaY;
97 // Ensure the scrollbar is in the view.
98 var scrollBottom =
99 Math.max(this.view_.scrollHeight - this.view_.clientHeight, 0);
100 scrollPosition = Math.max(Math.min(scrollPosition, scrollBottom), 0);
101
102 // TODO(yamaguchi): Invoke native scroll instead of setting scrollTop.
103 // This implementation will bypass the smooth scroll animation seen with
104 // native scroll.
105 this.scrollTop_ = scrollPosition;
106 this.view_.scrollTop = scrollPosition;
107 this.redraw_();
108 }
109
110 /**
89 * Scroll handler. 111 * Scroll handler.
90 * @private 112 * @private
91 */ 113 */
92 ScrollBar.prototype.onScroll_ = function() { 114 ScrollBar.prototype.onScroll_ = function() {
93 this.scrollTop_ = this.view_.scrollTop; 115 this.scrollTop_ = this.view_.scrollTop;
94 this.redraw_(); 116 this.redraw_();
95 117
96 // Add class 'scrolling' to scrollbar to make it visible while scrolling. 118 // Add class 'scrolling' to scrollbar to make it visible while scrolling.
97 this.button_.classList.add('scrolling'); 119 this.button_.classList.add('scrolling');
98 120
(...skipping 126 matching lines...) Expand 10 before | Expand all | Expand 10 after
225 requestAnimationFrame(function() { 247 requestAnimationFrame(function() {
226 this.hidden = hidden; 248 this.hidden = hidden;
227 this.button_.style.top = buttonTop + 'px'; 249 this.button_.style.top = buttonTop + 'px';
228 this.button_.style.height = buttonSize + 'px'; 250 this.button_.style.height = buttonSize + 'px';
229 }.bind(this)); 251 }.bind(this));
230 } 252 }
231 253
232 this.lastButtonTop_ = buttonTop; 254 this.lastButtonTop_ = buttonTop;
233 this.lastButtonSize_ = buttonSize; 255 this.lastButtonSize_ = buttonSize;
234 }; 256 };
OLDNEW
« no previous file with comments | « no previous file | no next file » | no next file with comments »

Powered by Google App Engine
This is Rietveld 408576698