OLD | NEW |
---|---|
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 Loading... | |
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('mousewheel', this.onWheel_.bind(this)); | |
fukino
2016/07/11 10:09:52
mousewheel event is deprecated, so please use the
yamaguchi
2016/07/11 10:17:20
Done.
| |
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 Loading... | |
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 | |
fukino
2016/07/11 10:09:52
Please add a comment about the difference between
yamaguchi
2016/07/11 10:17:20
Done.
| |
102 this.scrollTop_ = scrollPosition; | |
103 this.view_.scrollTop = scrollPosition; | |
104 this.redraw_(); | |
105 } | |
106 | |
107 /** | |
89 * Scroll handler. | 108 * Scroll handler. |
90 * @private | 109 * @private |
91 */ | 110 */ |
92 ScrollBar.prototype.onScroll_ = function() { | 111 ScrollBar.prototype.onScroll_ = function() { |
93 this.scrollTop_ = this.view_.scrollTop; | 112 this.scrollTop_ = this.view_.scrollTop; |
94 this.redraw_(); | 113 this.redraw_(); |
95 | 114 |
96 // Add class 'scrolling' to scrollbar to make it visible while scrolling. | 115 // Add class 'scrolling' to scrollbar to make it visible while scrolling. |
97 this.button_.classList.add('scrolling'); | 116 this.button_.classList.add('scrolling'); |
98 | 117 |
(...skipping 126 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... | |
225 requestAnimationFrame(function() { | 244 requestAnimationFrame(function() { |
226 this.hidden = hidden; | 245 this.hidden = hidden; |
227 this.button_.style.top = buttonTop + 'px'; | 246 this.button_.style.top = buttonTop + 'px'; |
228 this.button_.style.height = buttonSize + 'px'; | 247 this.button_.style.height = buttonSize + 'px'; |
229 }.bind(this)); | 248 }.bind(this)); |
230 } | 249 } |
231 | 250 |
232 this.lastButtonTop_ = buttonTop; | 251 this.lastButtonTop_ = buttonTop; |
233 this.lastButtonSize_ = buttonSize; | 252 this.lastButtonSize_ = buttonSize; |
234 }; | 253 }; |
OLD | NEW |