views/course.pug

   1 extends withQuestions
   2
   3 block append stylesheets
   4     link(rel="stylesheet" href="/stylesheets/statements.css")
   5     link(rel="stylesheet" href="/stylesheets/course.css")
   6
   7 block content
   8     .container#course
   9         if teacher
  10             #newAssessment.modal
  11                 .modal-content
  12                     form(@submit.prevent="addAssessment")
  13                         .input-field
  14                             input#assessmentName(type="text" v-model="newAssessment.name" required)
  15                             label(for="assessmentName") Name
  16                 .modal-footer
  17                     .center-align
  18                         a.waves-effect.waves-light.btn(href="#!" @click="addAssessment()")
  19                             span Submit
  20                             i.material-icons.right send
  21         .row(v-show="mode=='view'")
  22
  23
  24
  25
  26
  27
  28
  29
  30             #assessmentSettings.modal
  31                 .modal-content
  32                     form
  33                         p
  34                             input#active(type="checkbox" v-model="assessment.active")
  35                             label(for="active") Active
  36                         p
  37                             input#secure(name="status" type="radio" value="secure" v-model="assessment.mode")
  38                             label(for="secure") Exam mode, secured (class only)
  39                         p
  40                             input#watch(name="status" type="radio" value="watch" v-model="assessment.mode")
  41                             label(for="watch") Exam mode, watched (class only)
  42                         p
  43                             input#exam(name="status" type="radio" value="exam" v-model="assessment.mode")
  44                             label(for="exam") Exam mode, free (class only)
  45                         p
  46                             input#open(name="status" type="radio" value="open" v-model="assessment.mode")
  47                             label(for="open") Open to everyone
  48                         p
  49                             input#fixed(type="checkbox" v-model="assessment.fixed")
  50                             label(for="fixed") Fixed questions order
  51                         p
  52                             input#displayOne(name="display" type="radio" value="one" v-model="assessment.display")
  53                             label(for="displayOne") One question at a time
  54                         p
  55                             input#displayAll(name="display" type="radio" value="all" v-model="assessment.display")
  56                             label(for="displayAll") Display all questions
  57                         .input-field
  58                             input#time(type="number" v-model.number="assessment.time")
  59                             label(for="time") Time (minutes)
  60                 .modal-footer
  61                     .center-align
  62                         a.modal-action.modal-close.waves-effect.waves-light.btn-flat(href="#!") Done
  63             #assessmentEdit.modal
  64                 .modal-content
  65                     form
  66                         .input-field
  67                             textarea#introduction.materialize-textarea(v-model="assessment.introduction")
  68                             label(for="introduction") Introduction
  69                         .input-field
  70                             textarea#assessmentEdition.materialize-textarea(v-model="assessmentText")
  71                             label(for="assessmentEdition") Assessment in text format
  72                 .modal-footer
  73                     .center-align
  74                         a.modal-action.modal-close.waves-effect.waves-light.btn-flat(href="#!") Done
  75
  76
  77
  78
  79
  80
  81
  82             .col.s12.m10.offset-m1
  83                 if teacher
  84                     h4.title(@click="toggleDisplay('students')") Students
  85                     .card(v-show="display=='students'")
  86                         .center-align
  87                             input.hide#upload(type="file" @change="upload")
  88                             button.on-left.waves-effect.waves-light.btn(@click="uploadTrigger()") Import
  89                         table
  90                             thead
  91                                 tr
  92                                     th Number
  93                                     th Name
  94                                     th Group
  95                             tbody
  96                                 tr.student(v-for="student in studentList(0)")
  97                                     td {{ student.number }}
  98                                     td {{ student.name }}
  99                                     td {{ student.group }}
 100                 h4.title(@click="toggleDisplay('assessments')") Assessments
 101                 .card(v-show="display=='assessments'")
 102                     if teacher
 103                         .center-align
 104                             a.on-left.waves-effect.waves-light.btn.modal-trigger(href="#newAssessment") New assessment
 105                             input#password(type="password" v-model="monitorPwd" @keyup.enter="setPassword"
 106                                     placeholder="Password" title="Monitoring password")
 107                     table
 108                         thead
 109                             tr
 110                                 th Name
 111                                 th Mode
 112                                 th #Questions
 113                                 th Time
 114                         tbody
 115                             tr.assessment(v-for="(assessment,i) in assessmentArray" :class="{idle:!assessment.active}"
 116                                     @click.left="actionAssessment(i)" @contextmenu.prevent="deleteAssessment(assessment)")
 117                                 td {{ assessment.name }}
 118                                 td {{ assessment.mode }}
 119                                 td {{ assessment.questions.reduce( (a,b) => { return b.active ? a+1 : a; }, 0) }}
 120                                 td {{ assessment.time }}
 121         if teacher
 122             .row(v-show="mode=='edit'")
 123                 .col.s12.m10.offset-m1
 124                     h4 {{ assessment.name }}
 125                     .card
 126                         .center-align
 127                             button.waves-effect.waves-light.btn.on-left(@click="materialOpenModal('assessmentSettings')") Settings
 128                             button.waves-effect.waves-light.btn.on-left(@click="materialOpenModal('assessmentEdit')") Content
 129                             button.waves-effect.waves-light.btn(@click="redirect(assessment.name)") View
 130                         #questionList
 131                             .introduction(v-html="assessment.introduction")
 132                             .question(v-for="(question,i) in assessment.questions" :class="{questionInactive:!question.active}")
 133                                 .wording(v-html="question.wording")
 134                                 .option(v-for="(option,j) in question.options" :class="{choiceCorrect:question.answer.includes(j)}" v-html="option")
 135                                 p
 136                                     input(:id="checkboxFixedId(i)" type="checkbox" v-model="question.fixed")
 137                                     label.on-left(:for="checkboxFixedId(i)") Fixed
 138                                     input(:id="checkboxActiveId(i)" type="checkbox" v-model="question.active")
 139                                     label(:for="checkboxActiveId(i)") Active
 140                                     input(time default 0 = untimed)
 141                                     label Time for the question
 142                         .center-align
 143                             button.waves-effect.waves-light.btn.on-left(@click="mode='view'") Cancel
 144                             button.waves-effect.waves-light.btn(@click="updateAssessment") Send
 145
 146 block append javascripts
 147     script(src="//cdnjs.cloudflare.com/ajax/libs/PapaParse/4.3.6/papaparse.min.js")
 148     script.
 149         let assessmentArray = !{JSON.stringify(assessmentArray)};
 150         const course = !{JSON.stringify(course)};
 151         const initials = "#{initials}";
 152         const admin = #{teacher};
 153     script(src="/javascripts/utils/sha1.js")
 154     script(src="/javascripts/utils/validation.js")
 155     script(src="/javascripts/course.js")