diff --git a/src/components/modals/main/marketplace/Item.jsx b/src/components/modals/main/marketplace/Item.jsx
index da515c6d..5e33fe09 100644
--- a/src/components/modals/main/marketplace/Item.jsx
+++ b/src/components/modals/main/marketplace/Item.jsx
@@ -31,17 +31,19 @@ export default function Item(props) {
return (
-
+
+
+
{props.data.name}
{props.button}
-
+
+
{language.overview}
+
-
{language.information}
-
- {language.last_updated}
- {props.data.updated}
@@ -52,17 +54,16 @@ export default function Item(props) {
- {props.data.author}
-
+
+ {/*}
- {language.notice.title}
- {language.notice.description}
-
- {warningHTML}
+
*/}
+ {warningHTML}
- {language.overview}
-
);
}
diff --git a/src/components/modals/main/marketplace/sections/Added.jsx b/src/components/modals/main/marketplace/sections/Added.jsx
index e3afa364..6eb7e7ba 100644
--- a/src/components/modals/main/marketplace/sections/Added.jsx
+++ b/src/components/modals/main/marketplace/sections/Added.jsx
@@ -79,7 +79,7 @@ export default class Added extends React.PureComponent {
break;
}
- toast(window.language.modals.main.toasts[type + 'ed']);
+ toast(window.language.toasts[type + 'ed']);
let button = '';
if (type === 'install') {
@@ -93,7 +93,13 @@ export default class Added extends React.PureComponent {
}
render() {
- let content = this.toggle('item', 'addon', input)} />;
+ let content = (
+ this.toggle('item', 'addon', input)}
+ reloadItemsList={() => this.setState({ installed: JSON.parse(localStorage.getItem('installed')) })}
+ />
+ );
if (this.state.installed.length === 0) {
content = (
@@ -112,7 +118,7 @@ export default class Added extends React.PureComponent {
<>
this.manage('install', JSON.parse(e.target.result))} />
-
+ {/**/}
{content}
- this.toggle()} />
diff --git a/src/components/modals/main/marketplace/sections/Marketplace.jsx b/src/components/modals/main/marketplace/sections/Marketplace.jsx
index 0b877e16..9627445e 100644
--- a/src/components/modals/main/marketplace/sections/Marketplace.jsx
+++ b/src/components/modals/main/marketplace/sections/Marketplace.jsx
@@ -1,6 +1,8 @@
import React from 'react';
import WifiOffIcon from '@material-ui/icons/WifiOff';
+import LocalMallIcon from '@material-ui/icons/LocalMall';
+
import Item from '../Item';
import Items from '../Items';
@@ -31,9 +33,10 @@ export default class Marketplace extends React.PureComponent {
}
};
this.buttons = {
- uninstall: ,
- install:
+ uninstall: ,
+ install:
}
+ this.language = window.language.modals.main.marketplace;
}
async toggle(type, data) {
@@ -103,17 +106,13 @@ export default class Marketplace extends React.PureComponent {
break;
}
- toast(this.props.toastLanguage[type + 'ed']);
+ toast(window.language.toasts[type + 'ed']);
this.setState({
button: (type === 'install') ? this.buttons.uninstall : this.buttons.install
});
}
componentDidMount() {
- if (localStorage.getItem('animations') === 'true') {
- document.getElementById('marketplace').classList.add('marketplaceanimation');
- }
-
if (navigator.onLine === false || localStorage.getItem('offlineMode') === 'true') {
return;
}
@@ -156,6 +155,14 @@ export default class Marketplace extends React.PureComponent {
return errorMessage(
Loading
);
}
+ if (this.state.items.length === 0) {
+ return errorMessage(<>
+
+ Empty
+ No items in this category
+ >)
+ }
+
return (
<>
@@ -165,7 +172,7 @@ export default class Marketplace extends React.PureComponent {
this.toggle('item', input)} />
- this.toggle()} />
diff --git a/src/components/modals/main/scss/index.scss b/src/components/modals/main/scss/index.scss
index d99f57c7..5a8f16e6 100644
--- a/src/components/modals/main/scss/index.scss
+++ b/src/components/modals/main/scss/index.scss
@@ -200,6 +200,14 @@ li {
}
}
+@media only screen and (min-width: 2300px) {
+ .tab-content {
+ position: absolute !important;
+ left: 25% !important;
+ top: 7%;
+ }
+}
+
@media only screen and (max-width: 1920px) {
.tab-content {
position: absolute;
diff --git a/src/components/modals/main/scss/settings/_buttons.scss b/src/components/modals/main/scss/settings/_buttons.scss
index 9addbf2a..e4ac4d35 100644
--- a/src/components/modals/main/scss/settings/_buttons.scss
+++ b/src/components/modals/main/scss/settings/_buttons.scss
@@ -85,7 +85,7 @@
%storebutton {
cursor: pointer;
font-size: 18px;
- float: right;
+ display: block;
padding: 5px 30px;
background: none;
border-radius: 24px;
diff --git a/src/components/modals/main/settings/sections/Advanced.jsx b/src/components/modals/main/settings/sections/Advanced.jsx
index 90142274..732255f2 100644
--- a/src/components/modals/main/settings/sections/Advanced.jsx
+++ b/src/components/modals/main/settings/sections/Advanced.jsx
@@ -46,7 +46,7 @@ export default class AdvancedSettings extends React.PureComponent {
{advanced.customisation}
-
+
{this.language.sections.experimental.title}
{advanced.experimental_warning}
diff --git a/src/components/modals/main/settings/sections/Weather.jsx b/src/components/modals/main/settings/sections/Weather.jsx
index 7be719ca..954c9af9 100644
--- a/src/components/modals/main/settings/sections/Weather.jsx
+++ b/src/components/modals/main/settings/sections/Weather.jsx
@@ -2,6 +2,7 @@ import React from 'react';
import Switch from '../Switch';
import Radio from '../Radio';
+import Checkbox from '../Checkbox';
export default class TimeSettings extends React.PureComponent {
constructor() {
@@ -44,11 +45,18 @@ export default class TimeSettings extends React.PureComponent {
<>
{language.title}
+
+ Extra Information
+
+
+
+
+
>
);
}
diff --git a/src/components/modals/main/settings/sections/background/Background.jsx b/src/components/modals/main/settings/sections/background/Background.jsx
index 429bf759..2a07d89b 100644
--- a/src/components/modals/main/settings/sections/background/Background.jsx
+++ b/src/components/modals/main/settings/sections/background/Background.jsx
@@ -51,6 +51,12 @@ export default class BackgroundSettings extends React.PureComponent {
}
}
+ marketplaceType = () => {
+ if (localStorage.getItem('photo_packs')) {
+ return
+ }
+ }
+
componentDidUpdate() {
localStorage.setItem('customBackground', this.state.customBackground);
}
@@ -107,7 +113,7 @@ export default class BackgroundSettings extends React.PureComponent {
// API
default: backgroundSettings = APISettings; break;
}
-
+
return (
<>
{background.title}
@@ -125,6 +131,7 @@ export default class BackgroundSettings extends React.PureComponent {
this.setState({ backgroundType: value })}>
+ {this.marketplaceType()}
diff --git a/src/components/modals/main/tabs/backend/Tab.jsx b/src/components/modals/main/tabs/backend/Tab.jsx
index d6713063..ee253ea1 100644
--- a/src/components/modals/main/tabs/backend/Tab.jsx
+++ b/src/components/modals/main/tabs/backend/Tab.jsx
@@ -20,9 +20,10 @@ import Order from '@material-ui/icons/List';
import Weather from '@material-ui/icons/CloudOutlined';
import Advanced from '@material-ui/icons/SettingsOutlined';
import QuickLinks from '@material-ui/icons/Link';
+import Sideload from '@material-ui/icons/Code';
// Store
-import Added from '@material-ui/icons/AddCircle';
+import Added from '@material-ui/icons/AddCircleOutline';
export default function Tab(props) {
let className = 'tab-list-item';
@@ -67,6 +68,7 @@ export default function Tab(props) {
case 'Photo Packs': icon = ; break;
case 'Quote Packs': icon =
; break;
case 'Added': icon = ; break;
+ case 'Sideload': icon = ; break;
default: break;
}
diff --git a/src/components/widgets/time/Date.jsx b/src/components/widgets/time/Date.jsx
index 35ce4e54..899bf772 100644
--- a/src/components/widgets/time/Date.jsx
+++ b/src/components/widgets/time/Date.jsx
@@ -12,7 +12,7 @@ export default class DateWidget extends React.PureComponent {
getDate() {
const date = new Date();
- const type = localStorage.getItem('type');
+ const type = localStorage.getItem('dateType');
if (type === 'short') {
const dateDay = date.getDate();
@@ -33,8 +33,7 @@ export default class DateWidget extends React.PureComponent {
year = dateDay;
break;
// DMY
- default:
- break;
+ default: break;
}
let format;
@@ -50,6 +49,8 @@ export default class DateWidget extends React.PureComponent {
break;
case 'slashes':
format = `${day}/${month}/${year}`;
+ break;
+ default: break;
}
this.setState({
diff --git a/src/components/widgets/weather/Weather.jsx b/src/components/widgets/weather/Weather.jsx
index 5ed570b1..9720bbdb 100644
--- a/src/components/widgets/weather/Weather.jsx
+++ b/src/components/widgets/weather/Weather.jsx
@@ -1,33 +1,64 @@
import React from 'react';
import WeatherIcon from './WeatherIcon';
+import { WiHumidity, WiWindy } from 'weather-icons-react';
+
import './weather.scss';
export default class Weather extends React.PureComponent {
constructor() {
super();
this.state = {
+ location: localStorage.getItem('location') || 'London',
icon: '',
+ temp_text: '',
weather: {
title: '',
temp: '',
temp_min: '',
temp_max: '',
- humidity: ''
+ humidity: '',
+ windspeed: '',
+ pressure: ''
}
};
}
async getWeather() {
- const data = await (await fetch (window.constants.WEATHER_URL + '?city=London')).json();
+ const 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_max = data.main.temp_max;
+ let temp_text = 'K';
+
+ switch (localStorage.getItem('tempformat')) {
+ case 'celsius':
+ temp = temp - 273.15;
+ temp_min = temp_min - 273.15;
+ temp_max = temp_max - 273.15;
+ temp_text = '°C';
+ break;
+ case 'fahrenheit':
+ temp = ((temp - 273.15) * 1.8) + 32;
+ temp_min = ((temp_min - 273.15) * 1.8) + 32;
+ temp_max = ((temp_max - 273.15) * 1.8) + 32;
+ temp_text = '°F';
+ break;
+ default: break;
+ }
+
this.setState({
icon: data.weather[0].icon,
+ temp_text: temp_text,
weather: {
title: data.weather[0].main,
- temp: Math.round(data.main.temp - 273.15),
- temp_min: Math.round(data.main.temp_min - 273.15),
- temp_max: Math.round(data.main.temp_max - 273.15),
- humidity: data.main.humidity
+ 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
}
});
}
@@ -40,11 +71,17 @@ export default class Weather extends React.PureComponent {
return (
- {this.state.weather.temp}°C
-
- {this.state.weather.temp_min}°C, {this.state.weather.temp_max}°C
-
- London
+ {this.state.weather.temp + this.state.temp_text}
+
+ {this.state.weather.temp_min + this.state.temp_text} {this.state.weather.temp_max + this.state.temp_text}
+
+ {this.state.weather.humidity}%
+
+ {this.state.weather.windspeed} m/s
+
+ {this.state.weather.pressure} hPa
+
+ {this.state.location}
{/*{this.state.weather.title}*/}
);
diff --git a/src/components/widgets/weather/weather.scss b/src/components/widgets/weather/weather.scss
index 59c3693a..66c623c2 100644
--- a/src/components/widgets/weather/weather.scss
+++ b/src/components/widgets/weather/weather.scss
@@ -9,9 +9,7 @@
svg {
filter: drop-shadow(0 0 6px rgba(0, 0, 0, 0.3));
-
font-size: 0.8em;
-
}
.loc {
diff --git a/src/modules/default_settings.json b/src/modules/default_settings.json
index 3c4dda76..cd1b488f 100644
--- a/src/modules/default_settings.json
+++ b/src/modules/default_settings.json
@@ -158,5 +158,9 @@
{
"name": "weatherEnabled",
"value": false
+ },
+ {
+ "name": "temperatureformat",
+ "value": "celsius"
}
]
diff --git a/src/modules/helpers/marketplace.js b/src/modules/helpers/marketplace.js
index d4e9c182..7d172ef5 100644
--- a/src/modules/helpers/marketplace.js
+++ b/src/modules/helpers/marketplace.js
@@ -18,6 +18,11 @@ export default class MarketplaceFunctions {
localStorage.removeItem('quote_packs');
localStorage.removeItem('quoteAPI');
break;
+ case 'photo_packs':
+ localStorage.removeItem('photo_packs');
+ localStorage.setItem('backgroundType', localStorage.getItem('oldBackgroundType'));
+ localStorage.removeItem('oldBackgroundType');
+ break;
default:
try {
localStorage.removeItem(type);
@@ -56,6 +61,8 @@ export default class MarketplaceFunctions {
case 'photo_packs':
localStorage.setItem('photo_packs', JSON.stringify(input.photos));
+ localStorage.setItem('oldBackgroundType', localStorage.getItem('backgroundType'));
+ localStorage.setItem('backgroundType', 'photo_pack');
break;
case 'quote_packs':
diff --git a/src/modules/languages.json b/src/modules/languages.json
index f4821ef8..fb403694 100644
--- a/src/modules/languages.json
+++ b/src/modules/languages.json
@@ -1,4 +1,8 @@
[
+ {
+ "name": "Chinese (Simplified)",
+ "value": "zh_CN"
+ },
{
"name": "Deutsch",
"value": "de_DE"
@@ -30,9 +34,5 @@
{
"name": "Pусский",
"value": "ru"
- },
- {
- "name": "Chinese (Simplified)",
- "value": "zh_CN"
}
]
diff --git a/src/scss/modules/_marketplace.scss b/src/scss/modules/_marketplace.scss
index ee5e0113..0cafd589 100644
--- a/src/scss/modules/_marketplace.scss
+++ b/src/scss/modules/_marketplace.scss
@@ -8,18 +8,21 @@
}
.items {
- display: flex;
+ display: inline-grid;
+ grid-template-columns: repeat(3, 1fr);
margin-top: 15px;
.item {
position: relative;
border-radius: 12px;
height: 80px;
- width: 270px;
+ width: 260px;
background: map-get($marketplace, 'item-background');
transition: 0.5s;
cursor: pointer;
margin-right: 20px;
+ margin-top: 20px;
+ box-shadow: 0 0 6px rgb(0 0 0 / 30%);
img {
height: 100%;
@@ -74,17 +77,18 @@ p.author {
h1 {
font-size: 40px;
+ line-height: 20px;
}
}
#item>h1,
#item>.MuiSvgIcon-root {
display: inline;
- font-size: 35px !important;
}
p.description {
margin-top: 0px;
+ max-width: 400px;
}
.emptyMessage {
@@ -107,15 +111,13 @@ p.description {
}
.informationContainer {
- float: right;
- margin-right: 15px;
+ margin-top: 20px;
}
.productInformation {
- margin-bottom: 20px;
- padding: 20px;
+ padding: 10px;
background: map-get($marketplace, 'product-information-backgroud');
- width: 200px;
+ width: 350px;
border-radius: 12px;
h4 {
@@ -163,14 +165,16 @@ p.description {
}
.featured {
- margin-top: 20px;
- border-radius: 24px;
+ margin-top: 40px;
+ border-radius: 15px;
padding: 50px;
- color: map-get($theme-colours, 'main');
+ color: #fff;
+ box-shadow: 0 0 10px rgb(0 0 0 / 30%);
+ width: 85%;
button {
float: left;
- margin-top: -20px;
+ margin-top: -7px;
border: 2px solid map-get($theme-colours, 'main');
color: map-get($theme-colours, 'main');