'use strict'

import React, {Component} from 'react';
import ReactNative, {
    StyleSheet,
    Dimensions,
    Platform,
    View,
    Text,
    NativeModules,
    InteractionManager,
    NativeAppEventEmitter,
} from 'react-native'

import {bindActionCreators} from 'redux';
import {connect} from 'react-redux';
import {Map} from 'immutable';
import * as brandActions from '../reducers/brand/brandActions';

import Brand from '../components/brand/Brand';


const actions = [
    brandActions,
];

function mapStateToProps(state) {
    return {
        ...state
    };
}

function mapDispatchToProps(dispatch) {

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

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

class BrandContainer extends Component {
    constructor(props) {
        super(props);

        this._onPressSlideItem = this._onPressSlideItem.bind(this);
        this._onPressFilter = this._onPressFilter.bind(this);
        this._onChannelPressFliter = this._onChannelPressFliter.bind(this);
        this._onPressSearch = this._onPressSearch.bind(this);
        this._onPressClearHistory = this._onPressClearHistory.bind(this);
        this._onClickCancelSearch = this._onClickCancelSearch.bind(this);
        this._onSearchTextChange = this._onSearchTextChange.bind(this);
        this._onPressKeyword = this._onPressKeyword.bind(this);
        this._onPressBrandSearchItem = this._onPressBrandSearchItem.bind(this);
        this._setBrandData = this._setBrandData.bind(this);
        this._setInitialListSize = this._setInitialListSize.bind(this);


        this.subscription = NativeAppEventEmitter.addListener(
            'ChannelDidChangeEvent',
            (reminder) => {
                this._onChannelPressFliter(reminder.channel);
            }
        );

    }

    componentDidMount() {
        this.props.actions.getBrandList(1);
        this.props.actions.getBrandResource(1);
        this.props.actions.searchHistory();
        this.props.actions.hotKeyword();
    }

    componentWillUnmount() {

    }

    componentWillUnmount() {
        this.subscription && this.subscription.remove();
    }

    _onPressSlideItem(data){
        ReactNative.NativeModules.YH_ClassifyHelper.pushBrandVC(data);
    }

    _onPressFilter(value) {
        this.props.actions.setBrandFilter(value);
    }

    _setInitialListSize(count){
        this.props.actions.setInitialListSize(count);
    }

    _onChannelPressFliter(value){

        let {
            brandListForBoy,
            brandListForGirl,
            brandListForKid,
            brandListForLifeStyle,
            reourceForBoy,
            reourceForGirl,
            reourceForKid,
            reourceForLifeStyle,
        } = this.props.brand;

        let brandListNeedRequest;
        let reourceNeedRequest;
        if (value == 1) {
            brandListNeedRequest = brandListForBoy.get('hasSuccess');
            reourceNeedRequest = reourceForBoy.get('hasSuccess');
        }else if (value == 2) {
            brandListNeedRequest = brandListForGirl.get('hasSuccess');
            reourceNeedRequest = reourceForGirl.get('hasSuccess');
        }else if (value == 3) {
            brandListNeedRequest = brandListForKid.get('hasSuccess');
            reourceNeedRequest = reourceForKid.get('hasSuccess');
        }else if (value == 4) {
            brandListNeedRequest = brandListForLifeStyle.get('hasSuccess');
            reourceNeedRequest = reourceForLifeStyle.get('hasSuccess');
        }

        if (!brandListNeedRequest) {
            this.props.actions.getBrandList(value);
        }
        if (!reourceNeedRequest) {
            this.props.actions.getBrandResource(value);
        }
        this.props.actions.setInitialListSize(0);
        this.props.actions.setBrandChannelFilter(value);
    }

    _onPressSearch() {
        this.props.actions.setShowSearch(!this.props.brand.showSearch);
    }

    _onPressClearHistory() {
        this.props.actions.clearSearchHistory();
    }

    _onClickCancelSearch() {
        this.props.actions.setShowSearch(!this.props.brand.showSearch);
        this.props.actions.setBrandKeyword('');
        this.props.actions.filteBrandForKeyword('');
    }

    _onSearchTextChange(text) {
        this.props.actions.setBrandKeyword(text);
        this.props.actions.filteBrandForKeyword(text);
    }

    _setBrandData(data,brandChannelFliter) {
        this.props.actions.setBrandData(data,brandChannelFliter);
    }

    _onPressKeyword(keyword) {
        this._onSearchTextChange(keyword);
    }

    _onPressBrandSearchItem(url, brandName) {
        ReactNative.NativeModules.YH_CommonHelper.jumpWithUrl(url);
        this.props.actions.insertSearchHistory(brandName);
        this._onClickCancelSearch();
    }

    render() {
        let {
            showSearch,
            initialListSize,
            isFetching,
            brandChannelFliter,
            brandFliter,
            brandListForBoy,
            brandListForGirl,
            brandListForKid,
            brandListForLifeStyle,
            reourceForBoy,
            reourceForGirl,
            reourceForKid,
            reourceForLifeStyle,
            search,
        } = this.props.brand;

        return (
            <View style={styles.container}>
                <Brand
                    isFetching={isFetching}
                    initialListSize={initialListSize}
                    brandChannelFliter= {brandChannelFliter}
                    brandFliter= {brandFliter}
                    brandListForBoy= {brandListForBoy}
                    brandListForGirl= {brandListForGirl}
                    brandListForKid= {brandListForKid}
                    brandListForLifeStyle= {brandListForLifeStyle}
                    reourceForBoy= {reourceForBoy}
                    reourceForGirl={reourceForGirl}
                    reourceForKid={reourceForKid}
                    reourceForLifeStyle={reourceForLifeStyle}
                    onPressFilter= {this._onPressFilter}
                    onPressSlideItem= {this._onPressSlideItem}
                    onChannelPressFliter={this._onChannelPressFliter}
                    showSearch={showSearch}
                    search={search}
                    onPressSearch={this._onPressSearch}
                    onPressClearHistory={this._onPressClearHistory}
                    onClickCancel={this._onClickCancelSearch}
                    onTextChange={this._onSearchTextChange}
                    onPressBrandSearchItem={this._onPressBrandSearchItem}
                    setBrandData={this._setBrandData}
                    setInitialListSize={this._setInitialListSize}
                />
            </View>
        );
    }
}

let styles = StyleSheet.create({
    container: {
        flex: 1,
    },

});

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