mirrors/mue
1
0
Fork 0
mirror of https://github.com/mue/mue.git synced 2026-07-11 18:31:47 +02:00
Code Issues Packages Projects Releases Wiki Activity

bug fixes and cleanup

Browse Source
This commit is contained in:
David Ralph
2020-08-27 18:15:59 +01:00
parent f56854127c
commit 3a0468dcb9
9 changed files with 58 additions and 95 deletions
Download Patch File Download Diff File Expand all files Collapse all files

16
src/App.jsx
View File

@@ -78,14 +78,12 @@ export default class App extends React.PureComponent {
setDefaultSettings={() => SettingsFunctions.setDefaultSettings()}
openMarketplace={() => this.setState({ marketplaceModal: true, settingsModal: false })}
openAddons={() => this.setState({ settingsModal: false, addonsModal: true })}
toastLanguage={language.toasts}
/>
toastLanguage={language.toasts} />
</Modal>
<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 })}
/>
modalClose={() => this.setState({ updateModal: false })} />
</Modal>
<Modal onRequestClose={() => this.setState({ marketplaceModal: false })} isOpen={this.state.marketplaceModal} className={modalClassList} overlayClassName='Overlay' ariaHideApp={false}>
<Marketplace
@@ -94,8 +92,7 @@ export default class App extends React.PureComponent {
modalClose={() => this.setState({ marketplaceModal: false })}
openSettings={() => this.setState({ marketplaceModal: false, settingsModal: true })}
openAddons={() => this.setState({ marketplaceModal: false, addonsModal: true })}
toastLanguage={language.toasts}
/>
toastLanguage={language.toasts} />
</Modal>
<Modal onRequestClose={() => this.setState({ addonsModal: false })} isOpen={this.state.addonsModal} className={modalClassList} overlayClassName='Overlay' ariaHideApp={false}>
<Addons
@@ -104,13 +101,10 @@ export default class App extends React.PureComponent {
modalClose={() => this.setState({ addonsModal: false })}
openSettings={() => this.setState({ addonsModal: false, settingsModal: true })}
openMarketplace={() => this.setState({ addonsModal: false, marketplaceModal: true })}
toastLanguage={language.toasts}
/>
toastLanguage={language.toasts} />
</Modal>
<Modal onRequestClose={() => this.setState({ welcomeModal: false })} isOpen={this.state.welcomeModal} className={modalClassList} overlayClassName='Overlay' ariaHideApp={false}>
<Welcome
modalClose={() => this.setState({ welcomeModal: false })}
/>
<Welcome modalClose={() => this.setState({ welcomeModal: false })} />
</Modal>
</React.Suspense>
</div>

41
src/components/modals/Addons.jsx
View File

@@ -3,6 +3,8 @@ import LocalMallIcon from '@material-ui/icons/LocalMall';
import { toast } from 'react-toastify';
import Item from './marketplace/Item';
import MarketplaceFunctions from '../../modules/marketplaceFunctions';
import StoreIcon from '@material-ui/icons/Store';
import SettingsIcon from '@material-ui/icons/Settings';
export default class Addons extends React.PureComponent {
constructor(...args) {
@@ -44,36 +46,11 @@ export default class Addons extends React.PureComponent {
}
uninstall() {
let installed = JSON.parse(localStorage.getItem('installed'));
const uninstallStuff = () => {
for (let i = 0; i < installed.length; i++) {
if (installed[i].name === this.state.current_data.name) {
installed.splice(i, 1);
break;
}
}
localStorage.setItem('installed', JSON.stringify(installed));
toast(this.props.toastLanguage.removed);
this.toggle();
this.componentDidMount();
}
switch (this.state.current_data.type) {
case 'settings':
let oldSettings = JSON.parse(localStorage.getItem('backup_settings'));
localStorage.clear();
oldSettings.forEach(item => localStorage.setItem(item.name, item.value));
uninstallStuff();
break;
default:
try {
localStorage.removeItem(this.state.current_data.type);
uninstallStuff();
} catch (e) {
console.log('invalid');
}
}
MarketplaceFunctions.uninstall(this.state.current_data.name, this.state.current_data.type);
toast(this.props.toastLanguage.removed);
this.setState({
button: <button className="addToMue" onClick={() => this.install()}>{this.props.language.product.buttons.addtomue}</button>
});
}
componentDidMount() {
@@ -93,9 +70,9 @@ export default class Addons extends React.PureComponent {
<span className='closeModal' onClick={this.props.modalClose}>&times;</span>
<h1>{this.props.modalLanguage.title}</h1>
<div className="tab">
<button className="tablinks" onClick={this.props.openMarketplace}>{this.props.modalLanguage.marketplace}</button>
<button className="tablinks" onClick={this.props.openMarketplace}><StoreIcon/> {this.props.modalLanguage.marketplace}</button>
<button className="tablinks" id="active">{this.props.modalLanguage.addons}</button>
<button className="tablinks" onClick={this.props.openSettings}>{this.props.modalLanguage.settings}</button>
<button className="tablinks" onClick={this.props.openSettings}><SettingsIcon/> {this.props.modalLanguage.settings}</button>
</div>
<div id='marketplace'>
{ /*<input id='file-input' type='file' name='name' className='hidden' />

45
src/components/modals/Marketplace.jsx
View File

@@ -154,37 +154,11 @@ export default class Marketplace extends React.PureComponent {
}
uninstall() {
let installed = JSON.parse(localStorage.getItem('installed'));
let button;
const uninstallStuff = () => {
for (let i = 0; i < installed.length; i++) {
if (installed[i].name === this.state.current_data.name) {
installed.splice(i, 1);
break;
}
}
localStorage.setItem('installed', JSON.stringify(installed));
MarketplaceFunctions.uninstall(this.state.current_data.name, this.state.current_data.type);
toast(this.props.toastLanguage.removed);
button = <button className="addToMue" onClick={() => this.install()}>{this.props.language.product.buttons.addtomue}</button>;
this.setState({ button: button });
}
switch (this.state.current_data.type) {
case 'settings':
let oldSettings = JSON.parse(localStorage.getItem('backup_settings'));
localStorage.clear();
oldSettings.forEach(item => localStorage.setItem(item.name, item.value));
uninstallStuff();
break;
default:
try {
localStorage.removeItem(this.state.current_data.type);
uninstallStuff();
} catch (e) {
console.log('invalid');
}
}
this.setState({
button: <button className="addToMue" onClick={() => this.install()}>{this.props.language.product.buttons.addtomue}</button>
});
}
componentDidMount() {
@@ -200,9 +174,7 @@ export default class Marketplace extends React.PureComponent {
}
render() {
if (navigator.onLine === false || this.state.done === false) {
return this.offlineHTML;
}
if (navigator.onLine === false || this.state.done === false) return this.offlineHTML;
return <div className='content'>
<span className='closeModal' onClick={this.props.modalClose}>&times;</span>
@@ -217,36 +189,31 @@ export default class Marketplace extends React.PureComponent {
<div className="featured" style={{backgroundColor: this.state.featured.colour}}>
<p>{this.state.featured.title}</p>
<h1>{this.state.featured.name}</h1>
<button className="addToMue" onClick={() => window.location.href =
this.state.featured.buttonLink}>{this.state.featured.buttonText}</button>
<button className="addToMue" onClick={() => window.location.href = this.state.featured.buttonLink}>{this.state.featured.buttonText}</button>
</div>
<Items
title={this.props.language.photo_packs}
seeMoreTitle={this.props.language.see_more}
items={this.state.photo_packs.slice(0, 3)}
toggleFunction={(input) => this.toggle('item', 'photo_packs', input)}
seeMore={true}
seeMoreFunction={() => this.toggle('seemore', 'photo_packs')} />
<Items
title={this.props.language.preset_settings}
seeMoreTitle={this.props.language.see_more}
items={this.state.settings.slice(0, 3)}
toggleFunction={(input) => this.toggle('item', 'settings', input)}
seeMore={true}
seeMoreFunction={() => this.toggle('seemore', 'settings')} />
<Items
title={this.props.language.quote_packs}
seeMoreTitle={this.props.language.see_more}
items={this.state.quote_packs.slice(0, 3)}
toggleFunction={(input) => this.toggle('item', 'quote_packs', input)}
seeMore={true}
seeMoreFunction={() => this.toggle('seemore', 'quote_packs')} />
<Items
title={this.props.language.themes}
seeMoreTitle={this.props.language.see_more}
items={this.state.themes.slice(0, 3)}
toggleFunction={(input) => this.toggle('item', 'theme', input)}
seeMore={true}
seeMoreFunction={() => this.toggle('seemore', 'themes')} />
</div>
<Item button={this.state.button} data={this.state.item_data} function={()=> this.toggle()} language={this.props.language.product} />

6
src/components/modals/Settings.jsx
View File

@@ -80,17 +80,15 @@ export default class Settings extends React.PureComponent {
reader.onload = (readerEvent) => {
const content = JSON.parse(readerEvent.target.result);
for (const key of Object.keys(content)) localStorage.setItem(key, content[key]);
toast('Imported settings!');
toast(this.props.toastLanguage.imported_settings);
}
}
document.getElementById('bg-input').onchange = (e) => {
const allowed = [ 'image/svg+xml', 'image/jpeg', 'image/png', 'image/webp', 'image/webm', 'image/gif' ];
const reader = new FileReader();
const file = e.target.files[0];
if (file.size > 2000000) return toast('File is over 2MB', '#ff0000', '#ffffff');
if (!allowed.includes(file.type)) return console.error(`expected xml, svg, png or jpeg, got ${file.type}`);
reader.addEventListener('load', (e) => {
localStorage.setItem('customBackground', e.target.result);
@@ -191,7 +189,7 @@ export default class Settings extends React.PureComponent {
<ul>
<p>{this.props.language.background.custombackground} <span className='modalLink' onClick={() => this.resetItem('customBackground')}>{this.props.language.reset}</span></p>
<button className='uploadbg' onClick={() => document.getElementById('bg-input').click()}>{this.props.language.background.upload}</button>
<input id='bg-input' type='file' name='name' className='hidden' />
<input id='bg-input' type='file' name='name' className='hidden' accept='image/svg+xml, image/jpeg, image/png, image/webp, image/webm, image/gif' />
</ul>
{ /* <ul>
<p>{this.props.language.background.customcolour} <span className='modalLink' onClick={() => this.resetItem('customBackgroundColour')}>Reset</span></p>

1
src/components/modals/Update.jsx
View File

@@ -39,7 +39,6 @@ export default class Update extends React.PureComponent {
}
componentDidMount() {
localStorage.setItem('viewedUpdate', true);
this.getUpdate();
}

2
src/components/modals/marketplace/Items.jsx
View File

@@ -3,7 +3,7 @@ import React from 'react';
export default class Items extends React.PureComponent {
render() {
let seeMoreHTML;
if (this.props.seeMore === true) seeMoreHTML = <button className='addToMue seemore' onClick={this.props.seeMoreFunction}>{this.props.seeMoreTitle}</button>;
if (this.props.seeMoreFunction) seeMoreHTML = <button className='addToMue seemore' onClick={this.props.seeMoreFunction}>{this.props.seeMoreTitle}</button>;
return (
<div>

30
src/modules/marketplaceFunctions.js
View File

@@ -3,4 +3,34 @@ export default class MarketplaceFunctions {
let urlPattern = /https?:\/\/(www\.)?[-a-zA-Z0-9@:%._+~#=]{1,256}\.[a-zA-Z0-9()]{1,6}\b([-a-zA-Z0-9()!@:%_+.~#?&//=]*)/;
return input.replace(urlPattern, '<a href="$&" target="_blank">$&</a>');
}
static uninstall(name, type) {
let installed = JSON.parse(localStorage.getItem('installed'));
const uninstallStuff = () => {
for (let i = 0; i < installed.length; i++) {
if (installed[i].name === name) {
installed.splice(i, 1);
break;
}
}
localStorage.setItem('installed', JSON.stringify(installed));
}
switch (type) {
case 'settings':
let oldSettings = JSON.parse(localStorage.getItem('backup_settings'));
localStorage.clear();
oldSettings.forEach(item => localStorage.setItem(item.name, item.value));
uninstallStuff();
break;
default:
try {
localStorage.removeItem(type);
uninstallStuff();
} catch (e) {
console.log('invalid');
}
}
}
}

3
src/translations/en.json
View File

@@ -58,7 +58,8 @@
"apply": "Apply",
"reset": "Reset",
"import": "Import",
"export": "Export"
"export": "Export",
"imported_settings": "Imported settings"
},
"update": {
"title": "Update",