'use strict';

import React from 'react';
import ReactNative from 'react-native';
import Immutable, {Map} from 'immutable';


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

import User from '../components/user/User';
import {Actions} from 'react-native-router-flux';

import * as userActions from '../reducers/user/userActions';
import * as homeActions from '../reducers/home/homeActions';

import {shouldShowTabBar, shouldHideTabBar} from '../utils/tabBar';


const {
    StatusBar,
    ScrollView,
    View,
    StyleSheet,
    Dimensions,
    Platform,
    ActionSheetIOS,
    NativeModules,
    InteractionManager,
    NativeAppEventEmitter,
} = ReactNative;
let YH_CommunityAssetsPicker = NativeModules.YH_CommunityAssetsPicker;

let PickerType = {
    Avatar: 0,
    Bg: 1,
}

let SourceType = {
    UIImagePickerControllerSourceTypePhotoLibrary: 0,
    UIImagePickerControllerSourceTypeCamera: 1,
}

const actions = [
    userActions,
    homeActions,
];

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 UserContainer extends React.Component {
    constructor(props) {
        super(props);

        this._onPressUserAvatar = this._onPressUserAvatar.bind(this);
        this._onPressGotoSettingState = this._onPressGotoSettingState.bind(this);
        this._onPressAvatar = this._onPressAvatar.bind(this);
        this._onPressComment = this._onPressComment.bind(this);
        this._onPressLike = this._onPressLike.bind(this);
        this._onRefresh = this._onRefresh.bind(this);
        this._onPressPost = this._onPressPost.bind(this);
        this._onEndReached = this._onEndReached.bind(this);
        this._rightButtonClick = this._rightButtonClick.bind(this);
        this._onPressSectionTag = this._onPressSectionTag.bind(this);
        this._onBack = this._onBack.bind(this);
    }

    componentDidMount() {
        if (shouldHideTabBar(this.props.navigationState)) {
            NativeModules.YH_CommunityHelper.hideTabBar();
        }
        this.observer = NativeAppEventEmitter.addListener('UserImagePickerEvent',(event)=>{
            console.log(event);
            switch (event.pickerType) {
                case PickerType.Avatar:
                    this.props.actions.uploadAvatar(event.assetURL);
                    break;
                case PickerType.Bg:
                    this.props.actions.uploadBg(event.assetURL);
                    break;
                default:

            }
        })
    }

    componentWillUnmount() {
        this.props.actions.userClean();
        this.observer && this.observer.remove();
    }

    _onBack() {
        Actions.pop();
        if (shouldShowTabBar(this.props.navigationState)) {
            ReactNative.NativeModules.YH_CommunityHelper.showTabBar();
        }
    }

    // private method
    _onPressAvatar(url) {
        console.log('avatar');
    }

    _onPressComment(id) {
        console.log('comment');
        this.props.actions.goToPost(id);
    }

    _onPressLike(post) {
        console.log('like');
        this.props.actions.likeOperation(post);
    }

    _onPressReply(id) {
        console.log('reply=======');
    }

    _onPressPost(id) {
        console.log('posts id =' + id);
        this.props.actions.goToPost(id);
    }

    _onPressSectionTag(section) {
        this.props.actions.goToSection(section, this.props.navigationState.name);
    }

    _onPressUserAvatar() {

        const BUTTONS = ['拍照', '从相册选择', '编辑个人资料', '取消'];
        ActionSheetIOS.showActionSheetWithOptions({
            options: BUTTONS,
            cancelButtonIndex: 3,
        },

        (buttonIndex) => {
            this._onPressGotoSettingState(buttonIndex);
        });


    }

    _onPressGotoSettingState(buttonIndex) {
        console.log('go to setting state');
        switch (buttonIndex) {
            case 0:
            {
                console.log('拍照');
                YH_CommunityAssetsPicker.userImagePicker(PickerType.Avatar,SourceType.UIImagePickerControllerSourceTypeCamera);
            }
            break;
            case 1:
            {
                console.log('从相册中选择');
                YH_CommunityAssetsPicker.userImagePicker(PickerType.Avatar,SourceType.UIImagePickerControllerSourceTypePhotoLibrary);
            }
            break;
            case 2:
            {
                console.log('编辑个人资料');
                // console.log('actions = ' + this.actions);
                this.props.actions.goToStatsPage(GO_TO_SETTING);

            }
            break;
            default:
        }
    }

    _onPressBackgroundImg() {
        const BUTTONS = ['拍照', '从相册选择', '取消'];
        ActionSheetIOS.showActionSheetWithOptions({
            options: BUTTONS,
            cancelButtonIndex: 2,
        },
        (buttonIndex) => {
            switch (buttonIndex) {
                case 0:
                {
                    console.log('拍照');
                    YH_CommunityAssetsPicker.userImagePicker(PickerType.Bg,SourceType.UIImagePickerControllerSourceTypeCamera);
                }
                break;
                case 1:
                {
                    console.log('从相册中选择');
                    YH_CommunityAssetsPicker.userImagePicker(PickerType.Bg,SourceType.UIImagePickerControllerSourceTypePhotoLibrary);
                }
                break;
                default:
            }
        });
    }

    _onRefresh() {
        InteractionManager.runAfterInteractions(() => {
            this.props.actions.posts(true);
            this.props.actions.like(true);
            this.props.actions.reply(true);
            this.props.actions.unread();
        });
    }

    _onEndReached(page) {
        InteractionManager.runAfterInteractions(() => {
            this.props.actions.setActiveTab(page);
            if (page === 0) {
                console.log('on end reached page = 0');
                this.props.actions.posts(false);
            } else if (page === 1) {
                console.log('on end reached page = 1');
                this.props.actions.like(false);
            } else if (page === 2) {
                console.log('on end reached page = 2');
                this.props.actions.reply(false);
            }
        });
    }

    _rightButtonClick() {
        console.log('message clicked-----------');
        this.props.actions.goToMessageCenter();
    }

    render() {
        console.log(this.props);
        let {profile, activeTab, isFetching, ptr, posts: postsData, like: likeData, reply: replyData} = this.props.user;
        let listData = Immutable.fromJS([{posts: postsData.list, like: likeData.list, reply: replyData.list}]);
        let isRefreshing = ptr;
        let userInfo = Immutable.fromJS([profile]);
        let isLoadingMore, endReached;

        if (activeTab === 0) {
            isLoadingMore = !ptr && postsData.isFetching;
            isFetching = postsData.isFetching;
            endReached = postsData.endReached;
        } else if (activeTab === 1) {
            isLoadingMore = !ptr && likeData.isFetching;
            isFetching = likeData.isFetching;
            endReached = likeData.endReached;
        } else if (activeTab === 2) {
            isLoadingMore = !ptr && replyData.isFetching;
            isFetching = replyData.isFetching;
            endReached = replyData.endReached;
        }

        console.log('isRefreshing=====>' + isRefreshing);
        console.log('endReached=====>' + endReached);
        console.log('isLoadingMore=====>' + isLoadingMore);
        console.log('isFetching=====>' + isFetching);
        return (
            <View style={styles.container}>
                <User
                    channel={this.props.app.channel}
                    userInfo={userInfo}
                    profile={profile}
                    list={listData}
                    onPressAvatar={this._onPressAvatar}
                    onPressComment={this._onPressComment}
                    onPressLike={this._onPressLike}
                    onPressReply={this._onPressReply}
                    onPressPost={this._onPressPost}
                    onPressSectionTag={this._onPressSectionTag}
                    onPressUserAvatar={this._onPressUserAvatar}
                    onPressBackgroundImg={this._onPressBackgroundImg}
                    onRefresh={this._onRefresh}
                    isFetching={isFetching}
                    ptr={ptr}
                    endReached={endReached}
                    isRefreshing={isRefreshing}
                    isLoadingMore={isLoadingMore}
                    onEndReached={this._onEndReached}
                    rightButtonClick={this._rightButtonClick}
                    onBack={this._onBack}
                />
            </View>
        );
    }

}

let {width, height} = Dimensions.get('window');
let navbarHeight = (Platform.OS === 'android') ? 50 : 64;

let styles = StyleSheet.create({
    container: {
        // top: 0,
        height: height,
        backgroundColor: 'transparent'
    },

});

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