
require('../css/gallery.less');

var React = require('react');

var cx = React.addons.classSet;

var Gallery = React.createClass({
    getInitialState () {
        return {
            isShow: false
        };
    },
    componentWillReceiveProps (nextProps) {
        if (nextProps.currIndex > -1) {
            this.setState({
                isShow: true
            });
        }
    },
    hide () {
        this.setState({
            isShow: false
        });
    },
    render () {

        var imgNodes = this.props.imgList.map((img, index) => {
            return (
                <li key={ index } onClick={ this.hide }>
                    <img src={ img } />
                </li>
            );
        });

        var classes = cx({
            'gallery': true,
            'show': this.state.isShow
        });

        return (
            <div className={ classes }>
                <ul>{ imgNodes }</ul>
            </div>
        );
    }
});

module.exports = Gallery;
@@ -91,16 +91,54 @@
 ssSet;%0A%0A
+var windowWidth = window.innerWidth;%0A%0A
 var Gall
@@ -661,20 +661,60 @@
 his.hide
+ %7D style=%7B %7Bwidth: %60$%7B windowWidth %7Dpx%60%7D
  %7D%3E%0A
-
         
@@ -787,32 +787,138 @@
 );%0A        %7D);%0A%0A
+        var listStyle = %7B%0A            width: %60$%7B this.props.imgList.length * windowWidth %7Dpx%60%0A        %7D;%0A%0A
         var clas
@@ -1061,24 +1061,24 @@
  classes %7D%3E%0A
-
             
@@ -1084,16 +1084,36 @@
      %3Cul
+ style=%7B listStyle %7D
 %3E%7B imgNo

fix gallery width