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 2b69623e278e7a22998cd27f55c7e6dd6038ba0a..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,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 <li ref={ref} className={cls} key={index} onClick={this.onSelect}>{item}</li>;
+      const selected = selectedIndex === index;
+      const cls = classnames({
+        [`${prefixCls}-select-option-selected`]: selected,
+      });
+      return <li className={cls} key={index} onClick={this.onSelect.bind(this, +item)}>{item}</li>;
     });
   },
 
@@ -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;
     }