diff --git a/app/components/icon.gjs b/app/components/icon.gjs
index 6b5c90f..22175f0 100644
--- a/app/components/icon.gjs
+++ b/app/components/icon.gjs
@@ -1,65 +1,10 @@
import Component from '@glimmer/component';
import { htmlSafe } from '@ember/template';
-
-import arrowLeft from 'feather-icons/dist/icons/arrow-left.svg?raw';
-import activity from 'feather-icons/dist/icons/activity.svg?raw';
-import bookmark from 'feather-icons/dist/icons/bookmark.svg?raw';
-import clock from 'feather-icons/dist/icons/clock.svg?raw';
-import edit from 'feather-icons/dist/icons/edit.svg?raw';
-import facebook from 'feather-icons/dist/icons/facebook.svg?raw';
-import globe from 'feather-icons/dist/icons/globe.svg?raw';
-import home from 'feather-icons/dist/icons/home.svg?raw';
-import instagram from 'feather-icons/dist/icons/instagram.svg?raw';
-import logIn from 'feather-icons/dist/icons/log-in.svg?raw';
-import logOut from 'feather-icons/dist/icons/log-out.svg?raw';
-import mail from 'feather-icons/dist/icons/mail.svg?raw';
-import map from 'feather-icons/dist/icons/map.svg?raw';
-import mapPin from 'feather-icons/dist/icons/map-pin.svg?raw';
-import menu from 'feather-icons/dist/icons/menu.svg?raw';
-import navigation from 'feather-icons/dist/icons/navigation.svg?raw';
-import phone from 'feather-icons/dist/icons/phone.svg?raw';
-import plus from 'feather-icons/dist/icons/plus.svg?raw';
-import server from 'feather-icons/dist/icons/server.svg?raw';
-import search from 'feather-icons/dist/icons/search.svg?raw';
-import settings from 'feather-icons/dist/icons/settings.svg?raw';
-import target from 'feather-icons/dist/icons/target.svg?raw';
-import user from 'feather-icons/dist/icons/user.svg?raw';
-import x from 'feather-icons/dist/icons/x.svg?raw';
-import zap from 'feather-icons/dist/icons/zap.svg?raw';
-import wikipedia from '../icons/wikipedia.svg?raw';
-
-const ICONS = {
- 'arrow-left': arrowLeft,
- activity,
- bookmark,
- clock,
- edit,
- facebook,
- globe,
- home,
- instagram,
- 'log-in': logIn,
- 'log-out': logOut,
- mail,
- map,
- 'map-pin': mapPin,
- menu,
- navigation,
- phone,
- plus,
- server,
- search,
- settings,
- target,
- user,
- wikipedia,
- x,
- zap,
-};
+import { getIcon } from '../utils/icons';
export default class IconComponent extends Component {
get svg() {
- return ICONS[this.args.name];
+ return getIcon(this.args.name);
}
get size() {
diff --git a/app/components/map.gjs b/app/components/map.gjs
index 41bd482..e434fc6 100644
--- a/app/components/map.gjs
+++ b/app/components/map.gjs
@@ -60,9 +60,30 @@ export default class MapComponent extends Component {
// Create a vector source and layer for bookmarks
this.bookmarkSource = new VectorSource();
- const bookmarkLayer = new VectorLayer({
- source: this.bookmarkSource,
- style: [
+
+ const bookmarkStyleFunction = (feature) => {
+ const originalPlace = feature.get('originalPlace');
+ let color =
+ getComputedStyle(document.documentElement)
+ .getPropertyValue('--default-list-color')
+ .trim() || '#000000'; // Fallback to black if variable is missing to make error obvious
+
+ if (
+ originalPlace &&
+ originalPlace._listIds &&
+ originalPlace._listIds.length > 0
+ ) {
+ // Find the first list color
+ // We need access to storage.lists.
+ // Since this is inside setupMap, 'this' refers to the component instance.
+ const firstListId = originalPlace._listIds[0];
+ const list = this.storage.lists.find((l) => l.id === firstListId);
+ if (list && list.color) {
+ color = list.color;
+ }
+ }
+
+ return [
new Style({
image: new Circle({
radius: 10,
@@ -73,14 +94,19 @@ export default class MapComponent extends Component {
new Style({
image: new Circle({
radius: 9,
- fill: new Fill({ color: '#ffcc33' }), // Gold/Yellow
+ fill: new Fill({ color: color }),
stroke: new Stroke({
color: '#fff',
width: 2,
}),
}),
}),
- ],
+ ];
+ };
+
+ const bookmarkLayer = new VectorLayer({
+ source: this.bookmarkSource,
+ style: bookmarkStyleFunction,
zIndex: 10, // Ensure it sits above the map tiles
});
diff --git a/app/components/place-details.gjs b/app/components/place-details.gjs
index db23a2f..732b7b2 100644
--- a/app/components/place-details.gjs
+++ b/app/components/place-details.gjs
@@ -1,23 +1,39 @@
import Component from '@glimmer/component';
-import { fn } from '@ember/helper';
+import { service } from '@ember/service';
import { on } from '@ember/modifier';
import { htmlSafe } from '@ember/template';
import { humanizeOsmTag } from '../utils/format-text';
import { getLocalizedName, getPlaceType } from '../utils/osm';
+import { mapToStorageSchema } from '../utils/place-mapping';
import { getSocialInfo } from '../utils/social-links';
import Icon from '../components/icon';
import PlaceEditForm from './place-edit-form';
+import PlaceListsManager from './place-lists-manager';
import { tracked } from '@glimmer/tracking';
import { action } from '@ember/object';
export default class PlaceDetails extends Component {
+ @service storage;
@tracked isEditing = false;
+ @tracked showLists = false;
+
+ get isSaved() {
+ return this.storage.isPlaceSaved(this.place.id || this.place.osmId);
+ }
get place() {
return this.args.place || {};
}
+ get saveablePlace() {
+ if (this.place.createdAt) {
+ return this.place;
+ }
+
+ return mapToStorageSchema(this.place);
+ }
+
get tags() {
return this.place.osmTags || {};
}
@@ -28,7 +44,7 @@ export default class PlaceDetails extends Component {
@action
startEditing() {
- if (!this.place.createdAt) return; // Only allow editing saved places
+ if (!this.isSaved) return; // Only allow editing saved places
this.isEditing = true;
}
@@ -37,6 +53,21 @@ export default class PlaceDetails extends Component {
this.isEditing = false;
}
+ @action
+ toggleLists(event) {
+ // Prevent this click from propagating to the document listener
+ // which handles the "click outside" logic.
+ if (event) {
+ event.stopPropagation();
+ }
+ this.showLists = !this.showLists;
+ }
+
+ @action
+ closeLists() {
+ this.showLists = false;
+ }
+
@action
async saveChanges(changes) {
if (this.args.onSave) {
@@ -247,23 +278,29 @@ export default class PlaceDetails extends Component {
{{/if}}
-
+
+
+ {{#if this.isSaved}}