mirrors/mue
1
0
Fork 0
mirror of https://github.com/mue/mue.git synced 2026-07-09 05:34:20 +02:00
Code Issues Packages Projects Releases Wiki Activity

fixes

Browse Source
This commit is contained in:
David Ralph
2020-09-14 23:06:13 +01:00
parent 7dca1c9de9
commit 4fbcc19ff8
10 changed files with 73 additions and 70 deletions
Download Patch File Download Diff File Expand all files Collapse all files

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

@@ -47,7 +47,7 @@ export default class Addons extends React.PureComponent {
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>
button: <button className='addToMue' onClick={() => this.install()}>{this.props.language.product.buttons.addtomue}</button>
});
}
@@ -67,21 +67,21 @@ export default class Addons extends React.PureComponent {
return <div className='content'>
<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" id="active">{this.props.modalLanguage.addons}</button>
<button className="tablinks" onClick={this.props.openSettings}>{this.props.modalLanguage.settings}</button>
<div className='tab'>
<button className='tablinks' onClick={this.props.openMarketplace}>{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>
</div>
<div id='marketplace'>
{ /*<input id='file-input' type='file' name='name' className='hidden' />
<button className='addToMue sideload' onClick={() => document.getElementById('file-input').click()}>Sideload</button> */}
<h1>{this.props.language.added}</h1>
<div className="items">
<div className="emptyMessage">
<div className='items'>
<div className='emptyMessage'>
<LocalMallIcon />
<h1>{this.props.language.empty.title}</h1>
<p className="description">{this.props.language.empty.description}</p>
<button className="goToMarket" onClick={this.props.openMarketplace}>{this.props.language.empty.button}</button>
<p className='description'>{this.props.language.empty.description}</p>
<button className='goToMarket' onClick={this.props.openMarketplace}>{this.props.language.empty.button}</button>
</div>
</div>
</div>
@@ -91,27 +91,27 @@ export default class Addons extends React.PureComponent {
return <div className='content'>
<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" id="active">{this.props.modalLanguage.addons}</button>
<button className="tablinks" onClick={this.props.openSettings}>{this.props.modalLanguage.settings}</button>
<div className='tab'>
<button className='tablinks' onClick={this.props.openMarketplace}>{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>
</div>
<div id='marketplace'>
{ /*<input id='file-input' type='file' name='name' className='hidden' />
<button className='addToMue sideload' onClick={() => document.getElementById('file-input').click()}>Sideload</button> */}
<h1>{this.props.language.added}</h1>
<div className="items">
<div className='items'>
{this.state.installed.map((item) =>
<div className="item" onClick={()=> this.toggle('item', item.type, item.name)}>
<img alt="icon" src={item.content.data.icon_url} />
<div className="details">
<div className='item' onClick={()=> this.toggle('item', item.type, item.name)}>
<img alt='icon' src={item.content.data.icon_url} />
<div className='details'>
<h4>{item.content.data.name}</h4>
<p>{item.content.data.author}</p>
</div>
</div>)}
</div>
</div>
<Item button={<button className="removeFromMue" onClick={() => this.uninstall()}>{this.props.language.product.buttons.remove}</button>} data={this.state.item_data} function={()=> this.toggle()} language={this.props.language.product} />
<Item button={<button className='removeFromMue' onClick={() => this.uninstall()}>{this.props.language.product.buttons.remove}</button>} data={this.state.item_data} function={()=> this.toggle()} language={this.props.language.product} />
</div>;
}
}

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

@@ -38,17 +38,17 @@ export default class Marketplace extends React.PureComponent {
this.offlineHTML = <div className='content'>
<span className='closeModal' onClick={this.props.modalClose}>&times;</span>
<h1>{this.props.modalLanguage.title}</h1>
<div className="tab">
<button className="tablinks" id="active">{this.props.modalLanguage.marketplace}</button>
<button className="tablinks" onClick={this.props.openAddons}>{this.props.modalLanguage.addons}</button>
<button className="tablinks"
<div className='tab'>
<button className='tablinks' id='active'>{this.props.modalLanguage.marketplace}</button>
<button className='tablinks' onClick={this.props.openAddons}>{this.props.modalLanguage.addons}</button>
<button className='tablinks'
onClick={this.props.openSettings}>{this.props.modalLanguage.settings}</button>
</div>
<div id='marketplace'>
<div className="emptyMessage" style={{"marginTop": "20px", "transform": "translateY(80%)"}}>
<div className='emptyMessage' style={{'marginTop': '20px', 'transform': 'translateY(80%)'}}>
<WifiOffIcon />
<h1>{this.props.language.offline.title}</h1>
<p className="description">{this.props.language.offline.description}</p>
<p className='description'>{this.props.language.offline.description}</p>
</div>
</div>
</div>;
@@ -67,7 +67,7 @@ export default class Marketplace extends React.PureComponent {
if (type === 'item') {
let info;
try {
info = (await fetch(`${Constants.MARKETPLACE_URL}/item/${type2}/${data}`)).json();
info = await (await fetch(`${Constants.MARKETPLACE_URL}/item/${type2}/${data}`)).json();
} catch (e) {
return toast(this.props.toastLanguage.error);
}
@@ -87,9 +87,9 @@ export default class Marketplace extends React.PureComponent {
document.getElementById('seemore').style.display = 'none';
document.getElementById('item').style.display = 'block';
let button = <button className="addToMue" onClick={() => this.install()}>{this.props.language.product.buttons.addtomue}</button>;
let button = <button className='addToMue' onClick={() => this.install()}>{this.props.language.product.buttons.addtomue}</button>;
let installed = JSON.parse(localStorage.getItem('installed'));
if (installed.some(item => item.name === data)) button = <button className="removeFromMue" onClick={() => this.uninstall()}>{this.props.language.product.buttons.remove}</button>;
if (installed.some(item => item.name === data)) button = <button className='removeFromMue' onClick={() => this.uninstall()}>{this.props.language.product.buttons.remove}</button>;
this.setState({ button: button });
} else {
document.getElementById('marketplace').style.display = 'block';
@@ -120,7 +120,7 @@ export default class Marketplace extends React.PureComponent {
installed.push(this.state.current_data);
localStorage.setItem('installed', JSON.stringify(installed));
toast(this.props.toastLanguage.installed);
button = <button className="removeFromMue" onClick={() => this.uninstall()}>{this.props.language.product.buttons.remove}</button>;
button = <button className='removeFromMue' onClick={() => this.uninstall()}>{this.props.language.product.buttons.remove}</button>;
this.setState({ button: button });
}
@@ -154,7 +154,7 @@ export default class Marketplace extends React.PureComponent {
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>
button: <button className='addToMue' onClick={() => this.install()}>{this.props.language.product.buttons.addtomue}</button>
});
}
@@ -176,14 +176,14 @@ export default class Marketplace extends React.PureComponent {
return <div className='content'>
<span className='closeModal' onClick={this.props.modalClose}>&times;</span>
<h1>{this.props.modalLanguage.title}</h1>
<div className="tab">
<button className="tablinks" id="active">{this.props.modalLanguage.marketplace}</button>
<button className="tablinks" onClick={this.props.openAddons}>{this.props.modalLanguage.addons}</button>
<button className="tablinks"
<div className='tab'>
<button className='tablinks' id='active'>{this.props.modalLanguage.marketplace}</button>
<button className='tablinks' onClick={this.props.openAddons}>{this.props.modalLanguage.addons}</button>
<button className='tablinks'
onClick={this.props.openSettings}>{this.props.modalLanguage.settings}</button>
</div>
<div id='marketplace'>
<div className="emptyMessage" style={{"marginTop": "20px", "transform": "translateY(80%)"}}>
<div className='emptyMessage' style={{'marginTop': '20px', 'transform': 'translateY(80%)'}}>
<h1>Loading...</h1>
</div>
</div>
@@ -193,17 +193,17 @@ export default class Marketplace extends React.PureComponent {
return <div className='content'>
<span className='closeModal' onClick={this.props.modalClose}>&times;</span>
<h1>{this.props.modalLanguage.title}</h1>
<div className="tab">
<button className="tablinks" id="active">{this.props.modalLanguage.marketplace}</button>
<button className="tablinks" onClick={this.props.openAddons}>{this.props.modalLanguage.addons}</button>
<button className="tablinks"
<div className='tab'>
<button className='tablinks' id='active'>{this.props.modalLanguage.marketplace}</button>
<button className='tablinks' onClick={this.props.openAddons}>{this.props.modalLanguage.addons}</button>
<button className='tablinks'
onClick={this.props.openSettings}>{this.props.modalLanguage.settings}</button>
</div>
<div id='marketplace'>
<div className="featured" style={{backgroundColor: this.state.featured.colour}}>
<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}

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

@@ -50,6 +50,9 @@ export default class Settings extends React.PureComponent {
document.getElementById('brightnessAmount').innerText = value;
document.getElementById('brightnessRange').value = value;
}
const tag = document.getElementById(`${key}Status`);
if (tag) tag.checked = (value === 'true');
}
if (localStorage.getItem('darkTheme') === 'true') {

20
src/components/modals/Welcome.jsx
View File

@@ -5,13 +5,13 @@ export default class Welcome extends React.PureComponent {
render() {
return <div className='welcomeContent'>
<span className='closeModal' onClick={this.props.modalClose}>&times;</span>
<div className="welcomeModalText">
<h2 className="subtitle">Welcome to</h2>
<h1 className="welcometitle">Mue Tab</h1>
<img alt="celebration" style={{"height": "200px", "width": "auto"}} src="./././icons/undraw_celebration.svg" />
<h2 className="subtitle">Information</h2>
<div className='welcomeModalText'>
<h2 className='subtitle'>Welcome to</h2>
<h1 className='welcometitle'>Mue Tab</h1>
<img alt='celebration' style={{'height': '200px', 'width': 'auto'}} src='./././icons/undraw_celebration.svg' />
<h2 className='subtitle'>Information</h2>
<p>Thank you for downloading Mue Tab,<br/> we hope you enjoy your time with our extension.</p>
<h2 className="subtitle">Tutorials</h2>
<h2 className='subtitle'>Tutorials</h2>
<a href=''>General Start</a>
<br/>
<a href='https://blog.muetab.xyz/welcome-to-marketplace/'>Marketplace</a>
@@ -19,12 +19,12 @@ export default class Welcome extends React.PureComponent {
<a href=''>Submitting Photos</a>
<br/>
<a href=''>Settings</a>
<h2 className="subtitle">Support</h2>
{/* <img alt="twitter" href="https://twitter.com/getmue" className="icon" src=""/>
<img alt="discord" href="https://discord.gg/kJsufA9" className="icon" src=""/> */}
<h2 className='subtitle'>Support</h2>
{/* <img alt='twitter' href='https://twitter.com/getmue' className='icon' src=''/>
<img alt='discord' href='https://discord.gg/kJsufA9' className='icon' src=''/> */}
<EmailIcon />
<br/>
<button className="close" onClick={this.props.modalClose}>Close</button>
<button className='close' onClick={this.props.modalClose}>Close</button>
</div>
</div>;
}

20
src/components/modals/marketplace/Item.jsx
View File

@@ -3,7 +3,7 @@ import ArrowBackIcon from '@material-ui/icons/ArrowBack';
export default class Item extends React.PureComponent {
render() {
if (!this.props.data.icon) return <div></div>;
if (!this.props.data.icon) return null;
return (
<div id='item'>
<br/>
@@ -12,32 +12,32 @@ export default class Item extends React.PureComponent {
<h1>{this.props.data.name}</h1>
{this.props.button}
<br/><br/>
<img alt="product" draggable={false} src={'https://external-content.duckduckgo.com/iu/?u=' + this.props.data.icon} />
<div className="informationContainer">
<div className="productInformation">
<img alt='product' draggable={false} src={'https://external-content.duckduckgo.com/iu/?u=' + this.props.data.icon} />
<div className='informationContainer'>
<div className='productInformation'>
<h4>{this.props.language.information}</h4>
<ul>
<br/>
<li className="header">{this.props.language.last_updated}</li>
<li className='header'>{this.props.language.last_updated}</li>
<li>{this.props.data.updated}</li>
<br/>
<li className="header">{this.props.language.version}</li>
<li className='header'>{this.props.language.version}</li>
<li>{this.props.data.version}</li>
<br/>
<li className="header">{this.props.language.author}</li>
<li className='header'>{this.props.language.author}</li>
<li>{this.props.data.author}</li>
</ul>
</div>
<div className="productInformation">
<div className='productInformation'>
<ul>
<li className="header">{this.props.language.notice.title}</li>
<li className='header'>{this.props.language.notice.title}</li>
<li id='updated'>{this.props.language.notice.description}</li>
</ul>
</div>
</div>
<br/>
<h1>{this.props.language.overview}</h1>
<p className="description" dangerouslySetInnerHTML={{__html: this.props.data.description}}></p>
<p className='description' dangerouslySetInnerHTML={{__html: this.props.data.description}}></p>
</div>
);
}

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

@@ -9,11 +9,11 @@ export default class Items extends React.PureComponent {
<div>
{seeMoreHTML}
<h1>{this.props.title}</h1>
<div className="items">
<div className='items'>
{this.props.items.map((item) =>
<div className="item" onClick={() => this.props.toggleFunction(item.name)}>
<img alt="icon" draggable={false} src={'https://external-content.duckduckgo.com/iu/?u=' + item.icon_url} />
<div className="details">
<div className='item' onClick={() => this.props.toggleFunction(item.name)}>
<img alt='icon' draggable={false} src={'https://external-content.duckduckgo.com/iu/?u=' + item.icon_url} />
<div className='details'>
<h4>{item.display_name}</h4>
<p>{item.author}</p>
</div>

2
src/components/modals/settings/Checkbox.jsx
View File

@@ -24,7 +24,7 @@ export default class Checkbox extends React.PureComponent {
return (
<React.Fragment>
<FormControlLabel
control={<CheckboxUI name="checkedB" color="primary" checked={this.state.checked} onChange={this.handleChange} />}
control={<CheckboxUI name='checkedB' color='primary' checked={this.state.checked} onChange={this.handleChange} />}
label={this.props.text}
/>
<br/>

6
src/components/modals/settings/Slider.jsx
View File

@@ -6,9 +6,9 @@ export default class Slider extends React.PureComponent {
let setText = this.props.name;
if (this.props.override) setText = this.props.override;
return (
<label className="switch">
<input type="checkbox" onClick={() => SettingsFunctions.setItem(setText)} id={this.props.name + 'Status'} />
<span className="slider"></span>
<label className='switch'>
<input type='checkbox' onClick={() => SettingsFunctions.setItem(setText)} id={this.props.name + 'Status'} />
<span className='slider'></span>
</label>
);
}

2
src/components/widgets/Maximise.jsx
View File

@@ -33,7 +33,7 @@ export default class View extends React.PureComponent {
}
render() {
if (localStorage.getItem('view') === 'false') return <div></div>;
if (localStorage.getItem('view') === 'false') return null;
return <div className='view'>
<FullscreenIcon id='viewButton' onClick={() => this.viewStuff()} />
</div>

2
src/components/widgets/Search.jsx
View File

@@ -3,7 +3,7 @@ import SearchIcon from '@material-ui/icons/Search';
export default class Search extends React.PureComponent {
render() {
if (localStorage.getItem('searchBar') === 'false') return <div></div>;
if (localStorage.getItem('searchBar') === 'false') return null;
let url;
let query = 'q';