Skip to content

Commit f2a678b

Browse files
jacobkroljacobkrol
committed
Update to v1.3.0
1 parent ad1ff30 commit f2a678b

27 files changed

+17028
-118
lines changed

‎package-lock.json‎

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

‎package.json‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -4,12 +4,12 @@
44
"private": true,
55
"homepage": "https://kroljs.com/LP-Timer",
66
"dependencies": {
7+
"gh-pages": "3.0.0",
78
"react": "^16.13.1",
89
"react-dom": "^16.13.1",
9-
"react-icons": "^3.10.0",
10+
"react-icons": "^4.2.0",
1011
"react-router-dom": "^5.2.0",
1112
"react-scripts": "3.4.1",
12-
"gh-pages": "3.0.0",
1313
"whatwg-fetch": "3.2.0"
1414
},
1515
"scripts": {

‎src/components/App.js‎

Lines changed: 52 additions & 18 deletions
Original file line numberDiff line numberDiff line change
@@ -1,38 +1,72 @@
1-
import React from 'react';
1+
import React, { useState } from 'react';
22
import {
33
HashRouter as Router,
44
Switch,
55
Route
66
} from 'react-router-dom';
77

88
import GotoHome from './utilities/GotoHome';
9+
import GotoSettings from './utilities/GotoSettings';
10+
import Settings from './utilities/Settings';
911
import Footer from './utilities/Footer';
1012
import HomePage from './pages/HomePage';
1113
import ExtPage from './pages/ExtPage';
1214
import ImpPage from './pages/ImpPage';
1315
import TimerPage from './pages/TimerPage';
1416
import GuidePage from './pages/GuidePage';
1517
import AboutPage from './pages/AboutPage';
18+
import TOSPage from './pages/TOSPage';
1619
import Error404Page from './pages/Error404Page';
20+
import PrivacyPage from './pages/PrivacyPage';
1721

1822
function App() {
19-
return (
20-
<Router basename="/">
21-
<div className="page-container">
22-
<GotoHome />
23-
<Switch>
24-
<Route exact path="/" component={HomePage} />
25-
<Route path="/ext" component={ExtPage} />
26-
<Route path="/imp" component={ImpPage} />
27-
<Route path="/timer" component={TimerPage} />
28-
<Route path="/guide" component={GuidePage} />
29-
<Route path="/about" component={AboutPage} />
30-
<Route component={Error404Page} />
31-
</Switch>
32-
<Footer />
33-
</div>
34-
</Router>
35-
)
23+
const initSettings = {
24+
"delay": 0,
25+
"durationMin": 7,
26+
"durationSec": "00",
27+
"showMS": false
28+
};
29+
const [settingsOpen, setSettingsOpen] = useState(false);
30+
const [settings, setSettings] = useState(initSettings);
31+
// const [absoluteHome, setAbsoluteHome] = useState(true);
32+
// const [showGotoSettings, setShowGotoSettings] = useState(false);
33+
34+
// useEffect(() => {
35+
// console.log("effect");
36+
// setAbsoluteHome(window.location.pathname === "/LP-Timer/");
37+
// setShowGotoSettings(["/","/ext","/imp","/timer"]
38+
// .includes(window.location.href.match(/(?<=LP-Timer\/#)\/\w*/g)[0]));
39+
// }, [window.location.pathname, setAbsoluteHome, setShowGotoSettings]);
40+
41+
return (
42+
<Router basename="/">
43+
<div className="page-container">
44+
<div id="goto-row">
45+
<GotoHome />
46+
<GotoSettings setOpen={setSettingsOpen} />
47+
</div>
48+
<Settings open={settingsOpen} settings={settings} setOpen={setSettingsOpen} setSettings={setSettings} />
49+
<Switch>
50+
<Route exact path="/" component={HomePage} />
51+
<Route path="/ext">
52+
<ExtPage min={settings.durationMin} delay={settings.delay} />
53+
</Route>
54+
<Route path="/imp">
55+
<ImpPage min={settings.durationMin} delay={settings.delay} />
56+
</Route>
57+
<Route path="/timer">
58+
<TimerPage min={settings.durationMin} delay={settings.delay} showMS={settings.showMS} />
59+
</Route>
60+
<Route path="/guide" component={GuidePage} />
61+
<Route path="/about" component={AboutPage} />
62+
<Route path="/terms" component={TOSPage} />
63+
<Route path="/privacy" component={PrivacyPage} />
64+
<Route component={Error404Page} />
65+
</Switch>
66+
<Footer />
67+
</div>
68+
</Router>
69+
)
3670
}
3771

3872
export default App;

‎src/components/pages/AboutPage.js‎

Lines changed: 3 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -8,14 +8,13 @@ function AboutPage() {
88
<div id="about-page">
99
<h1>About this App</h1>
1010
<h3>Submit Feedback</h3>
11-
<p>Found a bug? Encountered an accessibility concern? Want to see a new feature added? Let me know!</p>
11+
<p>Found a bug? Encountered an accessibility concern? Want to see a new feature added? Let me know! The following information helps me to follow through and follow up to the best of my ability.</p>
1212
<Form />
1313
<p><FiAlertTriangle size={15} title="attention" /> Before submitting feedback, please check <a href="https://github.com/jacobkrol/LP-Timer/issues" target="_blank" rel="noopener noreferrer">if I am already working on it</a>.</p>
14-
<h3>App Infrastructure</h3>
15-
<p>The front-end for this progressive web application is built using the JavaScript framework, <a href="https://reactjs.org" target="_blank" rel="noopener noreferrer">ReactJS v16.13.1</a>. It is hosted on GitHub Pages, and the code is entirely open-source for you to read, nitpick, and expand upon. The pre-build files may be found on <a href="https://github.com/jacobkrol/LP-Timer" target="_blank" rel="noopener noreferrer">GitHub</a>.</p>
16-
<p>To handle feedback submission, the back-end is built using <a href="https://nodejs.org" target="_blank" rel="noopener noreferrer">Node.js v13.8.0</a>, with the <a href="https://expressjs.com" target="_blank" rel="noopener noreferrer">Express v4.17.1</a> framework. It is hosted using <a href="https://heroku.com" target="_blank" rel="noopener noreferrer">Heroku</a> and implements a CORS-protected REST API endpoint for feedback submission. Feedback is submitted to the database through the endpoint, and via email through an SMTP client. Feedback review is strictly available through the <a href="https://devcenter.heroku.com/articles/heroku-cli" target="_blank" rel="noopener noreferrer">Heroku CLI v7.42.1</a> or through a locally-accessible endpoint.</p>
1714
<h3>Licensing</h3>
1815
<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>
16+
<h3>Updates</h3>
17+
<p>This is LP Timer PWA v1.3.0. 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>
1918
</div>
2019
)
2120
}

‎src/components/pages/ExtPage.js‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,10 +1,10 @@
11
import React from 'react';
22
import Timer from '../utilities/Timer';
33

4-
function ExtPage() {
4+
function ExtPage({ min=7, delay=0 }) {
55
return (
66
<>
7-
<Timer mode="ext" min={7} />
7+
<Timer mode="ext" min={min} delay={delay} />
88
</>
99
)
1010
}

‎src/components/pages/GuidePage.js‎

Lines changed: 5 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
import React from 'react';
22
import '../../styles/GuidePage.css';
33
import { Link } from 'react-router-dom';
4-
import { FaPlay, FaPause, FaStop, FaVolumeMute } from 'react-icons/fa';
4+
import { FaPlay, FaPause, FaStop, FaVolumeMute, FaHourglassEnd } from 'react-icons/fa';
55
import { FiShare } from 'react-icons/fi';
66
import { RiAddBoxLine } from 'react-icons/ri';
77
import { BsThreeDotsVertical } from 'react-icons/bs';
@@ -15,9 +15,11 @@ function HowPage() {
1515
<p>Navigate to the <Link to="/">home page</Link> at any time using the <img id="logo-tiny" src={LPLogo} alt="logo" /> in the top left corner of every page.</p>
1616
<p>Click <FaPlay className="button" size={12} title="play" /> or press SPACE to begin or resume the timer. Click <FaPause className="button" size={12} title="pause" /> or press SPACE to pause the timer. Click <FaStop className="button" size={12} title="stop" /> to stop and reset the timer. Refreshing the page also resets the timer.</p>
1717
<p><strong>Status: Off</strong> represents a new timer.</p>
18+
<p><strong>Status: Starting</strong> is during a user-specified delay/countdown, after which your timer will begin.</p>
19+
<p><strong>Status: Previewing</strong> displays during a preview of the visual (and verbal, if applicable) signals you will receive when the timer is running.</p>
1820
<p><strong>Status: Running</strong> means the timer is running (even if you can't see it!)</p>
1921
<p><strong>Status: Paused</strong> represents a timer that has started, but has been paused by the user. When it is resumed, it will continue where it was when paused.</p>
20-
<p> The <span id="timer-anim-ex" aria-label="indicator"></span> in the top-left corner of each timer serves as an additional indicator that the timer is running.</p>
22+
<p> The <FaHourglassEnd title="hourglass" size={12} /> in the top-left corner of each timer serves as an additional indicator that the timer is running.</p>
2123

2224
<h3>Extemporaneous Timer</h3>
2325
<p><strong>Duration:</strong> 7 minutes</p>
@@ -40,7 +42,7 @@ function HowPage() {
4042
<p><sup>2</sup>&nbsp;&nbsp;&lt;1.0Mb. Check the <a href="https://github.com/jacobkrol/LP-Timer/releases" target="_blank" rel="noopener noreferrer">latest release</a> for a more accurate estimate.</p>
4143
</span>
4244
<h3>More Info</h3>
43-
<p>To read more about how this website works (for the other nerds), or to submit a bug / feature request for review, visit the <Link to="/about">about page</Link>.</p>
45+
<p>To submit a bug / feature request for review, or to read about nitty-gritty things like licencing and versioning, visit the <Link to="/about">about page</Link>.</p>
4446
</div>
4547
)
4648
}

‎src/components/pages/ImpPage.js‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,10 +1,10 @@
11
import React from 'react';
22
import Timer from '../utilities/Timer';
33

4-
function ImpPage() {
4+
function ImpPage({ min=7, delay=0 }) {
55
return (
66
<>
7-
<Timer mode="imp" min={7} />
7+
<Timer mode="imp" min={min} delay={delay} />
88
</>
99
)
1010
}

‎src/components/pages/PrivacyPage.js‎

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

0 commit comments

Comments
 (0)