Commit f53fcfb9 authored by Lidor Cohen's avatar Lidor Cohen

- fix double taggin on quiz

- fix question form css
parent 9e97b18b
......@@ -6,7 +6,7 @@
@import "{}/imports/ui/stylesheets/game-navbar.less";
@import "{}/imports/ui/stylesheets/game-lobby.less";
@import "{}/imports/ui/stylesheets/instructions.less";
@import "{}/imports/ui/stylesheets/create-quiz.less";
@import "{}/imports/ui/stylesheets/quiz-form.less";
@import "{}/imports/ui/stylesheets/quizes.less";
@import "{}/imports/ui/stylesheets/view-quiz.less";
@import "{}/imports/ui/stylesheets/question.less";
......
......@@ -36,57 +36,59 @@ const QuestionForm = ({ question, validate, actions }) => {
changePoints: actions.changeAnswerPoints(question._id),
};
return (
<div className="form-horizontal">
<div className="panel panel-default">
<div className="panel-heading">
<div className="form-group">
<div className="col-lg-8">
<div className={`form-group ${textValidation ? 'has-error' : ''}`}>
<input
name="text"
value={question.text}
className="form-control input-lg"
placeholder="שאל/י שאלה"
onChange={actions.changeQuestionText(question._id)}
/>
{textValidation
? <label className="control-label" htmlFor="text">{textValidation}</label>
: ''}
<div className="question-form">
<div className="form-horizontal">
<div className="panel panel-default">
<div className="panel-heading">
<div className="form-group">
<div className="col-lg-8">
<div className={`form-group ${textValidation ? 'has-error' : ''}`}>
<input
name="text"
value={question.text}
className="form-control input-lg"
placeholder="שאל/י שאלה"
onChange={actions.changeQuestionText(question._id)}
/>
{textValidation
? <label className="control-label" htmlFor="text">{textValidation}</label>
: ''}
</div>
</div>
</div>
<div className="col-lg-3">
<div className={`form-group ${timeValidation ? 'has-error' : ''}`}>
<label htmlFor="time" className="control-label col-lg-6">זמן לשאלה:</label>
<input
className="form-control input-lg col-lg-6"
value={question.time}
onChange={actions.changeQuestionTime(question._id)}
/>
{timeValidation
? <label className="control-label" htmlFor="time">{timeValidation}</label>
: ''}
<div className="col-lg-3">
<div className={`form-group ${timeValidation ? 'has-error' : ''}`}>
<label htmlFor="time" className="control-label col-lg-6">זמן לשאלה:</label>
<input
className="form-control input-lg col-lg-6"
value={question.time}
onChange={actions.changeQuestionTime(question._id)}
/>
{timeValidation
? <label className="control-label" htmlFor="time">{timeValidation}</label>
: ''}
</div>
</div>
<div className="col-lg-1">
<button
className="btn btn-danger btn-lg"
onClick={actions.removeQuestion(question._id)}
>
<span className="glyphicon glyphicon-minus" aria-hidden="true" />
</button>
</div>
</div>
<div className="col-lg-1">
<button
className="btn btn-danger btn-lg"
onClick={actions.removeQuestion(question._id)}
>
<span className="glyphicon glyphicon-minus" aria-hidden="true" />
</button>
</div>
</div>
</div>
<div className="panel-body">
{question.answers.map((a, i) => (
<AnswerForm
key={a._id}
answer={a}
index={i + 1}
validate={validate}
actions={answerActions}
/>
))}
<div className="panel-body">
{question.answers.map((a, i) =>
<AnswerForm
key={a._id}
answer={a}
index={i + 1}
validate={validate}
actions={answerActions}
/>,
)}
</div>
</div>
</div>
</div>
......
......@@ -24,7 +24,7 @@ const QuizForm = ({ quiz, validate, actions }) => {
};
const titleValidation = validate && validateTitle(quiz.title);
return (
<div id="create-quiz">
<div id="quiz-form">
<div className="row">
<div className="col-sm-12">
<div className="page-header">
......
......@@ -107,6 +107,9 @@ class CreateQuiz extends React.Component {
const form = e.target;
const tagName = form.tag.value;
// clear form
form.tag.value = '';
// create new tag
const newTag = {
_id: uuidV4(),
......@@ -116,10 +119,7 @@ class CreateQuiz extends React.Component {
// update state
const quiz = this.state.quiz;
const quiz$ = { ...quiz, tags: [...quiz.tags, newTag] };
this.setState({ quiz: quiz$ });
// clear form
form.tag.value = '';
return quiz.tags.find(t => t.name === tagName) ? 'Nothing' : this.setState({ quiz: quiz$ });
};
const removeTag = id => () => {
......@@ -162,7 +162,11 @@ class CreateQuiz extends React.Component {
saveQuiz,
};
return <QuizForm quiz={this.state.quiz} validate={this.state.validate} actions={actions} />;
return (
<div id="create-quiz">
<QuizForm quiz={this.state.quiz} validate={this.state.validate} actions={actions} />
</div>
);
}
}
......
......@@ -65,6 +65,9 @@ class EditQuiz extends React.Component {
const form = e.target;
const tagName = form.tag.value;
// clear form
form.tag.value = '';
// create new tag
const newTag = {
_id: uuidV4(),
......@@ -74,10 +77,7 @@ class EditQuiz extends React.Component {
// update state
const quiz = this.state.quiz;
const quiz$ = { ...quiz, tags: [...quiz.tags, newTag] };
this.setState({ quiz: quiz$ });
// clear form
form.tag.value = '';
return quiz.tags.find(t => t.name === tagName) ? 'Nothing' : this.setState({ quiz: quiz$ });
};
const removeTag = id => () => {
......
#create-quiz {
#quiz-form {
input.input-title {
height: 80px;
padding: 13px 16px;
......@@ -7,4 +7,11 @@
input.input-title:focus {
outline:none;
}
}
\ No newline at end of file
.question-form {
.form-horizontal .form-group {
margin-left: inherit;
margin-right: inherit;
margin-top: 5px;
}
}
}
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment