mirror of
https://github.com/mue/mue.git
synced 2026-07-20 15:34:10 +02:00
Progress
Co-authored-by: Alex Sparkes <turbomarshmello@gmail.com> Co-authored-by: Isaac Saunders <contact@eartharoid.me>
This commit is contained in:
@@ -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();
|
||||
}
|
||||
|
||||
|
||||
@@ -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>,
|
||||
];
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
}
|
||||
|
||||
@@ -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
15
src/components/Toast.jsx
Normal 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>
|
||||
);
|
||||
}
|
||||
}
|
||||
@@ -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}>×</span>
|
||||
<h1>Update</h1>
|
||||
<p>Edit different components to make Mue your new tab.</p>
|
||||
</div>;
|
||||
}
|
||||
<span className="closeModal" onClick={this.props.modalClose}>×</span>
|
||||
<h1 dangerouslySetInnerHTML={{__html: this.state.title}}></h1>
|
||||
<p dangerouslySetInnerHTML={{__html: this.state.content}}></p>
|
||||
</div>;
|
||||
}
|
||||
}
|
||||
Reference in New Issue
Block a user