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

feat: hot reload and fixes for weather, quicklinks and quote

Browse Source
This commit is contained in:
David Ralph
2021-04-13 10:51:36 +01:00
parent f5b8346a26
commit 5c638ec355
10 changed files with 106 additions and 59 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
src/components/modals/main/settings/ResetModal.jsx
View File

@@ -11,8 +11,8 @@ export default function ResetModal(props) {
<h4>{language.question}</h4>
<p>{language.information}</p>
<div className='resetfooter'>
<button className='reset' style={{ 'margin-left': '0' }} onClick={() => SettingsFunctions.setDefaultSettings('reset')}>{window.language.modals.main.settings.buttons.reset}</button>
<button className='import' style={{ 'margin-left': '5px' }} onClick={props.modalClose}>{language.cancel}</button>
<button className='reset' style={{ 'marginLeft': '0' }} onClick={() => SettingsFunctions.setDefaultSettings('reset')}>{window.language.modals.main.settings.buttons.reset}</button>
<button className='import' style={{ 'marginLeft': '5px' }} onClick={props.modalClose}>{language.cancel}</button>
</div>
</>
);

2
src/components/modals/main/settings/sections/Appearance.jsx
View File

@@ -59,7 +59,7 @@ export default function AppearanceSettings() {
<h3>{appearance.accessibility.title}</h3>
{(engineName === 'Blink') ?
<Slider title={appearance.accessibility.widget_zoom} name='widgetzoom' default='100' step='10' min='50' max='200' display='%'/>
<Slider title={appearance.accessibility.widget_zoom} name='widgetzoom' default='100' step='10' min='50' max='200' display='%' category='other'/>
: null}
<Slider title={appearance.accessibility.toast_duration} name='toastDisplayTime' default='2500' step='100' min='500' max='5000' display={' ' + appearance.accessibility.milliseconds} />
</>

6
src/components/modals/main/settings/sections/QuickLinks.jsx
View File

@@ -9,9 +9,9 @@ export default function QuickLinks() {
return (
<>
<h2>{language.title}</h2>
<Switch name='quicklinksenabled' text={window.language.modals.main.settings.enabled} />
<Checkbox name='quicklinksnewtab' text={language.open_new} />
<Checkbox name='quicklinkstooltip' text={language.tooltip} />
<Switch name='quicklinksenabled' text={window.language.modals.main.settings.enabled} category='quicklinks' />
<Checkbox name='quicklinksnewtab' text={language.open_new} category='quicklinks' />
<Checkbox name='quicklinkstooltip' text={language.tooltip} category='quicklinks' />
</>
);
}

14
src/components/modals/main/settings/sections/Weather.jsx
View File

@@ -38,19 +38,19 @@ export default class TimeSettings extends React.PureComponent {
return (
<>
<h2>{language.title}</h2>
<Switch name='weatherEnabled' text={this.language.enabled} />
<Switch name='weatherEnabled' text={this.language.enabled} category='weather'/>
<ul>
<p>{language.location}</p>
<input type='text' value={this.state.location} onChange={(e) => this.setState({ location: e.target.value })}></input>
</ul>
<br/>
<Radio name='tempformat' title={language.temp_format.title} options={tempFormat} />
<Radio name='tempformat' title={language.temp_format.title} options={tempFormat} category='weather'/>
<h3>{language.extra_info.title}</h3>
<Checkbox name='humidity' text={language.extra_info.humidity}/>
<Checkbox name='windspeed' text={language.extra_info.wind_speed}/>
<Checkbox name='mintemp' text={language.extra_info.min_temp}/>
<Checkbox name='maxtemp' text={language.extra_info.max_temp}/>
<Checkbox name='atmosphericpressure' text={language.extra_info.atmospheric_pressure}/>
<Checkbox name='humidity' text={language.extra_info.humidity} category='weather'/>
<Checkbox name='windspeed' text={language.extra_info.wind_speed} category='weather'/>
<Checkbox name='mintemp' text={language.extra_info.min_temp} category='weather'/>
<Checkbox name='maxtemp' text={language.extra_info.max_temp} category='weather'/>
<Checkbox name='atmosphericpressure' text={language.extra_info.atmospheric_pressure} category='weather'/>
</>
);
}

1
src/components/widgets/Widgets.jsx
View File

@@ -1,4 +1,5 @@
import React from 'react';
import EventBus from '../../modules/helpers/eventbus';
import Clock from './time/Clock';

29
src/components/widgets/quicklinks/QuickLinks.jsx
View File

@@ -1,5 +1,7 @@
import React from 'react';
import EventBus from '../../../modules/helpers/eventbus';
import Tooltip from '@material-ui/core/Tooltip';
import TextareaAutosize from '@material-ui/core/TextareaAutosize';
@@ -17,12 +19,6 @@ export default class QuickLinks extends React.PureComponent {
this.language = window.language.widgets.quicklinks;
}
updateLink(type, value) {
this.setState({
[type]: value
});
}
deleteLink(name, event) {
event.preventDefault();
@@ -65,6 +61,23 @@ export default class QuickLinks extends React.PureComponent {
}
}
componentDidMount() {
EventBus.on('refresh', (data) => {
if (data === 'quicklinks') {
const element = document.querySelector('.quicklinks-container');
if (localStorage.getItem('quicklinksenabled') === 'false') {
return element.style.display = 'none';
}
element.style.display = 'block';
this.setState({
items: JSON.parse(localStorage.getItem('quicklinks'))
});
}
});
}
render() {
let target, rel = null;
if (localStorage.getItem('quicklinksnewtab') === 'true') {
@@ -97,9 +110,9 @@ export default class QuickLinks extends React.PureComponent {
<span className='quicklinkscontainer' style={{'visibility': this.state.showAddLink}}>
<div className='topbarquicklinks'>
<h4>{this.language.new}</h4>
<TextareaAutosize rowsMax={1} placeholder={this.language.name} value={this.state.name} onChange={(e) => this.updateLink('name', e.target.value)} />
<TextareaAutosize rowsMax={1} placeholder={this.language.name} value={this.state.name} onChange={(e) => this.setState({ name: e.target.value })} />
<br/>
<TextareaAutosize rowsMax={10} placeholder={this.language.url} value={this.state.url} onChange={(e) => this.updateLink('url', e.target.value)} />
<TextareaAutosize rowsMax={10} placeholder={this.language.url} value={this.state.url} onChange={(e) => this.setState({ url: e.target.value })} />
<br/>
<button className='pinNote' onClick={this.addLink}>{this.language.add}</button>
</div>

6
src/components/widgets/quote/Quote.jsx
View File

@@ -155,8 +155,10 @@ export default class Quote extends React.PureComponent {
copy: (localStorage.getItem('copyButton') === 'false') ? null : this.buttons.copy,
tweet: (localStorage.getItem('tweetButton') === 'false') ? null : this.buttons.tweet
});
this.getQuote();
if (!this.state.quote) {
this.getQuote();
}
}
componentDidMount() {

46
src/components/widgets/weather/Weather.jsx
View File

@@ -1,5 +1,7 @@
import React from 'react';
import EventBus from '../../../modules/helpers/eventbus';
import WeatherIcon from './WeatherIcon';
import { WiHumidity, WiWindy } from 'weather-icons-react';
@@ -13,7 +15,6 @@ export default class Weather extends React.PureComponent {
icon: '',
temp_text: '',
weather: {
title: '',
temp: '',
temp_min: '',
temp_max: '',
@@ -25,10 +26,30 @@ export default class Weather extends React.PureComponent {
}
async getWeather() {
const data = await (await fetch (window.constants.WEATHER_URL + `?city=${this.state.location}`)).json();
let data = {
weather: [
{
icon: this.state.icon
}
],
wind: {
speed: this.state.weather.windspeed
},
main: {
temp: this.state.weather.original_temp,
temp_min: this.state.weather.original_temp_min,
temp_max: this.state.weather.original_temp_max,
humidity: this.state.weather.humidity,
pressure: this.state.weather.pressure
}
}
if (!this.state.weather.temp) {
data = await (await fetch (window.constants.WEATHER_URL + `?city=${this.state.location}`)).json();
}
let temp = data.main.temp;
let temp_min = data.main.temp_max
let temp_min = data.main.temp_mix
let temp_max = data.main.temp_max;
let temp_text = 'K';
@@ -52,18 +73,33 @@ export default class Weather extends React.PureComponent {
icon: data.weather[0].icon,
temp_text: temp_text,
weather: {
title: data.weather[0].main,
temp: Math.round(temp),
temp_min: Math.round(temp_min),
temp_max: Math.round(temp_max),
humidity: data.main.humidity,
windspeed: data.wind.speed,
pressure: data.main.pressure
pressure: data.main.pressure,
original_temp: data.main.temp,
original_temp_min: data.main.temp_min,
original_temp_max: data.main.temp_max
}
});
}
componentDidMount() {
EventBus.on('refresh', (data) => {
if (data === 'weather') {
const element = document.querySelector('.weather');
if (localStorage.getItem('weatherEnabled') === 'false') {
return element.style.display = 'none';
}
element.style.display = 'block';
this.getWeather();
}
});
this.getWeather();
}

2
src/modules/constants.js
View File

@@ -1,7 +1,7 @@
export const API_URL = 'https://api.muetab.com';
export const UNSPLASH_URL = 'https://unsplash.muetab.com';
export const MARKETPLACE_URL = 'https://marketplace.muetab.com';
export const WEATHER_URL = 'https://weather.muetab.com';
export const WEATHER_URL = 'https://mueweather.ohlookitsderpy.workers.dev';
export const WEBSITE_URL = 'https://muetab.com';
export const SPONSORS_URL = 'https://sponsors.muetab.com';
export const GITHUB_URL = 'https://api.github.com';

55
src/modules/helpers/settings.js
View File

@@ -72,7 +72,30 @@ export default class SettingsFunctions {
window.location.reload();
}
static loadSettings(noeasteregg) {
static loadSettings(hotreload) {
document.getElementById('widgets').style.zoom = localStorage.getItem('widgetzoom') + '%';
const theme = localStorage.getItem('theme');
switch (theme) {
case 'dark':
document.body.classList.add('dark');
break;
case 'auto':
if (window.matchMedia && window.matchMedia('(prefers-color-scheme: dark)').matches) {
document.body.classList.add('dark');
}
break;
default:
document.body.classList.remove('dark');
}
const tabName = localStorage.getItem('tabName') || window.language.tabname;
document.title = tabName;
if (hotreload === true) {
return;
}
const css = localStorage.getItem('customcss');
if (css) {
document.head.insertAdjacentHTML('beforeend', '<style>' + css + '</style>');
@@ -106,7 +129,7 @@ export default class SettingsFunctions {
<style>
${url}
* {
font-family: '${font}', 'Lexend Deca' !important;
font-family: '${font}', 'Lexend Deca', 'Roboto' !important;
${fontweight}
${fontstyle}
}
@@ -118,34 +141,6 @@ export default class SettingsFunctions {
experimentalInit();
}
const widgetzoom = localStorage.getItem('widgetzoom');
document.getElementById('root').style.zoom = widgetzoom + '%';
const theme = localStorage.getItem('theme');
switch (theme) {
case 'dark':
document.body.classList.add('dark');
break;
case 'auto':
if (window.matchMedia && window.matchMedia('(prefers-color-scheme: dark)').matches) {
document.body.classList.add('dark');
}
break;
default:
document.body.classList.remove('dark');
}
const tabName = localStorage.getItem('tabName');
if (tabName !== window.language.tabname) {
document.title = tabName;
} else {
document.title = window.language.tabname;
}
if (noeasteregg === true) {
return;
}
// easter egg
console.log(`
█████████████████████████████████████████████████████████████