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             #newEvaluation.modal
  11                 .modal-content
  12                     form(@submit.prevent="addEvaluation")
  13                         .input-field
  14                             input#evaluationName(type="text" v-model="newEvaluation.name" required)
  15                             label(for="evaluationName") Name
  16                 .modal-footer
  17                     .center-align
  18                         a.waves-effect.waves-light.btn(href="#!" @click="addEvaluation()")
  19                             span Submit
  20                             i.material-icons.right send
  21             .row
  22                 .col.s12.m10.offset-m1
  23                     h4.title(@click="toggleDisplay('students')") Students
  24                     .card(v-show="display=='students'")
  25                         .center-align
  26                             input.hide#upload(type="file" @change="upload")
  27                             button.on-left.waves-effect.waves-light.btn(@click="uploadTrigger()") Import
  28                         table
  29                             thead
  30                                 tr
  31                                     th Number
  32                                     th Name
  33                                     th Group
  34                             tbody
  35                                 tr.student(v-for="student in studentList(0)")
  36                                     td {{ student.number }}
  37                                     td {{ student.name }}
  38                                     td {{ student.group }}
  39         .row
  40             .col.s12.m10.offset-m1
  41                 h4.title(@click="toggleDisplay('evaluations')") Evaluations
  42                 .card(v-show="display=='evaluations'")
  43                     if teacher
  44                         .center-align
  45                             a.on-left.waves-effect.waves-light.btn.modal-trigger(href="#newEvaluation") New evaluation
  46                             input#password(type="password" v-model="monitorPwd" @keyup.enter="setPassword"
  47                                     placeholder="Password" title="Monitoring password")
  48                     table
  49                         thead
  50                             tr
  51                                 th Name
  52                                 th Mode
  53                                 th #Questions
  54                         tbody
  55                             tr.evaluation(v-for="(evaluation,i) in evaluationArray" :class="{idle:!evaluation.active}"
  56                                     @click.left="actionEvaluation(i)" @contextmenu.prevent="deleteEvaluation(evaluation)")
  57                                 td {{ evaluation.name }}
  58                                 td {{ evaluation.mode }}
  59                                 td {{ evaluation.questions.length }}
  60         if teacher
  61             .row
  62                 .col.s12.m10.offset-m1
  63                     h4 {{ evaluation.name }}
  64                     .card(v-show="mode=='view'")
  65                         .center-align
  66                             button.waves-effect.waves-light.btn.on-left(@click="mode='edit'") Edit
  67                             button.waves-effect.waves-light.btn(@click="redirect(evaluation.name)") View
  68                         div
  69                             .introduction(v-html="evaluation.introduction")
  70                             statements(:questions="evaluation.questions" :display="solution")
  71                     .card(v-show="mode=='edit'")
  72                         form(@submit.prevent)
  73                             p
  74                                 input#active(type="checkbox" v-model="evaluation.active")
  75                                 label(for="active") evaluation is active
  76                             div
  77                                 h4 Questions mode:
  78                                 span(title="Exam mode, secured (class only): students cannot lose focus or exit fullscreen")
  79                                     input#secure(name="status" type="radio" value="secure" v-model="evaluation.mode")
  80                                     label(for="secure") secure
  81                                 span(title="Exam mode, watched (class only): teachers are notified when students lose focus or resize window")
  82                                     input#watch(name="status" type="radio" value="watch" v-model="evaluation.mode")
  83                                     label(for="watch") watch
  84                                 span(title="Exam mode, unwatched: students can browse the web freely")
  85                                     input#exam(name="status" type="radio" value="exam" v-model="evaluation.mode")
  86                                     label(for="exam") exam
  87                                 span(title="Questions list open to the world (useful mode after an exam, or for a 'questions bank'")
  88                                     input#open(name="status" type="radio" value="open" v-model="evaluation.mode")
  89                                     label(for="open") open
  90                             p
  91                                 input#fixed(type="checkbox" v-model="evaluation.fixed")
  92                                 label(for="fixed") Fixed questions order
  93                             div
  94                                 h4 Display type:
  95                                 span(title="Show only one question at a time (with potential sub-questions)")
  96                                     input#displayOne(name="display" type="radio" value="one" v-model="evaluation.display")
  97                                     label(for="displayOne") one
  98                                 span(title="Always show all questions (with an optional navigator)")
  99                                     input#displayAll(name="display" type="radio" value="all" v-model="evaluation.display")
 100                                     label(for="displayAll") all
 101                             .input-field
 102                                 input#time(type="number" v-model.number="evaluation.time")
 103                                 label(for="time") Time (minutes)
 104                             .input-field
 105                                 textarea#introduction.materialize-textarea(v-model="evaluation.introduction")
 106                                 label(for="introduction") Introduction
 107                             .input-field
 108                                 textarea#evaluationEdition.materialize-textarea(v-model="evaluationText")
 109                                 label(for="evaluationEdition") evaluation in text format
 110                             .center-align
 111                                 button.waves-effect.waves-light.btn.on-left(@click="updateEvaluation()") Send
 112                                 button.waves-effect.waves-light.btn(@click="mode='view'") Cancel
 113
 114 block append javascripts
 115     script(src="//cdnjs.cloudflare.com/ajax/libs/PapaParse/4.3.6/papaparse.min.js")
 116     script.
 117         let evaluationArray = !{JSON.stringify(evaluationArray)};
 118         const course = !{JSON.stringify(course)};
 119         const initials = "#{initials}";
 120         const admin = #{teacher};
 121     script(src="/javascripts/utils/sha1.js")
 122     script(src="/javascripts/utils/validation.js")
 123     script(src="/javascripts/components/statements.js")
 124     script(src="/javascripts/course.js")