Skip to content

Commit 5b745ab

Browse files
jacobkroljacobkrol
committed
feat: added reading time signal and hint, fixed missing signal bug, footer cleanup
1 parent ecd9278 commit 5b745ab

File tree

9 files changed

+18026
-21847
lines changed

9 files changed

+18026
-21847
lines changed

‎package-lock.json‎

Lines changed: 17988 additions & 21831 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎package.json‎

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,15 +1,15 @@
11
{
22
"name": "lptimer",
3-
"version": "1.4.0",
3+
"version": "1.5.0",
44
"private": true,
55
"homepage": "https://kroljs.com/LP-Timer",
66
"dependencies": {
7-
"gh-pages": "3.0.0",
7+
"gh-pages": "^6.3.0",
88
"react": "^16.13.1",
99
"react-dom": "^16.13.1",
1010
"react-icons": "^4.2.0",
1111
"react-router-dom": "^5.2.0",
12-
"react-scripts": "3.4.1",
12+
"react-scripts": "^5.0.1",
1313
"whatwg-fetch": "3.2.0"
1414
},
1515
"scripts": {

‎src/audio/0-seconds-verbal.wav‎

31.4 KB
Binary file not shown.

‎src/components/App.js‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -21,7 +21,7 @@ import PrivacyPage from './pages/PrivacyPage';
2121

2222
function App() {
2323
const initSettings = {
24-
"delay": 0,
24+
"delay": 15,
2525
"durationMin": 7,
2626
"signalDuration": 5,
2727
"showMS": false,

‎src/components/pages/AboutPage.js‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -2,7 +2,7 @@ import React from 'react';
22
import Form from '../utilities/Form';
33
import '../../styles/AboutPage.css';
44
import { FiAlertTriangle } from 'react-icons/fi';
5-
import { version } from '../../../package.json';
5+
import pkg from '../../../package.json';
66

77
function AboutPage() {
88
return (
@@ -15,7 +15,7 @@ function AboutPage() {
1515
<h3>Licensing</h3>
1616
<p>The limited preparation timer progressive web application is open-sourced under a MIT license. To read the conditions of this license, visit the <a href="https://github.com/jacobkrol/LP-Timer/blob/master/LICENSE" target="_blank" rel="noopener noreferrer">LICENSE file in the host repository</a>.</p>
1717
<h3>Updates</h3>
18-
<p>This is LP Timer PWA v{version}. You can check for the latest version <a href="https://github.com/jacobkrol/LP-Timer/releases" target="_blank" rel="noopener noreferrer">on the project releases page</a>.</p>
18+
<p>This is LP Timer PWA v{pkg.version}. You can check for the latest version <a href="https://github.com/jacobkrol/LP-Timer/releases" target="_blank" rel="noopener noreferrer">on the project releases page</a>.</p>
1919
</div>
2020
)
2121
}

‎src/components/pages/ImpPage.js‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
import React from 'react';
22
import Timer from '../utilities/Timer';
33

4-
function ImpPage({ min=7, delay=0, showTips=true, signalDuration=5 }) {
4+
function ImpPage({ min=7, delay=15, showTips=true, signalDuration=5 }) {
55
return (
66
<>
77
<Timer mode="imp" min={min} delay={delay} showTips={showTips} signalDuration={signalDuration} />

‎src/components/utilities/Footer.js‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -8,7 +8,7 @@ function Footer() {
88
<p><Link to="/about">About LP Timer</Link></p>
99
<p><Link to="/terms">Terms of Service</Link></p>
1010
<p><Link to="/privacy">Privacy Policy</Link></p>
11-
<p><span style={{fontFamily: "Verdana, Calibri, sans-serif"}}>&copy;</span> 2020-2021 <a href="https://kroljs.com" target="_blank" rel="noopener noreferrer">Jacob Krol</a></p>
11+
<p><span style={{fontFamily: "Verdana, Calibri, sans-serif"}}>&copy;</span> {new Date().getFullYear()} <a href="https://kroljs.com" target="_blank" rel="noopener noreferrer">Jacob Krol</a></p>
1212
</footer>
1313
)
1414
}

‎src/components/utilities/Form.js‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -2,7 +2,7 @@ import React from 'react';
22
import { Link } from 'react-router-dom';
33
import 'whatwg-fetch';
44
import '../../styles/Form.css';
5-
import { version } from '../../../package.json';
5+
import pkg from '../../../package.json';
66

77
class Form extends React.Component {
88
state = {
@@ -93,7 +93,7 @@ class Form extends React.Component {
9393
getFormData = () => {
9494
let data = {...this.state};
9595
delete data.disabled;
96-
data['version'] = version;
96+
data['version'] = pkg.version;
9797
return JSON.stringify(data);
9898
}
9999

‎src/components/utilities/Timer.js‎

Lines changed: 28 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -11,6 +11,7 @@ import {
1111
FaHourglassEnd
1212
} from 'react-icons/fa';
1313
import '../../styles/Timer.css';
14+
import Verbal0 from '../../audio/0-seconds-verbal.wav';
1415
import Verbal30 from '../../audio/30-seconds-verbal.wav';
1516
import Verbal60 from '../../audio/60-seconds-verbal.wav';
1617
import Verbal90 from '../../audio/90-seconds-verbal.wav';
@@ -34,7 +35,7 @@ class Timer extends React.PureComponent {
3435
signalText: null, //string of hand signals
3536
isOvertime: false, //boolean flagging overtime
3637
isMuted: true, //boolean to mute verbals
37-
playVerbal: 0, //int 0,30,60,90 for last verbal given
38+
playVerbal: -1, //int -1,0,30,60,90 for last verbal given
3839
hourglass: 0, //0 stopped, 1 - 3 moving
3940
delaySignals: false, //override to toggle signal display
4041
previewMeta: null //meta text for previewing
@@ -63,7 +64,10 @@ class Timer extends React.PureComponent {
6364
if(this.state.playVerbal !== prevState.playVerbal && !this.state.isMuted) {
6465
let verbal;
6566
switch(this.state.playVerbal) {
67+
case -1:
68+
break;
6669
case 0:
70+
if(this.props.delay > 0) verbal = Verbal0;
6771
break;
6872
case 30:
6973
verbal = Verbal30;
@@ -159,7 +163,7 @@ class Timer extends React.PureComponent {
159163
sec = Math.ceil((this.props.delay*1000-(now-this.state.delayT))/1000);
160164
this.setState({signalText: sec});
161165
if(sec === 0) {
162-
this.setState({signalText: null});
166+
this.setState({signalText: null, playVerbal: 0});
163167
this.startTimer();
164168
}
165169
}
@@ -170,12 +174,17 @@ class Timer extends React.PureComponent {
170174
const now = (new Date()).getTime();
171175
const ms = now-this.state.previewT;
172176

173-
const verbalPreviews = [
177+
const readingTimePreviews = [
178+
{ action: () => this.setState({previewMeta: "When your reading time is over, you will hear..."}), duration: 2500 },
179+
{ action: () => this.setState({previewMeta: null, playVerbal: 0}), duration: 2000 }
180+
];
181+
const regularVerbalPreviews = [
174182
{ action: () => this.setState({previewMeta: "During prep, you will hear..."}), duration: 2500 },
175183
{ action: () => this.setState({previewMeta: null, playVerbal: 30}), duration: 2000 },
176184
{ action: () => this.setState({playVerbal: 60}), duration: 2000 },
177185
{ action: () => this.setState({playVerbal: 90}), duration: 2000 }
178186
];
187+
const verbalPreviews = this.props.delay ? readingTimePreviews.concat(regularVerbalPreviews) : regularVerbalPreviews;
179188
let handPreviews = [
180189
{ action: () => this.setState({previewMeta: "While speaking, you will receive..."}), duration: 2400 },
181190
{ action: () => this.setState({previewMeta: null}), duration: 100 }
@@ -313,7 +322,9 @@ class Timer extends React.PureComponent {
313322
signalText: null,
314323
status: "off",
315324
hourglass: 0,
316-
previewMeta: null
325+
previewMeta: null,
326+
playVerbal: -1,
327+
isOvertime: false
317328
}, () => {
318329
document.getElementById("timer-status").innerText = this.state.status[0].toUpperCase()+this.state.status.substr(1);
319330
});
@@ -323,6 +334,7 @@ class Timer extends React.PureComponent {
323334
switch(evt.keyCode) {
324335
case 32:
325336
//space bar
337+
if(this.state.status === "starting") break;
326338
this.state.status === "running" ? this.pauseTimer() : this.startTimer();
327339
break;
328340
case 13:
@@ -351,7 +363,7 @@ class Timer extends React.PureComponent {
351363
: null
352364
}
353365
{["imp","ext"].includes(this.props.mode)
354-
? <FaEye id="preview-button" onClick={this.startPreview} title="preview signals" size={30} />
366+
? <FaEye id="preview-button" style={this.state.status !== "off" ? {cursor: "not-allowed"} : {}} onClick={this.startPreview} title="preview signals" size={30} />
355367
: null
356368
}
357369
</div>
@@ -369,7 +381,17 @@ class Timer extends React.PureComponent {
369381
: this.state.status === "paused"
370382
? "resume"
371383
: "[error]"}.`}</p>
372-
<p>{this.state.isMuted ? null : "Press ENTER to mute remaining verbal signals."}</p>
384+
{this.props.mode === "imp" && <p>{this.state.isMuted ? "\u00A0" : "Press ENTER to mute remaining verbal signals."}</p>}
385+
<p>{this.state.status === "off"
386+
? this.props.delay > 0
387+
? this.props.mode === "imp"
388+
? `You will receive ${this.props.delay}s of reading time.`
389+
: `Your time will begin after a ${this.props.delay}s delay.`
390+
: this.props.mode === "imp"
391+
? "You will not receive reading time."
392+
: "Your time will begin immediately on start."
393+
: "\u00A0" // blank
394+
}</p>
373395
</div>
374396
: null
375397
}

0 commit comments

Comments
 (0)