Bug 1397114 - Disable smooth scrolling when value changes come from input box r=mconley

MozReview-Commit-ID: 9ZLSB2HQvcu

--HG--
extra : rebase_source : af5aad09637255596b8fa51f39ce069970e1f699
This commit is contained in:
Scott Wu 2017-09-20 16:45:03 +08:00
Родитель 5362aea0cf
Коммит 1cc0b91e89
2 изменённых файлов: 8 добавлений и 19 удалений

Просмотреть файл

@ -133,7 +133,7 @@ function DatePicker(context) {
/** /**
* Update date picker and its components. * Update date picker and its components.
*/ */
_update() { _update(options = {}) {
const { dateKeeper, isMonthPickerVisible } = this.state; const { dateKeeper, isMonthPickerVisible } = this.state;
if (isMonthPickerVisible) { if (isMonthPickerVisible) {
@ -148,7 +148,8 @@ function DatePicker(context) {
dateObj: dateKeeper.state.dateObj, dateObj: dateKeeper.state.dateObj,
months: this.state.months, months: this.state.months,
years: this.state.years, years: this.state.years,
toggleMonthPicker: this.state.toggleMonthPicker toggleMonthPicker: this.state.toggleMonthPicker,
noSmoothScroll: options.noSmoothScroll
}); });
this.components.calendar.setProps({ this.components.calendar.setProps({
isVisible: !isMonthPickerVisible, isVisible: !isMonthPickerVisible,
@ -269,7 +270,7 @@ function DatePicker(context) {
dateKeeper.setSelection({ dateKeeper.setSelection({
year, month, day year, month, day
}); });
this._update(); this._update({ noSmoothScroll: true });
} }
}; };
@ -350,14 +351,14 @@ function DatePicker(context) {
items: props.months, items: props.months,
isInfiniteScroll: true, isInfiniteScroll: true,
isValueSet: this.state.isMonthSet, isValueSet: this.state.isMonthSet,
smoothScroll: !this.state.firstOpened smoothScroll: !(this.state.firstOpened || props.noSmoothScroll)
}); });
this.components.year.setState({ this.components.year.setState({
value: props.dateObj.getUTCFullYear(), value: props.dateObj.getUTCFullYear(),
items: props.years, items: props.years,
isInfiniteScroll: false, isInfiniteScroll: false,
isValueSet: this.state.isYearSet, isValueSet: this.state.isYearSet,
smoothScroll: !this.state.firstOpened smoothScroll: !(this.state.firstOpened || props.noSmoothScroll)
}); });
this.state.firstOpened = false; this.state.firstOpened = false;
} else { } else {

Просмотреть файл

@ -124,8 +124,6 @@ function Spinner(props, context) {
/** /**
* Whenever scroll event is detected: * Whenever scroll event is detected:
* - Update the index state * - Update the index state
* - If a smooth scroll has reached its destination, set [isScrolling] state
* to false
* - If the value has changed, update the [value] state and call [setValue] * - If the value has changed, update the [value] state and call [setValue]
* - If infinite scrolling is on, reset the scrolling position if necessary * - If infinite scrolling is on, reset the scrolling position if necessary
*/ */
@ -138,14 +136,8 @@ function Spinner(props, context) {
const value = itemsView[this.state.index + viewportTopOffset].value; const value = itemsView[this.state.index + viewportTopOffset].value;
// Check if smooth scrolling has reached its destination. // Call setValue if value has changed
// This prevents input box jump when input box changes values. if (this.state.value != value) {
if (this.state.value == value && this.state.isScrolling) {
this.state.isScrolling = false;
}
// Call setValue if value has changed, and is not smooth scrolling
if (this.state.value != value && !this.state.isScrolling) {
this.state.value = value; this.state.value = value;
this.props.setValue(value); this.props.setValue(value);
} }
@ -444,10 +436,6 @@ function Spinner(props, context) {
_smoothScrollToIndex(index) { _smoothScrollToIndex(index) {
const element = this.elements.spinner.children[index]; const element = this.elements.spinner.children[index];
if (element) { if (element) {
// Set the isScrolling flag before smooth scrolling begins
// and remove it when it has reached the destination.
// This prevents input box jump when input box changes values
this.state.isScrolling = true;
element.scrollIntoView({ element.scrollIntoView({
behavior: "smooth", block: "start" behavior: "smooth", block: "start"
}); });