diff --git a/README.md b/README.md
index ca153026..c1826301 100644
--- a/README.md
+++ b/README.md
@@ -36,11 +36,11 @@ Mue is a fast, open and free-to-use browser extension that gives a new, fresh an
* Fast and free
* Supports multiple browsers
* Actively developed and open source
-* Automatically updating API (no tracking) with new photos, quotes and offline mode
+* Automatically updating [API](https://github.com/mue/api) with new photos, quotes and offline mode
* Widgets such as searchbar, weather, quick links, clock, date, quote, greeting
* Settings - enable/disable various features and customise parts of Mue
* Navbar with copy button, favourite background, notes feature etc
-* Marketplace - download custom photo packs made by the community
+* [Marketplace](https://github.com/mue/marketplace) - download custom photo packs, quote packs and preset settings made by the community
### Planned Features
Please see our [roadmap](https://github.com/mue/mue/projects)
diff --git a/package.json b/package.json
index e0b12474..338cfcd9 100644
--- a/package.json
+++ b/package.json
@@ -13,8 +13,8 @@
"dependencies": {
"@emotion/react": "^11.4.0",
"@emotion/styled": "^11.3.0",
- "@fontsource/lexend-deca": "^4.5.0",
- "@fontsource/montserrat": "^4.5.0",
+ "@fontsource/lexend-deca": "4.4.5",
+ "@fontsource/montserrat": "4.4.5",
"@material-ui/core": "5.0.0-beta.0",
"@material-ui/icons": "5.0.0-beta.0",
"react": "17.0.2",
diff --git a/src/components/modals/Modals.jsx b/src/components/modals/Modals.jsx
index 5995adc9..665d50e6 100644
--- a/src/components/modals/Modals.jsx
+++ b/src/components/modals/Modals.jsx
@@ -73,4 +73,4 @@ export default class Modals extends React.PureComponent {
>
);
}
-}
\ No newline at end of file
+}
diff --git a/src/components/modals/welcome/ProgressBar.jsx b/src/components/modals/welcome/ProgressBar.jsx
index eb221995..66bc29da 100644
--- a/src/components/modals/welcome/ProgressBar.jsx
+++ b/src/components/modals/welcome/ProgressBar.jsx
@@ -13,4 +13,4 @@ export default function ProgressBar(props) {
})}
);
-}
\ No newline at end of file
+}
diff --git a/src/components/modals/welcome/WelcomeSections.jsx b/src/components/modals/welcome/WelcomeSections.jsx
index 0611c1cf..1281b0ed 100644
--- a/src/components/modals/welcome/WelcomeSections.jsx
+++ b/src/components/modals/welcome/WelcomeSections.jsx
@@ -208,4 +208,4 @@ export default class WelcomeSections extends React.PureComponent {
return tabContent;
}
-}
\ No newline at end of file
+}
diff --git a/src/components/widgets/background/Favourite.jsx b/src/components/widgets/background/Favourite.jsx
index 3b4a682d..db8c9ddb 100644
--- a/src/components/widgets/background/Favourite.jsx
+++ b/src/components/widgets/background/Favourite.jsx
@@ -6,10 +6,15 @@ import StarIcon from '@material-ui/icons/Star';
import StarIcon2 from '@material-ui/icons/StarBorder';
export default class Favourite extends React.PureComponent {
+ buttons = {
+ favourited: ,
+ unfavourited:
+ }
+
constructor() {
super();
this.state = {
- favourited: (localStorage.getItem('favourite')) ? :
+ favourited: (localStorage.getItem('favourite')) ? this.buttons.favourited : this.buttons.unfavourited
};
}
@@ -17,7 +22,7 @@ export default class Favourite extends React.PureComponent {
if (localStorage.getItem('favourite')) {
localStorage.removeItem('favourite');
this.setState({
- favourited:
+ favourited: this.buttons.unfavourited
});
window.stats.postEvent('feature', 'Background favourite');
} else {
@@ -36,7 +41,7 @@ export default class Favourite extends React.PureComponent {
}));
this.setState({
- favourited:
+ favourited: this.buttons.favourited
});
window.stats.postEvent('feature', 'Background unfavourite');
}
diff --git a/src/components/widgets/navbar/Notes.jsx b/src/components/widgets/navbar/Notes.jsx
index adc128e7..29fca230 100644
--- a/src/components/widgets/navbar/Notes.jsx
+++ b/src/components/widgets/navbar/Notes.jsx
@@ -12,7 +12,8 @@ export default class Notes extends React.PureComponent {
constructor() {
super();
this.state = {
- notes: localStorage.getItem('notes') || ''
+ notes: localStorage.getItem('notes') || '',
+ visibility: (localStorage.getItem('notesPinned') === 'true') ? 'visible' : 'hidden'
};
this.language = window.language.widgets.navbar.notes;
}
@@ -26,44 +27,42 @@ export default class Notes extends React.PureComponent {
pin() {
window.stats.postEvent('feature', 'Notes pin');
- document.getElementById('noteContainer').classList.toggle('visibilityshow');
if (localStorage.getItem('notesPinned') === 'true') {
localStorage.setItem('notesPinned', false);
+ this.setState({
+ visibility: 'hidden'
+ });
} else {
localStorage.setItem('notesPinned', true);
+ this.setState({
+ visibility: 'visible'
+ });
}
}
copy() {
window.stats.postEvent('feature', 'Notes copied');
- // this.state.notes doesn't work for some reason
- navigator.clipboard.writeText(localStorage.getItem('notes'));
+ navigator.clipboard.writeText(this.state.notes);
toast(window.language.toasts.notes);
}
componentDidMount() {
- const noteContainer = document.getElementById('noteContainer');
-
- if (localStorage.getItem('notesPinned') === 'true') {
- noteContainer.classList.toggle('visibilityshow');
- }
-
if (localStorage.getItem('refresh') === 'false') {
- noteContainer.style.marginLeft = '-200px';
+ document.getElementById('noteContainer').style.marginLeft = '-200px';
}
}
render() {
return (
-
+
{this.language.title}
-
-
+
+
);
}
diff --git a/src/components/widgets/navbar/scss/_notes.scss b/src/components/widgets/navbar/scss/_notes.scss
index 48869f4f..92345db2 100644
--- a/src/components/widgets/navbar/scss/_notes.scss
+++ b/src/components/widgets/navbar/scss/_notes.scss
@@ -9,7 +9,7 @@
}
&:hover .notescontainer {
- visibility: visible;
+ visibility: visible !important;
}
}
diff --git a/src/components/widgets/navbar/scss/index.scss b/src/components/widgets/navbar/scss/index.scss
index bd13d697..e6cd4194 100644
--- a/src/components/widgets/navbar/scss/index.scss
+++ b/src/components/widgets/navbar/scss/index.scss
@@ -32,7 +32,3 @@
}
}
}
-
-.visibilityshow {
- visibility: visible !important;
-}
diff --git a/src/components/widgets/quicklinks/QuickLinks.jsx b/src/components/widgets/quicklinks/QuickLinks.jsx
index 0dc71d0f..2f297afe 100644
--- a/src/components/widgets/quicklinks/QuickLinks.jsx
+++ b/src/components/widgets/quicklinks/QuickLinks.jsx
@@ -99,6 +99,15 @@ export default class QuickLinks extends React.PureComponent {
}
}
+ // widget zoom
+ setZoom(element) {
+ const images = element.getElementsByTagName('img');
+ for (const img of images) {
+ img.style.height = `${0.87 * Number((localStorage.getItem('zoomQuicklinks') || 100) / 100)}em`;
+ };
+ element.querySelector('button').style.fontSize = `${1.15 * Number((localStorage.getItem('zoomQuicklinks') || 100) / 100)}em`;
+ }
+
componentDidMount() {
if (localStorage.getItem('offlineMode') === 'true') {
return;
@@ -113,11 +122,7 @@ export default class QuickLinks extends React.PureComponent {
}
element.style.display = 'block';
- const images = element.getElementsByTagName('img');
- for (const img of images) {
- img.style.height = `${0.87 * Number((localStorage.getItem('zoomQuicklinks') || 100) / 100)}em`;
- };
- element.querySelector('button').style.fontSize = `${1.15 * Number((localStorage.getItem('zoomQuicklinks') || 100) / 100)}em`;
+ this.setZoom(element);
this.setState({
items: JSON.parse(localStorage.getItem('quicklinks'))
@@ -135,12 +140,7 @@ export default class QuickLinks extends React.PureComponent {
}
};
- const element = document.querySelector('.quicklinks-container');
- const images = element.getElementsByTagName('img');
- for (const img of images) {
- img.style.height = `${0.87 * Number((localStorage.getItem('zoomQuicklinks') || 100) / 100)}em`;
- };
- element.querySelector('button').style.fontSize = `${1.15 * Number((localStorage.getItem('zoomQuicklinks') || 100) / 100)}em`;
+ this.setZoom(document.querySelector('.quicklinks-container'));
}
componentWillUnmount() {
@@ -196,4 +196,4 @@ export default class QuickLinks extends React.PureComponent {
);
}
-}
\ No newline at end of file
+}
diff --git a/src/components/widgets/quote/Quote.jsx b/src/components/widgets/quote/Quote.jsx
index 7a4f9af9..bee06b06 100644
--- a/src/components/widgets/quote/Quote.jsx
+++ b/src/components/widgets/quote/Quote.jsx
@@ -12,23 +12,35 @@ import { toast } from 'react-toastify';
import './quote.scss';
export default class Quote extends React.PureComponent {
+ buttons = {
+ tweet: this.tweetQuote()} />,
+ copy: this.copyQuote()} />,
+ unfavourited: this.favourite()} />,
+ favourited: this.favourite()} />
+ }
+
constructor() {
super();
this.state = {
quote: '',
author: '',
- favourited: ,
- tweet: '',
- copy: '',
- quoteLanguage: ''
- };
- this.buttons = {
- tweet: ,
- copy:
+ favourited: this.useFavourite(),
+ tweet: (localStorage.getItem('tweetButton') === 'false') ? null : this.buttons.tweet,
+ copy: (localStorage.getItem('copyButton') === 'false') ? null : this.buttons.copy,
+ quoteLanguage: '',
+ type: localStorage.getItem('quoteType') || 'api'
};
this.language = window.language.widgets.quote;
}
+ useFavourite() {
+ let favouriteQuote = null;
+ if (localStorage.getItem('favouriteQuoteEnabled') === 'true') {
+ favouriteQuote = localStorage.getItem('favouriteQuote') ? this.buttons.favourited : this.buttons.unfavourited;
+ }
+ return favouriteQuote;
+ }
+
doOffline() {
const quotes = require('./offline_quotes.json');
@@ -63,7 +75,7 @@ export default class Quote extends React.PureComponent {
});
}
- switch (localStorage.getItem('quoteType') || 'api') {
+ switch (this.state.type) {
case 'custom':
const customQuote = localStorage.getItem('customQuote');
const customQuoteAuthor = localStorage.getItem('customQuoteAuthor');
@@ -72,8 +84,7 @@ export default class Quote extends React.PureComponent {
return this.setState({
quote: '"' + customQuote + '"',
author: customQuoteAuthor,
- authorlink: this.getAuthorLink(customQuote),
- type: 'custom'
+ authorlink: this.getAuthorLink(customQuote)
});
}
break;
@@ -91,8 +102,7 @@ export default class Quote extends React.PureComponent {
return this.setState({
quote: '"' + data[quotePackAPI.quote] + '"',
author: author,
- authorlink: this.getAuthorLink(author),
- type: 'quote_pack'
+ authorlink: this.getAuthorLink(author)
});
} catch (e) {
return this.doOffline();
@@ -109,8 +119,7 @@ export default class Quote extends React.PureComponent {
return this.setState({
quote: '"' + data.quote + '"',
author: data.author,
- authorlink: this.getAuthorLink(data.author),
- type: 'quote_pack'
+ authorlink: this.getAuthorLink(data.author)
});
} else {
return this.doOffline();
@@ -136,8 +145,7 @@ export default class Quote extends React.PureComponent {
quote: '"' + data.quote + '"',
author: data.author,
authorlink: this.getAuthorLink(data.author),
- quoteLanguage: quotelanguage,
- type: 'api'
+ quoteLanguage: quotelanguage
});
} catch (e) {
// ..and if that fails we load one locally
@@ -149,27 +157,27 @@ export default class Quote extends React.PureComponent {
}
}
- copyQuote = () => {
+ copyQuote() {
window.stats.postEvent('feature', 'Quote copied');
navigator.clipboard.writeText(`${this.state.quote} - ${this.state.author}`);
toast(window.language.toasts.quote);
}
- tweetQuote = () => {
+ tweetQuote() {
window.stats.postEvent('feature', 'Quote tweet');
window.open(`https://twitter.com/intent/tweet?text=${this.state.quote} - ${this.state.author} on @getmue`, '_blank').focus();
}
- favourite = () => {
+ favourite() {
if (localStorage.getItem('favouriteQuote')) {
localStorage.removeItem('favouriteQuote');
this.setState({
- favourited:
+ favourited: this.buttons.unfavourited
});
} else {
localStorage.setItem('favouriteQuote', this.state.quote + ' - ' + this.state.author);
this.setState({
- favourited:
+ favourited: this.buttons.favourited
});
}
@@ -177,16 +185,7 @@ export default class Quote extends React.PureComponent {
}
init() {
- let favouriteQuote = '';
- if (localStorage.getItem('favouriteQuoteEnabled') === 'true') {
- favouriteQuote = localStorage.getItem('favouriteQuote') ? : ;
- }
-
- this.setState({
- favourited: favouriteQuote,
- copy: (localStorage.getItem('copyButton') === 'false') ? null : this.buttons.copy,
- tweet: (localStorage.getItem('tweetButton') === 'false') ? null : this.buttons.tweet
- });
+ this.setZoom();
const quoteType = localStorage.getItem('quoteType');
@@ -196,6 +195,11 @@ export default class Quote extends React.PureComponent {
}
}
+ setZoom() {
+ document.querySelector('.quote').style.fontSize = `${0.8 * Number((localStorage.getItem('zoomQuote') || 100) / 100)}em`;
+ document.querySelector('.quoteauthor').style.fontSize = `${0.9 * Number((localStorage.getItem('zoomQuote') || 100) / 100)}em`;
+ }
+
componentDidMount() {
EventBus.on('refresh', (data) => {
if (data === 'quote') {
@@ -206,8 +210,6 @@ export default class Quote extends React.PureComponent {
}
element.style.display = 'block';
- document.querySelector('.quote').style.fontSize = `${0.8 * Number((localStorage.getItem('zoomQuote') || 100) / 100)}em`;
- document.querySelector('.quoteauthor').style.fontSize = `${0.9 * Number((localStorage.getItem('zoomQuote') || 100) / 100)}em`;
this.init();
}
@@ -217,10 +219,9 @@ export default class Quote extends React.PureComponent {
}
});
- document.querySelector('.quote').style.fontSize = `${0.8 * Number((localStorage.getItem('zoomQuote') || 100) / 100)}em`;
- document.querySelector('.quoteauthor').style.fontSize = `${0.9 * Number((localStorage.getItem('zoomQuote') || 100) / 100)}em`;
-
- this.init();
+ // don't bother with the checks if we're loading for the first time
+ this.setZoom();
+ this.getQuote();
}
componentWillUnmount() {
@@ -230,7 +231,7 @@ export default class Quote extends React.PureComponent {
render() {
return (
-
{`${this.state.quote}`}
+
{this.state.quote}
{this.state.author}
diff --git a/src/components/widgets/search/Search.jsx b/src/components/widgets/search/Search.jsx
index da5799dc..089dd940 100644
--- a/src/components/widgets/search/Search.jsx
+++ b/src/components/widgets/search/Search.jsx
@@ -65,9 +65,9 @@ export default class Search extends React.PureComponent {
async getSuggestions(input) {
window.setResults = (results) => {
window.searchResults = results;
- }
+ };
- const script = document.createElement('script')
+ const script = document.createElement('script');
script.src = `${this.state.autocompleteURL + this.state.autocompleteQuery + input}&${this.state.autocompleteCallback}=window.setResults`;
document.head.appendChild(script);
@@ -82,9 +82,8 @@ export default class Search extends React.PureComponent {
}
init() {
- let url;
+ let url, microphone;
let query = 'q';
- let microphone = null;
const setting = localStorage.getItem('searchEngine');
const info = searchEngines.find((i) => i.settingsName === setting);
@@ -104,9 +103,7 @@ export default class Search extends React.PureComponent {
microphone = ;
}
- let autocompleteURL;
- let autocompleteQuery;
- let autocompleteCallback;
+ let autocompleteURL, autocompleteQuery, autocompleteCallback;
if (localStorage.getItem('autocomplete') === 'true') {
const info = autocompleteProviders.find((i) => i.value === localStorage.getItem('autocompleteProvider'));
diff --git a/src/components/widgets/time/Date.jsx b/src/components/widgets/time/Date.jsx
index 7f9fd0f4..860dde60 100644
--- a/src/components/widgets/time/Date.jsx
+++ b/src/components/widgets/time/Date.jsx
@@ -11,7 +11,7 @@ export default class DateWidget extends React.PureComponent {
super();
this.state = {
date: '',
- weekNumber: ''
+ weekNumber: null
};
}
@@ -37,6 +37,10 @@ export default class DateWidget extends React.PureComponent {
if (localStorage.getItem('weeknumber') === 'true') {
this.getWeekNumber(date);
+ } else if (this.state.weekNumber !== null) {
+ this.setState({
+ weekNumber: null
+ });
}
if (localStorage.getItem('dateType') === 'short') {
@@ -60,7 +64,8 @@ export default class DateWidget extends React.PureComponent {
year = dateDay;
break;
// DMY
- default: break;
+ default:
+ break;
}
let format;
@@ -77,7 +82,8 @@ export default class DateWidget extends React.PureComponent {
case 'slashes':
format = `${day}/${month}/${year}`;
break;
- default: break;
+ default:
+ break;
}
this.setState({
diff --git a/src/components/widgets/weather/Weather.jsx b/src/components/widgets/weather/Weather.jsx
index 06ba676c..3655447b 100644
--- a/src/components/widgets/weather/Weather.jsx
+++ b/src/components/widgets/weather/Weather.jsx
@@ -90,7 +90,8 @@ export default class Weather extends React.PureComponent {
temp_text = '°F';
break;
// kelvin
- default: break;
+ default:
+ break;
}
this.setState({
@@ -175,4 +176,4 @@ export default class Weather extends React.PureComponent {
);
}
-}
\ No newline at end of file
+}