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(style="margin-bottom:0")
  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(style="margin-bottom:0")
  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                         div(v-show="evaluationIndex >= 0")
  62                             h4 {{ evaluation.name }}
  63                             .card(v-show="mode=='view'")
  64                                 .center-align
  65                                     button.waves-effect.waves-light.btn.on-left(@click="mode='edit'") Edit
  66                                     button.waves-effect.waves-light.btn(@click="redirect(evaluation.name)") View
  67                                 div
  68                                     .introduction(v-html="evaluation.introduction")
  69                                     statements(:questions="evaluation.questions" :display="'solution'")
  70                             .card(v-show="mode=='edit'")
  71                                 form(@submit.prevent)
  72                                     p
  73                                         input#active(type="checkbox" v-model="evaluation.active")
  74                                         label(for="active") evaluation is active
  75                                     div
  76                                         h4 Questions mode:
  77                                         span(title="Exam mode, secured (class only): students cannot lose focus or exit fullscreen")
  78                                             input#secure(name="status" type="radio" value="secure" v-model="evaluation.mode")
  79                                             label(for="secure") secure
  80                                         span(title="Exam mode, watched (class only): teachers are notified when students lose focus or resize window")
  81                                             input#watch(name="status" type="radio" value="watch" v-model="evaluation.mode")
  82                                             label(for="watch") watch
  83                                         span(title="Exam mode, unwatched: students can browse the web freely")
  84                                             input#exam(name="status" type="radio" value="exam" v-model="evaluation.mode")
  85                                             label(for="exam") exam
  86                                         span(title="Questions list open to the world (useful mode after an exam, or for a 'questions bank'")
  87                                             input#open(name="status" type="radio" value="open" v-model="evaluation.mode")
  88                                             label(for="open") open
  89                                     p
  90                                         input#fixed(type="checkbox" v-model="evaluation.fixed")
  91                                         label(for="fixed") Fixed questions order
  92                                     div
  93                                         h4 Display type:
  94                                         span(title="Show only one question at a time (with potential sub-questions)")
  95                                             input#displayOne(name="display" type="radio" value="one" v-model="evaluation.display")
  96                                             label(for="displayOne") one
  97                                         span(title="Always show all questions (with an optional navigator)")
  98                                             input#displayAll(name="display" type="radio" value="all" v-model="evaluation.display")
  99                                             label(for="displayAll") all
 100                                     .input-field
 101                                         input#time(type="number" v-model.number="evaluation.time")
 102                                         label(for="time") Time (minutes)
 103                                     .input-field
 104                                         textarea#introduction.materialize-textarea(v-model="evaluation.introduction")
 105                                         label(for="introduction") Introduction
 106                                     .input-field
 107                                         textarea#evaluationEdition.materialize-textarea(v-model="questionsText")
 108                                         label(for="evaluationEdition") evaluation in text format
 109                                     .center-align
 110                                         button.waves-effect.waves-light.btn.on-left(@click="updateEvaluation()") Send
 111                                         button.waves-effect.waves-light.btn(@click="mode='view'") Cancel
 112
 113 block append javascripts
 114     script(src="//cdnjs.cloudflare.com/ajax/libs/PapaParse/4.3.6/papaparse.min.js")
 115     script.
 116         let evaluationArray = !{JSON.stringify(evaluationArray)};
 117         const course = !{JSON.stringify(course)};
 118         const initials = "#{initials}";
 119         const admin = #{teacher};
 120     script(src="/javascripts/utils/sha1.js")
 121     script(src="/javascripts/utils/validation.js")
 122     script(src="/javascripts/utils/libsRefresh.js")
 123     script(src="/javascripts/components/statements.js")
 124     script(src="/javascripts/course.js")