MapPage - refactor
This commit is contained in:
parent
6885b2c1ba
commit
610d66fce1
|
@ -255,56 +255,47 @@ function MapPage() {
|
||||||
variant="standard"
|
variant="standard"
|
||||||
type="color"
|
type="color"
|
||||||
/>
|
/>
|
||||||
|
{[
|
||||||
|
{
|
||||||
|
name: 'markersOnly',
|
||||||
|
checked: settings.markersOnly,
|
||||||
|
onChange: handleSettingsChange,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
name: 'showBarbarian',
|
||||||
|
checked: settings.showBarbarian,
|
||||||
|
onChange: handleSettingsChange,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
name: 'largerMarkers',
|
||||||
|
checked: settings.largerMarkers,
|
||||||
|
onChange: handleSettingsChange,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
name: 'showGrid',
|
||||||
|
checked: settings.showGrid,
|
||||||
|
onChange: handleSettingsChange,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
name: 'showContinentNumbers',
|
||||||
|
checked: settings.showContinentNumbers,
|
||||||
|
onChange: handleSettingsChange,
|
||||||
|
},
|
||||||
|
].map(({ name, checked, onChange }) => {
|
||||||
|
return (
|
||||||
<FormControlLabel
|
<FormControlLabel
|
||||||
label={t('inputLabels.markersOnly')}
|
key={name}
|
||||||
|
label={t('inputLabels.' + name)}
|
||||||
control={
|
control={
|
||||||
<Checkbox
|
<Checkbox
|
||||||
name="markersOnly"
|
name={name}
|
||||||
checked={settings.markersOnly}
|
checked={checked}
|
||||||
onChange={handleSettingsChange}
|
onChange={onChange}
|
||||||
/>
|
|
||||||
}
|
|
||||||
/>
|
|
||||||
<FormControlLabel
|
|
||||||
label={t('inputLabels.showBarbarianVillages')}
|
|
||||||
control={
|
|
||||||
<Checkbox
|
|
||||||
name="showBarbarian"
|
|
||||||
checked={settings.showBarbarian}
|
|
||||||
onChange={handleSettingsChange}
|
|
||||||
/>
|
|
||||||
}
|
|
||||||
/>
|
|
||||||
<FormControlLabel
|
|
||||||
label={t('inputLabels.largerMarkers')}
|
|
||||||
control={
|
|
||||||
<Checkbox
|
|
||||||
name="largerMarkers"
|
|
||||||
checked={settings.largerMarkers}
|
|
||||||
onChange={handleSettingsChange}
|
|
||||||
/>
|
|
||||||
}
|
|
||||||
/>
|
|
||||||
<FormControlLabel
|
|
||||||
label={t('inputLabels.continentGrid')}
|
|
||||||
control={
|
|
||||||
<Checkbox
|
|
||||||
name="showGrid"
|
|
||||||
checked={settings.showGrid}
|
|
||||||
onChange={handleSettingsChange}
|
|
||||||
/>
|
|
||||||
}
|
|
||||||
/>
|
|
||||||
<FormControlLabel
|
|
||||||
label={t('inputLabels.continentNumbers')}
|
|
||||||
control={
|
|
||||||
<Checkbox
|
|
||||||
name="showContinentNumbers"
|
|
||||||
checked={settings.showContinentNumbers}
|
|
||||||
onChange={handleSettingsChange}
|
|
||||||
/>
|
/>
|
||||||
}
|
}
|
||||||
/>
|
/>
|
||||||
|
);
|
||||||
|
})}
|
||||||
</div>
|
</div>
|
||||||
</Card>
|
</Card>
|
||||||
<Card>
|
<Card>
|
||||||
|
|
|
@ -27,22 +27,10 @@ function Map({
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<div className={classes.container}>
|
<div className={classes.container}>
|
||||||
{loading ? (
|
{loading && (
|
||||||
<Alert variant="filled" severity="warning">
|
<Alert variant="filled" severity="warning">
|
||||||
{loadingInfo}
|
{loadingInfo}
|
||||||
</Alert>
|
</Alert>
|
||||||
) : (
|
|
||||||
<Alert variant="filled" severity="info">
|
|
||||||
URL:{' '}
|
|
||||||
<Link
|
|
||||||
color="inherit"
|
|
||||||
underline="always"
|
|
||||||
className={classes.link}
|
|
||||||
href={src}
|
|
||||||
>
|
|
||||||
{src}
|
|
||||||
</Link>
|
|
||||||
</Alert>
|
|
||||||
)}
|
)}
|
||||||
<div
|
<div
|
||||||
className={classes.imageWrapper}
|
className={classes.imageWrapper}
|
||||||
|
@ -85,7 +73,7 @@ const useStyles = makeStyles(theme => {
|
||||||
marginTop: theme.spacing(2),
|
marginTop: theme.spacing(2),
|
||||||
},
|
},
|
||||||
imageWrapper: {
|
imageWrapper: {
|
||||||
marginTop: theme.spacing(1),
|
marginTop: theme.spacing(2),
|
||||||
margin: 'auto',
|
margin: 'auto',
|
||||||
},
|
},
|
||||||
};
|
};
|
||||||
|
|
|
@ -13,10 +13,10 @@ const translations = {
|
||||||
gridLineColor: 'Grid line color',
|
gridLineColor: 'Grid line color',
|
||||||
continentNumberColor: 'Continent number color',
|
continentNumberColor: 'Continent number color',
|
||||||
markersOnly: 'Markers only',
|
markersOnly: 'Markers only',
|
||||||
showBarbarianVillages: 'Show barbarian villages',
|
showBarbarian: 'Show barbarian villages',
|
||||||
largerMarkers: 'Larger markers',
|
largerMarkers: 'Larger markers',
|
||||||
continentGrid: 'Continent grid',
|
showGrid: 'Continent grid',
|
||||||
continentNumbers: 'Continent numbers',
|
showContinentNumbers: 'Continent numbers',
|
||||||
},
|
},
|
||||||
buttons: {
|
buttons: {
|
||||||
addMarker: 'Add marker',
|
addMarker: 'Add marker',
|
||||||
|
|
|
@ -13,10 +13,10 @@ const translations = {
|
||||||
gridLineColor: 'Kolor linii',
|
gridLineColor: 'Kolor linii',
|
||||||
continentNumberColor: 'Kolor numeru kontynentu',
|
continentNumberColor: 'Kolor numeru kontynentu',
|
||||||
markersOnly: 'Tylko oznaczenia',
|
markersOnly: 'Tylko oznaczenia',
|
||||||
showBarbarianVillages: 'Pokaż opuszczone',
|
showBarbarian: 'Pokaż opuszczone',
|
||||||
largerMarkers: 'Większe znaczniki',
|
largerMarkers: 'Większe znaczniki',
|
||||||
continentGrid: 'Granice kontynentów',
|
showGrid: 'Granice kontynentów',
|
||||||
continentNumbers: 'Numery kontynentów',
|
showContinentNumbers: 'Numery kontynentów',
|
||||||
},
|
},
|
||||||
buttons: {
|
buttons: {
|
||||||
addMarker: 'Dodaj marker',
|
addMarker: 'Dodaj marker',
|
||||||
|
|
Reference in New Issue
Block a user