X-Git-Url: https://git.immae.eu/?a=blobdiff_plain;f=src%2Fmodule%2FSelect.jsx;h=0b91ac5516e0171bffffcee5f5aaf50007c93600;hb=02d1b455617089d59a5202135eb43850f42e08a1;hp=2b69623e278e7a22998cd27f55c7e6dd6038ba0a;hpb=02de449a0474765a4796fa607e7e3922252f574f;p=github%2Ffretlink%2Ftime-picker.git diff --git a/src/module/Select.jsx b/src/module/Select.jsx index 2b69623..0b91ac5 100644 --- a/src/module/Select.jsx +++ b/src/module/Select.jsx @@ -3,6 +3,10 @@ import ReactDom from 'react-dom'; import classnames from 'classnames'; const scrollTo = (element, to, duration) => { + const requestAnimationFrame = window.requestAnimationFrame || + function requestAnimationFrameTimeout() { + return setTimeout(arguments[0], 10); + }; // jump to target if duration zero if (duration <= 0) { element.scrollTop = to; @@ -11,17 +15,18 @@ const scrollTo = (element, to, duration) => { const difference = to - element.scrollTop; const perTick = difference / duration * 10; - setTimeout(() => { + requestAnimationFrame(() => { element.scrollTop = element.scrollTop + perTick; if (element.scrollTop === to) return; scrollTo(element, to, duration - 10); - }, 10); + }); }; const Select = React.createClass({ propTypes: { prefixCls: PropTypes.string, options: PropTypes.array, + gregorianCalendarLocale: PropTypes.object, selectedIndex: PropTypes.number, type: PropTypes.string, onSelect: PropTypes.func, @@ -34,26 +39,22 @@ const Select = React.createClass({ componentDidUpdate() { // smooth scroll to selected option - this.scrollToSelected(200); + this.scrollToSelected(120); }, - onSelect(event) { - // do nothing when select selected option - if (event.target.getAttribute('class') === 'selected') { - return; - } - // change combobox selection + onSelect(value) { const { onSelect, type } = this.props; - const value = parseInt(event.target.innerHTML, 10); onSelect(type, value); }, getOptions() { - const { options, selectedIndex } = this.props; + const { options, selectedIndex, prefixCls } = this.props; return options.map((item, index) => { - const cls = classnames({ selected: selectedIndex === index}); - const ref = selectedIndex === index ? 'selected' : null; - return
  • {item}
  • ; + const selected = selectedIndex === index; + const cls = classnames({ + [`${prefixCls}-select-option-selected`]: selected, + }); + return
  • {item}
  • ; }); }, @@ -61,7 +62,7 @@ const Select = React.createClass({ // move to selected item const select = ReactDom.findDOMNode(this); const list = ReactDom.findDOMNode(this.refs.list); - let index = this.props.selectedIndex - 2; + let index = this.props.selectedIndex - 1; if (index < 0) { index = 0; }