fix: color home country purple on world map
This commit is contained in:
@@ -6,6 +6,7 @@
|
||||
import { getSelected, setTotalCount, getFlashing } from '../layout/selection.svelte.js';
|
||||
import { getUserProfile } from '../auth/userStore.svelte.js';
|
||||
import homeIconUrl from '../../assets/home.png';
|
||||
import { nameToId } from '../shared/countries.js';
|
||||
import crayonCursorUrl from '../../assets/logo-cursor.png';
|
||||
|
||||
let { onCountryClick = (_name) => {} } = $props();
|
||||
@@ -111,11 +112,17 @@
|
||||
proj.scale(s).translate([w / 2, h * 0.70]);
|
||||
}
|
||||
|
||||
function getHomeCode() {
|
||||
const name = getUserProfile()?.homeCountry;
|
||||
return name ? (nameToId[name] ?? null) : null;
|
||||
}
|
||||
|
||||
function updateAllFills() {
|
||||
const sel = getSelected();
|
||||
const hc = getHomeCode();
|
||||
if (!_paths || !_g) return;
|
||||
_paths.attr('fill', d => countryColor(d, sel, null));
|
||||
_g.selectAll('.micro-state').attr('fill', d => countryColor(d, sel, null));
|
||||
_paths.attr('fill', d => countryColor(d, sel, hc));
|
||||
_g.selectAll('.micro-state').attr('fill', d => countryColor(d, sel, hc));
|
||||
}
|
||||
|
||||
$effect(updateAllFills);
|
||||
@@ -178,7 +185,7 @@
|
||||
})
|
||||
.on('mouseenter', (event, d) => {
|
||||
const s = getSelected();
|
||||
d3.select(event.currentTarget).attr('fill', countryHoverColor(d, s, null));
|
||||
d3.select(event.currentTarget).attr('fill', countryHoverColor(d, s, getHomeCode()));
|
||||
tooltip.style('display', 'block').text(d.properties.name);
|
||||
})
|
||||
.on('mousemove', (event) => {
|
||||
@@ -187,7 +194,7 @@
|
||||
})
|
||||
.on('mouseleave', (event, d) => {
|
||||
const s = getSelected();
|
||||
d3.select(event.currentTarget).attr('fill', countryColor(d, s, null));
|
||||
d3.select(event.currentTarget).attr('fill', countryColor(d, s, getHomeCode()));
|
||||
tooltip.style('display', 'none');
|
||||
});
|
||||
}
|
||||
@@ -215,7 +222,7 @@
|
||||
.attr('cx', cx)
|
||||
.attr('cy', cy)
|
||||
.attr('r', 2)
|
||||
.attr('fill', countryColor(d, getSelected(), null))
|
||||
.attr('fill', countryColor(d, getSelected(), getHomeCode()))
|
||||
.attr('stroke', '#94a3b8')
|
||||
.attr('stroke-width', 0.5);
|
||||
attachEvents(c);
|
||||
|
||||
Reference in New Issue
Block a user