diff options
-rw-r--r-- | testapp/static/exam/js/question.js | 29 | ||||
-rw-r--r-- | testapp/templates/exam/question.html | 18 |
2 files changed, 39 insertions, 8 deletions
diff --git a/testapp/static/exam/js/question.js b/testapp/static/exam/js/question.js index cb6807e..2bf6f60 100644 --- a/testapp/static/exam/js/question.js +++ b/testapp/static/exam/js/question.js @@ -58,6 +58,17 @@ function replaceSelection (input, replaceString) } } +function autoresize() +{ + var ta = document.getElementById('answer'); + var divta = document.getElementById('AnswerWithLines'); + ta.style.height=""; + var height = ta.scrollHeight; + ta.style.height = 'auto'; + ta.style.height = height+'px'; + divta.style.height = height+'px'; +} + function catchTab(item,e) { if(navigator.userAgent.match("Gecko")) @@ -76,7 +87,7 @@ function catchTab(item,e) } } -var lineObjOffsetTop = 2; +var lineObjOffsetTop = 0; function addLineNumbers(id) { @@ -85,19 +96,20 @@ function addLineNumbers(id) var content = document.getElementById('snippet').value; ta.parentNode.insertBefore(el,ta); el.appendChild(ta); - el.className='textAreaWithLines'; el.style.width = (ta.offsetWidth + 30) + 'px'; ta.style.position = 'absolute'; ta.style.left = '30px'; - el.style.height = (ta.offsetHeight + 2) + 'px'; + ta.scrollHeight="" + el.style.border = 'none'; el.style.overflow='hidden'; el.style.position = 'relative'; el.style.width = (ta.offsetWidth + 30) + 'px'; var lineObj = document.createElement('DIV'); lineObj.style.position = 'absolute'; lineObj.style.top = lineObjOffsetTop + 'px'; - lineObj.style.left = '0px'; lineObj.style.width = '27px'; + lineObj.style.fontSize= '18px'; + lineObj.style.foregroundColor='black'; el.insertBefore(lineObj,ta); lineObj.style.textAlign = 'right'; lineObj.className='lineObj'; @@ -105,6 +117,10 @@ function addLineNumbers(id) split_content = content.split('\n'); if(id == "answer") { + el.className='AnswerWithLines'; + el.id='AnswerWithLines'; + el.style.height = (ta.scrollHeight) + 'px'; + for(var no=split_content.length+1;no<1000;no++) { if(string.length>0)string = string + '<br>'; @@ -113,6 +129,10 @@ function addLineNumbers(id) } else { + el.className='SnippetWithLines'; + el.id='SnippetWithLines'; + el.style.height = (ta.scrollHeight) + 'px'; + for(var no=1;no<=split_content.length;no++) { if(string.length>0)string = string + '<br>'; @@ -124,6 +144,7 @@ function addLineNumbers(id) ta.onblur = function() { positionLineObj(lineObj,ta); }; ta.onfocus = function() { positionLineObj(lineObj,ta); }; ta.onmouseover = function() { positionLineObj(lineObj,ta); }; + ta.onkeyup = function(){autoresize();}; lineObj.innerHTML = string; } diff --git a/testapp/templates/exam/question.html b/testapp/templates/exam/question.html index 529b620..c8454ff 100644 --- a/testapp/templates/exam/question.html +++ b/testapp/templates/exam/question.html @@ -39,12 +39,22 @@ function update_time() document.forms["code"].submit(); } } + +function setSnippetHeight() +{ + var ta = document.getElementById('snippet'); + var height = ta.scrollHeight+'px'; + ta.style.height = 'auto'; + ta.style.height = height; + autoresize(); +} + </script> {% endblock script %} -{% block onload %} onload="update_time()" {% endblock %} +{% block onload %} onload="update_time();setSnippetHeight()" {% endblock %} {% block pagetitle %} @@ -98,15 +108,15 @@ function update_time() {% endfor %} {% else %} - <textarea tabindex=1 rows="3" style="width:750px;margin-bottom:15px;height:auto;" readonly=yes name="snippet" id="snippet" wrap="off">{% if last_attempt %}{{ question.snippet }}{% else %}{% if question.type == "bash" %} #!/bin/bash {{ question.snippet }}{% else %}{{ question.snippet }}{% endif %}{% endif %}</textarea> + <textarea rows="1" style="padding:0;height:auto;width:750px;overflow:hidden;background-color:white;border: 0 none white;" readonly="yes" name="snippet" id="snippet" wrap="off">{% if last_attempt %}{{ question.snippet }}{% else %}{% if question.type == "bash" %} #!/bin/bash {{ question.snippet }}{% else %}{{ question.snippet }}{% endif %}{% endif %}</textarea> - <textarea tabindex=1 rows="10" style="width:750px;margin-bottom:10px;" name="answer" id="answer" wrap="off" onkeydown="return catchTab(this,event)">{% if last_attempt %}{{last_attempt}}{% else %}{% if question.type == "bash" %}{% else %}{% endif %}{% endif %}</textarea> + <textarea tabindex=1 rows="10" style="padding:0;height:auto; box-shadow: none;width:750px;margin-bottom:10px;overflow:hidden;border:none;" name="answer" id="answer" wrap="off" onkeydown="return catchTab(this,event)">{% if last_attempt %}{{last_attempt}}{% else %}{% if question.type == "bash" %}{% else %}{% endif %}{% endif %}</textarea> <br> <script type="text/javascript"> addLineNumbers('answer'); </script> - <script>addLineNumbers('snippet');</Script> + <script>addLineNumbers('snippet');</script> {% endif %} {% if question.type == "mcq" %} |