import React, { PropTypes, Component } from 'react';
import Answer from './Answer';
import QuestionStatsInLine from './QuestionStatsInline';

export default class Question extends Component {
    static propTypes = {
        question      : PropTypes.object.isRequired,
        userAnswer    : PropTypes.object.isRequired,
        ownPicture    : PropTypes.string.isRequired,
        defaultPicture: PropTypes.string.isRequired,
        last          : PropTypes.bool.isRequired,
        userSlug      : PropTypes.string.isRequired,
        onClickHandler: PropTypes.func,
        graphActive   : PropTypes.bool
    };

    static contextTypes = {
        router: PropTypes.object.isRequired
    };

    constructor(props) {
        super(props);

        this.onClickHandler = this.onClickHandler.bind(this);
        this.goToPreviousPage = this.goToPreviousPage.bind(this);
    }

    goToPreviousPage() {
        const {question, userSlug} = this.props;
        this.context.router.replace(`/answer-question/${question.question.questionId}/${userSlug}`);
    }

    render() {
        let question = this.props.question.question;
        if (!question) {
            return null;
        }
        let {userAnswer} = this.props;
        let answers = question && question.answers.length > 0 ? question.answers : [];
        let userAnswerText = '';

        if (userAnswer) {
            for (let index in answers) {
                if (!answers.hasOwnProperty(index)) {
                    continue;
                }
                if (answers[index].hasOwnProperty('answerId') && answers[index].answerId === userAnswer.answerId) {
                    userAnswerText = answers[index].text;
                }
            }
        }

        return (
            <div className="question" onClick={this.onClickHandler}>
                <a href="javascript:void(0)" onClick={this.goToPreviousPage}>
                    <span className="edit-question-button">
                        <span className="icon-edit"></span>
                    </span>
                </a>
                <div className="question-title">
                    {question.text}
                </div>
                <Answer text={userAnswerText} answered={true} accepted={userAnswer.acceptedAnswers.some(acceptedAnswerId => acceptedAnswerId === userAnswer.answerId)} {...this.props}/>

                {answers.map((answer, index) => {
                    if (answer.answerId === userAnswer.answerId) {
                        return null;
                    }
                    return (
                        <Answer key={index} text={answer.text} answered={false} accepted={userAnswer.acceptedAnswers.some(acceptedAnswerId => acceptedAnswerId === answer.answerId)} {...this.props}/>
                    );
                })}
                {this.props.graphActive ?
                    <QuestionStatsInLine question={question} userAnswer={userAnswer}/> : ''
                }
                <hr/>
            </div>
        );
    }

    onClickHandler() {
        this.props.onClickHandler(this.props.question.question.questionId);
    }
}

@@ -1315,427 +1315,8 @@
  %5B%5D;
-%0A        let userAnswerText = '';%0A%0A        if (userAnswer) %7B%0A            for (let index in answers) %7B%0A                if (!answers.hasOwnProperty(index)) %7B%0A                    continue;%0A                %7D%0A                if (answers%5Bindex%5D.hasOwnProperty('answerId') && answers%5Bindex%5D.answerId === userAnswer.answerId) %7B%0A                    userAnswerText = answers%5Bindex%5D.text;%0A                %7D%0A            %7D%0A        %7D
 %0A%0A  
@@ -1774,178 +1774,92 @@
     
-%3CAnswer text=%7BuserAnswerText%7D answered=%7Btrue%7D accepted=%7BuserAnswer.acceptedAnswers.some(acceptedAnswerId =%3E acceptedAnswerId === userAnswer.answerId)%7D %7B...this.props%7D/%3E%0A%0A
+%7Banswers.map((answer, index) =%3E%0A                    %3CAnswer key=%7Bindex%7D%0A            
     
@@ -1874,41 +1874,26 @@
     
+text=
 %7Banswer
-s.map((answer, index) =%3E %7B
+.text%7D
 %0A   
@@ -1909,20 +1909,34 @@
         
-if (
+        answered=%7B
 answer.a
@@ -1970,179 +1970,37 @@
 erId
-) %7B%0A                        return null;%0A                    %7D%0A                    return (%0A                        %3CAnswer key=%7Bindex%7D text=%7Banswer.text%7D answered=%7Bfalse%7D
+%7D%0A                           
  acc
@@ -2096,16 +2096,44 @@
 swerId)%7D
+%0A                           
  %7B...thi
@@ -2140,18 +2140,16 @@
 s.props%7D
-/%3E
 %0A       
@@ -2157,26 +2157,26 @@
             
-);
+/%3E
 %0A           
@@ -2180,17 +2180,16 @@
         
-%7D
 )%7D%0A     

Fix answers order