From f3eb2c4cdb82a8f4c5518b8ec6c461a641a12939 Mon Sep 17 00:00:00 2001 From: David Ralph Date: Tue, 23 Mar 2021 11:45:09 +0000 Subject: [PATCH] feat: better digital clock settings and greeting now changes properly --- README.md | 12 ++- manifest/background-opera.js | 14 --- manifest/opera.json | 17 --- package.json | 3 +- .../main/settings/sections/Appearance.jsx | 7 +- .../modals/main/settings/sections/Time.jsx | 16 ++- src/components/widgets/greeting/Greeting.jsx | 97 +++++++++-------- src/components/widgets/time/Clock.jsx | 102 +++++++++--------- 8 files changed, 127 insertions(+), 141 deletions(-) delete mode 100644 manifest/background-opera.js delete mode 100644 manifest/opera.json diff --git a/README.md b/README.md index 1a554fb3..a5ee1d79 100644 --- a/README.md +++ b/README.md @@ -18,8 +18,9 @@ Mue is a fast, open and free-to-use browser extension that gives a new, fresh an * [Installation](#installation) * [Chrome](#chrome) * [Firefox](#firefox) - * [Chromium](#edge-chromium) - * [Opera/Other](#operaother) + * [Edge Chromium](#edge-chromium) + * [Naver](#naver) + * [Other](#other) * [Contributing](#development) * [Requirements](#requirements) * [Starting](#starting) @@ -60,7 +61,12 @@ Please see our [roadmap](https://github.com/mue/mue/projects) ### Edge (Chromium) ~~[Microsoft Edge Addons](https://microsoftedge.microsoft.com/addons/detail/aepnglgjfokepefimhbnibfjekidhmja)~~ Currently outdated, please use the Chrome Web Store version -### Opera/Other +### Naver +[Whale Store](https://store.whale.naver.com/detail/ecllekeilcmicbfkkiknfdddbogibbnc) + +### Other +Please note that we have dropped support for Opera as of Mue 5.0 + [GitHub Releases](https://github.com/mue/mue/releases) ### Development diff --git a/manifest/background-opera.js b/manifest/background-opera.js deleted file mode 100644 index 4624da3f..00000000 --- a/manifest/background-opera.js +++ /dev/null @@ -1,14 +0,0 @@ -/* eslint-disable no-undef */ -//Source https://forums.opera.com/topic/25046/how-to-disable-completely-the-speed-dial/14 - -chrome.tabs.onCreated.addListener((tab) => { - if (tab.status === 'complete' && tab.url === 'chrome://startpage/') chrome.tabs.update(tab.id, { - url: chrome.extension.getURL('index.html') - }); -}); - -chrome.tabs.onUpdated.addListener((tabId, changeInfo, tab) => { - if (changeInfo.status === 'complete' && tab.url === 'chrome://startpage/') chrome.tabs.update(tabId, { - url: chrome.extension.getURL('index.html') - }); -}); diff --git a/manifest/opera.json b/manifest/opera.json deleted file mode 100644 index 3c7338cc..00000000 --- a/manifest/opera.json +++ /dev/null @@ -1,17 +0,0 @@ -{ - "manifest_version": 2, - "name": "Mue", - "description": "Fast, open and free-to-use new tab page for most modern browsers.", - "version": "5.0.0", - "browser_action": { - "default_icon": "icons/128x128.png" - }, - "background": { - "scripts": [ - "./background-opera.js" - ] - }, - "permissions": [ - "tabs" - ] -} diff --git a/package.json b/package.json index 45bcf3f1..53210eba 100644 --- a/package.json +++ b/package.json @@ -48,8 +48,7 @@ "start": "webpack serve", "build": "webpack --mode=production", "chrome": "cp manifest/chrome.json build/manifest.json", - "firefox": "cp manifest/firefox.json build/manifest.json", - "opera": "cp manifest/opera.json build/manifest.json && cp manifest/background-opera.js build/" + "firefox": "cp manifest/firefox.json build/manifest.json" }, "eslintConfig": { "extends": "react-app" diff --git a/src/components/modals/main/settings/sections/Appearance.jsx b/src/components/modals/main/settings/sections/Appearance.jsx index ddacd4c2..06c26fb8 100644 --- a/src/components/modals/main/settings/sections/Appearance.jsx +++ b/src/components/modals/main/settings/sections/Appearance.jsx @@ -9,7 +9,7 @@ import Text from '../Text'; export default function AppearanceSettings() { const { appearance } = window.language.modals.main.settings.sections; - let themeOptions = [ + const themeOptions = [ { 'name': 'Auto', 'value': 'auto' @@ -17,11 +17,12 @@ export default function AppearanceSettings() { { 'name': 'Light', 'value': 'light' - }, { + }, + { 'name': 'Dark', 'value': 'dark' } - ] + ]; return ( <> diff --git a/src/components/modals/main/settings/sections/Time.jsx b/src/components/modals/main/settings/sections/Time.jsx index 857d9997..172a83d2 100644 --- a/src/components/modals/main/settings/sections/Time.jsx +++ b/src/components/modals/main/settings/sections/Time.jsx @@ -3,6 +3,7 @@ import React from 'react'; import Checkbox from '../Checkbox'; import Dropdown from '../Dropdown'; import Switch from '../Switch'; +import Radio from '../Radio'; export default class TimeSettings extends React.PureComponent { constructor(...args) { @@ -19,12 +20,23 @@ export default class TimeSettings extends React.PureComponent { let timeSettings; + const digitalOptions = [ + { + 'name': '24 hour', + 'value': 'twentyfourhour' + }, + { + 'name': '12 hour', + 'value': 'twelvehour' + } + ]; + const digitalSettings = ( <>

{time.digital.title}

+ +
- - ); diff --git a/src/components/widgets/greeting/Greeting.jsx b/src/components/widgets/greeting/Greeting.jsx index b6b84718..cb2cef48 100644 --- a/src/components/widgets/greeting/Greeting.jsx +++ b/src/components/widgets/greeting/Greeting.jsx @@ -10,6 +10,7 @@ export default class Greeting extends React.PureComponent { this.state = { greeting: '' }; + this.timer = undefined; this.language = window.language.widgets.greeting; } @@ -42,61 +43,65 @@ export default class Greeting extends React.PureComponent { return Math.abs(birthday.getUTCFullYear() - 1970); } - getGreeting() { - const now = new Date(); - const hour = now.getHours(); + getGreeting(time = (60000 - Date.now() % 60000)) { + this.timer = setTimeout(() => { + const now = new Date(); + const hour = now.getHours(); - // Set the default greeting string to "Good evening" - let message = this.language.evening; - // If it's before 12am, set the greeting string to "Good morning" - if (hour < 12) { - message = this.language.morning; - // If it's before 6pm, set the greeting string to "Good afternoon" - } else if (hour < 18) { - message = this.language.afternoon; - } - - // Events - message = this.doEvents(now, message); - - const custom = localStorage.getItem('defaultGreetingMessage'); - if (custom === 'false') { - message = ''; - } - - // Name - let name = ''; - const data = localStorage.getItem('greetingName'); - - if (typeof data === 'string') { - if (data.replace(/\s/g, '').length > 0) { - name = `, ${data.trim()}`; + // Set the default greeting string to "Good evening" + let message = this.language.evening; + // If it's before 12am, set the greeting string to "Good morning" + if (hour < 12) { + message = this.language.morning; + // If it's before 6pm, set the greeting string to "Good afternoon" + } else if (hour < 18) { + message = this.language.afternoon; } - } - if (custom === 'false') { - name = name.replace(',', ''); - } + // Events + message = this.doEvents(now, message); - // Birthday - const birth = new Date(localStorage.getItem('birthday')); - if (localStorage.getItem('birthdayenabled') === 'true' && birth.getDate() === now.getDate() && birth.getMonth() === now.getMonth()) { - if (localStorage.getItem('birthdayage')) { - const text = this.language.birthday.split(' '); - message = `${text[0]} ${dtf.nth(this.calculateAge(birth))} ${text[1]}`; - } else { - message = this.language.birthday; + const custom = localStorage.getItem('defaultGreetingMessage'); + if (custom === 'false') { + message = ''; } - } - // Set the state to the greeting string - this.setState({ - greeting: `${message}${name}` - }); + // Name + let name = ''; + const data = localStorage.getItem('greetingName'); + + if (typeof data === 'string') { + if (data.replace(/\s/g, '').length > 0) { + name = `, ${data.trim()}`; + } + } + + if (custom === 'false') { + name = name.replace(',', ''); + } + + // Birthday + const birth = new Date(localStorage.getItem('birthday')); + if (localStorage.getItem('birthdayenabled') === 'true' && birth.getDate() === now.getDate() && birth.getMonth() === now.getMonth()) { + if (localStorage.getItem('birthdayage')) { + const text = this.language.birthday.split(' '); + message = `${text[0]} ${dtf.nth(this.calculateAge(birth))} ${text[1]}`; + } else { + message = this.language.birthday; + } + } + + // Set the state to the greeting string + this.setState({ + greeting: `${message}${name}` + }); + + this.getGreeting(); + }, time); } componentDidMount() { - this.getGreeting(); + this.getGreeting(0); } render() { diff --git a/src/components/widgets/time/Clock.jsx b/src/components/widgets/time/Clock.jsx index 6714ae5a..f03033f4 100644 --- a/src/components/widgets/time/Clock.jsx +++ b/src/components/widgets/time/Clock.jsx @@ -21,69 +21,63 @@ export default class Clock extends React.PureComponent { const timeType = localStorage.getItem('timeType'); - // Percentage - if (timeType === 'percentageComplete') { - return this.setState({ - time: (now.getHours() / 24).toFixed(2).replace('0.', '') + '%' - }); - } - - // Analog clock - if (timeType === 'analogue') { - // load analog clock css - require('react-clock/dist/Clock.css'); - - this.setState({ - time: now - }); - } else { - // Default clock - let time, sec = ''; - const zero = localStorage.getItem('zero'); - - if (localStorage.getItem('seconds') === 'true') { - if (zero === 'false') { - sec = ':' + now.getSeconds(); - } else { - sec = `:${('00' + now.getSeconds()).slice(-2)}`; - } - } - - if (localStorage.getItem('24hour') === 'true') { - if (zero === 'false') { - time = `${now.getHours()}:${now.getMinutes()}${sec}`; - } else { - time = `${('00' + now.getHours()).slice(-2)}:${('00' + now.getMinutes()).slice(-2)}${sec}`; - } + switch (timeType) { + case 'percentageComplete': + this.setState({ + time: (now.getHours() / 24).toFixed(2).replace('0.', '') + '%' + }); + break; + case 'analogue': + // load analog clock css + require('react-clock/dist/Clock.css'); this.setState({ - time: time + time: now }); - } else { - // 12 hour support - let hours = now.getHours(); + break; + default: + // Default clock + let time, sec = ''; + const zero = localStorage.getItem('zero'); - if (hours > 12) { - hours -= 12; + if (localStorage.getItem('seconds') === 'true') { + if (zero === 'false') { + sec = ':' + now.getSeconds(); + } else { + sec = `:${('00' + now.getSeconds()).slice(-2)}`; + } } - // Toggle AM/PM - let ampm = now.getHours() > 11 ? 'PM' : 'AM'; - if (localStorage.getItem('ampm') === 'false') { - ampm = ''; - } + if (localStorage.getItem('timeformat') === 'twentyfourhour') { + if (zero === 'false') { + time = `${now.getHours()}:${('00' + now.getMinutes()).slice(-2)}${sec}`; + } else { + time = `${('00' + now.getHours()).slice(-2)}:${('00' + now.getMinutes()).slice(-2)}${sec}`; + } - if (zero === 'false') { - time = `${hours}:${now.getMinutes()}${sec}`; + this.setState({ + time: time + }); } else { - time = `${('00' + hours).slice(-2)}:${('00' + now.getMinutes()).slice(-2)}${sec}`; - } + // 12 hour + let hours = now.getHours(); - this.setState({ - time: time, - ampm: ampm - }); - } + if (hours > 12) { + hours -= 12; + } + + if (zero === 'false') { + time = `${hours}:${now.getMinutes()}${sec}`; + } else { + time = `${('00' + hours).slice(-2)}:${('00' + now.getMinutes()).slice(-2)}${sec}`; + } + + this.setState({ + time: time, + ampm: now.getHours() > 11 ? 'PM' : 'AM' + }); + } + break; } this.startTime();