Merge pull request #19 from QuantumStack/dev

Version 1.3.5
QuantumStack · Apr 26, 2019 · 966e70d · 966e70d
2 parents cda8fde + c2dbaf5
commit 966e70d
Show file tree

Hide file tree

Showing 17 changed files with 178 additions and 87 deletions.
diff --git a/README.md b/README.md
@@ -13,6 +13,8 @@ Secure check-in and scoring. Easy for instructors, easy for students.
 - Automatically generates QR codes for check-in
 - Easily export data to CSV, with filters
 - Add/remove users from comprehensive admin console
+- Flag suspicious activity automatically
+- Enforce lab section timeslots
 
 Learn more [here](https://cmulab.quantumstack.xyz)
 
@@ -30,11 +32,11 @@ Learn more [here](https://cmulab.quantumstack.xyz)
 
 ## Images
 
-![Home Page](https://i.imgur.com/DxFn4NR.jpg)
+<img src="https://i.imgur.com/lqJ0iND.png" width="300" title="Homepage">
 
-![Checkin Page](https://i.imgur.com/NkSU5vm.jpg)
+<img src="https://i.imgur.com/Cy0danI.png" width="300" title="Check-in a student">
 
-![Administration Page](https://i.imgur.com/RxAPdSZ.png)
+<img src="https://i.imgur.com/5IIMK5E.png" width="400" title="Settings for administrators">
 
 ## Contributing
 

diff --git a/server/config.json b/server/config.json
@@ -5,12 +5,14 @@
   "offsetMinutes": 0,
   "minScore": 0,
   "maxScore": 3,
+  "showDelete": true,
   "lowercaseStudents": false,
   "radioInput": true,
   "manualLab": false,
   "flagSection": false,
   "flagAttempts": "",
   "flagAttemptsThreshold": 3600000,
   "flagGhosts": true,
+  "allowOverride": true,
   "sections": {}
 }
diff --git a/server/public/javascripts/datarow.js b/server/public/javascripts/datarow.js
@@ -53,6 +53,7 @@ var DataRow = function (_React$Component) {
     key: 'render',
     value: function render() {
       var _props = this.props,
+          showStudent = _props.showStudent,
           _id = _props._id,
           section = _props.section,
           student_id = _props.student_id,
@@ -76,7 +77,7 @@ var DataRow = function (_React$Component) {
         React.createElement(
           'td',
           null,
-          student_id
+          showStudent ? student_id : '••••••'
         ),
         React.createElement(
           'td',

diff --git a/server/public/javascripts/datatable.js b/server/public/javascripts/datatable.js
@@ -17,10 +17,12 @@ var DataTable = function (_React$Component) {
     var _this = _possibleConstructorReturn(this, (DataTable.__proto__ || Object.getPrototypeOf(DataTable)).call(this, props));
 
     _this.state = {
+      studentVisibility: false,
       lab: '',
       labActive: false,
       preserve: false
     };
+    _this.toggleStudentVisibility = _this.toggleStudentVisibility.bind(_this);
     _this.toggleLab = _this.toggleLab.bind(_this);
     _this.onChangeLab = _this.onChangeLab.bind(_this);
     _this.onChangePreserve = _this.onChangePreserve.bind(_this);
@@ -29,10 +31,18 @@ var DataTable = function (_React$Component) {
   }
 
   _createClass(DataTable, [{
+    key: 'toggleStudentVisibility',
+    value: function toggleStudentVisibility() {
+      this.setState(function (_ref) {
+        var studentVisibility = _ref.studentVisibility;
+        return { studentVisibility: !studentVisibility };
+      });
+    }
+  }, {
     key: 'toggleLab',
     value: function toggleLab() {
-      this.setState(function (_ref) {
-        var labActive = _ref.labActive;
+      this.setState(function (_ref2) {
+        var labActive = _ref2.labActive;
         return { labActive: !labActive };
       });
     }
@@ -67,7 +77,9 @@ var DataTable = function (_React$Component) {
           sort = _props.sort,
           entries = _props.entries,
           updateSort = _props.updateSort;
-      var labActive = this.state.labActive;
+      var _state2 = this.state,
+          studentVisibility = _state2.studentVisibility,
+          labActive = _state2.labActive;
 
       var columns = [['Section', 'section'], ['Student ID', 'student_id'], ['Score', 'score'], ['Lab', 'lab'], ['Date', 'date'], ['TA', 'ta'], ['Flags', 'flags']];
       return React.createElement(
@@ -79,10 +91,10 @@ var DataTable = function (_React$Component) {
           React.createElement(
             'tr',
             null,
-            columns.map(function (_ref2) {
-              var _ref3 = _slicedToArray(_ref2, 2),
-                  title = _ref3[0],
-                  name = _ref3[1];
+            columns.map(function (_ref3) {
+              var _ref4 = _slicedToArray(_ref3, 2),
+                  title = _ref4[0],
+                  name = _ref4[1];
 
               return React.createElement(
                 'th',
@@ -172,6 +184,15 @@ var DataTable = function (_React$Component) {
                     { className: 'icon' },
                     React.createElement('i', { className: 'fas fa-caret-' + (sort[name] > 0 ? 'down' : 'up') })
                   )
+                ),
+                name === 'student_id' && React.createElement(
+                  'a',
+                  { className: 'tooltip', 'data-tooltip': 'Toggle visibility', onClick: _this2.toggleStudentVisibility },
+                  React.createElement(
+                    'span',
+                    { className: 'icon has-text-info' },
+                    React.createElement('i', { className: 'fas fa-' + (studentVisibility ? 'eye-slash' : 'eye') })
+                  )
                 )
               );
             })
@@ -181,7 +202,7 @@ var DataTable = function (_React$Component) {
           'tbody',
           null,
           entries.map(function (entry) {
-            return React.createElement(DataRow, Object.assign({ key: entry._id }, entry));
+            return React.createElement(DataRow, Object.assign({ showStudent: studentVisibility, key: entry._id }, entry));
           })
         )
       );

diff --git a/server/public/javascripts/dataview.js b/server/public/javascripts/dataview.js
@@ -17,6 +17,7 @@ var DataView = function (_React$Component) {
     _this.state = {
       error: null,
       isLoaded: false,
+      showData: true,
       entries: [],
       filters: {
         good: true
@@ -49,10 +50,9 @@ var DataView = function (_React$Component) {
         filters: this.state.filters,
         sort: this.state.sort
       }).then(function (res) {
-        return _this2.setState({
-          isLoaded: true,
-          entries: res.data
-        });
+        return _this2.setState(Object.assign({
+          isLoaded: true
+        }, res.data));
       }, function (err) {
         return _this2.setState({
           isLoaded: true,
@@ -194,6 +194,7 @@ var DataView = function (_React$Component) {
       var _state = this.state,
           error = _state.error,
           isLoaded = _state.isLoaded,
+          showDelete = _state.showDelete,
           entries = _state.entries,
           filters = _state.filters,
           sort = _state.sort,
@@ -221,7 +222,7 @@ var DataView = function (_React$Component) {
         'div',
         null,
         React.createElement(FilterPane, { filters: filters, filtersActive: filtersActive, toggleFilters: this.toggleFilters, updateFilters: this.updateFilters, getData: this.getData }),
-        React.createElement(DataViewBar, { entriesCount: entries.length, filters: filters, toggleFilters: this.toggleFilters, updateFilters: this.updateFilters, getData: this.getData, downloadData: this.downloadData, deleteData: this.deleteData }),
+        React.createElement(DataViewBar, { showDelete: showDelete, entriesCount: entries.length, filters: filters, toggleFilters: this.toggleFilters, updateFilters: this.updateFilters, getData: this.getData, downloadData: this.downloadData, deleteData: this.deleteData }),
         React.createElement(DataDownload, { isActive: modalActive, toggleModal: this.toggleModal, data: downloadData, type: downloadType }),
         React.createElement(DataTable, { sort: sort, entries: entries, updateSort: this.updateSort, assignLab: this.assignLab })
       );

diff --git a/server/public/javascripts/dataviewbar.js b/server/public/javascripts/dataviewbar.js
@@ -50,6 +50,7 @@ var DataViewBar = function (_React$Component) {
     key: 'render',
     value: function render() {
       var _props = this.props,
+          showDelete = _props.showDelete,
           filters = _props.filters,
           toggleFilters = _props.toggleFilters,
           updateFilters = _props.updateFilters,
@@ -212,7 +213,7 @@ var DataViewBar = function (_React$Component) {
               )
             )
           ),
-          React.createElement(
+          showDelete && React.createElement(
             'p',
             { className: 'level-item' },
             React.createElement(

diff --git a/server/public/javascripts/flag-dismiss.js b/server/public/javascripts/flag-dismiss.js
diff --git a/server/public/javascripts/flag-manipulation.js b/server/public/javascripts/flag-manipulation.js
@@ -0,0 +1,28 @@
+function flagDismiss() {
+  document.getElementById('flags').classList.add('is-hidden');
+  document.getElementById('main').classList.remove('is-fullheight-with-navbar');
+  document.getElementById('main').classList.add('is-fullheight');
+}
+
+function flagOverride() {
+  const override = document.getElementById('override').value;
+  if (override) {
+    document.getElementById('flag-toggle').innerHTML = 'Override';
+    document.getElementById('override').value = '';
+    document.getElementById('flag-icon').classList.add('fa-exclamation-triangle');
+    document.getElementById('flag-icon').classList.remove('fa-check');
+    document.getElementById('flag-notification').classList.add('is-danger');
+    document.getElementById('flag-notification').classList.remove('is-warning');
+    document.getElementById('flags').classList.add('is-danger');
+    document.getElementById('flags').classList.remove('is-warning');
+  } else {
+    document.getElementById('flag-toggle').innerHTML = 'Flag';
+    document.getElementById('override').value = 'good';
+    document.getElementById('flag-icon').classList.remove('fa-exclamation-triangle');
+    document.getElementById('flag-icon').classList.add('fa-check');
+    document.getElementById('flag-notification').classList.remove('is-danger');
+    document.getElementById('flag-notification').classList.add('is-warning');
+    document.getElementById('flags').classList.remove('is-danger');
+    document.getElementById('flags').classList.add('is-warning');
+  }
+}
diff --git a/server/public/javascripts/react/datarow.jsx b/server/public/javascripts/react/datarow.jsx
@@ -28,14 +28,14 @@ class DataRow extends React.Component {
   }
 
   render() {
-    const { _id, section, student_id, score, lab, date, ta, flags } = this.props;
+    const { showStudent, _id, section, student_id, score, lab, date, ta, flags } = this.props;
     const { good, isActive } = this.state;
     return <tr>
       <td>
         {section}
       </td>
       <td>
-        {student_id}
+        {showStudent ? student_id : '••••••'}
       </td>
       <td>
         {score}

diff --git a/server/public/javascripts/react/datatable.jsx b/server/public/javascripts/react/datatable.jsx
@@ -2,16 +2,22 @@ class DataTable extends React.Component {
   constructor(props) {
     super(props);
     this.state = {
+      studentVisibility: false,
       lab: '',
       labActive: false,
       preserve: false,
     };
+    this.toggleStudentVisibility = this.toggleStudentVisibility.bind(this);
     this.toggleLab = this.toggleLab.bind(this);
     this.onChangeLab = this.onChangeLab.bind(this);
     this.onChangePreserve = this.onChangePreserve.bind(this);
     this.sendLab = this.sendLab.bind(this);
   }
 
+  toggleStudentVisibility() {
+    this.setState(({ studentVisibility }) => ({ studentVisibility: !studentVisibility }));
+  }
+
   toggleLab() {
     this.setState(({ labActive }) => ({ labActive: !labActive }));
   }
@@ -34,7 +40,7 @@ class DataTable extends React.Component {
 
   render() {
     const { sort, entries, updateSort } = this.props;
-    const { labActive } = this.state;
+    const { studentVisibility, labActive } = this.state;
     const columns = [
       ['Section', 'section'],
       ['Student ID', 'student_id'],
@@ -98,13 +104,20 @@ class DataTable extends React.Component {
                 </span>
               }
             </span>
+            {name === 'student_id' &&
+              <a className='tooltip' data-tooltip='Toggle visibility' onClick={this.toggleStudentVisibility}>
+                <span className='icon has-text-info'>
+                  <i className={`fas fa-${studentVisibility ? 'eye-slash' : 'eye'}`}></i>
+                </span>
+              </a>
+            }
           </th>
         ))}
         </tr>
       </thead>
       <tbody>
         {entries.map(entry => (
-          <DataRow key={entry._id} {...entry} />
+          <DataRow showStudent={studentVisibility} key={entry._id} {...entry} />
         ))}
       </tbody>
     </table>;

diff --git a/server/public/javascripts/react/dataview.jsx b/server/public/javascripts/react/dataview.jsx
@@ -4,6 +4,7 @@ class DataView extends React.Component {
     this.state = {
       error: null,
       isLoaded: false,
+      showData: true,
       entries: [],
       filters: {
         good: true,
@@ -32,7 +33,7 @@ class DataView extends React.Component {
       sort: this.state.sort,
     }).then(res => this.setState({
       isLoaded: true,
-      entries: res.data,
+      ...res.data,
     }), err => this.setState({
       isLoaded: true,
       error: err,
@@ -135,7 +136,7 @@ class DataView extends React.Component {
 
   render() {
     const {
-      error, isLoaded, entries, filters, sort, filtersActive, modalActive, downloadData, downloadType,
+      error, isLoaded, showDelete, entries, filters, sort, filtersActive, modalActive, downloadData, downloadType,
     } = this.state;
     if (error) {
       return <div>Error: {error.message}</div>;
@@ -145,7 +146,7 @@ class DataView extends React.Component {
     }
     return <div>
       <FilterPane filters={filters} filtersActive={filtersActive} toggleFilters={this.toggleFilters} updateFilters={this.updateFilters} getData={this.getData} />
-      <DataViewBar entriesCount={entries.length} filters={filters} toggleFilters={this.toggleFilters} updateFilters={this.updateFilters} getData={this.getData} downloadData={this.downloadData} deleteData={this.deleteData} />
+      <DataViewBar showDelete={showDelete} entriesCount={entries.length} filters={filters} toggleFilters={this.toggleFilters} updateFilters={this.updateFilters} getData={this.getData} downloadData={this.downloadData} deleteData={this.deleteData} />
       <DataDownload isActive={modalActive} toggleModal={this.toggleModal} data={downloadData} type={downloadType} />
       <DataTable sort={sort} entries={entries} updateSort={this.updateSort} assignLab={this.assignLab} />
     </div>;