1.20.5

This should re-establish relay connections when PWAs are being woken up
after background sleep

app/components/modal.gjs

@@ -11,6 +11,7 @@ export default class Modal extends Component {
 
   @action
   close() {
+    if (this.args.disableClose) return;
     if (this.args.onClose) {
       this.args.onClose();
     }
@@ -31,10 +32,11 @@ export default class Modal extends Component {
       >
         <button
           type="button"
-          class="close-modal-btn btn-text"
+          class="close-modal-btn btn-text {{if @disableClose 'disabled'}}"
+          disabled={{@disableClose}}
           {{on "click" this.close}}
         >
-          <Icon @name="x" @size={{24}} />
+          <Icon @name="x" @size={{24}} @color="currentColor" />
         </button>
         {{yield}}
       </div>

app/components/place-details.gjs

@@ -27,6 +27,12 @@ export default class PlaceDetails extends Component {
   @tracked isPhotoUploadModalOpen = false;
   @tracked isNostrConnectModalOpen = false;
   @tracked newlyUploadedPhotoId = null;
+  @tracked isPhotoUploadActive = false;
+
+  @action
+  handleUploadStateChange(isActive) {
+    this.isPhotoUploadActive = isActive;
+  }
 
   @action
   openPhotoUploadModal(e) {
@@ -42,6 +48,7 @@ export default class PlaceDetails extends Component {
 
   @action
   closePhotoUploadModal(eventId) {
+    if (this.isPhotoUploadActive) return;
     this.isPhotoUploadModalOpen = false;
     if (typeof eventId === 'string') {
       this.newlyUploadedPhotoId = eventId;
@@ -569,7 +576,7 @@ export default class PlaceDetails extends Component {
       {{#if this.osmUrl}}
         <div class="meta-info">
           <p class="content-with-icon">
-            <Icon @name="camera" />
+            <Icon @name="feather-camera" />
             <span>
               <button
                 type="button"
@@ -585,10 +592,14 @@ export default class PlaceDetails extends Component {
     </div>
 
     {{#if this.isPhotoUploadModalOpen}}
-      <Modal @onClose={{this.closePhotoUploadModal}}>
+      <Modal
+        @onClose={{this.closePhotoUploadModal}}
+        @disableClose={{this.isPhotoUploadActive}}
+      >
         <PlacePhotoUpload
           @place={{this.saveablePlace}}
           @onClose={{this.closePhotoUploadModal}}
+          @onUploadStateChange={{this.handleUploadStateChange}}
         />
       </Modal>
     {{/if}}

app/components/place-photo-upload-item.gjs

@@ -10,7 +10,7 @@ import { isMobile } from '../utils/device';
 import Blurhash from './blurhash';
 
 const MAX_IMAGE_DIMENSION = 1920;
-const IMAGE_QUALITY = 0.94;
+const IMAGE_QUALITY = 0.9;
 const MAX_THUMBNAIL_DIMENSION = 350;
 const THUMBNAIL_QUALITY = 0.9;
 
@@ -22,6 +22,7 @@ export default class PlacePhotoUploadItem extends Component {
   @tracked thumbnailUrl = '';
   @tracked blurhash = '';
   @tracked error = '';
+  @tracked statusText = '';
 
   constructor() {
     super(...arguments);
@@ -47,6 +48,7 @@ export default class PlacePhotoUploadItem extends Component {
 
   uploadTask = task(async (file) => {
     this.error = '';
+    this.statusText = 'Processing';
     try {
       // 1. Process main image and generate blurhash in worker
       const mainData = await this.imageProcessor.process(
@@ -71,18 +73,34 @@ export default class PlacePhotoUploadItem extends Component {
       let mainResult, thumbResult;
       const isMobileDevice = isMobile();
 
+      const mainProgress = (status) => {
+        if (status === 'signing') this.statusText = 'Signing photo upload';
+        if (status === 'uploading') this.statusText = 'Uploading photo';
+      };
+
+      const thumbProgress = (status) => {
+        if (status === 'signing') this.statusText = 'Signing thumbnail upload';
+        if (status === 'uploading') this.statusText = 'Uploading thumbnail';
+      };
+
       if (isMobileDevice) {
         // Mobile: sequential uploads to preserve bandwidth and memory
         mainResult = await this.blossom.upload(mainData.blob, {
           sequential: true,
+          onProgress: mainProgress,
         });
         thumbResult = await this.blossom.upload(thumbData.blob, {
           sequential: true,
+          onProgress: thumbProgress,
         });
       } else {
         // Desktop: concurrent uploads
-        const mainUploadPromise = this.blossom.upload(mainData.blob);
-        const thumbUploadPromise = this.blossom.upload(thumbData.blob);
+        const mainUploadPromise = this.blossom.upload(mainData.blob, {
+          onProgress: mainProgress,
+        });
+        const thumbUploadPromise = this.blossom.upload(thumbData.blob, {
+          onProgress: thumbProgress,
+        });
 
         [mainResult, thumbResult] = await Promise.all([
           mainUploadPromise,
@@ -127,6 +145,9 @@ export default class PlacePhotoUploadItem extends Component {
             @color="white"
             class="spin-animation"
           />
+          {{#if this.statusText}}
+            <span class="upload-status-text">{{this.statusText}}</span>
+          {{/if}}
         </div>
       {{/if}}
 

app/components/place-photo-upload.gjs

@@ -19,7 +19,6 @@ export default class PlacePhotoUpload extends Component {
 
   @tracked file = null;
   @tracked uploadedPhoto = null;
-  @tracked status = '';
   @tracked error = '';
   @tracked isPublishing = false;
   @tracked isDragging = false;
@@ -77,6 +76,9 @@ export default class PlacePhotoUpload extends Component {
     }
     this.file = file;
     this.uploadedPhoto = null;
+    if (this.args.onUploadStateChange) {
+      this.args.onUploadStateChange(true);
+    }
   }
 
   @action
@@ -91,6 +93,9 @@ export default class PlacePhotoUpload extends Component {
     }
     this.file = null;
     this.uploadedPhoto = null;
+    if (this.args.onUploadStateChange) {
+      this.args.onUploadStateChange(false);
+    }
   }
 
   deletePhotoTask = task(async (photoData) => {
@@ -126,7 +131,6 @@ export default class PlacePhotoUpload extends Component {
       return;
     }
 
-    this.status = 'Publishing event...';
     this.error = '';
     this.isPublishing = true;
 
@@ -185,18 +189,20 @@ export default class PlacePhotoUpload extends Component {
       this.nostrData.store.add(event);
 
       this.toast.show('Photo published successfully');
-      this.status = '';
 
       // Clear out the file so user can upload more or be done
       this.file = null;
       this.uploadedPhoto = null;
 
+      if (this.args.onUploadStateChange) {
+        this.args.onUploadStateChange(false);
+      }
+
       if (this.args.onClose) {
         this.args.onClose(event.id);
       }
     } catch (e) {
       this.error = 'Failed to publish: ' + e.message;
-      this.status = '';
     } finally {
       this.isPublishing = false;
     }
@@ -212,12 +218,6 @@ export default class PlacePhotoUpload extends Component {
         </div>
       {{/if}}
 
-      {{#if this.status}}
-        <div class="alert alert-info">
-          {{this.status}}
-        </div>
-      {{/if}}
-
       {{#if this.file}}
         <div class="photo-grid">
           <PlacePhotoUploadItem

app/components/place-photos-carousel.gjs

@@ -116,7 +116,8 @@ export default class PlacePhotosCarousel extends Component {
           {{#each this.photos as |photo|}}
             {{! template-lint-disable no-inline-styles }}
             <div
-              class="carousel-slide"
+              class="carousel-slide
+                {{if photo.isLandscape 'landscape' 'portrait'}}"
               style={{photo.style}}
               data-event-id={{photo.eventId}}
             >

app/services/blossom.js

@@ -60,10 +60,13 @@ export default class BlossomService extends Service {
     return `Nostr ${base64url}`;
   }
 
-  async _uploadToServer(file, hash, serverUrl) {
+  async _uploadToServer(file, hash, serverUrl, onProgress) {
     const uploadUrl = getBlossomUrl(serverUrl, 'upload');
+
+    if (onProgress) onProgress('signing');
     const authHeader = await this._getAuthHeader('upload', hash, serverUrl);
 
+    if (onProgress) onProgress('uploading');
     // eslint-disable-next-line warp-drive/no-external-request-patterns
     const response = await fetch(uploadUrl, {
       method: 'PUT',
@@ -109,14 +112,20 @@ export default class BlossomService extends Service {
 
     if (options.sequential) {
       // Sequential upload logic
-      mainResult = await this._uploadToServer(file, payloadHash, mainServer);
+      mainResult = await this._uploadToServer(
+        file,
+        payloadHash,
+        mainServer,
+        options.onProgress
+      );
 
       for (const serverUrl of fallbackServers) {
         try {
           const result = await this._uploadToServer(
             file,
             payloadHash,
-            serverUrl
+            serverUrl,
+            options.onProgress
           );
           fallbackUrls.push(result.url);
         } catch (error) {
@@ -125,9 +134,14 @@ export default class BlossomService extends Service {
       }
     } else {
       // Concurrent upload logic
-      const mainPromise = this._uploadToServer(file, payloadHash, mainServer);
+      const mainPromise = this._uploadToServer(
+        file,
+        payloadHash,
+        mainServer,
+        options.onProgress
+      );
       const fallbackPromises = fallbackServers.map((serverUrl) =>
-        this._uploadToServer(file, payloadHash, serverUrl)
+        this._uploadToServer(file, payloadHash, serverUrl, options.onProgress)
       );
 
       // Main server MUST succeed

app/services/nostr-relay.js

@@ -2,7 +2,7 @@ import Service from '@ember/service';
 import { RelayPool } from 'applesauce-relay';
 
 export default class NostrRelayService extends Service {
-  pool = new RelayPool();
+  pool = new RelayPool({ enablePing: true });
 
   async publish(relays, event) {
     if (!relays || relays.length === 0) {

app/styles/app.css

@@ -285,10 +285,20 @@ body {
   inset: 0;
   background: rgb(0 0 0 / 60%);
   display: flex;
+  flex-direction: column;
   align-items: center;
   justify-content: center;
 }
 
+.upload-status-text {
+  color: white;
+  margin-top: 1rem;
+  font-size: 0.9rem;
+  text-shadow: 0 1px 3px rgb(0 0 0 / 80%);
+  text-align: center;
+  padding: 0 1rem;
+}
+
 .photo-upload-item .error-overlay {
   background: rgb(224 108 117 / 80%);
   cursor: pointer;
@@ -1006,10 +1016,17 @@ abbr[title] {
     flex: 0 0 auto;
     height: 100px;
     width: auto;
-    aspect-ratio: var(--slide-ratio, 16 / 9);
     scroll-snap-align: none;
   }
 
+  .carousel-slide.landscape {
+    aspect-ratio: var(--slide-ratio, 16 / 9);
+  }
+
+  .carousel-slide.portrait {
+    aspect-ratio: 1 / 1;
+  }
+
   .carousel-placeholder {
     display: block;
     background-color: var(--hover-bg);
@@ -1798,6 +1815,12 @@ button.create-place {
   top: 1rem;
   right: 1rem;
   cursor: pointer;
+  color: #898989;
+}
+
+.close-modal-btn.disabled {
+  color: #ccc;
+  cursor: not-allowed;
 }
 
 .place-photo-upload h2 {
@@ -1816,11 +1839,6 @@ button.create-place {
   color: #c00;
 }
 
-.alert-info {
-  background: #eef;
-  color: #00c;
-}
-
 .preview-group {
   margin-bottom: 1rem;
 }

app/utils/icons.js

@@ -2,7 +2,7 @@
 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';
-import camera from 'feather-icons/dist/icons/camera.svg?raw';
+import featherCamera from 'feather-icons/dist/icons/camera.svg?raw';
 import checkSquare from 'feather-icons/dist/icons/check-square.svg?raw';
 import chevronLeft from 'feather-icons/dist/icons/chevron-left.svg?raw';
 import chevronRight from 'feather-icons/dist/icons/chevron-right.svg?raw';
@@ -45,7 +45,9 @@ import badgeShieldWithFire from '@waysidemapping/pinhead/dist/icons/badge_shield
 import beachUmbrellaInGround from '@waysidemapping/pinhead/dist/icons/beach_umbrella_in_ground.svg?raw';
 import beerMugWithFoam from '@waysidemapping/pinhead/dist/icons/beer_mug_with_foam.svg?raw';
 import burgerAndDrinkCupWithStraw from '@waysidemapping/pinhead/dist/icons/burger_and_drink_cup_with_straw.svg?raw';
+import bridge from '@waysidemapping/pinhead/dist/icons/bridge.svg?raw';
 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 cigaretteWithSmokeCurl from '@waysidemapping/pinhead/dist/icons/cigarette_with_smoke_curl.svg?raw';
@@ -76,6 +78,7 @@ import gravestone from '@waysidemapping/pinhead/dist/icons/gravestone.svg?raw';
 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 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';
@@ -103,6 +106,7 @@ import roundStructureWithFlag from '@waysidemapping/pinhead/dist/icons/round_str
 import sailingShipInWater from '@waysidemapping/pinhead/dist/icons/sailing_ship_in_water.svg?raw';
 import scissorsOpen from '@waysidemapping/pinhead/dist/icons/scissors_open.svg?raw';
 import shipwreckInWater from '@waysidemapping/pinhead/dist/icons/shipwreck_in_water.svg?raw';
+import steamTrainOnRailwayTrack from '@waysidemapping/pinhead/dist/icons/steam_train_on_railway_track.svg?raw';
 import shoppingBag from '@waysidemapping/pinhead/dist/icons/shopping_bag.svg?raw';
 import shoppingBasket from '@waysidemapping/pinhead/dist/icons/shopping_basket.svg?raw';
 import shoppingCart from '@waysidemapping/pinhead/dist/icons/shopping_cart.svg?raw';
@@ -132,8 +136,10 @@ const ICONS = {
   bookmark,
   'boxing-glove-up': boxingGloveUp,
   'burger-and-drink-cup-with-straw': burgerAndDrinkCupWithStraw,
+  bridge,
   bus,
   camera,
+  'feather-camera': featherCamera,
   'check-square': checkSquare,
   'chevron-left': chevronLeft,
   'chevron-right': chevronRight,
@@ -176,6 +182,7 @@ const ICONS = {
   heart,
   home,
   'ice-cream-on-cone': iceCreamOnCone,
+  'industrial-building': industrialBuilding,
   info,
   instagram,
   jewel,
@@ -216,6 +223,7 @@ const ICONS = {
   'sailing-ship-in-water': sailingShipInWater,
   'scissors-open': scissorsOpen,
   'shipwreck-in-water': shipwreckInWater,
+  'steam-train-on-railway-track': steamTrainOnRailwayTrack,
   'shopping-bag': shoppingBag,
   search,
   server,

app/utils/osm-icons.js

@@ -109,6 +109,7 @@ export const POI_ICON_RULES = [
   { tags: { amenity: 'arts_center' }, icon: 'comedy-mask-and-tragedy-mask' },
 
   // Historic
+  { tags: { historic: 'bridge' }, icon: 'bridge' },
   { tags: { historic: 'fort' }, icon: 'fort' },
   { tags: { historic: 'castle' }, icon: 'palace' },
   { tags: { historic: 'building' }, icon: 'classical-building-with-flag' },
@@ -119,6 +120,12 @@ export const POI_ICON_RULES = [
     tags: { historic: 'monument' },
     icon: 'classical-building-with-dome-and-flag',
   },
+  { tags: { historic: 'folly' }, icon: 'classical-building' },
+  { tags: { historic: 'industrial' }, icon: 'industrial-building' },
+  {
+    tags: { historic: 'railway_station' },
+    icon: 'steam-train-on-railway-track',
+  },
   { tags: { historic: 'ship' }, icon: 'sailing-ship-in-water' },
   { tags: { historic: 'wreck' }, icon: 'shipwreck-in-water' },
   { tags: { historic: 'ruins' }, icon: 'camera' },

app/utils/poi-categories.js

@@ -41,7 +41,7 @@ export const POI_CATEGORIES = [
   {
     id: 'things-to-do',
     label: 'Things to do',
-    icon: 'camera',
+    icon: 'feather-camera',
     filter: [
       '["tourism"~"^(museum|gallery|attraction|viewpoint|zoo|theme_park|aquarium|artwork)$"]',
       '["amenity"~"^(cinema|theatre|arts_centre|planetarium)$"]',

package.json

@@ -1,6 +1,6 @@
 {
   "name": "marco",
-  "version": "1.20.1",
+  "version": "1.20.5",
   "private": true,
   "description": "Unhosted maps app",
   "repository": {

release/index.html

@@ -39,8 +39,8 @@
     <meta name="msapplication-TileColor" content="#F6E9A6">
     <meta name="msapplication-TileImage" content="/icons/icon-144.png">
 
-  <script type="module" crossorigin src="/assets/main-CGySSjv6.js"></script>
-  <link rel="stylesheet" crossorigin href="/assets/main-BA3LWr76.css">
+  <script type="module" crossorigin src="/assets/main-Dhq0XoTm.js"></script>
+  <link rel="stylesheet" crossorigin href="/assets/main-CHuW_yI-.css">
 </head>
   <body>
  </body>