views/assessment.pug

   1 extends withQuestions
   2
   3 block append stylesheets
   4     link(rel="stylesheet" href="/stylesheets/assessment.css")
   5     noscript
   6         meta(http-equiv="Refresh" content="0; URL=/enablejs")
   7
   8 block rightMenu
   9     a#rightButton.btn-floating.btn-large.grey(href=assessment.name + "/monitor")
  10         i.material-icons video_label
  11
  12 block content
  13     .container#assessment
  14         .row
  15             #warning.modal
  16                 .modal-content {{ warnMsg }}
  17                 .modal-footer
  18                     .center-align
  19                         a.modal-action.modal-close.waves-effect.waves-light.btn-flat(href="#!") Ok
  20         .row
  21             .col.s12.m10.offset-m1.l8.offset-l2.xl6.offset-xl3
  22                 h4= assessment.name
  23                 #stage0(v-show="stage==0")
  24                     .card
  25                         .input-field.inline.on-left
  26                             label(for="number") Number
  27                             input#number(type="text" v-model="student.number" @keyup.enter="getStudent()")
  28                         button.waves-effect.waves-light.btn(@click="getStudent()") Send
  29                 #stage1(v-show="stage==1")
  30                     .card
  31                         if assessment.mode != "open"
  32                             .input-field.inline.on-left
  33                                 label(for="forename") Forename
  34                                 input#forename(type="text" v-model="student.forename" disabled)
  35                             .input-field.inline
  36                                 label(for="name") Name
  37                                 input#name(type="text" v-model="student.name" disabled)
  38                         p.center-align
  39                             if assessment.mode != "open"
  40                                 button.waves-effect.waves-light.btn.on-left(@click="cancelStudent") Cancel
  41                             button.waves-effect.waves-light.btn(@click="startAssessment") Start!
  42                 #stage1_2_4(v-show="stage==1 || stage==2 || stage == 4")
  43                     .card
  44                         .introduction(v-html="assessment.introduction")
  45                 #stage2_4(v-show="stage==2 || stage==4")
  46                     if assessment.time > 0
  47                         .card
  48                             .timer.center(v-if="stage==2") {{ countdown }}
  49                     .card
  50                         button.waves-effect.waves-light.btn(style="display:block;margin:0 auto" @click="sendAnswer") Send
  51                         statements(:questions="assessment.questions" :showAnswers="showAnswers" :index="index" :inputs="inputs" @gameover="endAssessment")
  52                 #stage3(v-show="stage==3")
  53                     .card
  54                         .finish Exam completed &#9786; ...don't close the window!
  55                 #stage3_4(v-show="stage==3 || stage==4")
  56                     .card
  57                         .conclusion(v-html="assessment.conclusion")
  58
  59 block append javascripts
  60     script.
  61         let assessment = !{JSON.stringify(assessment)};
  62         const monitoring = false;
  63     script(src="/javascripts/components/statements.js")
  64     script(src="/javascripts/assessment.js")