feat: weather sizing, achievements

This commit is contained in:
alexsparkes
2022-05-24 22:19:47 +01:00
parent 2c89894372
commit 5f42b1a6ee
5 changed files with 219 additions and 158 deletions

View File

@@ -4,6 +4,7 @@ import { MdShowChart } from 'react-icons/md';
import Switch from '../Switch';
import SettingsItem from '../SettingsItem';
import { FaTrophy } from 'react-icons/fa';
import EventBus from 'modules/helpers/eventbus';
@@ -71,19 +72,30 @@ export default class Stats extends PureComponent {
/>
</SettingsItem>
<div className="statsGrid">
<div>
<span>
{getMessage('modals.main.settings.sections.stats.sections.tabs_opened')}:{' '}
{this.state.stats['tabs-opened'] || 0}
</span>
<div className="statSection">
<span className="title">Achievements</span>
<div className="achievements">
{this.state.stats['tabs-opened'] > 10 && (
<div className="achievement">
<FaTrophy />
<div className="achievementContent">
<span>10/10 IGN</span>
<span className="subtitle">Opened 10 tabs</span>
</div>
</div>
)}
{this.state.stats['tabs-opened'] > 100 && (
<div className="achievement">
<FaTrophy />
<div className="achievementContent">
<span>Seasoning</span>
<span className="subtitle">Opened 100 tabs</span>
</div>
</div>
)}
</div>
<div>
<span>
{getMessage('modals.main.settings.sections.stats.sections.tabs_opened')}:{' '}
{this.state.stats['tabs-opened'] || 0}
</span>
</div>
<div>
<div className="statSection rightPanel">
<MdShowChart />
<span className="subtitle">
{getMessage('modals.main.settings.sections.stats.sections.tabs_opened')}{' '}

View File

@@ -76,6 +76,7 @@ export default class TimeSettings extends PureComponent {
<option value="1">Basic</option>
<option value="2">Standard</option>
<option value="3">Expanded</option>
<option value="4">Custom</option>
</Dropdown>
</SettingsItem>
<SettingsItem title={getMessage('modals.main.settings.sections.weather.location')}>
@@ -158,64 +159,70 @@ export default class TimeSettings extends PureComponent {
</Dropdown>
</SettingsItem>
)}
<Checkbox
name="showlocation"
text={getMessage('modals.main.settings.sections.weather.extra_info.show_location')}
category="weather"
/>
<Checkbox
name="weatherdescription"
text={getMessage('modals.main.settings.sections.weather.extra_info.show_description')}
category="weather"
/>
<Checkbox
name="cloudiness"
text={getMessage('modals.main.settings.sections.weather.extra_info.cloudiness')}
category="weather"
/>
<Checkbox
name="humidity"
text={getMessage('modals.main.settings.sections.weather.extra_info.humidity')}
category="weather"
/>
<Checkbox
name="visibility"
text={getMessage('modals.main.settings.sections.weather.extra_info.visibility')}
category="weather"
/>
<Checkbox
name="windspeed"
text={getMessage('modals.main.settings.sections.weather.extra_info.wind_speed')}
category="weather"
onChange={() =>
this.setState({
windSpeed: localStorage.getItem('windspeed') !== 'true',
})
}
/>
<Checkbox
name="windDirection"
text={getMessage('modals.main.settings.sections.weather.extra_info.wind_direction')}
category="weather"
disabled={this.state.windSpeed}
/>
<Checkbox
name="mintemp"
text={getMessage('modals.main.settings.sections.weather.extra_info.min_temp')}
category="weather"
/>
<Checkbox
name="maxtemp"
text={getMessage('modals.main.settings.sections.weather.extra_info.max_temp')}
category="weather"
/>
<Checkbox name="feelsliketemp" text={'Feels like temperature'} category="weather" />
<Checkbox
name="atmosphericpressure"
text={getMessage('modals.main.settings.sections.weather.extra_info.atmospheric_pressure')}
category="weather"
/>
<Checkbox name="upcomingForecast" text="Upcoming Forecast" category="weather" />
{localStorage.getItem('weatherType') == 4 && (
<SettingsItem title="Custom Settings">
<Checkbox
name="showlocation"
text={getMessage('modals.main.settings.sections.weather.extra_info.show_location')}
category="weather"
/>
<Checkbox
name="weatherdescription"
text={getMessage('modals.main.settings.sections.weather.extra_info.show_description')}
category="weather"
/>
<Checkbox
name="cloudiness"
text={getMessage('modals.main.settings.sections.weather.extra_info.cloudiness')}
category="weather"
/>
<Checkbox
name="humidity"
text={getMessage('modals.main.settings.sections.weather.extra_info.humidity')}
category="weather"
/>
<Checkbox
name="visibility"
text={getMessage('modals.main.settings.sections.weather.extra_info.visibility')}
category="weather"
/>
<Checkbox
name="windspeed"
text={getMessage('modals.main.settings.sections.weather.extra_info.wind_speed')}
category="weather"
onChange={() =>
this.setState({
windSpeed: localStorage.getItem('windspeed') !== 'true',
})
}
/>
<Checkbox
name="windDirection"
text={getMessage('modals.main.settings.sections.weather.extra_info.wind_direction')}
category="weather"
disabled={this.state.windSpeed}
/>
<Checkbox
name="mintemp"
text={getMessage('modals.main.settings.sections.weather.extra_info.min_temp')}
category="weather"
/>
<Checkbox
name="maxtemp"
text={getMessage('modals.main.settings.sections.weather.extra_info.max_temp')}
category="weather"
/>
<Checkbox name="feelsliketemp" text={'Feels like temperature'} category="weather" />
<Checkbox
name="atmosphericpressure"
text={getMessage(
'modals.main.settings.sections.weather.extra_info.atmospheric_pressure',
)}
category="weather"
/>
<Checkbox name="upcomingForecast" text="Upcoming Forecast" category="weather" />
</SettingsItem>
)}
</>
);
}