An easy-to-use platform for EEG experimentation in the classroom
Polished RunComponent
+29
-12
+5
-2
app/app.global.css
+5
-2
app/app.global.css
···
8
8
@import "~rc-slider/assets/index.css";
9
9
@import "~react-toastify/dist/ReactToastify.css";
10
10
11
-
12
11
body {
13
12
position: relative;
14
13
height: 100vh;
···
54
53
}
55
54
56
55
img {
57
-
max-width: 100% !important;
56
+
min-width: 100% !important;
57
+
}
58
+
59
+
#jspsych-image-keyboard-response-stimulus {
60
+
width: 100% !important;
58
61
}
59
62
60
63
button:active {
+14
-3
app/components/CollectComponent/RunComponent.js
+14
-3
app/components/CollectComponent/RunComponent.js
···
1
1
// @flow
2
2
import React, { Component } from 'react';
3
3
import { Grid, Button, Segment, Header, Divider } from 'semantic-ui-react';
4
-
import { Experiment } from 'jspsych-react';
4
+
import { Experiment, jsPsych } from 'jspsych-react';
5
5
import { debounce } from 'lodash';
6
6
import { Link } from 'react-router-dom';
7
+
import Mousetrap from 'mousetrap';
7
8
import styles from '../styles/common.css';
8
9
import InputModal from '../InputModal';
9
10
import { injectEmotivMarker } from '../../utils/eeg/emotiv';
···
67
68
if (this.props.mainTimeline.length <= 0) {
68
69
this.props.experimentActions.loadDefaultTimeline();
69
70
}
71
+
Mousetrap.bind('esc', jsPsych.endCurrentTimeline);
72
+
}
73
+
74
+
componentWillUnmount() {
75
+
Mousetrap.unbind('esc');
70
76
}
71
77
72
78
handleSubjectEntry(event: Object, data: Object) {
···
99
105
),
100
106
(value, time) => injectionFunction(value, time), // event callback
101
107
null, // start callback
102
-
this.props.experimentActions.stop, // stop callback
108
+
null, // stop callback
103
109
this.props.params.showProgessBar
104
110
);
105
111
return timeline;
···
180
186
render() {
181
187
return (
182
188
<div className={styles.mainContainer} data-tid="container">
183
-
<Grid columns={1} divided relaxed>
189
+
<Grid
190
+
columns={1}
191
+
divided
192
+
relaxed
193
+
className={styles.experimentContainer}
194
+
>
184
195
<Grid.Row centered>{this.renderExperiment()}</Grid.Row>
185
196
</Grid>
186
197
<InputModal