{% extends "manage.html" %}


{% block subtitle %}Add Question{% endblock %}

{% block css %}
<link rel="stylesheet" href="{{ URL_ROOT }}/static/exam/css/question_quiz.css" type="text/css" /> 
{% endblock %}

{% block script %}
<script type="text/javascript" src="{{ URL_ROOT }}/static/exam/css/min.js"></script>
<script type="text/javascript">

function increase(frm)
{
	if(frm.points.value == "")
	{
		frm.points.value = "0.5";
		return;
	}
	frm.points.value = parseFloat(frm.points.value) + 0.5;
}

function decrease(frm)
{
	if(frm.points.value > 0)
	{
		frm.points.value = parseFloat(frm.points.value) - 0.5;
	}
	else
	{
		frm.points.value=0;
	}

	
}

function textareaformat()
{

	document.getElementById('id_type').setAttribute('class','select-type');
	
	document.getElementById('id_points').setAttribute('class','mini-text');

	$('#id_description').bind('focus', function( event ){
         document.getElementById("id_description").rows=5;
         document.getElementById("id_description").cols=40;
      });

	$('#id_description').bind('blur', function( event ){
         document.getElementById("id_description").rows=1;
         document.getElementById("id_description").cols=40;
      });
	
	$('#id_description').bind('keypress', function (event){
		document.getElementById('my').innerHTML = document.getElementById('id_description').value ;
	});

	$('#id_test').bind('focus', function( event ){
         document.getElementById("id_test").rows=5;
         document.getElementById("id_test").cols=40;
      });

	$('#id_test').bind('blur', function( event ){
         document.getElementById("id_test").rows=1;
         document.getElementById("id_test").cols=40;
      });
	$('#id_options').bind('focus', function( event ){
         document.getElementById("id_options").rows=5;
         document.getElementById("id_options").cols=40;
      });

	$('#id_options').bind('blur', function( event ){
         document.getElementById("id_options").rows=1;
         document.getElementById("id_options").cols=40;
      });
	
	$('#id_type').bind('change',function(event){
		var value = document.getElementById('id_type').value;
		if(value == 'mcq')
		{
			document.getElementById('id_options').style.visibility='visible';
			document.getElementById('label_option').innerHTML="Options :"

		}
		else
		{
			document.getElementById('id_options').style.visibility='hidden';
			document.getElementById('label_option').innerHTML = "";
		}
	});

		document.getElementById('my').innerHTML = document.getElementById('id_description').value ;
		var value = document.getElementById('id_type').value;
		if(value == 'mcq')
		{
			document.getElementById('id_options').style.visibility='visible';
			document.getElementById('label_option').innerHTML="Options :"

		}
		else
		{
			document.getElementById('id_options').style.visibility='hidden';
			document.getElementById('label_option').innerHTML = "";
		}	
}

function autosubmit()
{
	if (document.getElementById('id_type').value == 'mcq')
	{
		var value = document.getElementById('id_options').value;
		if(value.split('\n').length != 4)
		{
			alert("Enter 4 options. One option per line.");
			return false;
		}
		return true;
	}

}
</script>
{% endblock %}

{% block onload %} onload='javascript:textareaformat();' {% endblock %}

{% block manage %}
<form action="" method="post" name=frm onSubmit="return autosubmit();">
  {% csrf_token %}
  <center><table class=span1>
  <tr><td>Summary: <td>{{ form.summary }}{{ form.summary.errors }}
  <tr><td>Points:<td><button class="btn-mini" type="button" onClick="increase(frm);">+</button>{{ form.points }}<button class="btn-mini" type="button" onClick="decrease(frm);"">-</button>{{ form.points.errors }} &nbsp; Active: &nbsp; {{ form.active }}{{form.active.errors}} &nbsp; Type: &nbsp;{{ form.type }}{{form.type.errors}}
  <tr><td><strong>Rendered: </strong><td><p id='my'></p>
  <tr><td>Description: <td>{{ form.description}}  {{form.description.errors}}
  <tr><td>Test: <td>{{ form.test }}{{form.test.errors}}
  <tr><td id='label_option'>Options: <td>{{ form.options }}  {{form.options.errors}}
  </table></center>
  <center><button class="btn" type="submit" name="savequestion">Save</button>
  <button class="btn" type="button" name="button" onClick='location.replace("{{URL_ROOT}}/exam/manage/questions/");'>Cancel</button> </center>
</form>
{% endblock %}