views/course.pug

   1 extends withQuestions
   2
   3 block append stylesheets
   4     link(rel="stylesheet" href="/stylesheets/course.css")
   5
   6 block content
   7     .container#course
   8         if teacher
   9             #newAssessment.modal
  10                 .modal-content
  11                     form(@submit.prevent="addAssessment")
  12                         .input-field
  13                             input#assessmentName(type="text" v-model="newAssessment.name" required)
  14                             label(for="assessmentName") Name
  15                 .modal-footer
  16                     .center-align
  17                         a.waves-effect.waves-light.btn(href="#!" @click="addAssessment()")
  18                             span Submit
  19                             i.material-icons.right send
  20             #assessmentSettings.modal
  21                 .modal-content
  22                     form
  23                         p
  24                             input#active(type="checkbox" v-model="assessment.active")
  25                             label(for="active") Active
  26                         p
  27                             input#secure(name="status" type="radio" value="secure" v-model="assessment.mode")
  28                             label(for="secure") Exam mode, secured (class only)
  29                         p
  30                             input#exam(name="status" type="radio" value="exam" v-model="assessment.mode")
  31                             label(for="exam") Exam mode, free (class only)
  32                         p
  33                             input#open(name="status" type="radio" value="open" v-model="assessment.mode")
  34                             label(for="open") Open to everyone
  35                         p
  36                             input#fixed(type="checkbox" v-model="assessment.fixed")
  37                             label(for="fixed") Fixed questions order
  38                         p
  39                             input#displayOne(name="display" type="radio" value="one" v-model="assessment.display")
  40                             label(for="displayOne") One question at a time
  41                         p
  42                             input#displayAll(name="display" type="radio" value="all" v-model="assessment.display")
  43                             label(for="displayAll") Display all questions
  44                         .input-field
  45                             input#time(type="number" v-model.number="assessment.time")
  46                             label(for="time") Time (minutes)
  47                 .modal-footer
  48                     .center-align
  49                         a.modal-action.modal-close.waves-effect.waves-light.btn-flat(href="#!") Done
  50             #assessmentEdit.modal
  51                 .modal-content
  52                     form
  53                         .input-field
  54                             textarea#introduction.materialize-textarea(v-model="assessment.introduction")
  55                             label(for="introduction") Introduction
  56                         .input-field
  57                             textarea#assessmentEdition.materialize-textarea(v-model="assessmentText")
  58                             label(for="assessmentEdition") Assessment in text format
  59                 .modal-footer
  60                     .center-align
  61                         a.modal-action.modal-close.waves-effect.waves-light.btn-flat(href="#!") Done
  62             #gradeSettings.modal
  63                 .modal-content
  64                     form(@submit.prevent="computeGrades")
  65                         .input-field
  66                             input#points(type="number" v-model.number="settings.totalPoints" required)
  67                             label(for="points") Total points
  68                         p
  69                             input#partial(type="checkbox" v-model="settings.halfPoint")
  70                             label(for="partial") Half point for partial answers? (&ge; 50%)
  71                         p
  72                             input#malus(type="checkbox" v-model="settings.zeroSum")
  73                             label(for="malus") Lose points on wrong answers? ("Zero-sum" game)
  74                 .modal-footer
  75                     .center-align
  76                         a.modal-action.modal-close.waves-effect.waves-light.btn(href="#!" @click="computeGrades()")
  77                             span Compute
  78                             i.material-icons.right send
  79             #detailedGrades.modal
  80                 .modal-content
  81                     table
  82                         thead
  83                             tr
  84                                 th Number
  85                                 th(v-for="assessment in assessmentArray") {{ assessment.name }}
  86                         tbody
  87                             tr.grade(v-for="student in studentList(group)")
  88                                 td {{ student.number }}
  89                                 td(v-for="(assessment,i) in assessmentArray" @click="togglePresence(student.number,i)")
  90                                     | {{ grade(i,student.number) }}
  91                 .modal-footer
  92                     .center-align
  93                         a.modal-action.modal-close.waves-effect.waves-light.btn-flat(href="#!") Close
  94         .row(v-show="mode=='view'")
  95             .col.s12.m10.offset-m1
  96                 if teacher
  97                     h4.title(@click="toggleDisplay('students')") Students
  98                     .card(v-show="display=='students'")
  99                         .center-align
 100                             input.hide#upload(type="file" @change="upload")
 101                             button.on-left.waves-effect.waves-light.btn(@click="uploadTrigger()") Import
 102                         table
 103                             thead
 104                                 tr
 105                                     th Number
 106                                     th Name
 107                                     th Group
 108                             tbody
 109                                 tr.student(v-for="student in studentList(0)")
 110                                     td {{ student.number }}
 111                                     td {{ student.name }}
 112                                     td {{ student.group }}
 113                 h4.title(@click="toggleDisplay('assessments')") Assessments
 114                 .card(v-show="display=='assessments'")
 115                     if teacher
 116                         .center-align
 117                             a.on-left.waves-effect.waves-light.btn.modal-trigger(href="#newAssessment") New assessment
 118                             input#password(type="password" v-model="monitorPwd" @keyup.enter="setPassword"
 119                                     placeholder="Password" title="Monitoring password")
 120                     table
 121                         thead
 122                             tr
 123                                 th Name
 124                                 th Mode
 125                                 th #Questions
 126                                 th Time
 127                         tbody
 128                             tr.assessment(v-for="(assessment,i) in assessmentArray" :class="{idle:!assessment.active}"
 129                                     @click.left="actionAssessment(i)" @contextmenu.prevent="deleteAssessment(assessment)")
 130                                 td {{ assessment.name }}
 131                                 td {{ assessment.mode }}
 132                                 td {{ assessment.questions.reduce( (a,b) => { return b.active ? a+1 : a; }, 0) }}
 133                                 td {{ assessment.time }}
 134                 if teacher
 135                     h4.title(@click="toggleDisplay('grades')") Grades
 136                     .card(v-show="display=='grades'")
 137                         .center-align
 138                             button.on-left.waves-effect.waves-light.btn(@click="gradeSettings()") Settings
 139                             a#download.hide(href="#" ref="download")
 140                             button.waves-effect.waves-light.btn(@click="download") Download
 141                         ul.tabs.tabs-fixed-width
 142                             li.tab
 143                                 a(href="#group0") All
 144                             li.tab(v-for="group in groupList()")
 145                                 a(:href="groupId(group,'#')") G.{{ group }}
 146                         table.result(:id="groupId(group)" v-for="group in [0].concat(groupList())" @click="showDetails(group)")
 147                             thead
 148                                 tr
 149                                     th Number
 150                                     th Name
 151                                     th Final
 152                             tbody
 153                                 tr.grade(v-for="student in studentList(group)")
 154                                     td {{ student.number }}
 155                                     td {{ student.name }}
 156                                     td grade...
 157                                     //td {{ grades[student.number].final }}
 158                                 tr.stats
 159                                     td(colspan="4") Stats: range= stdev= mean=
 160         if teacher
 161             .row(v-show="mode=='edit'")
 162                 .col.s12.m10.offset-m1
 163                     h4 {{ assessment.name }}
 164                     .card
 165                         .center-align
 166                             button.waves-effect.waves-light.btn.on-left(@click="materialOpenModal('assessmentSettings')") Settings
 167                             button.waves-effect.waves-light.btn.on-left(@click="materialOpenModal('assessmentEdit')") Content
 168                             button.waves-effect.waves-light.btn(@click="redirect(assessment.name)") View
 169                         #questionList
 170                             .introduction(v-html="assessment.introduction")
 171                             .question(v-for="(question,i) in assessment.questions" :class="{questionInactive:!question.active}")
 172                                 .wording(v-html="question.wording")
 173                                 .option(v-for="(option,j) in question.options" :class="{choiceCorrect:question.answer.includes(j)}" v-html="option")
 174                                 p
 175                                     input(:id="checkBoxFixedId(i)" type="checkbox" v-model="question.fixed")
 176                                     label.on-left(:for="checkBoxFixedId(i)") Fixed
 177                                     input(:id="checkBoxActiveId(i)" type="checkbox" v-model="question.active")
 178                                     label(:for="checkBoxActiveId(i)") Active
 179                         .center-align
 180                             button.waves-effect.waves-light.btn.on-left(@click="mode='view'") Cancel
 181                             button.waves-effect.waves-light.btn(@click="updateAssessment") Send
 182
 183 block append javascripts
 184     script(src="//cdnjs.cloudflare.com/ajax/libs/PapaParse/4.3.6/papaparse.min.js")
 185     script.
 186         let assessmentArray = !{JSON.stringify(assessmentArray)};
 187         const course = !{JSON.stringify(course)};
 188         const initials = "#{initials}";
 189         const admin = #{teacher};
 190     script(src="/javascripts/utils/sha1.js")
 191     script(src="/javascripts/utils/validation.js")
 192     script(src="/javascripts/course.js")