diff --git a/CHANGELOG.md b/CHANGELOG.md index 95a7964..852429d 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -5,6 +5,12 @@ All notable changes to this project will be documented in this file. The format is based on [Keep a Changelog](https://keepachangelog.com/en/1.0.0/), and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0.html). +## [1.2.0] - 2021-06-01 + +### Added + +- Progress bar + ## [1.1.2] - 2021-05-31 ### Fixed diff --git a/package.json b/package.json index 152099b..50a2acf 100644 --- a/package.json +++ b/package.json @@ -11,7 +11,7 @@ "repository": { "url": "https://github.com/cupcakearmy/unpixel" }, - "version": "1.1.2", + "version": "1.2.0", "main": "./dist/back/index.js", "scripts": { "start": "electron .", diff --git a/src/back/updater.ts b/src/back/updater.ts index fc54d4e..2d6575f 100644 --- a/src/back/updater.ts +++ b/src/back/updater.ts @@ -38,7 +38,6 @@ export default class Updater { .then(({ response }) => { if (response === 0) { shell.openExternal('https://github.com/cupcakearmy/unpixel/releases') - process.exit(0) } }) } else { diff --git a/src/front/banner/index.css b/src/front/banner/index.css index a823e5f..1523f7b 100644 --- a/src/front/banner/index.css +++ b/src/front/banner/index.css @@ -19,11 +19,6 @@ main { align-items: center; } -h1 { - border-bottom: 0.5em solid currentColor; - padding-bottom: 0.15em; -} - .countdown { font-size: min(8rem, 25vh); } @@ -58,3 +53,16 @@ button { button:hover { background-color: #2c2cce; } + +.progress { + width: 100%; + height: 3rem; + border: 0.125rem solid currentColor; +} + +.progress > div { + background-color: currentColor; + height: 100%; + width: 100%; + transition: width ease-out 250ms; +} diff --git a/src/front/banner/index.tsx b/src/front/banner/index.tsx index 9f3a294..9d00277 100644 --- a/src/front/banner/index.tsx +++ b/src/front/banner/index.tsx @@ -30,6 +30,8 @@ const Banner: React.FC = () => { const [done, setDone] = useState(false) const [auto, setAuto] = useState(false) + const [progress, setProgress] = useState(100) + const [max, setMax] = useState(0) const [countdown, setCountdown] = useState(null) const handler = useCallback( @@ -57,16 +59,26 @@ const Banner: React.FC = () => { } }, [countdown]) + useEffect(() => { + if (countdown !== null) { + setProgress((countdown / max) * 100) + } + }, [countdown, max]) + useEffect(() => { const autoClose = ipcRenderer.sendSync('load', { key: 'autoClose' }) setAuto(autoClose) const time = ipcRenderer.sendSync('load', { key: 'duration' }) setCountdown(time) + setMax(time) }, []) return (
-

Look Away

+

Look Away

+
+
+
{countdown}
Look at least 6 meters away.