Compare commits
29 Commits
| Author | SHA1 | Date | |
|---|---|---|---|
|
989173a2e6
|
|||
|
62407f5fa4
|
|||
|
7f1c4b5f61
|
|||
|
59e334c499
|
|||
|
981502e293
|
|||
|
9c5fbca72a
|
|||
|
fd8f04f902
|
|||
|
3e23ec161c
|
|||
|
f2e531c0f6
|
|||
|
96a5a6ac34
|
|||
|
78996b6c61
|
|||
|
bb5b69711c
|
|||
|
ad9c489102
|
|||
|
c11882adfb
|
|||
|
707f4ac11c
|
|||
|
3bada05b63
|
|||
|
f01730fef5
|
|||
|
448c51bab6
|
|||
|
0bcbae374b
|
|||
|
c33fe3b268
|
|||
|
18bda60310
|
|||
|
86d25dc6ba
|
|||
|
5b8bec6a00
|
|||
|
f2c2eb1fdc
|
|||
|
b42c4881f6
|
|||
|
b18e299eca
|
|||
|
401ed41fcd
|
|||
|
504e8fab94
|
|||
|
76897c9e69
|
@@ -9,6 +9,7 @@ import SearchBox from '#components/search-box';
|
||||
import CategoryChips from '#components/category-chips';
|
||||
import { and } from 'ember-truth-helpers';
|
||||
import cachedImage from '../modifiers/cached-image';
|
||||
import { POI_CATEGORIES } from '../utils/poi-categories';
|
||||
|
||||
export default class AppHeaderComponent extends Component {
|
||||
@service storage;
|
||||
@@ -16,11 +17,59 @@ export default class AppHeaderComponent extends Component {
|
||||
@service nostrAuth;
|
||||
@service nostrData;
|
||||
@service mapUi;
|
||||
@service router;
|
||||
@tracked isUserMenuOpen = false;
|
||||
@tracked searchQuery = '';
|
||||
|
||||
get hasQuery() {
|
||||
return !!this.searchQuery;
|
||||
constructor() {
|
||||
super(...arguments);
|
||||
if (this.router && typeof this.router.on === 'function') {
|
||||
this.router.on('routeDidChange', this.syncSearchQuery);
|
||||
}
|
||||
this.syncSearchQuery();
|
||||
}
|
||||
|
||||
willDestroy() {
|
||||
if (this.router && typeof this.router.off === 'function') {
|
||||
this.router.off('routeDidChange', this.syncSearchQuery);
|
||||
}
|
||||
super.willDestroy(...arguments);
|
||||
}
|
||||
|
||||
@action
|
||||
syncSearchQuery() {
|
||||
const qp =
|
||||
this.mapUi.currentSearch || this.router?.currentRoute?.queryParams;
|
||||
if (qp?.q) {
|
||||
this.searchQuery = qp.q;
|
||||
} else if (qp?.category) {
|
||||
const category = POI_CATEGORIES.find((c) => c.id === qp.category);
|
||||
this.searchQuery = category ? category.label : qp.category;
|
||||
} else {
|
||||
this.searchQuery = '';
|
||||
}
|
||||
}
|
||||
|
||||
get isSearching() {
|
||||
// 1. If we are actively focusing/typing in the search box with a query, hide pills
|
||||
if (this.mapUi.searchBoxHasFocus && this.searchQuery) {
|
||||
return true;
|
||||
}
|
||||
|
||||
// 2. If we are on the search route, check loading and results status
|
||||
if (this.router?.currentRouteName === 'search') {
|
||||
if (this.mapUi.loadingState) {
|
||||
return false; // Keep pills visible while loading
|
||||
}
|
||||
return this.mapUi.searchResults && this.mapUi.searchResults.length > 0;
|
||||
}
|
||||
|
||||
// 3. Fallback for integration tests (non-search route with a query)
|
||||
if (this.router?.currentRouteName !== 'search' && this.searchQuery) {
|
||||
return true;
|
||||
}
|
||||
|
||||
return false;
|
||||
}
|
||||
|
||||
get showQuickSearch() {
|
||||
@@ -61,7 +110,7 @@ export default class AppHeaderComponent extends Component {
|
||||
</div>
|
||||
|
||||
{{#if this.showQuickSearch}}
|
||||
<div class="header-center {{if this.hasQuery 'searching'}}">
|
||||
<div class="header-center {{if this.isSearching 'searching'}}">
|
||||
<CategoryChips @onSelect={{this.handleChipSelect}} />
|
||||
</div>
|
||||
{{/if}}
|
||||
|
||||
@@ -3,11 +3,11 @@ import Icon from '#components/icon';
|
||||
|
||||
<template>
|
||||
{{! template-lint-disable no-nested-interactive }}
|
||||
<div class="sidebar-header">
|
||||
<div class="sidebar-header has-back-btn">
|
||||
<button type="button" class="back-btn" {{on "click" @onBack}}>
|
||||
<Icon @name="arrow-left" @size={{20}} @color="#333" />
|
||||
</button>
|
||||
<h2>About</h2>
|
||||
<h2 class="sidebar-header-text-centered">About</h2>
|
||||
<button type="button" class="close-btn" {{on "click" @onClose}}>
|
||||
<Icon @name="x" @size={{20}} @color="#333" />
|
||||
</button>
|
||||
|
||||
@@ -19,6 +19,12 @@ import iconRounded from '../../icons/icon-rounded.svg?raw';
|
||||
|
||||
<div class="sidebar-content">
|
||||
<ul class="app-menu">
|
||||
<li>
|
||||
<button type="button" {{on "click" @onSavedPlaces}}>
|
||||
<Icon @name="bookmark" @size={{20}} />
|
||||
<span>Collections</span>
|
||||
</button>
|
||||
</li>
|
||||
<li>
|
||||
<button type="button" {{on "click" (fn @onNavigate "settings")}}>
|
||||
<Icon @name="settings" @size={{20}} />
|
||||
|
||||
@@ -2,6 +2,7 @@ import Component from '@glimmer/component';
|
||||
import { action } from '@ember/object';
|
||||
import { tracked } from '@glimmer/tracking';
|
||||
import { fn } from '@ember/helper';
|
||||
import { service } from '@ember/service';
|
||||
import eq from 'ember-truth-helpers/helpers/eq';
|
||||
|
||||
import AppMenuHome from './home';
|
||||
@@ -9,6 +10,7 @@ import AppMenuSettings from './settings';
|
||||
import AppMenuAbout from './about';
|
||||
|
||||
export default class AppMenu extends Component {
|
||||
@service router;
|
||||
@tracked currentView = 'menu'; // 'menu', 'settings', 'about'
|
||||
|
||||
@action
|
||||
@@ -16,10 +18,19 @@ export default class AppMenu extends Component {
|
||||
this.currentView = view;
|
||||
}
|
||||
|
||||
@action
|
||||
goToSavedPlaces() {
|
||||
this.router.transitionTo('lists.index');
|
||||
}
|
||||
|
||||
<template>
|
||||
<div class="sidebar app-menu-pane">
|
||||
{{#if (eq this.currentView "menu")}}
|
||||
<AppMenuHome @onNavigate={{this.setView}} @onClose={{@onClose}} />
|
||||
<AppMenuHome
|
||||
@onNavigate={{this.setView}}
|
||||
@onClose={{@onClose}}
|
||||
@onSavedPlaces={{this.goToSavedPlaces}}
|
||||
/>
|
||||
|
||||
{{else if (eq this.currentView "settings")}}
|
||||
<AppMenuSettings
|
||||
|
||||
@@ -21,11 +21,11 @@ export default class AppMenuSettings extends Component {
|
||||
}
|
||||
|
||||
<template>
|
||||
<div class="sidebar-header">
|
||||
<div class="sidebar-header has-back-btn">
|
||||
<button type="button" class="back-btn" {{on "click" @onBack}}>
|
||||
<Icon @name="arrow-left" @size={{20}} @color="#333" />
|
||||
</button>
|
||||
<h2>Settings</h2>
|
||||
<h2 class="sidebar-header-text-centered">Settings</h2>
|
||||
<button type="button" class="close-btn" {{on "click" @onClose}}>
|
||||
<Icon @name="x" @size={{20}} @color="#333" />
|
||||
</button>
|
||||
|
||||
@@ -5,7 +5,11 @@ import { tracked } from '@glimmer/tracking';
|
||||
import { service } from '@ember/service';
|
||||
import { fn } from '@ember/helper';
|
||||
import Icon from '#components/icon';
|
||||
import { normalizeRelayUrl } from '../../../utils/nostr';
|
||||
import {
|
||||
excludeRequiredRelays,
|
||||
mergeRequiredRelays,
|
||||
normalizeRelayUrl,
|
||||
} from '../../../utils/nostr';
|
||||
|
||||
const stripProtocol = (url) => (url ? url.replace(/^wss?:\/\//, '') : '');
|
||||
|
||||
@@ -17,6 +21,74 @@ export default class AppMenuSettingsNostr extends Component {
|
||||
@tracked newReadRelay = '';
|
||||
@tracked newWriteRelay = '';
|
||||
|
||||
get customReadRelays() {
|
||||
return excludeRequiredRelays(
|
||||
this.settings.nostrReadRelays || [],
|
||||
this.nostrData.requiredReadRelays
|
||||
);
|
||||
}
|
||||
|
||||
get customWriteRelays() {
|
||||
return excludeRequiredRelays(
|
||||
this.settings.nostrWriteRelays || [],
|
||||
this.nostrData.requiredWriteRelays
|
||||
);
|
||||
}
|
||||
|
||||
get readRelayExclusions() {
|
||||
return this.settings.nostrReadRelayExclusions || [];
|
||||
}
|
||||
|
||||
get writeRelayExclusions() {
|
||||
return this.settings.nostrWriteRelayExclusions || [];
|
||||
}
|
||||
|
||||
get requiredReadRelaySet() {
|
||||
return new Set(this.nostrData.requiredReadRelays.filter(Boolean));
|
||||
}
|
||||
|
||||
get requiredWriteRelaySet() {
|
||||
return new Set(this.nostrData.requiredWriteRelays.filter(Boolean));
|
||||
}
|
||||
|
||||
get mailboxReadRelaySet() {
|
||||
return new Set(this.nostrData.mailboxReadRelays);
|
||||
}
|
||||
|
||||
get mailboxWriteRelaySet() {
|
||||
return new Set(this.nostrData.mailboxWriteRelays);
|
||||
}
|
||||
|
||||
get hasReadOverrides() {
|
||||
return (
|
||||
this.customReadRelays.length > 0 || this.readRelayExclusions.length > 0
|
||||
);
|
||||
}
|
||||
|
||||
get hasWriteOverrides() {
|
||||
return (
|
||||
this.customWriteRelays.length > 0 || this.writeRelayExclusions.length > 0
|
||||
);
|
||||
}
|
||||
|
||||
get readRelaysForDisplay() {
|
||||
return this.nostrData.activeReadRelays.map((url) => {
|
||||
return {
|
||||
url,
|
||||
isRequired: this.requiredReadRelaySet.has(url),
|
||||
};
|
||||
});
|
||||
}
|
||||
|
||||
get writeRelaysForDisplay() {
|
||||
return this.nostrData.activeWriteRelays.map((url) => {
|
||||
return {
|
||||
url,
|
||||
isRequired: this.requiredWriteRelaySet.has(url),
|
||||
};
|
||||
});
|
||||
}
|
||||
|
||||
@action
|
||||
updateNewReadRelay(event) {
|
||||
this.newReadRelay = event.target.value;
|
||||
@@ -32,19 +104,51 @@ export default class AppMenuSettingsNostr extends Component {
|
||||
const url = normalizeRelayUrl(this.newReadRelay);
|
||||
if (!url) return;
|
||||
|
||||
const current =
|
||||
this.settings.nostrReadRelays || this.nostrData.defaultReadRelays;
|
||||
const set = new Set([...current, url]);
|
||||
this.settings.update('nostrReadRelays', Array.from(set));
|
||||
const merged = mergeRequiredRelays(this.nostrData.requiredReadRelays, [
|
||||
...this.customReadRelays,
|
||||
url,
|
||||
]);
|
||||
const custom = excludeRequiredRelays(
|
||||
merged,
|
||||
this.nostrData.requiredReadRelays
|
||||
);
|
||||
|
||||
const readExclusions = this.readRelayExclusions.filter((relay) => {
|
||||
return normalizeRelayUrl(relay) !== url;
|
||||
});
|
||||
|
||||
this.settings.update('nostrReadRelays', custom.length > 0 ? custom : null);
|
||||
this.settings.update(
|
||||
'nostrReadRelayExclusions',
|
||||
readExclusions.length > 0 ? readExclusions : null
|
||||
);
|
||||
this.newReadRelay = '';
|
||||
}
|
||||
|
||||
@action
|
||||
removeReadRelay(url) {
|
||||
const current =
|
||||
this.settings.nostrReadRelays || this.nostrData.defaultReadRelays;
|
||||
const filtered = current.filter((r) => r !== url);
|
||||
this.settings.update('nostrReadRelays', filtered);
|
||||
if (this.requiredReadRelaySet.has(url)) {
|
||||
return;
|
||||
}
|
||||
|
||||
const normalizedUrl = normalizeRelayUrl(url);
|
||||
|
||||
const remainingCustom = this.customReadRelays.filter((relay) => {
|
||||
return normalizeRelayUrl(relay) !== normalizedUrl;
|
||||
});
|
||||
|
||||
const nextExclusions = this.mailboxReadRelaySet.has(normalizedUrl)
|
||||
? Array.from(new Set([...this.readRelayExclusions, normalizedUrl]))
|
||||
: this.readRelayExclusions;
|
||||
|
||||
this.settings.update(
|
||||
'nostrReadRelays',
|
||||
remainingCustom.length > 0 ? remainingCustom : null
|
||||
);
|
||||
this.settings.update(
|
||||
'nostrReadRelayExclusions',
|
||||
nextExclusions.length > 0 ? nextExclusions : null
|
||||
);
|
||||
}
|
||||
|
||||
@action
|
||||
@@ -64,6 +168,7 @@ export default class AppMenuSettingsNostr extends Component {
|
||||
@action
|
||||
resetReadRelays() {
|
||||
this.settings.update('nostrReadRelays', null);
|
||||
this.settings.update('nostrReadRelayExclusions', null);
|
||||
}
|
||||
|
||||
@action
|
||||
@@ -71,24 +176,57 @@ export default class AppMenuSettingsNostr extends Component {
|
||||
const url = normalizeRelayUrl(this.newWriteRelay);
|
||||
if (!url) return;
|
||||
|
||||
const current =
|
||||
this.settings.nostrWriteRelays || this.nostrData.defaultWriteRelays;
|
||||
const set = new Set([...current, url]);
|
||||
this.settings.update('nostrWriteRelays', Array.from(set));
|
||||
const merged = mergeRequiredRelays(this.nostrData.requiredWriteRelays, [
|
||||
...this.customWriteRelays,
|
||||
url,
|
||||
]);
|
||||
const custom = excludeRequiredRelays(
|
||||
merged,
|
||||
this.nostrData.requiredWriteRelays
|
||||
);
|
||||
|
||||
const writeExclusions = this.writeRelayExclusions.filter((relay) => {
|
||||
return normalizeRelayUrl(relay) !== url;
|
||||
});
|
||||
|
||||
this.settings.update('nostrWriteRelays', custom.length > 0 ? custom : null);
|
||||
this.settings.update(
|
||||
'nostrWriteRelayExclusions',
|
||||
writeExclusions.length > 0 ? writeExclusions : null
|
||||
);
|
||||
this.newWriteRelay = '';
|
||||
}
|
||||
|
||||
@action
|
||||
removeWriteRelay(url) {
|
||||
const current =
|
||||
this.settings.nostrWriteRelays || this.nostrData.defaultWriteRelays;
|
||||
const filtered = current.filter((r) => r !== url);
|
||||
this.settings.update('nostrWriteRelays', filtered);
|
||||
if (this.requiredWriteRelaySet.has(url)) {
|
||||
return;
|
||||
}
|
||||
|
||||
const normalizedUrl = normalizeRelayUrl(url);
|
||||
|
||||
const remainingCustom = this.customWriteRelays.filter((relay) => {
|
||||
return normalizeRelayUrl(relay) !== normalizedUrl;
|
||||
});
|
||||
|
||||
const nextExclusions = this.mailboxWriteRelaySet.has(normalizedUrl)
|
||||
? Array.from(new Set([...this.writeRelayExclusions, normalizedUrl]))
|
||||
: this.writeRelayExclusions;
|
||||
|
||||
this.settings.update(
|
||||
'nostrWriteRelays',
|
||||
remainingCustom.length > 0 ? remainingCustom : null
|
||||
);
|
||||
this.settings.update(
|
||||
'nostrWriteRelayExclusions',
|
||||
nextExclusions.length > 0 ? nextExclusions : null
|
||||
);
|
||||
}
|
||||
|
||||
@action
|
||||
resetWriteRelays() {
|
||||
this.settings.update('nostrWriteRelays', null);
|
||||
this.settings.update('nostrWriteRelayExclusions', null);
|
||||
}
|
||||
|
||||
@action
|
||||
@@ -112,18 +250,20 @@ export default class AppMenuSettingsNostr extends Component {
|
||||
<div class="form-group">
|
||||
<label for="new-read-relay">Read Relays</label>
|
||||
<ul class="relay-list">
|
||||
{{#each this.nostrData.activeReadRelays as |relay|}}
|
||||
{{#each this.readRelaysForDisplay as |relay|}}
|
||||
<li>
|
||||
<span>{{stripProtocol relay}}</span>
|
||||
<span>{{stripProtocol relay.url}}</span>
|
||||
{{#unless relay.isRequired}}
|
||||
<button
|
||||
type="button"
|
||||
class="btn-remove-relay"
|
||||
title="Remove relay"
|
||||
aria-label="Remove"
|
||||
{{on "click" (fn this.removeReadRelay relay)}}
|
||||
{{on "click" (fn this.removeReadRelay relay.url)}}
|
||||
>
|
||||
<Icon @name="x" @size={{14}} @color="currentColor" />
|
||||
</button>
|
||||
{{/unless}}
|
||||
</li>
|
||||
{{/each}}
|
||||
</ul>
|
||||
@@ -143,7 +283,7 @@ export default class AppMenuSettingsNostr extends Component {
|
||||
{{on "click" this.addReadRelay}}
|
||||
>Add</button>
|
||||
</div>
|
||||
{{#if this.settings.nostrReadRelays}}
|
||||
{{#if this.hasReadOverrides}}
|
||||
<button
|
||||
type="button"
|
||||
class="btn-link reset-relays"
|
||||
@@ -157,18 +297,20 @@ export default class AppMenuSettingsNostr extends Component {
|
||||
<div class="form-group">
|
||||
<label for="new-write-relay">Write Relays</label>
|
||||
<ul class="relay-list">
|
||||
{{#each this.nostrData.activeWriteRelays as |relay|}}
|
||||
{{#each this.writeRelaysForDisplay as |relay|}}
|
||||
<li>
|
||||
<span>{{stripProtocol relay}}</span>
|
||||
<span>{{stripProtocol relay.url}}</span>
|
||||
{{#unless relay.isRequired}}
|
||||
<button
|
||||
type="button"
|
||||
class="btn-remove-relay"
|
||||
title="Remove relay"
|
||||
aria-label="Remove"
|
||||
{{on "click" (fn this.removeWriteRelay relay)}}
|
||||
{{on "click" (fn this.removeWriteRelay relay.url)}}
|
||||
>
|
||||
<Icon @name="x" @size={{14}} @color="currentColor" />
|
||||
</button>
|
||||
{{/unless}}
|
||||
</li>
|
||||
{{/each}}
|
||||
</ul>
|
||||
@@ -188,7 +330,7 @@ export default class AppMenuSettingsNostr extends Component {
|
||||
{{on "click" this.addWriteRelay}}
|
||||
>Add</button>
|
||||
</div>
|
||||
{{#if this.settings.nostrWriteRelays}}
|
||||
{{#if this.hasWriteOverrides}}
|
||||
<button
|
||||
type="button"
|
||||
class="btn-link reset-relays"
|
||||
|
||||
@@ -1191,6 +1191,12 @@ export default class MapComponent extends Component {
|
||||
return;
|
||||
}
|
||||
|
||||
if (this.mapUi.searchResults && this.mapUi.searchResults.length > 0) {
|
||||
console.debug('Clearing active search and markers on map click');
|
||||
this.router.transitionTo('index');
|
||||
return;
|
||||
}
|
||||
|
||||
// Require Zoom >= 17 for generic map searches
|
||||
// This prevents accidental searches when interacting with the map at a high level
|
||||
const currentZoom = this.mapInstance.getView().getZoom();
|
||||
|
||||
@@ -23,6 +23,7 @@ export default class PlaceDetails extends Component {
|
||||
@service storage;
|
||||
@service nostrAuth;
|
||||
@service nostrData;
|
||||
@service mapUi;
|
||||
@tracked isEditing = false;
|
||||
@tracked showLists = false;
|
||||
@tracked isPhotoUploadActive = false;
|
||||
@@ -345,11 +346,23 @@ export default class PlaceDetails extends Component {
|
||||
|
||||
get osmUrl() {
|
||||
const id = this.place.osmId;
|
||||
if (!id) return null;
|
||||
if (id) {
|
||||
const type = this.place.osmType || 'node';
|
||||
return `https://www.openstreetmap.org/${type}/${id}`;
|
||||
}
|
||||
|
||||
const lat = this.place.lat;
|
||||
const lon = this.place.lon;
|
||||
if (!lat || !lon) return null;
|
||||
|
||||
const viewLat = this.mapUi.currentCenter?.lat ?? lat;
|
||||
const viewLon = this.mapUi.currentCenter?.lon ?? lon;
|
||||
const zoom = this.mapUi.currentZoom ?? 17;
|
||||
const roundedZoom = Math.round(zoom);
|
||||
|
||||
return `https://www.openstreetmap.org/search?lat=${lat}&lon=${lon}&zoom=${roundedZoom}#map=${roundedZoom}/${Number(viewLat).toFixed(5)}/${Number(viewLon).toFixed(5)}`;
|
||||
}
|
||||
|
||||
get gmapsUrl() {
|
||||
const id = this.place.gmapsId || this.place.osmId;
|
||||
if (!id) return null;
|
||||
@@ -591,7 +604,7 @@ export default class PlaceDetails extends Component {
|
||||
|
||||
</div>
|
||||
|
||||
{{#if this.osmUrl}}
|
||||
{{#if this.place.osmId}}
|
||||
<div class="meta-info">
|
||||
<p class="content-with-icon">
|
||||
<Icon @name="feather-camera" />
|
||||
|
||||
@@ -103,7 +103,7 @@ export default class PlaceListsManager extends Component {
|
||||
checked={{this.isSaved}}
|
||||
{{on "change" this.toggleSaved}}
|
||||
/>
|
||||
<span class="list-color"></span>
|
||||
<span class="list-color-dot"></span>
|
||||
<span class="list-name">Saved places</span>
|
||||
</label>
|
||||
</div>
|
||||
@@ -122,7 +122,7 @@ export default class PlaceListsManager extends Component {
|
||||
/>
|
||||
{{! template-lint-disable no-inline-styles }}
|
||||
<span
|
||||
class="list-color"
|
||||
class="list-color-dot"
|
||||
style={{this.styleFor list.color}}
|
||||
></span>
|
||||
<span class="list-name">{{list.title}}</span>
|
||||
|
||||
@@ -5,10 +5,13 @@ import { on } from '@ember/modifier';
|
||||
import { fn } from '@ember/helper';
|
||||
import or from 'ember-truth-helpers/helpers/or';
|
||||
import eq from 'ember-truth-helpers/helpers/eq';
|
||||
import and from 'ember-truth-helpers/helpers/and';
|
||||
import not from 'ember-truth-helpers/helpers/not';
|
||||
import PlaceDetails from './place-details';
|
||||
import Icon from './icon';
|
||||
import humanizeOsmTag from '../helpers/humanize-osm-tag';
|
||||
import { getLocalizedName, getPlaceType } from '../utils/osm';
|
||||
import restoreScroll from '../modifiers/restore-scroll';
|
||||
|
||||
export default class PlacesSidebar extends Component {
|
||||
@service storage;
|
||||
@@ -160,19 +163,44 @@ export default class PlacesSidebar extends Component {
|
||||
|
||||
<template>
|
||||
<div class="sidebar">
|
||||
<div class="sidebar-header {{if this.hasHeaderPhoto 'no-border'}}">
|
||||
<div
|
||||
class="sidebar-header
|
||||
{{if this.hasHeaderPhoto 'no-border'}}
|
||||
{{if (and (not @selectedPlace) @onBack) 'has-back-btn'}}"
|
||||
>
|
||||
{{#if @selectedPlace}}
|
||||
<button
|
||||
type="button"
|
||||
class="back-btn"
|
||||
{{on "click" this.clearSelection}}
|
||||
><Icon @name="arrow-left" @size={{20}} @color="#333" /></button>
|
||||
{{else}}
|
||||
{{#if @onBack}}
|
||||
<button type="button" class="back-btn" {{on "click" @onBack}}><Icon
|
||||
@name="arrow-left"
|
||||
@size={{20}}
|
||||
@color="#333"
|
||||
/></button>
|
||||
{{/if}}
|
||||
{{#if @onBack}}
|
||||
<h2 class="sidebar-header-text-centered">
|
||||
<span class="sidebar-header-icon-wrapper">
|
||||
<Icon
|
||||
@name="bookmark"
|
||||
@size={{20}}
|
||||
@color={{or @color "#898989"}}
|
||||
/>
|
||||
</span>
|
||||
{{@title}}
|
||||
</h2>
|
||||
{{else}}
|
||||
{{#if this.isNearbySearch}}
|
||||
<h2><Icon @name="target" @size={{20}} @color="#ea4335" />
|
||||
Nearby</h2>
|
||||
{{else}}
|
||||
<h2><Icon @name="search" @size={{20}} @color="#333" /> Results</h2>
|
||||
<h2><Icon @name="search" @size={{20}} @color="#333" />
|
||||
Results</h2>
|
||||
{{/if}}
|
||||
{{/if}}
|
||||
{{/if}}
|
||||
<button type="button" class="close-btn" {{on "click" @onClose}}><Icon
|
||||
@@ -182,13 +210,18 @@ export default class PlacesSidebar extends Component {
|
||||
/></button>
|
||||
</div>
|
||||
|
||||
<div class="sidebar-content">
|
||||
<div class="sidebar-content" {{restoreScroll @scrollTop}}>
|
||||
{{#if @selectedPlace}}
|
||||
<PlaceDetails
|
||||
@place={{@selectedPlace}}
|
||||
@onToggleSave={{this.toggleSave}}
|
||||
@onSave={{this.updateBookmark}}
|
||||
/>
|
||||
{{else}}
|
||||
{{#if @isLoading}}
|
||||
<div class="sidebar-loading">
|
||||
<Icon @name="loading-ring" @size={{24}} @color="#898989" />
|
||||
</div>
|
||||
{{else}}
|
||||
{{#if @places}}
|
||||
<ul class="places-list">
|
||||
@@ -210,12 +243,10 @@ export default class PlacesSidebar extends Component {
|
||||
{{humanizeOsmTag place.type}}
|
||||
{{else if (eq place.source "photon")}}
|
||||
{{place.description}}
|
||||
{{else if (getPlaceType place.osmTags)}}
|
||||
{{getPlaceType place.osmTags}}
|
||||
{{else}}
|
||||
{{#if place.osmTags}}
|
||||
{{humanizeOsmTag (getPlaceType place.osmTags)}}
|
||||
{{else if place.description}}
|
||||
{{place.description}}
|
||||
{{/if}}
|
||||
Saved place
|
||||
{{/if}}
|
||||
</div>
|
||||
</button>
|
||||
@@ -239,6 +270,7 @@ export default class PlacesSidebar extends Component {
|
||||
Create new place
|
||||
</button>
|
||||
{{/if}}
|
||||
{{/if}}
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
@@ -0,0 +1,108 @@
|
||||
import Controller from '@ember/controller';
|
||||
import { service } from '@ember/service';
|
||||
import { action } from '@ember/object';
|
||||
import { tracked } from '@glimmer/tracking';
|
||||
import { task } from 'ember-concurrency';
|
||||
|
||||
export default class ListsListController extends Controller {
|
||||
@service router;
|
||||
@service mapUi;
|
||||
@service storage;
|
||||
|
||||
@tracked model;
|
||||
@tracked loadedPlaces = [];
|
||||
|
||||
get listId() {
|
||||
return this.model?.list_id;
|
||||
}
|
||||
|
||||
loadPlacesTask = task({ restartable: true }, async (listId) => {
|
||||
this.loadedPlaces = []; // Clear previous elements immediately to show fresh loader
|
||||
try {
|
||||
this.loadedPlaces = await this.storage.getPlacesInList(listId);
|
||||
} catch (e) {
|
||||
console.error('Failed to load places in list', listId, e);
|
||||
this.loadedPlaces = [];
|
||||
}
|
||||
});
|
||||
|
||||
get scrollTop() {
|
||||
return this.mapUi.getScrollPosition(`list-${this.listId}`);
|
||||
}
|
||||
|
||||
get listColor() {
|
||||
const list = this.storage.lists.find((l) => l.id === this.listId);
|
||||
if (list && list.color) {
|
||||
return list.color;
|
||||
}
|
||||
return getComputedStyle(document.documentElement)
|
||||
.getPropertyValue('--default-list-color')
|
||||
.trim();
|
||||
}
|
||||
|
||||
get listTitle() {
|
||||
const list = this.storage.lists.find((l) => l.id === this.listId);
|
||||
return list ? list.title : 'Collections';
|
||||
}
|
||||
|
||||
get places() {
|
||||
const currentList = this.storage.lists.find((l) => l.id === this.listId);
|
||||
const placeRefsIds = new Set(
|
||||
currentList?.placeRefs?.map((ref) => ref.id) || []
|
||||
);
|
||||
|
||||
// Filter live tracked savedPlaces that are in this list
|
||||
const livePlaces = this.storage.savedPlaces.filter((p) =>
|
||||
placeRefsIds.has(p.id)
|
||||
);
|
||||
|
||||
const merged = [];
|
||||
const seen = new Set();
|
||||
|
||||
// Process live state first to reflect deletions/edits immediately
|
||||
livePlaces.forEach((p) => {
|
||||
merged.push(p);
|
||||
seen.add(p.id);
|
||||
});
|
||||
|
||||
// Supplement with any background-fetched places that are still valid but not in live state yet
|
||||
this.loadedPlaces.forEach((p) => {
|
||||
if (placeRefsIds.has(p.id) && !seen.has(p.id)) {
|
||||
merged.push(p);
|
||||
seen.add(p.id);
|
||||
}
|
||||
});
|
||||
|
||||
return merged;
|
||||
}
|
||||
|
||||
@action
|
||||
selectPlace(place) {
|
||||
if (place) {
|
||||
const sidebarContent = document.querySelector('.sidebar-content');
|
||||
if (sidebarContent) {
|
||||
this.mapUi.saveScrollPosition(
|
||||
`list-${this.listId}`,
|
||||
sidebarContent.scrollTop
|
||||
);
|
||||
}
|
||||
this.mapUi.returnToRoute = {
|
||||
name: 'lists.list',
|
||||
model: this.listId,
|
||||
};
|
||||
this.mapUi.showSidebar();
|
||||
this.mapUi.preventNextZoom = true;
|
||||
this.router.transitionTo('place', place);
|
||||
}
|
||||
}
|
||||
|
||||
@action
|
||||
close() {
|
||||
this.router.transitionTo('index');
|
||||
}
|
||||
|
||||
@action
|
||||
backToLists() {
|
||||
this.router.transitionTo('lists.index');
|
||||
}
|
||||
}
|
||||
@@ -20,7 +20,26 @@ export default class SearchController extends Controller {
|
||||
category = null;
|
||||
|
||||
fetchResultsTask = task({ restartable: true }, async (params) => {
|
||||
// Hide sidebar and clear previous results immediately to signal a new search
|
||||
// 1. Check if the incoming parameters match our currently loaded search
|
||||
const isSameSearch =
|
||||
this.mapUi.currentSearch &&
|
||||
params.q === this.mapUi.currentSearch.q &&
|
||||
params.category === this.mapUi.currentSearch.category &&
|
||||
params.lat === this.mapUi.currentSearch.lat &&
|
||||
params.lon === this.mapUi.currentSearch.lon;
|
||||
|
||||
const hasResults =
|
||||
this.mapUi.searchResults && this.mapUi.searchResults.length > 0;
|
||||
|
||||
// 2. If it's a back navigation to the exact same search, resolve instantly with no animation
|
||||
if (isSameSearch && hasResults) {
|
||||
if (this.mapUi.isSidebarVisible) {
|
||||
this.mapUi.showSidebar();
|
||||
}
|
||||
return;
|
||||
}
|
||||
|
||||
// 3. Otherwise, this is a brand new search: hide the sidebar and clear previous results immediately to signal a new search
|
||||
this.mapUi.hideSidebar();
|
||||
this.mapUi.clearSearchResults();
|
||||
|
||||
|
||||
@@ -0,0 +1,10 @@
|
||||
import { modifier } from 'ember-modifier';
|
||||
|
||||
export default modifier((element, [scrollTop]) => {
|
||||
if (element && typeof scrollTop === 'number' && scrollTop > 0) {
|
||||
// Restore inside requestAnimationFrame to guarantee layout rendering is ready
|
||||
requestAnimationFrame(() => {
|
||||
element.scrollTop = scrollTop;
|
||||
});
|
||||
}
|
||||
});
|
||||
@@ -10,6 +10,10 @@ Router.map(function () {
|
||||
this.route('place', { path: '/place/:place_id' });
|
||||
this.route('place.new', { path: '/place/new' });
|
||||
this.route('search');
|
||||
this.route('menu');
|
||||
this.route('lists', function () {
|
||||
this.route('list', { path: '/:list_id' });
|
||||
});
|
||||
this.route('oauth', function () {
|
||||
this.route('osm-callback', { path: '/osm/callback' });
|
||||
});
|
||||
|
||||
@@ -6,5 +6,6 @@ export default class IndexRoute extends Route {
|
||||
|
||||
activate() {
|
||||
this.mapUi.clearSearchResults();
|
||||
this.mapUi.hideSidebar();
|
||||
}
|
||||
}
|
||||
|
||||
@@ -0,0 +1,10 @@
|
||||
import Route from '@ember/routing/route';
|
||||
import { service } from '@ember/service';
|
||||
|
||||
export default class ListsRoute extends Route {
|
||||
@service mapUi;
|
||||
|
||||
activate() {
|
||||
this.mapUi.showSidebar();
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,3 @@
|
||||
import Route from '@ember/routing/route';
|
||||
|
||||
export default class ListsIndexRoute extends Route {}
|
||||
@@ -0,0 +1,26 @@
|
||||
import Route from '@ember/routing/route';
|
||||
import { service } from '@ember/service';
|
||||
|
||||
export default class ListsListRoute extends Route {
|
||||
@service storage;
|
||||
|
||||
model(params) {
|
||||
// Resolve instantly so transition happens in 0ms!
|
||||
return { list_id: params.list_id };
|
||||
}
|
||||
|
||||
setupController(controller, model) {
|
||||
console.debug('DEBUG: setupController controller is:', controller);
|
||||
console.debug(
|
||||
'DEBUG: controller.loadPlacesTask is:',
|
||||
controller?.loadPlacesTask
|
||||
);
|
||||
controller.model = model;
|
||||
super.setupController(controller, model);
|
||||
if (controller && controller.loadPlacesTask) {
|
||||
controller.loadPlacesTask.perform(model.list_id);
|
||||
} else {
|
||||
console.error('DEBUG: ERROR! controller.loadPlacesTask is undefined!');
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,10 @@
|
||||
import Route from '@ember/routing/route';
|
||||
import { service } from '@ember/service';
|
||||
|
||||
export default class MenuRoute extends Route {
|
||||
@service mapUi;
|
||||
|
||||
activate() {
|
||||
this.mapUi.showSidebar();
|
||||
}
|
||||
}
|
||||
@@ -108,6 +108,7 @@ export default class PlaceRoute extends Route {
|
||||
this.mapUi.clearSelection();
|
||||
// Reset the "return to search" flag so it doesn't persist to subsequent navigations
|
||||
this.mapUi.returnToSearch = false;
|
||||
this.mapUi.returnToRoute = null;
|
||||
}
|
||||
|
||||
async loadOsmPlace(id, type = null) {
|
||||
|
||||
@@ -1,5 +1,6 @@
|
||||
import Service, { service } from '@ember/service';
|
||||
import { tracked } from '@glimmer/tracking';
|
||||
import { action } from '@ember/object';
|
||||
|
||||
export default class MapUiService extends Service {
|
||||
@service nostrData;
|
||||
@@ -9,6 +10,7 @@ export default class MapUiService extends Service {
|
||||
@tracked isCreating = false;
|
||||
@tracked creationCoordinates = null;
|
||||
@tracked returnToSearch = false;
|
||||
@tracked returnToRoute = null;
|
||||
@tracked currentCenter = null;
|
||||
@tracked currentBounds = null;
|
||||
@tracked currentZoom = null;
|
||||
@@ -19,13 +21,33 @@ export default class MapUiService extends Service {
|
||||
@tracked currentSearch = null;
|
||||
@tracked loadingState = null;
|
||||
@tracked isSidebarVisible = false;
|
||||
@tracked isSidebarOpening = false;
|
||||
|
||||
scrollPositions = {};
|
||||
|
||||
@action
|
||||
saveScrollPosition(key, value) {
|
||||
this.scrollPositions[key] = value;
|
||||
}
|
||||
|
||||
@action
|
||||
getScrollPosition(key) {
|
||||
return this.scrollPositions[key] || 0;
|
||||
}
|
||||
|
||||
showSidebar() {
|
||||
if (!this.isSidebarVisible) {
|
||||
this.isSidebarVisible = true;
|
||||
this.isSidebarOpening = true;
|
||||
setTimeout(() => {
|
||||
this.isSidebarOpening = false;
|
||||
}, 250);
|
||||
}
|
||||
}
|
||||
|
||||
hideSidebar() {
|
||||
this.isSidebarVisible = false;
|
||||
this.isSidebarOpening = false;
|
||||
}
|
||||
|
||||
selectPlace(place, options = {}) {
|
||||
|
||||
+50
-26
@@ -6,7 +6,12 @@ import { MailboxesModel } from 'applesauce-core/models/mailboxes';
|
||||
import { npubEncode } from 'applesauce-core/helpers/pointers';
|
||||
import { persistEventsToCache } from 'applesauce-core/helpers/event-cache';
|
||||
import { NostrIDB, openDB } from 'nostr-idb';
|
||||
import { normalizeRelayUrl } from '../utils/nostr';
|
||||
import {
|
||||
excludeRequiredRelays,
|
||||
mergeRequiredRelays,
|
||||
normalizeRelayUrl,
|
||||
uniqNormalizedRelays,
|
||||
} from '../utils/nostr';
|
||||
import { getGeohashPrefixesInBbox } from '../utils/geohash-coverage';
|
||||
|
||||
const DIRECTORY_RELAYS = [
|
||||
@@ -83,44 +88,63 @@ export default class NostrDataService extends Service {
|
||||
});
|
||||
}
|
||||
|
||||
get defaultReadRelays() {
|
||||
const mailboxes = (this.mailboxes?.inboxes || [])
|
||||
.map(normalizeRelayUrl)
|
||||
.filter(Boolean);
|
||||
const defaults = DEFAULT_READ_RELAYS.map(normalizeRelayUrl).filter(Boolean);
|
||||
return Array.from(new Set([...defaults, ...mailboxes]));
|
||||
get requiredReadRelays() {
|
||||
return DEFAULT_READ_RELAYS;
|
||||
}
|
||||
|
||||
get defaultWriteRelays() {
|
||||
const mailboxes = (this.mailboxes?.outboxes || [])
|
||||
get requiredWriteRelays() {
|
||||
return DEFAULT_WRITE_RELAYS;
|
||||
}
|
||||
|
||||
get mailboxReadRelays() {
|
||||
return (this.mailboxes?.inboxes || [])
|
||||
.map(normalizeRelayUrl)
|
||||
.filter(Boolean);
|
||||
const defaults =
|
||||
DEFAULT_WRITE_RELAYS.map(normalizeRelayUrl).filter(Boolean);
|
||||
return Array.from(new Set([...defaults, ...mailboxes]));
|
||||
}
|
||||
|
||||
get mailboxWriteRelays() {
|
||||
return (this.mailboxes?.outboxes || [])
|
||||
.map(normalizeRelayUrl)
|
||||
.filter(Boolean);
|
||||
}
|
||||
|
||||
get configuredReadRelays() {
|
||||
const configured = uniqNormalizedRelays([
|
||||
...this.mailboxReadRelays,
|
||||
...(this.settings.nostrReadRelays || []),
|
||||
]);
|
||||
|
||||
return excludeRequiredRelays(
|
||||
configured,
|
||||
this.settings.nostrReadRelayExclusions || []
|
||||
);
|
||||
}
|
||||
|
||||
get configuredWriteRelays() {
|
||||
const configured = uniqNormalizedRelays([
|
||||
...this.mailboxWriteRelays,
|
||||
...(this.settings.nostrWriteRelays || []),
|
||||
]);
|
||||
|
||||
return excludeRequiredRelays(
|
||||
configured,
|
||||
this.settings.nostrWriteRelayExclusions || []
|
||||
);
|
||||
}
|
||||
|
||||
get activeReadRelays() {
|
||||
if (this.settings.nostrReadRelays) {
|
||||
return Array.from(
|
||||
new Set(
|
||||
this.settings.nostrReadRelays.map(normalizeRelayUrl).filter(Boolean)
|
||||
)
|
||||
return mergeRequiredRelays(
|
||||
this.requiredReadRelays,
|
||||
this.configuredReadRelays
|
||||
);
|
||||
}
|
||||
return this.defaultReadRelays;
|
||||
}
|
||||
|
||||
get activeWriteRelays() {
|
||||
if (this.settings.nostrWriteRelays) {
|
||||
return Array.from(
|
||||
new Set(
|
||||
this.settings.nostrWriteRelays.map(normalizeRelayUrl).filter(Boolean)
|
||||
)
|
||||
return mergeRequiredRelays(
|
||||
this.requiredWriteRelays,
|
||||
this.configuredWriteRelays
|
||||
);
|
||||
}
|
||||
return this.defaultWriteRelays;
|
||||
}
|
||||
|
||||
async loadPlacesInBounds(bbox) {
|
||||
const requiredPrefixes = getGeohashPrefixesInBbox(bbox);
|
||||
|
||||
@@ -9,6 +9,8 @@ const DEFAULT_SETTINGS = {
|
||||
nostrPhotoFallbackUploads: false,
|
||||
nostrReadRelays: null,
|
||||
nostrWriteRelays: null,
|
||||
nostrReadRelayExclusions: null,
|
||||
nostrWriteRelayExclusions: null,
|
||||
experimentalEnablePhotoDeletion: false,
|
||||
};
|
||||
|
||||
@@ -21,6 +23,9 @@ export default class SettingsService extends Service {
|
||||
DEFAULT_SETTINGS.nostrPhotoFallbackUploads;
|
||||
@tracked nostrReadRelays = DEFAULT_SETTINGS.nostrReadRelays;
|
||||
@tracked nostrWriteRelays = DEFAULT_SETTINGS.nostrWriteRelays;
|
||||
@tracked nostrReadRelayExclusions = DEFAULT_SETTINGS.nostrReadRelayExclusions;
|
||||
@tracked nostrWriteRelayExclusions =
|
||||
DEFAULT_SETTINGS.nostrWriteRelayExclusions;
|
||||
@tracked experimentalEnablePhotoDeletion =
|
||||
DEFAULT_SETTINGS.experimentalEnablePhotoDeletion;
|
||||
|
||||
@@ -111,6 +116,8 @@ export default class SettingsService extends Service {
|
||||
this.nostrPhotoFallbackUploads = finalSettings.nostrPhotoFallbackUploads;
|
||||
this.nostrReadRelays = finalSettings.nostrReadRelays;
|
||||
this.nostrWriteRelays = finalSettings.nostrWriteRelays;
|
||||
this.nostrReadRelayExclusions = finalSettings.nostrReadRelayExclusions;
|
||||
this.nostrWriteRelayExclusions = finalSettings.nostrWriteRelayExclusions;
|
||||
this.experimentalEnablePhotoDeletion =
|
||||
finalSettings.experimentalEnablePhotoDeletion;
|
||||
|
||||
@@ -127,6 +134,8 @@ export default class SettingsService extends Service {
|
||||
nostrPhotoFallbackUploads: this.nostrPhotoFallbackUploads,
|
||||
nostrReadRelays: this.nostrReadRelays,
|
||||
nostrWriteRelays: this.nostrWriteRelays,
|
||||
nostrReadRelayExclusions: this.nostrReadRelayExclusions,
|
||||
nostrWriteRelayExclusions: this.nostrWriteRelayExclusions,
|
||||
experimentalEnablePhotoDeletion: this.experimentalEnablePhotoDeletion,
|
||||
};
|
||||
localStorage.setItem('marco:settings', JSON.stringify(settings));
|
||||
|
||||
@@ -270,6 +270,11 @@ export default class StorageService extends Service {
|
||||
}
|
||||
}
|
||||
|
||||
async getPlacesInList(listId) {
|
||||
if (!this.places || !this.places.lists) return [];
|
||||
return this.places.lists.getPlaces(listId);
|
||||
}
|
||||
|
||||
async loadPlacesInBounds(bbox) {
|
||||
// 1. Calculate required prefixes
|
||||
const requiredPrefixes = getGeohashPrefixesInBbox(bbox);
|
||||
|
||||
+178
-40
@@ -1,8 +1,10 @@
|
||||
/* Ember supports plain CSS out of the box. More info: https://cli.emberjs.com/release/advanced-use/stylesheets/ */
|
||||
|
||||
:root {
|
||||
--default-list-color: #fc3;
|
||||
--body-text-color: #333;
|
||||
--primary-background-color: #fff;
|
||||
--hover-bg: #f8f9fa;
|
||||
--divider-color: #eee;
|
||||
--sidebar-width: 350px;
|
||||
--link-color: #2a7fff;
|
||||
--link-color-visited: #6a4fbf;
|
||||
@@ -10,6 +12,7 @@
|
||||
--marker-color-dark: #b31412;
|
||||
--danger-color: var(--marker-color-primary);
|
||||
--danger-color-dark: var(--marker-color-dark);
|
||||
--default-list-color: #fc3;
|
||||
}
|
||||
|
||||
html,
|
||||
@@ -31,7 +34,7 @@ body {
|
||||
font-family: 'Noto Sans', sans-serif;
|
||||
font-size: 16px;
|
||||
font-weight: normal;
|
||||
color: #333;
|
||||
color: var(--body-text-color);
|
||||
}
|
||||
|
||||
#root,
|
||||
@@ -112,8 +115,6 @@ body {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
grid-area: search;
|
||||
|
||||
/* Ensure it sits at the start of its grid area */
|
||||
justify-self: start;
|
||||
width: 100%;
|
||||
}
|
||||
@@ -127,7 +128,6 @@ body {
|
||||
|
||||
@media (width > 768px) {
|
||||
.header-left {
|
||||
/* Desktop: Ensure minimum width for search box so it's not squeezed */
|
||||
min-width: 300px;
|
||||
max-width: 350px;
|
||||
}
|
||||
@@ -140,8 +140,6 @@ body {
|
||||
|
||||
.header-center {
|
||||
grid-area: chips;
|
||||
|
||||
/* Desktop: Center the chips block in the available space */
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
min-width: 0; /* Allow shrinking */
|
||||
@@ -156,7 +154,6 @@ body {
|
||||
}
|
||||
|
||||
@media (width <= 768px) {
|
||||
/* No need to reset min-width/max-width since they are only set in media query above */
|
||||
.header-center {
|
||||
width: 100%;
|
||||
overflow: hidden;
|
||||
@@ -383,7 +380,7 @@ body {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
padding: 1rem 0;
|
||||
border-bottom: 1px solid #eee;
|
||||
border-bottom: 1px solid var(--divider-color);
|
||||
}
|
||||
|
||||
.account-item:last-child {
|
||||
@@ -460,6 +457,11 @@ body {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
overflow: hidden; /* Ensure flex children are contained */
|
||||
will-change: transform;
|
||||
}
|
||||
|
||||
.sidebar-opening .sidebar {
|
||||
animation: sidebar-slide-in-left 0.18s cubic-bezier(0.16, 1, 0.3, 1) forwards;
|
||||
}
|
||||
|
||||
.sidebar.app-menu-pane {
|
||||
@@ -478,11 +480,13 @@ body {
|
||||
}
|
||||
|
||||
.sidebar-header {
|
||||
padding: 1rem;
|
||||
border-bottom: 1px solid #eee;
|
||||
height: 56px; /* Strictly enforce identical vertical height */
|
||||
padding: 0 1rem; /* Keep horizontal padding, remove vertical padding */
|
||||
border-bottom: 1px solid var(--divider-color);
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
box-sizing: border-box; /* Guarantee strict height boundaries */
|
||||
}
|
||||
|
||||
.sidebar-header.no-border {
|
||||
@@ -491,7 +495,7 @@ body {
|
||||
|
||||
.sidebar-header h2 {
|
||||
margin: 0;
|
||||
font-size: 1.2rem;
|
||||
font-size: 1.1rem;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 0.5rem;
|
||||
@@ -526,7 +530,7 @@ body {
|
||||
padding-left: 1.4rem;
|
||||
background: none;
|
||||
border: none;
|
||||
color: #333;
|
||||
color: var(--body-text-color);
|
||||
cursor: pointer;
|
||||
text-align: left;
|
||||
font-size: 0.95rem;
|
||||
@@ -557,7 +561,7 @@ body {
|
||||
padding-left: 1.4rem;
|
||||
cursor: pointer;
|
||||
font-size: 0.95rem;
|
||||
color: #333;
|
||||
color: var(--body-text-color);
|
||||
transition: background-color 0.2s;
|
||||
}
|
||||
|
||||
@@ -628,7 +632,7 @@ body {
|
||||
width: 24px;
|
||||
height: 24px;
|
||||
border-radius: 50%;
|
||||
background-color: #fff;
|
||||
background-color: var(--primary-background-color);
|
||||
border: 1px solid var(--danger-color);
|
||||
color: var(--danger-color);
|
||||
cursor: pointer;
|
||||
@@ -644,7 +648,7 @@ body {
|
||||
.btn-remove-relay:hover,
|
||||
.btn-remove-relay:active {
|
||||
background-color: var(--danger-color);
|
||||
color: #fff;
|
||||
color: var(--primary-background-color);
|
||||
}
|
||||
|
||||
.add-relay-input {
|
||||
@@ -674,7 +678,7 @@ body {
|
||||
margin-bottom: 1rem;
|
||||
background: var(--hover-bg);
|
||||
padding: 1rem;
|
||||
border-bottom: 1px solid #eee;
|
||||
border-bottom: 1px solid var(--divider-color);
|
||||
}
|
||||
|
||||
.form-group {
|
||||
@@ -696,8 +700,8 @@ body {
|
||||
font-family: inherit;
|
||||
font-size: 1rem;
|
||||
box-sizing: border-box; /* Ensure padding doesn't overflow width */
|
||||
color: #333;
|
||||
background-color: #fff;
|
||||
color: var(--body-text-color);
|
||||
background-color: var(--primary-background-color);
|
||||
}
|
||||
|
||||
.form-control:focus {
|
||||
@@ -708,7 +712,7 @@ body {
|
||||
|
||||
select.form-control {
|
||||
appearance: none;
|
||||
background-color: #fff;
|
||||
background-color: var(--primary-background-color);
|
||||
background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%23666' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'/%3E%3C/svg%3E");
|
||||
background-repeat: no-repeat;
|
||||
background-position: right 0.75rem center;
|
||||
@@ -784,7 +788,7 @@ select.form-control {
|
||||
.meta-info p:first-child {
|
||||
margin-top: 1.2rem;
|
||||
padding-top: 1.2rem;
|
||||
border-top: 1px solid #eee;
|
||||
border-top: 1px solid var(--divider-color);
|
||||
}
|
||||
|
||||
.meta-info a,
|
||||
@@ -843,9 +847,9 @@ abbr[title] {
|
||||
width: 100%;
|
||||
text-align: left;
|
||||
border: none;
|
||||
border-bottom: 1px solid #eee;
|
||||
background: #fff;
|
||||
color: #333;
|
||||
border-bottom: 1px solid var(--divider-color);
|
||||
background: var(--primary-background-color);
|
||||
color: var(--body-text-color);
|
||||
padding: 1rem;
|
||||
cursor: pointer;
|
||||
transition: background 0.2s;
|
||||
@@ -1016,7 +1020,7 @@ abbr[title] {
|
||||
.photo-carousel.inline .photo-carousel-track {
|
||||
scroll-snap-type: none;
|
||||
gap: 2px;
|
||||
background-color: #fff;
|
||||
background-color: var(--primary-background-color);
|
||||
}
|
||||
|
||||
.photo-carousel.inline .carousel-slide {
|
||||
@@ -1095,7 +1099,7 @@ abbr[title] {
|
||||
|
||||
.btn-outline {
|
||||
background: transparent;
|
||||
color: #333;
|
||||
color: var(--body-text-color);
|
||||
border: 1px solid #ccc;
|
||||
}
|
||||
|
||||
@@ -1104,7 +1108,7 @@ abbr[title] {
|
||||
}
|
||||
|
||||
.btn-secondary {
|
||||
color: #333;
|
||||
color: var(--body-text-color);
|
||||
border: 1px solid rgb(255 204 51 / 20%);
|
||||
background: rgb(255 204 51 / 30%);
|
||||
}
|
||||
@@ -1266,6 +1270,20 @@ span.icon {
|
||||
gap: 0.5rem;
|
||||
}
|
||||
|
||||
.content-with-icon > span:not(.icon) {
|
||||
min-width: 0;
|
||||
flex: 1;
|
||||
}
|
||||
|
||||
.content-with-icon > span:not(.icon) a {
|
||||
display: inline-block;
|
||||
max-width: 100%;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
white-space: nowrap;
|
||||
vertical-align: bottom;
|
||||
}
|
||||
|
||||
.content-with-icon .icon {
|
||||
margin-top: 0.15rem;
|
||||
}
|
||||
@@ -1347,7 +1365,7 @@ span.icon {
|
||||
width: 24px;
|
||||
height: 24px;
|
||||
transform: translate(-50%, -50%);
|
||||
color: #333;
|
||||
color: var(--body-text-color);
|
||||
pointer-events: none;
|
||||
z-index: 2000;
|
||||
display: none;
|
||||
@@ -1408,6 +1426,11 @@ button.create-place {
|
||||
inset: auto 0 0;
|
||||
}
|
||||
|
||||
.sidebar-opening .sidebar {
|
||||
animation: sidebar-slide-up-bottom 0.18s cubic-bezier(0.16, 1, 0.3, 1)
|
||||
forwards;
|
||||
}
|
||||
|
||||
.sidebar-content {
|
||||
overflow-y: auto;
|
||||
|
||||
@@ -1481,7 +1504,7 @@ button.create-place {
|
||||
min-width: 0;
|
||||
height: 100%;
|
||||
font-size: 1rem;
|
||||
color: #333;
|
||||
color: var(--body-text-color);
|
||||
outline: none;
|
||||
width: 100%;
|
||||
padding: 0 4px;
|
||||
@@ -1512,7 +1535,7 @@ button.create-place {
|
||||
|
||||
.search-submit-btn:hover {
|
||||
background: rgb(0 0 0 / 5%);
|
||||
color: #333;
|
||||
color: var(--body-text-color);
|
||||
}
|
||||
|
||||
.search-clear-btn {
|
||||
@@ -1530,7 +1553,7 @@ button.create-place {
|
||||
|
||||
.search-clear-btn:hover {
|
||||
background: rgb(0 0 0 / 5%);
|
||||
color: #333;
|
||||
color: var(--body-text-color);
|
||||
}
|
||||
|
||||
/* Search Results Popover */
|
||||
@@ -1599,7 +1622,7 @@ button.create-place {
|
||||
|
||||
.result-title {
|
||||
font-weight: 500;
|
||||
color: #333;
|
||||
color: var(--body-text-color);
|
||||
font-size: 0.95rem;
|
||||
white-space: nowrap;
|
||||
overflow: hidden;
|
||||
@@ -1651,7 +1674,7 @@ button.create-place {
|
||||
cursor: pointer;
|
||||
margin: 0;
|
||||
font-size: 0.95rem;
|
||||
color: #333;
|
||||
color: var(--body-text-color);
|
||||
}
|
||||
|
||||
.place-lists-manager input[type='checkbox'] {
|
||||
@@ -1661,7 +1684,8 @@ button.create-place {
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.place-lists-manager .list-color {
|
||||
/* Shared List Color Dot */
|
||||
.list-color-dot {
|
||||
width: 12px;
|
||||
height: 12px;
|
||||
background-color: var(--default-list-color);
|
||||
@@ -1672,7 +1696,7 @@ button.create-place {
|
||||
|
||||
.place-lists-manager .divider {
|
||||
height: 1px;
|
||||
background: #eee;
|
||||
background: var(--divider-color);
|
||||
margin: 0.5rem 0;
|
||||
}
|
||||
|
||||
@@ -1715,7 +1739,7 @@ button.create-place {
|
||||
border: 1px solid #ddd;
|
||||
border-radius: 16px; /* Pill shape */
|
||||
font-size: 0.9rem;
|
||||
color: #333;
|
||||
color: var(--body-text-color);
|
||||
cursor: pointer;
|
||||
white-space: nowrap;
|
||||
box-shadow: 0 1px 3px rgb(0 0 0 / 10%);
|
||||
@@ -1727,7 +1751,7 @@ button.create-place {
|
||||
}
|
||||
|
||||
.category-chip:active {
|
||||
background: #eee;
|
||||
background: var(--divider-color);
|
||||
}
|
||||
|
||||
.category-chip:disabled {
|
||||
@@ -1862,7 +1886,7 @@ button.create-place {
|
||||
|
||||
.photo-tag-chip {
|
||||
background: #f8f9fa;
|
||||
color: #333;
|
||||
color: var(--body-text-color);
|
||||
border: none;
|
||||
border-radius: 16px;
|
||||
padding: 6px 12px;
|
||||
@@ -1872,7 +1896,7 @@ button.create-place {
|
||||
}
|
||||
|
||||
.photo-tag-chip:hover {
|
||||
background: #eee;
|
||||
background: var(--divider-color);
|
||||
}
|
||||
|
||||
.photo-tag-chip.is-selected {
|
||||
@@ -2103,7 +2127,7 @@ button.create-place {
|
||||
text-align: left;
|
||||
cursor: pointer;
|
||||
font-size: 0.95rem;
|
||||
color: #333;
|
||||
color: var(--body-text-color);
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
@@ -2123,3 +2147,117 @@ button.create-place {
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
/* Snappy slide-in from left (Desktop) */
|
||||
@keyframes sidebar-slide-in-left {
|
||||
from {
|
||||
transform: translateX(-100%);
|
||||
}
|
||||
|
||||
to {
|
||||
transform: translateX(0);
|
||||
}
|
||||
}
|
||||
|
||||
/* Snappy slide-up from bottom (Mobile) */
|
||||
@keyframes sidebar-slide-up-bottom {
|
||||
from {
|
||||
transform: translateY(100%);
|
||||
}
|
||||
|
||||
to {
|
||||
transform: translateY(0);
|
||||
}
|
||||
}
|
||||
|
||||
/* Lists Index Sidebar Menu */
|
||||
.lists-index-item {
|
||||
width: 100%;
|
||||
text-align: left;
|
||||
border: none;
|
||||
border-bottom: 1px solid var(--divider-color);
|
||||
background: var(--primary-background-color);
|
||||
color: var(--body-text-color);
|
||||
padding: 1rem;
|
||||
cursor: pointer;
|
||||
transition: background 0.2s;
|
||||
font-family: inherit;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
}
|
||||
|
||||
.lists-index-item:hover {
|
||||
background: var(--hover-bg);
|
||||
}
|
||||
|
||||
.lists-index-item-left {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 12px;
|
||||
min-width: 0;
|
||||
}
|
||||
|
||||
.lists-index-name {
|
||||
font-size: 0.95rem;
|
||||
font-weight: normal;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
.lists-index-count {
|
||||
color: #666;
|
||||
font-size: 0.85rem;
|
||||
margin: 0;
|
||||
white-space: nowrap;
|
||||
flex-shrink: 0;
|
||||
}
|
||||
|
||||
/* Centered layout when back button is present */
|
||||
.sidebar-header.has-back-btn {
|
||||
position: relative;
|
||||
justify-content: center; /* Center horizontally */
|
||||
}
|
||||
|
||||
/* Absolute positioning for buttons in centered header */
|
||||
.sidebar-header.has-back-btn .back-btn {
|
||||
position: absolute;
|
||||
left: 1rem;
|
||||
z-index: 10;
|
||||
}
|
||||
|
||||
.sidebar-header.has-back-btn .close-btn {
|
||||
position: absolute;
|
||||
right: 1rem;
|
||||
z-index: 10;
|
||||
}
|
||||
|
||||
/* Centralized Title text */
|
||||
.sidebar-header-text-centered {
|
||||
position: relative;
|
||||
margin: 0;
|
||||
font-size: 1.2rem;
|
||||
font-weight: bold;
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
text-align: center;
|
||||
max-width: 60%;
|
||||
}
|
||||
|
||||
.sidebar-header-icon-wrapper {
|
||||
position: absolute;
|
||||
right: 100%;
|
||||
margin-right: 0.5rem;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
/* Sidebar Loading State */
|
||||
.sidebar-loading {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
padding: 4rem 1rem;
|
||||
}
|
||||
|
||||
@@ -2,12 +2,9 @@ import Component from '@glimmer/component';
|
||||
import { pageTitle } from 'ember-page-title';
|
||||
import Map from '#components/map';
|
||||
import AppHeader from '#components/app-header';
|
||||
import AppMenu from '#components/app-menu/index';
|
||||
import Toast from '#components/toast';
|
||||
import { service } from '@ember/service';
|
||||
import { tracked } from '@glimmer/tracking';
|
||||
import { action } from '@ember/object';
|
||||
import { or } from 'ember-truth-helpers';
|
||||
import { on } from '@ember/modifier';
|
||||
|
||||
export default class ApplicationComponent extends Component {
|
||||
@@ -15,16 +12,17 @@ export default class ApplicationComponent extends Component {
|
||||
@service mapUi;
|
||||
@service router;
|
||||
|
||||
@tracked isAppMenuOpen = false;
|
||||
|
||||
get isSidebarOpen() {
|
||||
// We consider the sidebar "open" if we are in search or place routes AND it's visible.
|
||||
// We consider the sidebar "open" if we are in search, menu, lists or place routes AND it's visible.
|
||||
// This helps the map know if it should shift the center or adjust view.
|
||||
const name = this.router.currentRouteName;
|
||||
return (
|
||||
this.mapUi.isSidebarVisible &&
|
||||
(this.router.currentRouteName === 'place' ||
|
||||
this.router.currentRouteName === 'place.new' ||
|
||||
this.router.currentRouteName === 'search')
|
||||
(name === 'place' ||
|
||||
name === 'place.new' ||
|
||||
name === 'search' ||
|
||||
name === 'menu' ||
|
||||
name.startsWith('lists'))
|
||||
);
|
||||
}
|
||||
|
||||
@@ -37,24 +35,35 @@ export default class ApplicationComponent extends Component {
|
||||
|
||||
@action
|
||||
toggleAppMenu() {
|
||||
this.isAppMenuOpen = !this.isAppMenuOpen;
|
||||
if (this.router.currentRouteName === 'menu') {
|
||||
this.router.transitionTo('index');
|
||||
} else {
|
||||
this.router.transitionTo('menu');
|
||||
}
|
||||
|
||||
@action
|
||||
closeAppMenu() {
|
||||
this.isAppMenuOpen = false;
|
||||
}
|
||||
|
||||
@action
|
||||
handleOutsideClick() {
|
||||
if (this.isAppMenuOpen) {
|
||||
this.closeAppMenu();
|
||||
} else if (
|
||||
this.router.currentRouteName === 'search' ||
|
||||
this.router.currentRouteName === 'place'
|
||||
const name = this.router.currentRouteName;
|
||||
if (
|
||||
name === 'search' ||
|
||||
name === 'place' ||
|
||||
name === 'menu' ||
|
||||
name.startsWith('lists')
|
||||
) {
|
||||
this.mapUi.clearSelection();
|
||||
this.mapUi.hideSidebar();
|
||||
if (name === 'menu' || name.startsWith('lists')) {
|
||||
this.router.transitionTo('index');
|
||||
} else if (name === 'place') {
|
||||
if (this.mapUi.returnToSearch && this.mapUi.currentSearch) {
|
||||
this.router.transitionTo('search', {
|
||||
queryParams: this.mapUi.currentSearch,
|
||||
});
|
||||
} else {
|
||||
this.router.transitionTo('index');
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@@ -66,6 +75,7 @@ export default class ApplicationComponent extends Component {
|
||||
<template>
|
||||
{{pageTitle "Marco"}}
|
||||
|
||||
<div class={{if this.mapUi.isSidebarOpening "sidebar-opening"}}>
|
||||
<AppHeader @onToggleMenu={{this.toggleAppMenu}} />
|
||||
|
||||
<div
|
||||
@@ -82,16 +92,13 @@ export default class ApplicationComponent extends Component {
|
||||
{{/if}}
|
||||
|
||||
<Map
|
||||
@isSidebarOpen={{or this.isSidebarOpen this.isAppMenuOpen}}
|
||||
@isSidebarOpen={{this.isSidebarOpen}}
|
||||
@onOutsideClick={{this.handleOutsideClick}}
|
||||
/>
|
||||
|
||||
{{#if this.isAppMenuOpen}}
|
||||
<AppMenu @onClose={{this.closeAppMenu}} />
|
||||
{{/if}}
|
||||
|
||||
<Toast />
|
||||
|
||||
{{outlet}}
|
||||
</div>
|
||||
</template>
|
||||
}
|
||||
|
||||
@@ -0,0 +1 @@
|
||||
<template>{{outlet}}</template>
|
||||
@@ -0,0 +1,89 @@
|
||||
import Component from '@glimmer/component';
|
||||
import { service } from '@ember/service';
|
||||
import { action } from '@ember/object';
|
||||
import { fn } from '@ember/helper';
|
||||
import { on } from '@ember/modifier';
|
||||
import Icon from '#components/icon';
|
||||
import { htmlSafe } from '@ember/template';
|
||||
|
||||
export default class ListsIndexTemplate extends Component {
|
||||
@service storage;
|
||||
@service router;
|
||||
@service mapUi;
|
||||
|
||||
styleFor(color) {
|
||||
const finalColor =
|
||||
color ||
|
||||
getComputedStyle(document.documentElement)
|
||||
.getPropertyValue('--default-list-color')
|
||||
.trim();
|
||||
return htmlSafe(`background-color: ${finalColor}`);
|
||||
}
|
||||
|
||||
@action
|
||||
selectList(listId) {
|
||||
this.router.transitionTo('lists.list', listId);
|
||||
}
|
||||
|
||||
@action
|
||||
close() {
|
||||
this.router.transitionTo('index');
|
||||
}
|
||||
|
||||
@action
|
||||
backToMenu() {
|
||||
this.router.transitionTo('menu');
|
||||
}
|
||||
|
||||
<template>
|
||||
{{#if this.mapUi.isSidebarVisible}}
|
||||
<div class="sidebar">
|
||||
<div class="sidebar-header has-back-btn">
|
||||
<button type="button" class="back-btn" {{on "click" this.backToMenu}}>
|
||||
<Icon @name="arrow-left" @size={{20}} @color="#333" />
|
||||
</button>
|
||||
<h2 class="sidebar-header-text-centered">
|
||||
<span class="sidebar-header-icon-wrapper">
|
||||
<Icon @name="bookmark" @size={{20}} @color="#898989" />
|
||||
</span>
|
||||
Collections
|
||||
</h2>
|
||||
<button type="button" class="close-btn" {{on "click" this.close}}>
|
||||
<Icon @name="x" @size={{20}} @color="#333" />
|
||||
</button>
|
||||
</div>
|
||||
|
||||
<div class="sidebar-content">
|
||||
<ul class="places-list">
|
||||
{{#each this.storage.lists as |list|}}
|
||||
<li>
|
||||
<button
|
||||
type="button"
|
||||
class="lists-index-item"
|
||||
{{on "click" (fn this.selectList list.id)}}
|
||||
>
|
||||
<div class="lists-index-item-left">
|
||||
{{! template-lint-disable no-inline-styles }}
|
||||
<span
|
||||
class="list-color-dot"
|
||||
style={{this.styleFor list.color}}
|
||||
></span>
|
||||
<div class="lists-index-name">{{list.title}}</div>
|
||||
</div>
|
||||
<div class="lists-index-count">
|
||||
{{#if list.placeRefs.length}}
|
||||
{{list.placeRefs.length}}
|
||||
places
|
||||
{{else}}
|
||||
empty
|
||||
{{/if}}
|
||||
</div>
|
||||
</button>
|
||||
</li>
|
||||
{{/each}}
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
{{/if}}
|
||||
</template>
|
||||
}
|
||||
@@ -0,0 +1,16 @@
|
||||
import PlacesSidebar from '#components/places-sidebar';
|
||||
|
||||
<template>
|
||||
{{#if @controller.mapUi.isSidebarVisible}}
|
||||
<PlacesSidebar
|
||||
@places={{@controller.places}}
|
||||
@title={{@controller.listTitle}}
|
||||
@color={{@controller.listColor}}
|
||||
@scrollTop={{@controller.scrollTop}}
|
||||
@isLoading={{@controller.loadPlacesTask.isRunning}}
|
||||
@onSelect={{@controller.selectPlace}}
|
||||
@onClose={{@controller.close}}
|
||||
@onBack={{@controller.backToLists}}
|
||||
/>
|
||||
{{/if}}
|
||||
</template>
|
||||
@@ -0,0 +1,15 @@
|
||||
import Component from '@glimmer/component';
|
||||
import AppMenu from '#components/app-menu/index';
|
||||
import { service } from '@ember/service';
|
||||
import { action } from '@ember/object';
|
||||
|
||||
export default class MenuTemplate extends Component {
|
||||
@service router;
|
||||
|
||||
@action
|
||||
close() {
|
||||
this.router.transitionTo('index');
|
||||
}
|
||||
|
||||
<template><AppMenu @onClose={{this.close}} /></template>
|
||||
}
|
||||
+14
-1
@@ -77,8 +77,14 @@ export default class PlaceTemplate extends Component {
|
||||
navigateBack(place) {
|
||||
// The sidebar calls this with null when "Back" is clicked.
|
||||
if (place === null) {
|
||||
// If we have an active route context (e.g. lists), return to it
|
||||
if (this.mapUi.returnToRoute) {
|
||||
this.mapUi.showSidebar();
|
||||
const { name, model } = this.mapUi.returnToRoute;
|
||||
this.router.transitionTo(name, model);
|
||||
}
|
||||
// If we have an active search context, return to it (UP navigation)
|
||||
if (this.mapUi.returnToSearch && this.mapUi.currentSearch) {
|
||||
else if (this.mapUi.returnToSearch && this.mapUi.currentSearch) {
|
||||
this.mapUi.showSidebar();
|
||||
this.router.transitionTo('search', {
|
||||
queryParams: this.mapUi.currentSearch,
|
||||
@@ -98,6 +104,13 @@ export default class PlaceTemplate extends Component {
|
||||
close() {
|
||||
this.mapUi.clearSelection();
|
||||
this.mapUi.hideSidebar();
|
||||
if (this.mapUi.returnToSearch && this.mapUi.currentSearch) {
|
||||
this.router.transitionTo('search', {
|
||||
queryParams: this.mapUi.currentSearch,
|
||||
});
|
||||
} else {
|
||||
this.router.transitionTo('index');
|
||||
}
|
||||
}
|
||||
|
||||
<template>
|
||||
|
||||
@@ -10,6 +10,10 @@ export default class SearchTemplate extends Component {
|
||||
@action
|
||||
selectPlace(place) {
|
||||
if (place) {
|
||||
const sidebarContent = document.querySelector('.sidebar-content');
|
||||
if (sidebarContent) {
|
||||
this.mapUi.saveScrollPosition('search', sidebarContent.scrollTop);
|
||||
}
|
||||
this.mapUi.returnToSearch = true;
|
||||
this.mapUi.showSidebar();
|
||||
this.mapUi.preventNextZoom = true;
|
||||
@@ -28,6 +32,7 @@ export default class SearchTemplate extends Component {
|
||||
{{#if this.mapUi.isSidebarVisible}}
|
||||
<PlacesSidebar
|
||||
@places={{this.mapUi.searchResults}}
|
||||
@scrollTop={{this.mapUi.getScrollPosition "search"}}
|
||||
@onSelect={{this.selectPlace}}
|
||||
@onClose={{this.close}}
|
||||
/>
|
||||
|
||||
@@ -1,4 +1,7 @@
|
||||
// AGENT: Keep imports sorted alphabetically, grouped by feather-icons → pinhead → custom/local
|
||||
/*
|
||||
* Feather icons
|
||||
*/
|
||||
import activity from 'feather-icons/dist/icons/activity.svg?raw';
|
||||
import arrowLeft from 'feather-icons/dist/icons/arrow-left.svg?raw';
|
||||
import bookmark from 'feather-icons/dist/icons/bookmark.svg?raw';
|
||||
@@ -40,6 +43,9 @@ import check from 'feather-icons/dist/icons/check.svg?raw';
|
||||
import alertCircle from 'feather-icons/dist/icons/alert-circle.svg?raw';
|
||||
import zap from 'feather-icons/dist/icons/zap.svg?raw';
|
||||
|
||||
/*
|
||||
* Pinhead icons
|
||||
*/
|
||||
import angelfish from '@waysidemapping/pinhead/dist/icons/angelfish.svg?raw';
|
||||
import barbell from '@waysidemapping/pinhead/dist/icons/barbell.svg?raw';
|
||||
import climbingWall from '@waysidemapping/pinhead/dist/icons/climbing_wall.svg?raw';
|
||||
@@ -53,8 +59,12 @@ import bus from '@waysidemapping/pinhead/dist/icons/bus.svg?raw';
|
||||
import camera from '@waysidemapping/pinhead/dist/icons/camera.svg?raw';
|
||||
import boxingGloveUp from '@waysidemapping/pinhead/dist/icons/boxing_glove_up.svg?raw';
|
||||
import car from '@waysidemapping/pinhead/dist/icons/car.svg?raw';
|
||||
import carAndWrench from '@waysidemapping/pinhead/dist/icons/car_and_wrench.svg?raw';
|
||||
import castleKeep from '@waysidemapping/pinhead/dist/icons/castle_keep.svg?raw';
|
||||
import cigaretteWithSmokeCurl from '@waysidemapping/pinhead/dist/icons/cigarette_with_smoke_curl.svg?raw';
|
||||
import cityGate from '@waysidemapping/pinhead/dist/icons/city_gate.svg?raw';
|
||||
import classicalBuilding from '@waysidemapping/pinhead/dist/icons/classical_building.svg?raw';
|
||||
import classicalBuildingWithClock from '@waysidemapping/pinhead/dist/icons/classical_building_with_clock.svg?raw';
|
||||
import classicalBuildingWithDomeAndFlag from '@waysidemapping/pinhead/dist/icons/classical_building_with_dome_and_flag.svg?raw';
|
||||
import classicalBuildingWithFlag from '@waysidemapping/pinhead/dist/icons/classical_building_with_flag.svg?raw';
|
||||
import commercialBuilding from '@waysidemapping/pinhead/dist/icons/commercial_building.svg?raw';
|
||||
@@ -82,8 +92,13 @@ import grecianVase from '@waysidemapping/pinhead/dist/icons/grecian_vase.svg?raw
|
||||
import greekCross from '@waysidemapping/pinhead/dist/icons/greek_cross.svg?raw';
|
||||
import iceCreamOnCone from '@waysidemapping/pinhead/dist/icons/ice_cream_on_cone.svg?raw';
|
||||
import industrialBuilding from '@waysidemapping/pinhead/dist/icons/industrial_building.svg?raw';
|
||||
import infoI from '@waysidemapping/pinhead/dist/icons/info_i.svg?raw';
|
||||
import jewel from '@waysidemapping/pinhead/dist/icons/jewel.svg?raw';
|
||||
import lowriseBuilding from '@waysidemapping/pinhead/dist/icons/lowrise_building.svg?raw';
|
||||
import marketStall from '@waysidemapping/pinhead/dist/icons/market_stall.svg?raw';
|
||||
import memorialStoneWithInscription from '@waysidemapping/pinhead/dist/icons/memorial_stone_with_inscription.svg?raw';
|
||||
import mobilePhoneWithKeypadAndAntenna from '@waysidemapping/pinhead/dist/icons/mobile_phone_with_keypad_and_antenna.svg?raw';
|
||||
import molarTooth from '@waysidemapping/pinhead/dist/icons/molar_tooth.svg?raw';
|
||||
import needleAndSpoolOfThread from '@waysidemapping/pinhead/dist/icons/needle_and_spool_of_thread.svg?raw';
|
||||
import openBook from '@waysidemapping/pinhead/dist/icons/open_book.svg?raw';
|
||||
import palace from '@waysidemapping/pinhead/dist/icons/palace.svg?raw';
|
||||
@@ -118,6 +133,9 @@ import wallHangingWithMountainsAndSun from '@waysidemapping/pinhead/dist/icons/w
|
||||
import windingWayWide from '@waysidemapping/pinhead/dist/icons/winding_way_wide.svg?raw';
|
||||
import womensAndMensRestroomSymbol from '@waysidemapping/pinhead/dist/icons/womens_and_mens_restroom_symbol.svg?raw';
|
||||
|
||||
/*
|
||||
* Custom/local icons
|
||||
*/
|
||||
import loadingRing from '../icons/270-ring.svg?raw';
|
||||
import nostrich from '../icons/nostrich-2.svg?raw';
|
||||
import remotestorage from '../icons/remotestorage.svg?raw';
|
||||
@@ -144,11 +162,13 @@ const ICONS = {
|
||||
'chevron-left': chevronLeft,
|
||||
'chevron-right': chevronRight,
|
||||
'cigarette-with-smoke-curl': cigaretteWithSmokeCurl,
|
||||
'city-gate': cityGate,
|
||||
climbing_wall: climbingWall,
|
||||
check,
|
||||
'alert-circle': alertCircle,
|
||||
'alert-triangle': alertTriangle,
|
||||
'classical-building': classicalBuilding,
|
||||
'classical-building-with-clock': classicalBuildingWithClock,
|
||||
'classical-building-with-dome-and-flag': classicalBuildingWithDomeAndFlag,
|
||||
'classical-building-with-flag': classicalBuildingWithFlag,
|
||||
'commercial-building': commercialBuilding,
|
||||
@@ -185,6 +205,7 @@ const ICONS = {
|
||||
'ice-cream-on-cone': iceCreamOnCone,
|
||||
'industrial-building': industrialBuilding,
|
||||
info,
|
||||
'info-i': infoI,
|
||||
instagram,
|
||||
jewel,
|
||||
'log-in': logIn,
|
||||
@@ -193,7 +214,11 @@ const ICONS = {
|
||||
mail,
|
||||
map,
|
||||
'map-pin': mapPin,
|
||||
'market-stall': marketStall,
|
||||
'memorial-stone-with-inscription': memorialStoneWithInscription,
|
||||
menu,
|
||||
'mobile-phone-with-keypad-and-antenna': mobilePhoneWithKeypadAndAntenna,
|
||||
'molar-tooth': molarTooth,
|
||||
'more-horizontal': moreHorizontal,
|
||||
'more-vertical': moreVertical,
|
||||
navigation,
|
||||
@@ -245,6 +270,8 @@ const ICONS = {
|
||||
winding_way_wide: windingWayWide,
|
||||
parking_p: parkingP,
|
||||
car,
|
||||
'car-and-wrench': carAndWrench,
|
||||
'castle-keep': castleKeep,
|
||||
x,
|
||||
zap,
|
||||
'loading-ring': loadingRing,
|
||||
|
||||
@@ -14,6 +14,30 @@ export function normalizeRelayUrl(url) {
|
||||
return normalized;
|
||||
}
|
||||
|
||||
export function uniqNormalizedRelays(relays = []) {
|
||||
return Array.from(new Set(relays.map(normalizeRelayUrl).filter(Boolean)));
|
||||
}
|
||||
|
||||
export function mergeRequiredRelays(requiredRelays = [], customRelays = []) {
|
||||
const requiredSet = new Set(requiredRelays.filter(Boolean));
|
||||
const merged = [...requiredRelays.filter(Boolean)];
|
||||
|
||||
for (const relay of uniqNormalizedRelays(customRelays)) {
|
||||
if (!requiredSet.has(relay)) {
|
||||
merged.push(relay);
|
||||
}
|
||||
}
|
||||
|
||||
return merged;
|
||||
}
|
||||
|
||||
export function excludeRequiredRelays(customRelays = [], requiredRelays = []) {
|
||||
const requiredSet = new Set(requiredRelays.filter(Boolean));
|
||||
return uniqNormalizedRelays(customRelays).filter((relay) => {
|
||||
return !requiredSet.has(relay);
|
||||
});
|
||||
}
|
||||
|
||||
/**
|
||||
* Extracts and normalizes photo data from NIP-360 (Place Photos) events.
|
||||
* Sorts chronologically and guarantees the first landscape photo (or first portrait) is at index 0.
|
||||
|
||||
@@ -27,6 +27,8 @@ export const POI_ICON_RULES = [
|
||||
|
||||
{ tags: { amenity: 'bank' }, icon: 'banknote' },
|
||||
{ tags: { amenity: 'place_of_worship' }, icon: 'place-of-worship-building' },
|
||||
{ tags: { amenity: 'townhall' }, icon: 'classical-building-with-clock' },
|
||||
{ tags: { building: 'townhall' }, icon: 'classical-building-with-clock' },
|
||||
{ tags: { amenity: 'fire_station' }, icon: 'badge-shield-with-fire' },
|
||||
{ tags: { amenity: 'police' }, icon: 'police-officer-with-stop-arm' },
|
||||
{ tags: { amenity: 'toilets' }, icon: 'womens-and-mens-restroom-symbol' },
|
||||
@@ -72,6 +74,7 @@ export const POI_ICON_RULES = [
|
||||
tags: { shop: 'beauty' },
|
||||
icon: 'fancy-mirror-with-reflection-and-stars',
|
||||
},
|
||||
{ tags: { shop: 'car_repair' }, icon: 'car-and-wrench' },
|
||||
{ tags: { craft: 'tailor' }, icon: 'needle-and-spool-of-thread' },
|
||||
{ tags: { office: 'estate_agent' }, icon: 'village-buildings' },
|
||||
{ tags: { office: true }, icon: 'commercial-building' },
|
||||
@@ -103,6 +106,7 @@ export const POI_ICON_RULES = [
|
||||
{ tags: { tourism: 'viewpoint' }, icon: 'camera' },
|
||||
{ tags: { tourism: 'zoo' }, icon: 'camera' },
|
||||
{ tags: { tourism: 'artwork' }, icon: 'camera' },
|
||||
{ tags: { tourism: 'information' }, icon: 'info-i' },
|
||||
{ tags: { amenity: 'cinema' }, icon: 'film' },
|
||||
{ tags: { amenity: 'theatre' }, icon: 'camera' },
|
||||
{ tags: { amenity: 'arts_centre' }, icon: 'comedy-mask-and-tragedy-mask' },
|
||||
@@ -113,7 +117,9 @@ export const POI_ICON_RULES = [
|
||||
{ tags: { historic: 'bridge' }, icon: 'bridge' },
|
||||
{ tags: { historic: 'bridge_site' }, icon: 'bridge' },
|
||||
{ tags: { historic: 'fort' }, icon: 'fort' },
|
||||
{ tags: { historic: 'city_gate' }, icon: 'city-gate' },
|
||||
{ tags: { historic: 'castle' }, icon: 'palace' },
|
||||
{ tags: { building: 'tower', historic: 'yes' }, icon: 'castle-keep' },
|
||||
{ tags: { historic: 'building' }, icon: 'classical-building-with-flag' },
|
||||
{ tags: { historic: 'archaeological_site' }, icon: 'grecian-vase' },
|
||||
{ tags: { historic: 'memorial' }, icon: 'memorial-stone-with-inscription' },
|
||||
|
||||
+10
-1
@@ -56,15 +56,24 @@ const PLACE_TYPE_KEYS = [
|
||||
export function getPlaceType(tags) {
|
||||
if (!tags) return null;
|
||||
|
||||
let fallbackKey = null;
|
||||
|
||||
for (const key of PLACE_TYPE_KEYS) {
|
||||
const value = tags[key];
|
||||
if (value) {
|
||||
if (value === 'yes') {
|
||||
return humanizeOsmTag(key);
|
||||
if (!fallbackKey) {
|
||||
fallbackKey = key;
|
||||
}
|
||||
continue;
|
||||
}
|
||||
return humanizeOsmTag(value);
|
||||
}
|
||||
}
|
||||
|
||||
if (fallbackKey) {
|
||||
return humanizeOsmTag(fallbackKey);
|
||||
}
|
||||
|
||||
return null;
|
||||
}
|
||||
|
||||
@@ -43,7 +43,7 @@ export const POI_CATEGORIES = [
|
||||
label: 'Things to do',
|
||||
icon: 'feather-camera',
|
||||
filter: [
|
||||
'["tourism"~"^(museum|gallery|attraction|viewpoint|zoo|theme_park|aquarium|artwork)$"]',
|
||||
'["tourism"~"^(museum|gallery|attraction|viewpoint|zoo|theme_park|aquarium|artwork|information)$"]',
|
||||
'["amenity"~"^(cinema|theatre|arts_centre|planetarium)$"]',
|
||||
'["leisure"~"^(sports_centre|stadium|water_park)$"]',
|
||||
'["historic"]',
|
||||
@@ -55,7 +55,7 @@ export const POI_CATEGORIES = [
|
||||
id: 'accommodation',
|
||||
label: 'Hotels',
|
||||
icon: 'person-sleeping-in-bed',
|
||||
filter: ['["tourism"~"^(hotel|hostel|motel|chalet)$"]'],
|
||||
filter: ['["tourism"~"^(hotel|hostel|motel|chalet|guest_house)$"]'],
|
||||
types: ['node', 'way', 'relation'],
|
||||
},
|
||||
];
|
||||
|
||||
+1
-1
@@ -52,7 +52,7 @@
|
||||
"@embroider/vite": "^1.5.0",
|
||||
"@eslint/js": "^9.39.2",
|
||||
"@glimmer/component": "^2.0.0",
|
||||
"@remotestorage/module-places": "~1.2.1",
|
||||
"@remotestorage/module-places": "~1.3.0",
|
||||
"@rollup/plugin-babel": "^6.1.0",
|
||||
"@warp-drive/core": "~5.8.0",
|
||||
"@warp-drive/ember": "~5.8.0",
|
||||
|
||||
Generated
+5
-5
@@ -88,8 +88,8 @@ importers:
|
||||
specifier: ^2.0.0
|
||||
version: 2.0.0
|
||||
'@remotestorage/module-places':
|
||||
specifier: ~1.2.1
|
||||
version: 1.2.1
|
||||
specifier: ~1.3.0
|
||||
version: 1.3.0
|
||||
'@rollup/plugin-babel':
|
||||
specifier: ^6.1.0
|
||||
version: 6.1.0(@babel/core@7.28.6)(rollup@4.55.1)
|
||||
@@ -1468,8 +1468,8 @@ packages:
|
||||
resolution: {integrity: sha512-4rdu8GPY9TeQwsYp5D2My74dC3dSVS3tghAvisG80ybK4lqa0gvlrglaSTBxogJbxqHRw/NjI/liEtb3+SD+Bw==}
|
||||
engines: {node: '>=18.12'}
|
||||
|
||||
'@remotestorage/module-places@1.2.1':
|
||||
resolution: {integrity: sha512-hNRuhGoG8RS+cieVvDVzXWBEuNPfyeFirhgNH3z1WoKw9ngHdPY6V0sT0vKbsxB8xaODReZfo2ZKHLTmdFunlw==}
|
||||
'@remotestorage/module-places@1.3.0':
|
||||
resolution: {integrity: sha512-VM0CqkIP6IBEpjqJ2DyTrGDOQXc73aXoAFDLIoME5Lo033uTitgn+qKgTGPK/lD4H92mk1+D3W88ECtf9v3mWw==}
|
||||
|
||||
'@rollup/plugin-babel@6.1.0':
|
||||
resolution: {integrity: sha512-dFZNuFD2YRcoomP4oYf+DvQNSUA9ih+A3vUqopQx5EdtPGo3WBnQcI/S8pwpz91UsGfL0HsMSOlaMld8HrbubA==}
|
||||
@@ -7439,7 +7439,7 @@ snapshots:
|
||||
'@pnpm/error': 1000.0.5
|
||||
find-up: 5.0.0
|
||||
|
||||
'@remotestorage/module-places@1.2.1':
|
||||
'@remotestorage/module-places@1.3.0':
|
||||
dependencies:
|
||||
latlon-geohash: 2.0.0
|
||||
ulid: 3.0.2
|
||||
|
||||
@@ -0,0 +1,138 @@
|
||||
import { module, test } from 'qunit';
|
||||
import { visit, currentURL, click, waitFor } from '@ember/test-helpers';
|
||||
import { setupApplicationTest } from 'marco/tests/helpers';
|
||||
import Service from '@ember/service';
|
||||
|
||||
class MockOsmService extends Service {
|
||||
async fetchOsmObject() {
|
||||
return null;
|
||||
}
|
||||
}
|
||||
|
||||
class MockStorageService extends Service {
|
||||
initialSyncDone = true;
|
||||
savedPlaces = [
|
||||
{
|
||||
id: 'place-123',
|
||||
title: 'Mountain Trail',
|
||||
geohash: 'u33dc0',
|
||||
osmTags: { name: 'Mountain Trail' },
|
||||
},
|
||||
];
|
||||
lists = [
|
||||
{
|
||||
id: 'to-go',
|
||||
title: 'Want to go',
|
||||
color: '#2e9e4f',
|
||||
placeRefs: [{ id: 'place-123', geohash: 'u33dc0' }],
|
||||
},
|
||||
{ id: 'to-do', title: 'To do', color: '#2a7fff', placeRefs: [] },
|
||||
];
|
||||
|
||||
findPlaceById(id) {
|
||||
if (id === 'place-123') {
|
||||
return this.savedPlaces[0];
|
||||
}
|
||||
return null;
|
||||
}
|
||||
|
||||
isPlaceSaved() {
|
||||
return true;
|
||||
}
|
||||
|
||||
loadPlacesInBounds() {
|
||||
return [];
|
||||
}
|
||||
|
||||
getPlacesInList(listId) {
|
||||
if (listId === 'to-go') {
|
||||
return Promise.resolve([this.savedPlaces[0]]);
|
||||
}
|
||||
return Promise.resolve([]);
|
||||
}
|
||||
|
||||
rs = {
|
||||
on: () => {},
|
||||
};
|
||||
}
|
||||
|
||||
module('Acceptance | collections navigation', function (hooks) {
|
||||
setupApplicationTest(hooks);
|
||||
|
||||
hooks.beforeEach(function () {
|
||||
this.owner.register('service:osm', MockOsmService);
|
||||
this.owner.register('service:storage', MockStorageService);
|
||||
});
|
||||
|
||||
test('navigating through the collections menu hierarchy, viewing list places, and going back', async function (assert) {
|
||||
// 1. Visit Home Map
|
||||
await visit('/');
|
||||
assert.strictEqual(currentURL(), '/');
|
||||
|
||||
// 2. Open the App Menu overlay
|
||||
await click('.menu-btn-integrated');
|
||||
assert.dom('.sidebar.app-menu-pane').exists('App menu sidebar is open');
|
||||
assert
|
||||
.dom('.app-menu')
|
||||
.includesText('Collections', 'Menu contains Collections link');
|
||||
|
||||
// 3. Transition to Collections Index (List of lists)
|
||||
await click(document.querySelectorAll('.app-menu button')[0]); // Click "Collections"
|
||||
assert.strictEqual(currentURL(), '/lists', 'Transitions to /lists index');
|
||||
assert
|
||||
.dom('.sidebar-header-text-centered')
|
||||
.includesText('Collections', 'Header is centered and titled Collections');
|
||||
assert
|
||||
.dom('.lists-index-item')
|
||||
.exists({ count: 2 }, 'Renders our 2 mocked list items');
|
||||
|
||||
// 4. Transition to a specific list (Want to go)
|
||||
await click(document.querySelectorAll('.lists-index-item')[0]); // Click "Want to go"
|
||||
assert.strictEqual(
|
||||
currentURL(),
|
||||
'/lists/to-go',
|
||||
'Transitions instantly to /lists/to-go'
|
||||
);
|
||||
|
||||
// 5. Verify background loading spinner shows up, then results populate
|
||||
await waitFor('.places-list');
|
||||
assert
|
||||
.dom('.places-list .place-name')
|
||||
.hasText('Mountain Trail', 'Renders the saved place from the list');
|
||||
assert
|
||||
.dom('.places-list .place-type')
|
||||
.hasText('Saved place', 'Place type displays Saved place correctly');
|
||||
|
||||
// 6. Click back button in collection list header
|
||||
await click('.sidebar-header .back-btn');
|
||||
assert.strictEqual(currentURL(), '/lists', 'Goes back to /lists index');
|
||||
|
||||
// 7. Click back button in collections index header
|
||||
await click('.sidebar-header .back-btn');
|
||||
assert.strictEqual(currentURL(), '/menu', 'Goes back to main menu route');
|
||||
|
||||
// 8. Close sidebar
|
||||
await click('.sidebar-header .close-btn');
|
||||
assert.strictEqual(currentURL(), '/', 'Sidebar closed and returned home');
|
||||
});
|
||||
|
||||
test('clicking a place inside a collection sets returnToRoute and returns gracefully on back click', async function (assert) {
|
||||
await visit('/lists/to-go');
|
||||
await waitFor('.places-list');
|
||||
|
||||
// Click on the place item to view details
|
||||
await click('.place-item');
|
||||
assert.ok(
|
||||
currentURL().includes('/place/place-123'),
|
||||
'Transitions to place details route'
|
||||
);
|
||||
|
||||
// Click back from place details
|
||||
await click('.back-btn');
|
||||
assert.strictEqual(
|
||||
currentURL(),
|
||||
'/lists/to-go',
|
||||
'Returns gracefully back to lists/to-go list view'
|
||||
);
|
||||
});
|
||||
});
|
||||
@@ -2,7 +2,6 @@ import { module, test } from 'qunit';
|
||||
import { visit, currentURL, waitFor, triggerEvent } from '@ember/test-helpers';
|
||||
import { setupApplicationTest } from 'marco/tests/helpers';
|
||||
import Service from '@ember/service';
|
||||
import sinon from 'sinon';
|
||||
|
||||
module('Acceptance | map search reset', function (hooks) {
|
||||
setupApplicationTest(hooks);
|
||||
@@ -17,58 +16,10 @@ module('Acceptance | map search reset', function (hooks) {
|
||||
'marco:map-view',
|
||||
JSON.stringify(highZoomState)
|
||||
);
|
||||
|
||||
// Stub window.fetch using Sinon
|
||||
// We want to intercept map style requests and let everything else through
|
||||
this.fetchStub = sinon.stub(window, 'fetch');
|
||||
|
||||
this.fetchStub.callsFake(async (input, init) => {
|
||||
let url = input;
|
||||
if (typeof input === 'object' && input !== null && 'url' in input) {
|
||||
url = input.url;
|
||||
}
|
||||
|
||||
if (
|
||||
typeof url === 'string' &&
|
||||
url.includes('tiles.openfreemap.org/styles/liberty')
|
||||
) {
|
||||
return {
|
||||
ok: true,
|
||||
status: 200,
|
||||
json: async () => ({
|
||||
version: 8,
|
||||
name: 'Liberty',
|
||||
sources: {
|
||||
openmaptiles: {
|
||||
type: 'vector',
|
||||
url: 'https://tiles.openfreemap.org/planet',
|
||||
},
|
||||
},
|
||||
layers: [
|
||||
{
|
||||
id: 'background',
|
||||
type: 'background',
|
||||
paint: {
|
||||
'background-color': '#123456',
|
||||
},
|
||||
},
|
||||
],
|
||||
glyphs:
|
||||
'https://tiles.openfreemap.org/fonts/{fontstack}/{range}.pbf',
|
||||
sprite: 'https://tiles.openfreemap.org/sprites/liberty',
|
||||
}),
|
||||
};
|
||||
}
|
||||
|
||||
// Pass through to the original implementation
|
||||
return this.fetchStub.wrappedMethod(input, init);
|
||||
});
|
||||
});
|
||||
|
||||
hooks.afterEach(function () {
|
||||
window.localStorage.removeItem('marco:map-view');
|
||||
// Restore the original fetch
|
||||
this.fetchStub.restore();
|
||||
});
|
||||
|
||||
test('clicking the map clears the category search parameter', async function (assert) {
|
||||
@@ -150,7 +101,7 @@ module('Acceptance | map search reset', function (hooks) {
|
||||
'Should have stayed on the search route with markers intact'
|
||||
);
|
||||
|
||||
// Second Click (Start new search)
|
||||
// Second Click (Clear search and markers)
|
||||
// Click slightly differently to ensure fresh event
|
||||
await triggerEvent(canvas, 'pointerdown', {
|
||||
clientX: 250,
|
||||
@@ -174,11 +125,6 @@ module('Acceptance | map search reset', function (hooks) {
|
||||
// 3. Wait for transition
|
||||
await new Promise((r) => setTimeout(r, 1000));
|
||||
|
||||
const newUrl = currentURL();
|
||||
assert.notOk(
|
||||
newUrl.includes('category=coffee'),
|
||||
`New URL ${newUrl} should not contain category param`
|
||||
);
|
||||
assert.ok(newUrl.includes('/search'), 'Should be on search route');
|
||||
assert.strictEqual(currentURL(), '/', 'Should have transitioned to index');
|
||||
});
|
||||
});
|
||||
|
||||
@@ -85,7 +85,7 @@ module('Acceptance | navigation', function (hooks) {
|
||||
);
|
||||
});
|
||||
|
||||
test('closing the sidebar resets the returnToSearch flag', async function (assert) {
|
||||
test('closing the sidebar transitions back to search route when opened from search results', async function (assert) {
|
||||
const mapUi = this.owner.lookup('service:map-ui');
|
||||
|
||||
await visit('/search?lat=1&lon=1');
|
||||
@@ -97,7 +97,22 @@ module('Acceptance | navigation', function (hooks) {
|
||||
await click('.close-btn');
|
||||
|
||||
assert.dom('.sidebar').doesNotExist('Sidebar should be closed');
|
||||
assert.ok(currentURL().includes('/place/'), 'Remains on place route');
|
||||
assert.strictEqual(
|
||||
currentURL(),
|
||||
'/search?lat=1&lon=1',
|
||||
'Should transition back to search route'
|
||||
);
|
||||
});
|
||||
|
||||
test('closing the sidebar when visiting a place directly transitions to index', async function (assert) {
|
||||
await visit('/place/osm:node:123');
|
||||
assert.ok(currentURL().includes('/place/'), 'Visited place directly');
|
||||
|
||||
// Click the Close (X) button
|
||||
await click('.close-btn');
|
||||
|
||||
assert.dom('.sidebar').doesNotExist('Sidebar should be closed');
|
||||
assert.strictEqual(currentURL(), '/', 'Should transition back to index');
|
||||
});
|
||||
|
||||
test('navigating directly to place and back closes sidebar', async function (assert) {
|
||||
|
||||
@@ -169,4 +169,77 @@ module('Acceptance | search loading', function (hooks) {
|
||||
// Verify we are back on index (or at least query is gone)
|
||||
assert.strictEqual(currentURL(), '/', 'Navigated to index');
|
||||
});
|
||||
|
||||
test('quick search pills visibility during category search transition', async function (assert) {
|
||||
const mapUi = this.owner.lookup('service:map-ui');
|
||||
mapUi.currentZoom = 15;
|
||||
|
||||
// Seed localStorage with a high zoom level to ensure quick search buttons show
|
||||
const highZoomState = {
|
||||
center: [13.4, 52.5],
|
||||
zoom: 18,
|
||||
};
|
||||
window.localStorage.setItem(
|
||||
'marco:map-view',
|
||||
JSON.stringify(highZoomState)
|
||||
);
|
||||
|
||||
try {
|
||||
// Make sure quick search buttons setting is enabled
|
||||
const settings = this.owner.lookup('service:settings');
|
||||
settings.showQuickSearchButtons = true;
|
||||
|
||||
// 1. Visit slowly loading category search
|
||||
const catPromise = visit('/search?category=slow_category&lat=1&lon=1');
|
||||
await new Promise((r) => setTimeout(r, 10));
|
||||
|
||||
// Verify loading state is set and pills are visible (i.e. header-center does NOT have .searching)
|
||||
assert.ok(mapUi.loadingState, 'Search is loading');
|
||||
assert
|
||||
.dom('.header-center')
|
||||
.doesNotHaveClass(
|
||||
'searching',
|
||||
'Pills remain visible while search is loading'
|
||||
);
|
||||
|
||||
// Resolve the promise with empty results
|
||||
osmResolve();
|
||||
await catPromise;
|
||||
await settled();
|
||||
|
||||
// Verify search completed and since results are empty, pills are still visible
|
||||
assert.strictEqual(mapUi.searchResults.length, 0, 'No results found');
|
||||
assert
|
||||
.dom('.header-center')
|
||||
.doesNotHaveClass(
|
||||
'searching',
|
||||
'Pills remain visible after search completes with no results'
|
||||
);
|
||||
|
||||
// 2. Now simulate a fast category search that returns results
|
||||
const osmService = this.owner.lookup('service:osm');
|
||||
osmService.getCategoryPois = async () => [
|
||||
{
|
||||
title: 'Latte Art Cafe',
|
||||
lat: 1,
|
||||
lon: 1,
|
||||
osmId: '101',
|
||||
osmType: 'N',
|
||||
},
|
||||
];
|
||||
|
||||
await visit('/search?category=coffee&lat=1&lon=1');
|
||||
|
||||
// Verify search completed with results, so pills are hidden
|
||||
assert.ok(mapUi.searchResults.length > 0, 'Results found');
|
||||
assert
|
||||
.dom('.header-center')
|
||||
.hasClass(
|
||||
'searching',
|
||||
'Pills are hidden after search completes with results'
|
||||
);
|
||||
} finally {
|
||||
window.localStorage.removeItem('marco:map-view');
|
||||
}
|
||||
});
|
||||
});
|
||||
|
||||
@@ -270,4 +270,76 @@ module('Acceptance | search', function (hooks) {
|
||||
.hasText('Search request failed. Please try again.');
|
||||
assert.dom('.places-sidebar').doesNotExist('Results panel should not open');
|
||||
});
|
||||
|
||||
test('search box query synchronized with active route query parameters', async function (assert) {
|
||||
// Mock Osm Service
|
||||
class MockOsmService extends Service {
|
||||
async getCategoryPois() {
|
||||
return [];
|
||||
}
|
||||
}
|
||||
this.owner.register('service:osm', MockOsmService);
|
||||
|
||||
// Mock Photon Service
|
||||
class MockPhotonService extends Service {
|
||||
async search() {
|
||||
return [];
|
||||
}
|
||||
}
|
||||
this.owner.register('service:photon', MockPhotonService);
|
||||
|
||||
// Mock Storage Service
|
||||
class MockStorageService extends Service {
|
||||
savedPlaces = [];
|
||||
findPlaceById() {
|
||||
return null;
|
||||
}
|
||||
isPlaceSaved() {
|
||||
return false;
|
||||
}
|
||||
rs = { on: () => {} };
|
||||
placesInView = [];
|
||||
loadPlacesInBounds() {
|
||||
return Promise.resolve();
|
||||
}
|
||||
}
|
||||
this.owner.register('service:storage', MockStorageService);
|
||||
|
||||
// Mock Map Service
|
||||
class MockMapService extends Service {
|
||||
getBounds() {
|
||||
return {
|
||||
minLat: 52.5,
|
||||
minLon: 13.4,
|
||||
maxLat: 52.6,
|
||||
maxLon: 13.5,
|
||||
};
|
||||
}
|
||||
}
|
||||
this.owner.register('service:map', MockMapService);
|
||||
|
||||
// 1. Visit a search URL directly
|
||||
await visit('/search?q=Berlin');
|
||||
assert
|
||||
.dom('.search-input')
|
||||
.hasValue(
|
||||
'Berlin',
|
||||
'Search input is populated with search term on direct load'
|
||||
);
|
||||
|
||||
// 2. Visit a category search URL
|
||||
await visit('/search?category=coffee&lat=52.52&lon=13.405');
|
||||
assert
|
||||
.dom('.search-input')
|
||||
.hasValue(
|
||||
'Coffee',
|
||||
'Search input is populated with mapped category label'
|
||||
);
|
||||
|
||||
// 3. Go back to index
|
||||
await visit('/');
|
||||
assert
|
||||
.dom('.search-input')
|
||||
.hasValue('', 'Search input is cleared on transitioning to index');
|
||||
});
|
||||
});
|
||||
|
||||
@@ -4,6 +4,92 @@ import {
|
||||
setupTest as upstreamSetupTest,
|
||||
} from 'ember-qunit';
|
||||
import { setupNostrMocks } from './mock-nostr';
|
||||
import sinon from 'sinon';
|
||||
|
||||
function setupMapStyleMocks(hooks) {
|
||||
hooks.beforeEach(function () {
|
||||
// Stub window.fetch to capture map-style assets before they hit the network
|
||||
this.fetchStub = sinon.stub(window, 'fetch');
|
||||
|
||||
this.fetchStub.callsFake(async (input, init) => {
|
||||
let url = input;
|
||||
if (typeof input === 'object' && input !== null && 'url' in input) {
|
||||
url = input.url;
|
||||
}
|
||||
|
||||
if (typeof url === 'string' && url.includes('tiles.openfreemap.org')) {
|
||||
// A. Mock Style Sheet
|
||||
if (url.includes('/styles/liberty')) {
|
||||
return {
|
||||
ok: true,
|
||||
status: 200,
|
||||
json: async () => ({
|
||||
version: 8,
|
||||
name: 'Mock Style',
|
||||
sources: {
|
||||
openmaptiles: {
|
||||
type: 'vector',
|
||||
tiles: [], // Empty tiles list prevents any map tile fetching completely!
|
||||
},
|
||||
},
|
||||
sprite: 'https://tiles.openfreemap.org/sprites/liberty',
|
||||
glyphs:
|
||||
'https://tiles.openfreemap.org/fonts/{fontstack}/{range}.pbf',
|
||||
layers: [
|
||||
{
|
||||
id: 'background',
|
||||
type: 'background',
|
||||
paint: { 'background-color': '#f8f9fa' },
|
||||
},
|
||||
],
|
||||
}),
|
||||
};
|
||||
}
|
||||
|
||||
// B. Mock Sprite Atlas JSON
|
||||
if (url.endsWith('.json') && url.includes('/sprites/')) {
|
||||
return {
|
||||
ok: true,
|
||||
status: 200,
|
||||
json: async () => ({}), // Empty sprite dictionary
|
||||
};
|
||||
}
|
||||
|
||||
// C. Mock Sprite Atlas PNG (Returns a valid 1x1 transparent PNG)
|
||||
if (url.endsWith('.png') && url.includes('/sprites/')) {
|
||||
const bytes = new Uint8Array([
|
||||
137, 80, 78, 71, 13, 10, 26, 10, 0, 0, 0, 13, 73, 72, 68, 82, 0, 0,
|
||||
0, 1, 0, 0, 0, 1, 8, 6, 0, 0, 0, 31, 21, 196, 137, 0, 0, 0, 11, 73,
|
||||
68, 65, 84, 120, 156, 99, 96, 0, 0, 0, 2, 0, 1, 226, 33, 188, 51, 0,
|
||||
0, 0, 0, 73, 69, 78, 68, 174, 66, 96, 130,
|
||||
]);
|
||||
const blob = new Blob([bytes], { type: 'image/png' });
|
||||
return {
|
||||
ok: true,
|
||||
status: 200,
|
||||
blob: async () => blob,
|
||||
};
|
||||
}
|
||||
|
||||
// Catch-all mock for other openfreemap endpoints
|
||||
return {
|
||||
ok: true,
|
||||
status: 200,
|
||||
json: async () => ({}),
|
||||
};
|
||||
}
|
||||
|
||||
// Pass through to original fetch (e.g. Photon results, local mock APIs)
|
||||
return this.fetchStub.wrappedMethod(input, init);
|
||||
});
|
||||
});
|
||||
|
||||
hooks.afterEach(function () {
|
||||
if (this.fetchStub && typeof this.fetchStub.restore === 'function') {
|
||||
this.fetchStub.restore();
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
// This file exists to provide wrappers around ember-qunit's
|
||||
// test setup functions. This way, you can easily extend the setup that is
|
||||
@@ -12,6 +98,7 @@ import { setupNostrMocks } from './mock-nostr';
|
||||
function setupApplicationTest(hooks, options) {
|
||||
upstreamSetupApplicationTest(hooks, options);
|
||||
setupNostrMocks(hooks);
|
||||
setupMapStyleMocks(hooks);
|
||||
|
||||
// Additional setup for application tests can be done here.
|
||||
//
|
||||
|
||||
@@ -49,11 +49,19 @@ export class MockNostrDataService extends Service {
|
||||
return [];
|
||||
}
|
||||
|
||||
get defaultReadRelays() {
|
||||
get requiredReadRelays() {
|
||||
return [];
|
||||
}
|
||||
|
||||
get defaultWriteRelays() {
|
||||
get requiredWriteRelays() {
|
||||
return [];
|
||||
}
|
||||
|
||||
get mailboxReadRelays() {
|
||||
return [];
|
||||
}
|
||||
|
||||
get mailboxWriteRelays() {
|
||||
return [];
|
||||
}
|
||||
|
||||
|
||||
@@ -0,0 +1,188 @@
|
||||
import { module, test } from 'qunit';
|
||||
import { setupRenderingTest } from 'marco/tests/helpers';
|
||||
import { click, fillIn, render } from '@ember/test-helpers';
|
||||
import Service, { service } from '@ember/service';
|
||||
import AppMenuSettingsNostr from 'marco/components/app-menu/settings/nostr';
|
||||
import {
|
||||
excludeRequiredRelays,
|
||||
mergeRequiredRelays,
|
||||
uniqNormalizedRelays,
|
||||
} from 'marco/utils/nostr';
|
||||
|
||||
class MockNostrDataService extends Service {
|
||||
@service settings;
|
||||
|
||||
requiredReadRelays = ['wss://nostr.kosmos.org'];
|
||||
requiredWriteRelays = [];
|
||||
|
||||
mailboxReadRelays = ['wss://mailbox.example.com'];
|
||||
mailboxWriteRelays = ['wss://mailbox-write.example.com'];
|
||||
|
||||
get configuredReadRelays() {
|
||||
const configured = uniqNormalizedRelays([
|
||||
...this.mailboxReadRelays,
|
||||
...(this.settings.nostrReadRelays || []),
|
||||
]);
|
||||
|
||||
return excludeRequiredRelays(
|
||||
configured,
|
||||
this.settings.nostrReadRelayExclusions || []
|
||||
);
|
||||
}
|
||||
|
||||
get configuredWriteRelays() {
|
||||
const configured = uniqNormalizedRelays([
|
||||
...this.mailboxWriteRelays,
|
||||
...(this.settings.nostrWriteRelays || []),
|
||||
]);
|
||||
|
||||
return excludeRequiredRelays(
|
||||
configured,
|
||||
this.settings.nostrWriteRelayExclusions || []
|
||||
);
|
||||
}
|
||||
|
||||
get activeReadRelays() {
|
||||
return mergeRequiredRelays(
|
||||
this.requiredReadRelays,
|
||||
this.configuredReadRelays
|
||||
);
|
||||
}
|
||||
|
||||
get activeWriteRelays() {
|
||||
return mergeRequiredRelays(
|
||||
this.requiredWriteRelays,
|
||||
this.configuredWriteRelays
|
||||
);
|
||||
}
|
||||
|
||||
async clearCache() {}
|
||||
}
|
||||
|
||||
function readRows(element) {
|
||||
const list = element.querySelectorAll('.relay-list')[0];
|
||||
return [...list.querySelectorAll('li')];
|
||||
}
|
||||
|
||||
function writeRows(element) {
|
||||
const list = element.querySelectorAll('.relay-list')[1];
|
||||
return [...list.querySelectorAll('li')];
|
||||
}
|
||||
|
||||
function rowByText(rows, text) {
|
||||
return rows.find((row) => row.textContent.includes(text));
|
||||
}
|
||||
|
||||
module('Integration | Component | app-menu/settings/nostr', function (hooks) {
|
||||
setupRenderingTest(hooks);
|
||||
|
||||
hooks.beforeEach(function () {
|
||||
localStorage.removeItem('marco:settings');
|
||||
|
||||
this.owner.register('service:nostrData', MockNostrDataService);
|
||||
this.settings = this.owner.lookup('service:settings');
|
||||
this.onChange = () => {};
|
||||
});
|
||||
|
||||
hooks.afterEach(function () {
|
||||
localStorage.removeItem('marco:settings');
|
||||
});
|
||||
|
||||
async function renderAndOpenDetails(context) {
|
||||
await render(
|
||||
<template><AppMenuSettingsNostr @onChange={{this.onChange}} /></template>
|
||||
);
|
||||
await click('summary');
|
||||
return context.element;
|
||||
}
|
||||
|
||||
test('required read relay is first and non-removable', async function (assert) {
|
||||
const element = await renderAndOpenDetails(this);
|
||||
const rows = readRows(element);
|
||||
|
||||
assert.dom(rows[0]).includesText('nostr.kosmos.org');
|
||||
|
||||
const requiredRow = rowByText(rows, 'nostr.kosmos.org');
|
||||
const mailboxRow = rowByText(rows, 'mailbox.example.com');
|
||||
|
||||
assert.dom(requiredRow.querySelector('.btn-remove-relay')).doesNotExist();
|
||||
assert.dom(mailboxRow.querySelector('.btn-remove-relay')).exists();
|
||||
});
|
||||
|
||||
test('removing mailbox read relay stores exclusion override', async function (assert) {
|
||||
const element = await renderAndOpenDetails(this);
|
||||
const mailboxRow = rowByText(readRows(element), 'mailbox.example.com');
|
||||
|
||||
await click(mailboxRow.querySelector('.btn-remove-relay'));
|
||||
|
||||
assert.deepEqual(this.settings.nostrReadRelayExclusions, [
|
||||
'wss://mailbox.example.com',
|
||||
]);
|
||||
assert.strictEqual(this.settings.nostrReadRelays, null);
|
||||
});
|
||||
|
||||
test('removing custom read relay updates custom list without exclusions', async function (assert) {
|
||||
this.settings.update('nostrReadRelays', ['wss://custom.example.com']);
|
||||
|
||||
const element = await renderAndOpenDetails(this);
|
||||
const customRow = rowByText(readRows(element), 'custom.example.com');
|
||||
|
||||
await click(customRow.querySelector('.btn-remove-relay'));
|
||||
|
||||
assert.strictEqual(this.settings.nostrReadRelays, null);
|
||||
assert.strictEqual(this.settings.nostrReadRelayExclusions, null);
|
||||
});
|
||||
|
||||
test('adding read relay clears existing exclusion for same relay', async function (assert) {
|
||||
this.settings.update('nostrReadRelayExclusions', [
|
||||
'wss://mailbox.example.com',
|
||||
]);
|
||||
|
||||
const element = await renderAndOpenDetails(this);
|
||||
|
||||
await fillIn('#new-read-relay', 'Mailbox.EXAMPLE.com/');
|
||||
await click(element.querySelector('#new-read-relay').nextElementSibling);
|
||||
|
||||
assert.deepEqual(this.settings.nostrReadRelays, [
|
||||
'wss://mailbox.example.com',
|
||||
]);
|
||||
assert.strictEqual(this.settings.nostrReadRelayExclusions, null);
|
||||
});
|
||||
|
||||
test('reset read relays clears additions and exclusions', async function (assert) {
|
||||
this.settings.update('nostrReadRelays', ['wss://custom.example.com']);
|
||||
this.settings.update('nostrReadRelayExclusions', [
|
||||
'wss://mailbox.example.com',
|
||||
]);
|
||||
|
||||
const element = await renderAndOpenDetails(this);
|
||||
await click(element.querySelectorAll('.reset-relays')[0]);
|
||||
|
||||
assert.strictEqual(this.settings.nostrReadRelays, null);
|
||||
assert.strictEqual(this.settings.nostrReadRelayExclusions, null);
|
||||
|
||||
const requiredRow = rowByText(readRows(element), 'nostr.kosmos.org');
|
||||
assert.dom(requiredRow).exists();
|
||||
});
|
||||
|
||||
test('write relays are removable and mailbox delete stores exclusion', async function (assert) {
|
||||
this.settings.update('nostrWriteRelays', [
|
||||
'wss://custom-write.example.com',
|
||||
]);
|
||||
|
||||
const element = await renderAndOpenDetails(this);
|
||||
const rows = writeRows(element);
|
||||
|
||||
assert.true(
|
||||
rows.every((row) => row.querySelector('.btn-remove-relay')),
|
||||
'all write relays can be removed'
|
||||
);
|
||||
|
||||
const mailboxRow = rowByText(rows, 'mailbox-write.example.com');
|
||||
await click(mailboxRow.querySelector('.btn-remove-relay'));
|
||||
|
||||
assert.deepEqual(this.settings.nostrWriteRelayExclusions, [
|
||||
'wss://mailbox-write.example.com',
|
||||
]);
|
||||
});
|
||||
});
|
||||
@@ -334,4 +334,54 @@ module('Integration | Component | place-details', function (hooks) {
|
||||
assert.dom(links[0]).hasText('+44 987 654 321');
|
||||
assert.dom(links[1]).hasText('+1 234-567 8900');
|
||||
});
|
||||
|
||||
test('it renders correct OpenStreetMap link for an OSM place', async function (assert) {
|
||||
const place = {
|
||||
title: 'OSM Place',
|
||||
osmId: '12345',
|
||||
osmType: 'node',
|
||||
lat: 52.520008,
|
||||
lon: 13.404954,
|
||||
};
|
||||
|
||||
await render(<template><PlaceDetails @place={{place}} /></template>);
|
||||
|
||||
const osmLink = this.element.querySelector(
|
||||
'.meta-info a[href^="https://www.openstreetmap.org/node/12345"]'
|
||||
);
|
||||
assert.ok(osmLink, 'OpenStreetMap link is rendered');
|
||||
assert.strictEqual(
|
||||
osmLink.getAttribute('href'),
|
||||
'https://www.openstreetmap.org/node/12345'
|
||||
);
|
||||
|
||||
assert.dom('button.btn-link').hasText('Add a photo');
|
||||
});
|
||||
|
||||
test('it renders correct search-based OpenStreetMap link for a custom saved place', async function (assert) {
|
||||
class MockMapUi extends Service {
|
||||
currentCenter = { lat: 52.5, lon: 13.4 };
|
||||
currentZoom = 15.6;
|
||||
}
|
||||
this.owner.register('service:map-ui', MockMapUi);
|
||||
|
||||
const place = {
|
||||
title: 'Custom Place',
|
||||
lat: 52.520008,
|
||||
lon: 13.404954,
|
||||
};
|
||||
|
||||
await render(<template><PlaceDetails @place={{place}} /></template>);
|
||||
|
||||
const osmLink = this.element.querySelector(
|
||||
'.meta-info a[href^="https://www.openstreetmap.org/search"]'
|
||||
);
|
||||
assert.ok(osmLink, 'OpenStreetMap search link is rendered');
|
||||
assert.strictEqual(
|
||||
osmLink.getAttribute('href'),
|
||||
'https://www.openstreetmap.org/search?lat=52.520008&lon=13.404954&zoom=16#map=16/52.50000/13.40000'
|
||||
);
|
||||
|
||||
assert.dom('button.btn-link').doesNotExist();
|
||||
});
|
||||
});
|
||||
|
||||
@@ -1,5 +1,11 @@
|
||||
import { module, test } from 'qunit';
|
||||
import { normalizeRelayUrl, parsePlacePhotos } from 'marco/utils/nostr';
|
||||
import {
|
||||
excludeRequiredRelays,
|
||||
mergeRequiredRelays,
|
||||
normalizeRelayUrl,
|
||||
parsePlacePhotos,
|
||||
uniqNormalizedRelays,
|
||||
} from 'marco/utils/nostr';
|
||||
|
||||
module('Unit | Utility | nostr', function () {
|
||||
test('normalizeRelayUrl normalizes protocol, case, and slashes', function (assert) {
|
||||
@@ -141,4 +147,59 @@ module('Unit | Utility | nostr', function () {
|
||||
assert.strictEqual(photos[0].placeIdentifier, 'osm:node:123');
|
||||
assert.strictEqual(photos[1].placeIdentifier, 'osm:node:456');
|
||||
});
|
||||
|
||||
test('uniqNormalizedRelays returns normalized unique relays', function (assert) {
|
||||
const relays = uniqNormalizedRelays([
|
||||
'Relay.example.com',
|
||||
'wss://relay.example.com/',
|
||||
'wss://other.example.com',
|
||||
]);
|
||||
|
||||
assert.deepEqual(relays, [
|
||||
'wss://relay.example.com',
|
||||
'wss://other.example.com',
|
||||
]);
|
||||
});
|
||||
|
||||
test('mergeRequiredRelays keeps required relays as-is and merges normalized custom relays', function (assert) {
|
||||
const relays = mergeRequiredRelays(
|
||||
['wss://required.example.com', 'required-2.example.com'],
|
||||
['required-2.example.com/', 'wss://custom.example.com']
|
||||
);
|
||||
|
||||
assert.deepEqual(relays, [
|
||||
'wss://required.example.com',
|
||||
'required-2.example.com',
|
||||
'wss://required-2.example.com',
|
||||
'wss://custom.example.com',
|
||||
]);
|
||||
});
|
||||
|
||||
test('excludeRequiredRelays removes required relays from normalized custom list', function (assert) {
|
||||
const relays = excludeRequiredRelays(
|
||||
[
|
||||
'wss://required.example.com',
|
||||
'custom.example.com',
|
||||
'ws://custom2.example.com',
|
||||
],
|
||||
['wss://required.example.com']
|
||||
);
|
||||
|
||||
assert.deepEqual(relays, [
|
||||
'wss://custom.example.com',
|
||||
'ws://custom2.example.com',
|
||||
]);
|
||||
});
|
||||
|
||||
test('excludeRequiredRelays trusts required list without normalizing it', function (assert) {
|
||||
const relays = excludeRequiredRelays(
|
||||
['Required.example.com', 'custom.example.com'],
|
||||
['required.example.com']
|
||||
);
|
||||
|
||||
assert.deepEqual(relays, [
|
||||
'wss://required.example.com',
|
||||
'wss://custom.example.com',
|
||||
]);
|
||||
});
|
||||
});
|
||||
|
||||
@@ -1,4 +1,5 @@
|
||||
import { getIconNameForTags } from 'marco/utils/osm-icons';
|
||||
import { getIconNameForTags, POI_ICON_RULES } from 'marco/utils/osm-icons';
|
||||
import { getIcon } from 'marco/utils/icons';
|
||||
import { module, test } from 'qunit';
|
||||
|
||||
module('Unit | Utility | osm-icons', function () {
|
||||
@@ -36,4 +37,14 @@ module('Unit | Utility | osm-icons', function () {
|
||||
let result = getIconNameForTags({ foo: 'bar' });
|
||||
assert.strictEqual(result, null);
|
||||
});
|
||||
|
||||
test('all icons used in POI_ICON_RULES exist in the icons utility', function (assert) {
|
||||
for (let rule of POI_ICON_RULES) {
|
||||
let icon = getIcon(rule.icon);
|
||||
assert.ok(
|
||||
icon,
|
||||
`Icon "${rule.icon}" specified in POI_ICON_RULES should be imported and available in getIcon`
|
||||
);
|
||||
}
|
||||
});
|
||||
});
|
||||
|
||||
@@ -89,6 +89,12 @@ module('Unit | Utility | osm', function (hooks) {
|
||||
assert.strictEqual(result, 'Building');
|
||||
});
|
||||
|
||||
test('getPlaceType ignores generic "yes" values if a more specific tag is present', function (assert) {
|
||||
const tags = { historic: 'yes', building: 'tower' };
|
||||
const result = getPlaceType(tags);
|
||||
assert.strictEqual(result, 'Tower');
|
||||
});
|
||||
|
||||
test('getPlaceType prioritizes order (amenity > shop > building)', function (assert) {
|
||||
// If something is both a shop and a building, it should be a shop
|
||||
const tags = { building: 'yes', shop: 'supermarket' };
|
||||
|
||||
Reference in New Issue
Block a user