Commit 4c0de3c98d6f266d1984a86caf4ecf3d2b3f7894

Authored by juliotoscano
1 parent 990646cb

modifying modal-exam for panel-exam #362

courses/templates/subject/create.html
... ... @@ -4,7 +4,7 @@
4 4  
5 5 {% block breadcrumbs %}
6 6 {{ block.super }}
7   - {% breadcrumb 'Create subject' 'course:create_subject' %}
  7 + {% breadcrumb 'Create subject' 'course:create_subject' %}
8 8 {% endblock breadcrumbs %}
9 9  
10 10 {% block content %}
... ...
courses/templates/subject/form_view_teacher.html
... ... @@ -103,7 +103,7 @@
103 103 <li><a href="javascript:createForum('{% url 'course:forum:create' %}', '{{ topic.id }}')">{% trans 'Create Forum' %}</a></li>
104 104 <li><a href="javascript:modal.get('{% url 'course:poll:create_poll' topic.slug%}','#poll','#requisicoes_ajax');">{% trans 'Create Poll' %}</a></li>
105 105 <li><a href="javascript:modal.get('{% url 'course:exercise:create_exercise' topic.slug %}', '#createExercisesModal','#requisicoes_ajax')">{% trans 'Delivery Material' %}</a></li>
106   - <li><a href="javascript:modal.get('{% url 'course:exam:create_exam' topic.slug%}','#exam','#requisicoes_ajax');">{% trans 'Create exam' %}</a></li>
  106 + <li><a href="{% url 'course:exam:create_exam' topic.slug %}">{% trans 'Create exam' %}</a></li>
107 107 </ul>
108 108 </div>
109 109 </div>
... ...
exam/static/js/Exam.js 0 → 100644
... ... @@ -0,0 +1,146 @@
  1 +//Insert Create select with question type
  2 + var idQuestionType = 1;
  3 + $("#addQuestion").on("click", function(event){
  4 + var element =
  5 + '<div class="row form-group" id="questionType_' + idQuestionType +'">' +
  6 + '<label for="questionType" class="col-md-2 control-label">' +
  7 + '{% trans "Question Type" %}</label>' + '<div class="col-md-10">' +
  8 + '<select id="questionType'+ idQuestionType +'" class="form-control" name="option_question" onchange="showDiv (this, '+ idQuestionType +')">' +
  9 + '<option selected disabled>{% trans "Question Type" %}</option>' +
  10 + '<option value="0">{% trans "Multiple Choice" %}</option>' +
  11 + '<option value="1">{% trans "True or False" %}</option>' +
  12 + '<option value="2">{% trans "Gap Filling" %}</option>' +
  13 + '<option value="3">{% trans "Discursive Question" %}</option>' +
  14 + '</select>' +
  15 + '</div>' +
  16 + '</div>' + '<hr id="hr_'+idQuestionType+'">'
  17 + ;
  18 + if (idQuestionType == 1){
  19 + $(element).insertAfter('#buttonAddQuestion');
  20 + }else{
  21 + var idhr = '#hr_'+(idQuestionType-1);
  22 + $(element).insertAfter(idhr);
  23 + }
  24 + idQuestionType++;
  25 + })
  26 +
  27 + //Insert question choice
  28 + function showDiv (elem, questionType_id) {
  29 + if (elem.value == 0) {
  30 + var questionChoice =
  31 + '<div id="questionChoice_'+questionType_id+'">' +
  32 + '<div class="row form-group">'+
  33 + '<label for="question-name" class="col-md-2 control-label">Question</label>'+
  34 + '<div class="col-md-10">'+
  35 + '<textarea class="form-control" rows="1" id="question-name" placeholder="Wording"></textarea>'+
  36 + '</div>'+
  37 + '</div>'+
  38 + '<div class="row form-group">'+
  39 + '<label for="alternatives" class="col-md-2 control-label">Alternatives</label>'+
  40 + '<div class="col-md-10" id="radios_'+questionType_id+'">'+
  41 + '<div class="radio radio-primary form-group">'+
  42 + '<label>'+
  43 + '<input checked type="radio" name="multiple-choice" id="alternative1" value="1">'+
  44 + '<textarea class="form-control" rows="1" placeholder="Write your alternative"></textarea>'+
  45 + '</label>'+
  46 + '</div>'+
  47 + '<div class="radio radio-primary form-group">'+
  48 + '<label>'+
  49 + '<input type="radio" name="multiple-choice" id="alternative2" value="2">'+
  50 + '<textarea class="form-control" rows="1" placeholder="Write your alternative"></textarea>'+
  51 + '</label>'+
  52 + '</div>'+
  53 + '</div>'+
  54 + '</div>'+
  55 + '<div class="row form-group">'+
  56 + '<button type="button" class="btn btn-raised btn-primary" id="newAlternative_'+questionType_id+'" onclick="functionNewAlternative(radios_'+questionType_id+')">New Alternative</button>'+
  57 + '</div>'+
  58 + '</div>';
  59 + } else if (elem.value == 1) {
  60 + var questionChoice =
  61 + '<div id="questionChoice_'+questionType_id+'">'+
  62 + '<div class="row form-group">'+
  63 + '<label for="question-name" class="col-md-2 control-label">Question True or False</label>'+
  64 + '<div class="col-md-10">'+
  65 + '<textarea class="form-control" rows="1" id="question-name" placeholder="Wording"></textarea>'+
  66 + '</div>'+
  67 + '</div>'+
  68 + '<div class="row form-group">'+
  69 + '<label for="alternative" class="col-md-2 control-label">Alternatives: T/F</label>'+
  70 + '<div class="col-md-10" id="radiosTF_'+questionType_id+'">'+
  71 + '<div class="radio form-group" value="1">'+
  72 + '<div class="radio">'+
  73 + '<label>'+
  74 + '<textarea class="form-control" rows="1" placeholder="Write your alternative"></textarea>'+
  75 + '</label>'+
  76 + '<label>'+
  77 + '<input type="radio" name="true-or-false-1" value="T">'+
  78 + '</label>'+
  79 + '<label>'+
  80 + '<input type="radio" name="true-or-false-1" value="F">'+
  81 + '</label>'+
  82 + '</div>'+
  83 + '</div>'+
  84 + '<div class="radio form-group" value="2">'+
  85 + '<label>'+
  86 + '<textarea class="form-control" rows="1" placeholder="Write your alternative"></textarea>'+
  87 + '</label>'+
  88 + '<label>'+
  89 + '<input type="radio" name="true-or-false-2" value="T">'+
  90 + '</label>'+
  91 + '<label>'+
  92 + '<input type="radio" name="true-or-false-2" value="F">'+
  93 + '</label>'+
  94 + '</div>'+
  95 + '</div>'+
  96 + '</div>'+
  97 + '<div class="row form-group">'+
  98 + '<button type="button" class="btn btn-raised btn-primary" id="newAlternative_'+questionType_id+'" onclick="functionNewAlternativeTF(radiosTF_'+questionType_id+')">New Alternative</button>'+
  99 + '</div>'+
  100 + '</div>';
  101 + } else if (elem.value == 3) {
  102 + var questionChoice =
  103 + '<div id="questionChoice_'+questionType_id+'">'+
  104 + '<div class="row form-group">'+
  105 + '<label for="question-name" class="col-md-2 control-label">Name Question discursive</label>'+
  106 + '<div class="col-md-10">'+
  107 + '<textarea class="form-control" rows="2" id="question" placeholder="Wording"></textarea>'+
  108 + '</div>'+
  109 + '</div>'+
  110 + '</div>';
  111 + }
  112 + if(document.getElementById('questionChoice_'+ questionType_id)){
  113 + $('#questionChoice_'+ questionType_id).detach();
  114 + }
  115 + $(questionChoice).insertBefore('#hr_'+questionType_id);
  116 + $.material.init() //O material deve ser iniciado aqui para funcionar os botoes de radio.
  117 + }
  118 +//Bug quando criamos sem ser na ordem
  119 +function functionNewAlternative(Question_Id){
  120 + var alternative = parseInt($("div input").last().val()) + 1;
  121 + var element = '<div class="radio radio-primary form-group">' +
  122 + '<label>' +
  123 + '<input type="radio" name="alternatives" id="alternative_'+alternative+'_'+Question_Id+'"' + 'value="'+alternative+'">' +
  124 + '<textarea class="form-control" rows="1" placeholder="Write your alternative"></textarea>' +
  125 + '</label>'+
  126 + '</div>';
  127 + $(Question_Id).append(element);
  128 + $.material.init() //O material deve ser iniciado aqui para funcionar os botoes de radio.
  129 +}
  130 +function functionNewAlternativeTF(Question_Id){
  131 + var alternative = parseInt($("div").last().val()) + 1;
  132 + var element =
  133 + '<div class="radio form-group">'+
  134 + '<label>'+
  135 + '<textarea class="form-control" rows="1" placeholder="Write your alternative"></textarea>'+
  136 + '</label>'+
  137 + '<label>'+
  138 + '<input type="radio" name="true-or-false-2" value="T">'+
  139 + '</label>'+
  140 + '<label>'+
  141 + '<input type="radio" name="true-or-false-2" value="F">'+
  142 + '</label>'+
  143 + '</div>';
  144 + $(Question_Id).append(element);
  145 + $.material.init() //O material deve ser iniciado aqui para funcionar os botoes de radio.
  146 +}
0 147 \ No newline at end of file
... ...
exam/static/js/modalExam.js
... ... @@ -1,147 +0,0 @@
1   -
2   -//Insert Create select with question type
3   - var idQuestionType = 1;
4   - $("#addQuestion").on("click", function(event){
5   - var element =
6   - '<div class="row form-group" id="questionType_' + idQuestionType +'">' +
7   - '<label for="questionType" class="col-md-2 control-label">' +
8   - '{% trans "Question Type" %}</label>' + '<div class="col-md-10">' +
9   - '<select id="questionType'+ idQuestionType +'" class="form-control" name="option_question" onchange="showDiv (this, '+ idQuestionType +')">' +
10   - '<option selected disabled>{% trans "Question Type" %}</option>' +
11   - '<option value="0">{% trans "Multiple Choice" %}</option>' +
12   - '<option value="1">{% trans "True or False" %}</option>' +
13   - '<option value="2">{% trans "Gap Filling" %}</option>' +
14   - '<option value="3">{% trans "Discursive Question" %}</option>' +
15   - '</select>' +
16   - '</div>' +
17   - '</div>' + '<hr id="hr_'+idQuestionType+'">'
18   - ;
19   - if (idQuestionType == 1){
20   - $(element).insertAfter('#buttonAddQuestion');
21   - }else{
22   - var idhr = '#hr_'+(idQuestionType-1);
23   - $(element).insertAfter(idhr);
24   - }
25   - idQuestionType++;
26   - })
27   -
28   - //Insert question choice
29   - function showDiv (elem, questionType_id) {
30   - if (elem.value == 0) {
31   - var questionChoice =
32   - '<div id="questionChoice_'+questionType_id+'">' +
33   - '<div class="row form-group">'+
34   - '<label for="question-name" class="col-md-2 control-label">Question</label>'+
35   - '<div class="col-md-10">'+
36   - '<textarea class="form-control" rows="1" id="question-name" placeholder="Wording"></textarea>'+
37   - '</div>'+
38   - '</div>'+
39   - '<div class="row form-group">'+
40   - '<label for="alternatives" class="col-md-2 control-label">Alternatives</label>'+
41   - '<div class="col-md-10" id="radios_'+questionType_id+'">'+
42   - '<div class="radio radio-primary form-group">'+
43   - '<label>'+
44   - '<input checked type="radio" name="multiple-choice" id="alternative1" value="1">'+
45   - '<textarea class="form-control" rows="1" placeholder="Write your alternative"></textarea>'+
46   - '</label>'+
47   - '</div>'+
48   - '<div class="radio radio-primary form-group">'+
49   - '<label>'+
50   - '<input type="radio" name="multiple-choice" id="alternative2" value="2">'+
51   - '<textarea class="form-control" rows="1" placeholder="Write your alternative"></textarea>'+
52   - '</label>'+
53   - '</div>'+
54   - '</div>'+
55   - '</div>'+
56   - '<div class="form-group">'+
57   - '<button type="button" class="btn btn-raised btn-primary" id="newAlternative_'+questionType_id+'" onclick="functionNewAlternative(radios_'+questionType_id+')">New Alternative</button>'+
58   - '</div>'+
59   - '</div>';
60   - } else if (elem.value == 1) {
61   - var questionChoice =
62   - '<div id="questionChoice_'+questionType_id+'">'+
63   - '<div class="row form-group">'+
64   - '<label for="question-name" class="col-md-2 control-label">Question True or False</label>'+
65   - '<div class="col-md-10">'+
66   - '<textarea class="form-control" rows="1" id="question-name" placeholder="Wording"></textarea>'+
67   - '</div>'+
68   - '</div>'+
69   - '<div class="row form-group">'+
70   - '<label for="alternative" class="col-md-2 control-label">Alternatives: T/F</label>'+
71   - '<div class="col-md-10" id="radiosTF_'+questionType_id+'">'+
72   - '<div class="radio form-group" value="1">'+
73   - '<div class="radio">'+
74   - '<label>'+
75   - '<textarea class="form-control" rows="1" placeholder="Write your alternative"></textarea>'+
76   - '</label>'+
77   - '<label>'+
78   - '<input type="radio" name="true-or-false-1" value="T">'+
79   - '</label>'+
80   - '<label>'+
81   - '<input type="radio" name="true-or-false-1" value="F">'+
82   - '</label>'+
83   - '</div>'+
84   - '</div>'+
85   - '<div class="radio form-group" value="2">'+
86   - '<label>'+
87   - '<textarea class="form-control" rows="1" placeholder="Write your alternative"></textarea>'+
88   - '</label>'+
89   - '<label>'+
90   - '<input type="radio" name="true-or-false-2" value="T">'+
91   - '</label>'+
92   - '<label>'+
93   - '<input type="radio" name="true-or-false-2" value="F">'+
94   - '</label>'+
95   - '</div>'+
96   - '</div>'+
97   - '</div>'+
98   - '<div class="form-group">'+
99   - '<button type="button" class="btn btn-raised btn-primary" id="newAlternative_'+questionType_id+'" onclick="functionNewAlternativeTF(radiosTF_'+questionType_id+')">New Alternative</button>'+
100   - '</div>'+
101   - '</div>';
102   - } else if (elem.value == 3) {
103   - var questionChoice =
104   - '<div id="questionChoice_'+questionType_id+'">'+
105   - '<div class="row form-group">'+
106   - '<label for="question-name" class="col-md-2 control-label">Name Question discursive</label>'+
107   - '<div class="col-md-10">'+
108   - '<textarea class="form-control" rows="2" id="question" placeholder="Wording"></textarea>'+
109   - '</div>'+
110   - '</div>'+
111   - '</div>';
112   - }
113   - if(document.getElementById('questionChoice_'+ questionType_id)){
114   - $('#questionChoice_'+ questionType_id).detach();
115   - }
116   - $(questionChoice).insertBefore('#hr_'+questionType_id);
117   - $.material.init() //O material deve ser iniciado aqui para funcionar os botoes de radio.
118   - }
119   -//Bug quando criamos sem ser na ordem
120   -function functionNewAlternative(Question_Id){
121   - var alternative = parseInt($("div input").last().val()) + 1;
122   - var element = '<div class="radio radio-primary form-group">' +
123   - '<label>' +
124   - '<input type="radio" name="alternatives" id="alternative_'+alternative+'_'+Question_Id+'"' + 'value="'+alternative+'">' +
125   - '<textarea class="form-control" rows="1" placeholder="Write your alternative"></textarea>' +
126   - '</label>'+
127   - '</div>';
128   - $(Question_Id).append(element);
129   - $.material.init() //O material deve ser iniciado aqui para funcionar os botoes de radio.
130   -}
131   -function functionNewAlternativeTF(Question_Id){
132   - var alternative = parseInt($("div").last().val()) + 1;
133   - var element =
134   - '<div class="radio form-group">'+
135   - '<label>'+
136   - '<textarea class="form-control" rows="1" placeholder="Write your alternative"></textarea>'+
137   - '</label>'+
138   - '<label>'+
139   - '<input type="radio" name="true-or-false-2" value="T">'+
140   - '</label>'+
141   - '<label>'+
142   - '<input type="radio" name="true-or-false-2" value="F">'+
143   - '</label>'+
144   - '</div>';
145   - $(Question_Id).append(element);
146   - $.material.init() //O material deve ser iniciado aqui para funcionar os botoes de radio.
147   -}
148 0 \ No newline at end of file
exam/templates/exam/create.html
  1 +{% extends 'subject/index.html' %}
1 2  
2   -{% load i18n widget_tweaks dict_access static%}
  3 +{% load i18n widget_tweaks static django_bootstrap_breadcrumbs %}
3 4  
4   -{# {% block style %} #}
5   - <script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script>
6   - <script src="{% static 'js/modalExam.js' %}"></script>
7   - <!-- Init material Bootstrap -->
8   - <script type="text/javascript">$.material.init()</script><!-- O botao radio volta a funcionar quando coloco essa função-->
9   -{# {% endblock %} #}
  5 +{% block breadcrumbs %}
  6 + {{ block.super }}
  7 + {% breadcrumb 'Create exam' 'course:create_exam' %}
  8 +{% endblock breadcrumbs %}
10 9  
11 10 {% block content %}
12   -<!-- Modal (remember to change the ids!!!) -->
13   -<div class="modal fade" id="exam" tabindex="-1" role="dialog" aria-labelledby="myModalLabel">
14   - <div class="modal-dialog" role="document">
15   - <div class="modal-content">
16   -
17   - <!-- Modal Header -->
18   - <div class="modal-header">
19   -
20   - {% block title_exam %}
21   - <!-- Put your title here!!! -->
22   - <h4 class="modal-title" id="myModalLabel">{% trans "Create a Exam" %}</h4>
23   - {% endblock title_exam %}
  11 +<div class="panel panel-primary">
  12 + <div class="panel-heading">
  13 + <h4 class="panel-title" id="exam-title">{% trans "Create a Exam" %}</h4>
  14 + </div>
  15 + <div class="panel-body">
  16 + <div class="row form-group">
  17 + <label for="exam_name" class="col-md-2 control-label">{% trans "Exam Name" %}</label>
  18 + <div class="col-md-10">
  19 + <input type="text" name="exam_name" class="form-control" id="exam_name" placeholder="{% trans 'Exam Name' %}">
24 20 </div>
25   - <!-- Modal Body -->
26   - <div class="modal-body">
27   -
28   - {% block content_exam %}
29   -
30   - <div class="panel-body">
31   - <div class="row form-group">
32   - <label for="exam_name" class="col-md-2 control-label">{% trans "Exam Name" %}</label>
33   - <div class="col-md-10">
34   - <input type="text" name="exam_name" class="form-control" id="exam_name" placeholder="{% trans 'Exam Name' %}">
35   - </div>
36   - </div>
37   - <div class="row form-group">
38   - <label for="begin_date" class="col-md-2 control-label">{% trans "Exam's begin date" %}</label>
39   - <div class="col-md-10">
40   - <input type="date" name="begin_date" class="form-control" id="begin_date" placeholder='{% trans "Begin Date" %}'>
41   - </div>
42   - </div>
43   - <div class="row form-group">
44   - <label for="end_date" class="col-md-2 control-label">{% trans "Exam's end date" %}</label>
45   - <div class="col-md-10">
46   - <input type="date" name="end_date" class="form-control" id="end_date" placeholder='{% trans "End Date" %}'>
47   - </div>
48   - </div>
49   - <div class="row form-group">
50   - <div class="col-md-10">
51   - <div class="checkbox">
52   - <label>
53   - <input type="checkbox" name="checkbox"><span class="checkbox-material"></span> {% trans "Allow submissions after deadline?" %}
54   - </label>
55   - </div>
56   - </div>
57   - </div>
58   - <div class="row form-group" id="buttonAddQuestion">
59   - <div class="col-md-10">
60   - <button id="addQuestion" type="button" class="btn btn-raised btn-default">Add new question buton</button>
61   - </div>
62   - </div>
63   - <!-- Modal Footer -->
64   - <div class="modal-footer">
65   - <!-- Don't remove that!!! -->
66   - <button type="button" class="btn btn-default btn-raised" data-dismiss="modal">{% trans "Close" %}</button>
67   - {% block button_save %}
68   - <!-- Put curtom buttons here!!! -->
69   - <button type="submite" id="button" form="form" class="btn btn-primary btn-raised">{% trans "Create" %}</button>
70   - {% endblock button_save %}
71   - </div>
72   -
73   -
74   - {% endblock content_exam %}
  21 + </div>
  22 + <div class="row form-group">
  23 + <label for="begin_date" class="col-md-2 control-label">{% trans "Exam's begin date" %}</label>
  24 + <div class="col-md-4">
  25 + <input type="date" name="begin_date" class="form-control" id="begin_date" placeholder='{% trans "Begin Date" %}'>
  26 + </div>
  27 + <label for="end_date" class="col-md-2 control-label">{% trans "Exam's end date" %}</label>
  28 + <div class="col-md-4">
  29 + <input type="date" name="end_date" class="form-control" id="end_date" placeholder='{% trans "End Date" %}'>
  30 + </div>
  31 + </div>
  32 + <div class="row form-group">
  33 + <div class="col-md-10">
  34 + <div class="checkbox">
  35 + <label>
  36 + <input type="checkbox" name="checkbox"><span class="checkbox-material"></span> {% trans "Allow submissions after deadline?" %}
  37 + </label>
  38 + </div>
  39 + </div>
  40 + </div>
  41 + <div class="row form-group" id="buttonAddQuestion">
  42 + <div class="col-md-10">
  43 + <button id="addQuestion" type="button" class="btn btn-raised btn-default">Add new question buton</button>
75 44 </div>
76 45 </div>
77 46 </div>
  47 + <div class="panel-footer">
  48 + <button type="button" class="btn btn-default btn-raised" data-dismiss="modal">{% trans "Close" %}</button>
  49 + {% block button_save %}
  50 + <!-- Put curtom buttons here!!! -->
  51 + <button type="submite" id="button" form="form" class="btn btn-primary btn-raised">{% trans "Create" %}</button>
  52 + {% endblock button_save %}
  53 + </div>
78 54 </div>
79 55  
  56 +{% block javascript %}
  57 + <script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script>
  58 + <script src="{% static 'js/Exam.js' %}"></script>
  59 + <!-- Init material Bootstrap -->
  60 + <script type="text/javascript">$.material.init()</script><!-- O botao radio volta a funcionar quando coloco essa função-->
  61 +{% endblock %}
80 62 {% endblock content %}
... ...