Massive Update

Co-authored-by: Alex Sparkes <turbomarshmello@gmail.com>
Co-authored-by: Wessel Tip <discord@go2it.eu>
Co-authored-by: Isaac Saunders <contact@eartharoid.me>
This commit is contained in:
David Ralph
2020-08-10 19:49:46 +01:00
parent 80b1ef6ab4
commit 21ae1ff461
31 changed files with 1017 additions and 454 deletions

View File

@@ -1,4 +1,3 @@
//* Imports
import React from 'react';
import Background from './components/Background';
import Clock from './components/Clock';
@@ -7,50 +6,34 @@ import Quote from './components/Quote';
import Search from './components/Search';
import Credit from './components/Credit';
import Navbar from './components/Navbar';
import Toast from './components/Toast';
import { ToastContainer } from 'react-toastify';
import Modal from 'react-modal';
import './scss/index.scss';
import './scss/index.scss';
import 'react-toastify/dist/ReactToastify.css';
const defaultSettings = require('./modules/defaultSettings.json');
const Settings = React.lazy(() => import('./components/Settings'));
const Update = React.lazy(() => import('./components/Update'));
const renderLoader = () => <div></div>;
//* App
export default class App extends React.Component {
// Modal stuff
export default class App extends React.PureComponent {
constructor(props) {
super(props);
this.state = {
settingsModal: false,
this.state = {
settingsModal: false,
updateModal: false
};
}
setDefaultSettings() {
localStorage.clear();
localStorage.setItem('time', true);
localStorage.setItem('greeting', true);
localStorage.setItem('background', true);
localStorage.setItem('quote', true);
localStorage.setItem('searchBar', true);
localStorage.setItem('blur', 0);
localStorage.setItem('copyButton', false);
localStorage.setItem('seconds', false);
localStorage.setItem('24hour', false);
localStorage.setItem('offlineMode', false);
localStorage.setItem('webp', false);
localStorage.setItem('events', true);
localStorage.setItem('customBackgroundColour', '');
localStorage.setItem('customBackground', '');
localStorage.setItem('greetingName', '');
localStorage.setItem('defaultGreetingMessage', true);
defaultSettings.forEach(element => localStorage.setItem(element.name, element.value));
// Set theme depending on user preferred
if (window.matchMedia && window.matchMedia('(prefers-color-scheme: dark)').matches) localStorage.setItem('darkTheme', true);
else localStorage.setItem('darkTheme', false);
localStorage.setItem('darkTheme', false);
// if (window.matchMedia && window.matchMedia('(prefers-color-scheme: dark)').matches) localStorage.setItem('darkTheme', true);
//else localStorage.setItem('darkTheme', false);
// Finally we set this to true so it doesn't run the function on every load
localStorage.setItem('firstRun', true);
@@ -62,27 +45,31 @@ export default class App extends React.Component {
if (!localStorage.getItem('firstRun')) this.setDefaultSettings();
let modalClassList = 'Modal';
const darkTheme = localStorage.getItem('darkTheme');
if (darkTheme === 'true') modalClassList = 'Modal dark';
if (localStorage.getItem('darkTheme') === 'true') modalClassList = 'Modal dark';
let overlayClassList = 'Overlay';
if (localStorage.getItem('animations') === 'true') overlayClassList = 'Overlay modal-animation';
let language = require(`./translations/${localStorage.getItem('language')}.json`);
return (
<React.Fragment>
<div id='backgroundImage'></div>
<Background/>
<ToastContainer className='toast' position='bottom-right' autoClose={2500} hideProgressBar={false} newestOnTop={true} closeOnClick rtl={false} pauseOnFocusLoss />
<div id='center'>
<Search/>
<Search language={language.search} />
<Navbar settingsModalOpen={() => this.setState({ settingsModal: true })} updateModalOpen={() => this.setState({ updateModal: true })} />
<Greeting/>
<Clock/>
<Quote />
<Credit/>
<Toast/>
<Greeting language={language.greeting} />
<Clock/>
<Quote/>
<Credit language={language.credit} />
<React.Suspense fallback={renderLoader()}>
<Modal isOpen={this.state.settingsModal} className={modalClassList} overlayClassName="Overlay" ariaHideApp={false}>
<Settings modalClose={() => this.setState({ settingsModal: false })} setDefaultSettings={() => this.setDefaultSettings()} />
<Modal id={'modal'} onRequestClose={() => this.setState({ settingsModal: false })} isOpen={this.state.settingsModal} className={modalClassList} overlayClassName={overlayClassList} ariaHideApp={false}>
<Settings language={language.settings} modalClose={() => this.setState({ settingsModal: false })} setDefaultSettings={() => this.setDefaultSettings()} />
</Modal>
<Modal isOpen={this.state.updateModal} className={modalClassList} overlayClassName="Overlay" ariaHideApp={false}>
<Update modalClose={() => this.setState({ updateModal: false })} />
<Modal onRequestClose={() => this.setState({ updateModal: false })} isOpen={this.state.updateModal} className={modalClassList} overlayClassName={overlayClassList} ariaHideApp={false}>
<Update language={language.update} modalClose={() => this.setState({ updateModal: false })} />
</Modal>
</React.Suspense>
</div>