'use strict';

import React from 'react';
import ReactNative from 'react-native';

import {bindActionCreators} from 'redux';
import {connect} from 'react-redux';

import {Map} from 'immutable';

import * as guideActions from '../reducers/guide/guideActions';
import * as deviceActions from '../reducers/device/deviceActions';

import Guide from '../components/Guide';

const {
    Component,
} = React;

const {
    View,
    Text,
} = ReactNative;

/**
 * ## Actions
 * 3 of our actions will be available as ```actions```
 */
const actions = [
    guideActions,
    deviceActions,
];

/**
 *  Save that state
 */
function mapStateToProps(state) {
    return {
        ...state
    };
}

/**
 * Bind all the functions from the ```actions``` and bind them with
 * ```dispatch```
 */
function mapDispatchToProps(dispatch) {

    const creators = Map()
            .merge(...actions)
            .filter(value => typeof value === 'function')
            .toObject();

    return {
        actions: bindActionCreators(creators, dispatch),
        dispatch
    };
}

class GuideContainer extends Component {

    constructor(props) {
        super(props);

        this.onPress = this.onPress.bind(this);

        this.guideItems = [
            {
                uri: require('../images/guide/guide1.png'),
                text:  '客源多多，免费开店',
            },
            {
                uri: require('../images/guide/guide2.png'),
                text:  '店铺随身管，实时看数据',
            },
            {
                uri: require('../images/guide/guide3.png'),
                text:  '各种工具，玩转销售',
                buttonText: '立即登录',
                onPress: this.onPress,
            },
        ];

    }

    componentDidMount() {
        // this.timer = TimerMixin.setTimeout(() => {

        //     this.props.actions.setDisplayStatus();

        // }, 1000);
    }

    componentWillUnmount() {
        // TimerMixin.clearTimeout(this.timer);
    }

    onPress() {
        this.props.actions.setGuideDisplayState();
    }

	render() {
        return (
            <Guide items={this.guideItems} />
        );
    }
}

export default connect(mapStateToProps, mapDispatchToProps)(GuideContainer);