add header and select test case

[github/fretlink/time-picker.git] / src / module / Select.jsx

diff --git a/src/module/Select.jsx b/src/module/Select.jsx
index be4c02544eb53b2bf2e37405868310f35388edc1..0b91ac5516e0171bffffcee5f5aaf50007c93600 100644 (file)
--- 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,11 +15,11 @@ 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({
@@ -35,7 +39,7 @@ const Select = React.createClass({
 
   componentDidUpdate() {
     // smooth scroll to selected option
-    this.scrollToSelected(200);
+    this.scrollToSelected(120);
   },
 
   onSelect(value) {
@@ -58,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;
     }