/**
 * Created by zack on 2018/4/29.
 */
import {
	View,
	Text,
	StyleSheet,
	TextInput,
	TouchableOpacity
} from 'react-native'
import React, {Component} from 'react'
import {NavigationBarHeight, TabBarHeight, ScreenDimensions} from '../../../utils/DimensionsTools'
import BaseNavigationBarStyle from '../../base/BaseNavigationBarStyle'
import HttpTools from '../../../network/HttpTools'
import {auth, question, comment} from '../../../network/API'

export default class AnswerCreateViewController extends Component {
	static navigatorButtons = {
		leftButtons: [
			{
				title: '取消', // for a textual button, provide the button title (label)
				id: 'cancel', // id for this button, given in onNavigatorEvent(event) to help understand which button was clicked
				buttonColor: '#000000', // Optional, iOS only. Set color for the button (can also be used in setButtons function to set different button style programatically)
				buttonFontSize: 14, // Set font size for the button (can also be used in setButtons function to set different button style programatically)
			},

		],
		rightButtons: [
			{
				title: '发布', // for a textual button, provide the button title (label)
				id: 'submit', // id for this button, given in onNavigatorEvent(event) to help understand which button was clicked
				buttonColor: '#000000', // Optional, iOS only. Set color for the button (can also be used in setButtons function to set different button style programatically)
				buttonFontSize: 14, // Set font size for the button (can also be used in setButtons function to set different button style programatically)
			},

		]
	};

	constructor(props) {
		super(props)
		this.state = {
			questionId: props.questionId,
			title: props.title,
			comment: ''
		}
	}

	componentDidMount() {
		this.props.navigator.setOnNavigatorEvent((event) => {
			if (event.type === 'NavBarButtonPress') { // this is the event type for button presses
				if (event.id === 'cancel') { // this is the same id field from the static navigatorButtons definition
					this.props.navigator.dismissModal()
				}else if (event.id === 'submit') {
					this.submitComment()
				}
			}
		})
	}

	submitComment() {
		if (!this.state.comment.length) {
			alert("请输入你的回答内容")

			return
		}

		const param = JSON.stringify({
			content: this.state.comment,
			model_id: this.state.questionId,
			model_type: "question",
			related_id: ""  //回答这个问题，不需要传递
		})

		HttpTools.post(comment, param, (response) => {

		}, (error) => {

		})

		this.props.navigator.dismissModal()
	}

	render() {
		return(
			<View style={styles.View}>
				<View style={styles.BottomTextView}>
					<Text style={styles.BottomText}>{this.state.title}</Text>>
				</View>

				<TextInput onChangeText={(text) => {
					this.setState({comment: text})
				}} style={styles.TextInput} multiline={true} placeholderTextColor={'#9c9c9c'} placeholder={'分享你的真是观点和经验'}/>
			</View>
		)
	}
}

const styles = StyleSheet.create({
	View: {
		width: ScreenDimensions.width,
		height: ScreenDimensions.height - NavigationBarHeight.height,
		backgroundColor: 'white'
	},
	BottomTextView: {
		width: ScreenDimensions.width,
		marginTop: NavigationBarHeight.height,
		borderBottomWidth: 0.5,
		borderBottomColor: '#efeff4',
		justifyContent: 'center',
		alignItems: 'center'
	},
	BottomText: {
		color: "#505050",
		fontSize: 17,
		textAlign: 'center',
		paddingLeft: 28,
		paddingRight: 28,
		paddingTop: 30,
		paddingBottom: 30,
	},
	TextInput: {
		paddingTop: 14,
		width: ScreenDimensions.width,
		color: "#000000",
		fontSize: 17,
		paddingLeft: 28,
		paddingRight: 28,
		height: 200,
		textAlignVertical: 'top'
	}
})