// pins.mjs — place a pin by clicking, give it an Epoch, move it by editing lat/lon, delete it
const P = acts => [{ type: 'pointer', id: 'mouse', parameters: { pointerType: 'mouse' }, actions: acts }];
const click = (x, y) => P([{ type: 'pointerMove', x, y }, { type: 'pointerDown', button: 0 }, { type: 'pointerUp', button: 0 }]);
const set = (sel, v) => `{ const i = document.querySelector('${sel}'); i.value = '${v}'; i.dispatchEvent(new Event('input')); i.dispatchEvent(new Event('change')); }`;
const pins = `return window.mapViewer.pins.pins.map(p => [p.name, p.epoch, +p.lat.toFixed(2), +p.lon.toFixed(2)]);`;
export const steps = [
{ name: 'add pin → placing', wait: 4000, js: `window.mapViewer.showTab('pins'); [...document.querySelectorAll('#tab-pins button')].find(b => b.textContent.includes('Add pin')).click(); return window.mapViewer.mode;`, expect: v => v === 'pin' },
{ name: 'click the map opens the form with epoch + coordinates', actions: click(600, 400), settle: 500,
js: `const f = document.querySelector('form.pin'); return [!!f, f.querySelectorAll('select option').length, f.querySelectorAll('input[type=number]').length];`,
expect: ([f, n, c]) => f && n >= 7 && c === 2 },
{ name: 'save with name + epoch', js: set('form.pin input[required]', 'Smoke Isle') + set('form.pin select', 'epoch-high-fantasy') +
`document.querySelector('form.pin button[type=submit]').click(); await new Promise(r => setTimeout(r, 800));` + pins,
expect: v => v.length === 1 && v[0][0] === 'Smoke Isle' && v[0][1] === 'epoch-high-fantasy' },
{ name: 'edit: move by lat/lon', js: `[...document.querySelectorAll('#tab-pins button')].find(b => b.textContent === 'Edit').click(); await new Promise(r => setTimeout(r, 200));
const n = document.querySelectorAll('form.pin input[type=number]');` + `n[0].value = '-15.5'; n[0].dispatchEvent(new Event('input')); n[1].value = '-34.2'; n[1].dispatchEvent(new Event('input'));
document.querySelector('form.pin button[type=submit]').click(); await new Promise(r => setTimeout(r, 800));` + pins,
expect: v => v[0][2] === -15.5 && v[0][3] === -34.2 && v[0][1] === 'epoch-high-fantasy' },
{ name: 'list shows the epoch', js: `return document.getElementById('tab-pins').textContent;`, expect: v => /high-fantasy/.test(v) },
{ name: 'delete', js: `window.confirm = () => true; [...document.querySelectorAll('#tab-pins button')].find(b => b.textContent === 'Delete').click();
await new Promise(r => setTimeout(r, 800));` + pins, expect: v => v.length === 0 },
];