Co-authored-by: Alex Sparkes <turbomarshmello@gmail.com>
Co-authored-by: Isaac Saunders <contact@eartharoid.me>
This commit is contained in:
David Ralph
2020-07-17 23:46:01 +01:00
parent 0464afea27
commit 3e80586620
10 changed files with 232 additions and 16 deletions

View File

@@ -45,7 +45,10 @@ export default class Background extends React.Component {
componentDidMount() {
const enabled = localStorage.getItem('background');
if (enabled === 'false') return;
if (enabled === 'false') {
document.getElementById('backgroundCredits').style.display = 'none';
return;
}
this.setBackground();
}

View File

@@ -1,6 +1,8 @@
//* Imports
import React from 'react';
import Quotes from '@muetab/quotes';
import copy from 'copy-text-to-clipboard';
import FileCopy from '@material-ui/icons/AttachFile';
export default class Quote extends React.Component {
constructor(...args) {
@@ -38,6 +40,13 @@ export default class Quote extends React.Component {
}
}
copyQuote() {
copy(`${this.state.quote} - ${this.state.author}`);
var x = document.getElementById('toast');
x.className = "show";
setTimeout(function(){ x.className = x.className.replace("show", ""); }, 3000);
}
componentDidMount() {
const enabled = localStorage.getItem('quote');
if (enabled === 'false') return;
@@ -46,9 +55,17 @@ export default class Quote extends React.Component {
render() {
return [
<h1 className='quote'>{`${this.state.quote}`}</h1>,
// <i class="material-icons">perm_identity</i>,
<h1 className='quoteauthor'>{`${this.state.author}`}</h1>,
<h1 className='quote'>{`${this.state.quote}`}</h1>,
<h1 className='quoteauthor'>{this.state.author} <FileCopy className='copyButton' onClick={() => this.copyQuote() }></FileCopy></h1>,
];
}
}

View File

@@ -28,8 +28,16 @@ export default class Settings extends React.Component {
}
componentDidMount() {
document.getElementById('greetingName').value = localStorage.getItem('greetingName');
for (const key of Object.keys(localStorage)) {
let value = localStorage.getItem(key);
if (key === 'blur') {
document.getElementById('blurAmount').innerText = value;
document.getElementById('blurRange').value = value;
}
const tag = document.getElementById(`${key}Status`);
if (tag) {
@@ -90,14 +98,20 @@ export default class Settings extends React.Component {
</div>
<div className='section'>
<h4>Quote</h4>
<ExpandMore className='expandIcons' onClick={() => this.toggleExtra(document.getElementsByClassName('extraSettings')[2], document.getElementsByClassName('expandIcons')[2])} />
<label className="switch">
<input id="quoteStatus" type="checkbox" onClick={()=> this.setItem('quote')} id='quoteStatus' />
<span className="slider"></span>
</label>
</label> <li className="extraSettings">
<ul>
<input id="5" type="checkbox" onClick={()=> this.setItem('copyButton')} id='copyButtonStatus' />
<label htmlFor="5">Copy Button</label>
</ul>
</li>
</div>
<div className='section'>
<h4>Background</h4>
<ExpandMore className='expandIcons' onClick={() => this.toggleExtra(document.getElementsByClassName('extraSettings')[2], document.getElementsByClassName('expandIcons')[2])} />
<ExpandMore className='expandIcons' onClick={() => this.toggleExtra(document.getElementsByClassName('extraSettings')[3], document.getElementsByClassName('expandIcons')[3])} />
<label className="switch">
<input type="checkbox" onClick={()=> this.setItem('background')} id='backgroundStatus' />
<span className="slider"></span>
@@ -113,7 +127,7 @@ export default class Settings extends React.Component {
</div>
<div className='section'>
<h4>Search Bar</h4>
<ExpandMore className='expandIcons' onClick={() => this.toggleExtra(document.getElementsByClassName('extraSettings')[3], document.getElementsByClassName('expandIcons')[3])} />
<ExpandMore className='expandIcons' onClick={() => this.toggleExtra(document.getElementsByClassName('extraSettings')[4], document.getElementsByClassName('expandIcons')[4])} />
<label className="switch">
<input type="checkbox" onClick={()=> this.setItem('searchBar')} id='searchBarStatus' />
<span className="slider"></span>

15
src/components/Toast.jsx Normal file
View File

@@ -0,0 +1,15 @@
//* Imports
import React from 'react';
import FileCopy from '@material-ui/icons/AttachFile';
export default class Toast extends React.Component {
render() {
return (
<div id='toast'>
<FileCopy className="copyButton"/>
<hr />
Quote Copied!
</div>
);
}
}

View File

@@ -1,11 +1,46 @@
import React from 'react';
export default class Update extends React.Component {
constructor(...args) {
super(...args);
this.state = {
title: '',
date: '',
content: ''
};
}
async getUpdate() {
const enabled = localStorage.getItem('offlineMode');
if (enabled === 'true') return this.setState({
title: 'Offline',
content: 'Cannot get update logs while in offline mode'
});
try { // First we try and get a quote from the API...
let data = await fetch('https://api.muetab.xyz/getUpdate');
data = await data.json();
this.setState({
title: data.title,
content: data.content
});
} catch (e) {
this.setState({
title: 'Error',
content: 'Could not connect to the server!'
});
}
}
componentDidMount() {
this.getUpdate();
}
render() {
return <div className="content">
<span className="closeModal" onClick={this.props.modalClose}>&times;</span>
<h1>Update</h1>
<p>Edit different components to make Mue your new tab.</p>
</div>;
}
<span className="closeModal" onClick={this.props.modalClose}>&times;</span>
<h1 dangerouslySetInnerHTML={{__html: this.state.title}}></h1>
<p dangerouslySetInnerHTML={{__html: this.state.content}}></p>
</div>;
}
}