Merge pull request #2913 from matrix-org/travis/breadcrumbs/scrolling-3

Remove breadcrumb scroll tolerances and use sensible defaults
pull/21833/head
Travis Ralston 2019-04-11 11:30:47 -06:00 committed by GitHub
commit 9bd8f47cdf
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
3 changed files with 13 additions and 34 deletions

View File

@ -29,13 +29,6 @@ export default class IndicatorScrollbar extends React.Component {
// scroll horizontally rather than vertically. This should only be used on components // scroll horizontally rather than vertically. This should only be used on components
// with no vertical scroll opportunity. // with no vertical scroll opportunity.
verticalScrollsHorizontally: PropTypes.bool, verticalScrollsHorizontally: PropTypes.bool,
// An object containing 2 numbers: xyThreshold and yReduction. xyThreshold is the amount
// of horizontal movement required in order to ignore any vertical changes in scroll, and
// only applies when verticalScrollsHorizontally is true. yReduction is the factor to
// multiply the vertical delta by when verticalScrollsHorizontally is true. The default
// behaviour is to have an xyThreshold of infinity and a yReduction of 0.8
scrollTolerances: PropTypes.object,
}; };
constructor(props) { constructor(props) {
@ -127,20 +120,19 @@ export default class IndicatorScrollbar extends React.Component {
onMouseWheel = (e) => { onMouseWheel = (e) => {
if (this.props.verticalScrollsHorizontally && this._scrollElement) { if (this.props.verticalScrollsHorizontally && this._scrollElement) {
const xyThreshold = this.props.scrollTolerances // xyThreshold is the amount of horizontal motion required for the component to
? this.props.scrollTolerances.xyThreshold // ignore the vertical delta in a scroll. Used to stop trackpads from acting in
: Number.MAX_SAFE_INTEGER; // strange ways. Should be positive.
const xyThreshold = 0;
const yReduction = this.props.scrollTolerances // yRetention is the factor multiplied by the vertical delta to try and reduce
? this.props.scrollTolerances.yReduction // the harshness of the scroll behaviour. Should be a value between 0 and 1.
: 0.8; const yRetention = 1.0;
// Don't apply vertical motion to horizontal scrolls. This is meant to eliminate if (Math.abs(e.deltaX) < xyThreshold) {
// trackpads causing excessive scroll motion. // noinspection JSSuspiciousNameCombination
if (e.deltaX >= xyThreshold) return; this._scrollElement.scrollLeft += e.deltaY * yRetention;
}
// noinspection JSSuspiciousNameCombination
this._scrollElement.scrollLeft += e.deltaY * yReduction;
} }
}; };

View File

@ -33,12 +33,7 @@ const MAX_ROOMS = 20;
export default class RoomBreadcrumbs extends React.Component { export default class RoomBreadcrumbs extends React.Component {
constructor(props) { constructor(props) {
super(props); super(props);
this.state = {rooms: []};
const tolerances = SettingsStore.getValue("breadcrumb_scroll_tolerances");
this.state = {rooms: [], scrollTolerances: tolerances};
// Record this for debugging purposes
console.log("Breadcrumbs scroll tolerances:", tolerances);
this.onAction = this.onAction.bind(this); this.onAction = this.onAction.bind(this);
this._dispatcherRef = null; this._dispatcherRef = null;
@ -343,8 +338,7 @@ export default class RoomBreadcrumbs extends React.Component {
}); });
return ( return (
<IndicatorScrollbar ref="scroller" className="mx_RoomBreadcrumbs" <IndicatorScrollbar ref="scroller" className="mx_RoomBreadcrumbs"
trackHorizontalOverflow={true} verticalScrollsHorizontally={true} trackHorizontalOverflow={true} verticalScrollsHorizontally={true}>
scrollTolerances={this.state.scrollTolerances}>
{ avatars } { avatars }
</IndicatorScrollbar> </IndicatorScrollbar>
); );

View File

@ -262,13 +262,6 @@ export const SETTINGS = {
supportedLevels: ['account'], supportedLevels: ['account'],
default: [], default: [],
}, },
"breadcrumb_scroll_tolerances": {
supportedLevels: LEVELS_DEVICE_ONLY_SETTINGS,
default: {
xyThreshold: 10,
yReduction: 0.8,
},
},
"analyticsOptIn": { "analyticsOptIn": {
supportedLevels: LEVELS_DEVICE_ONLY_SETTINGS_WITH_CONFIG, supportedLevels: LEVELS_DEVICE_ONLY_SETTINGS_WITH_CONFIG,
displayName: _td('Send analytics data'), displayName: _td('Send analytics data'),