New stuff

app/Http/Middleware/SecureHeaders.php

@@ -64,7 +64,7 @@ class SecureHeaders
             // "form-action 'self'", // safe
             "font-src 'self' data:",
             sprintf("connect-src 'self' https://api.pwnedpasswords.com %s", $trackingScriptSrc),
-            sprintf("img-src 'self' data: 'nonce-%1s' ", $nonce),
+            sprintf("img-src 'self' data:  https://tile.openstreetmap.org 'nonce-%1s' ", $nonce),
             "manifest-src 'self'",
         ];
 

package-lock.json

@@ -1639,6 +1639,12 @@
                 }
             }
         },
+        "node_modules/leaflet": {
+            "version": "1.9.4",
+            "resolved": "https://registry.npmjs.org/leaflet/-/leaflet-1.9.4.tgz",
+            "integrity": "sha512-nxS1ynzJOmOlHp+iL3FyWqK89GtNL8U8rvlMOsQdTTssxZwCXh8N2NB3GDQOL+YR3XnWyZAxwQixURb+FA74PA==",
+            "license": "BSD-2-Clause"
+        },
         "node_modules/lightningcss": {
             "version": "1.33.0",
             "resolved": "https://registry.npmjs.org/lightningcss/-/lightningcss-1.33.0.tgz",
@@ -2708,6 +2714,7 @@
                 "i18next-chained-backend": "^5.0.0",
                 "i18next-http-backend": "^4.0.0",
                 "i18next-localstorage-backend": "^4.2.0",
+                "leaflet": "^1.9.4",
                 "patch-package": "^8.0.1",
                 "shepherd.js": "^15.2.2",
                 "store": "^2.0.12"

public/v1/css/firefly.css

@@ -31,7 +31,7 @@
 .low-chart {width:100%;height:200px;}
 .medium-chart {width:100%;height:250px;}
 .center-chart {width:100%;margin:0 auto;}
-.map-size {width:100%;height:300px;}
+.map-size {height:300px;}
 
 /* install box border */
 .install-box-border {border:1px #ddd solid;}

resources/assets/v3/js/pages/transactions/create.js

@@ -50,6 +50,9 @@ import {clearSourceAccount, clearDestinationAccount} from './shared/clear-fields
 import {detectTransactionType} from './shared/detect-transaction-type.js';
 import {determineAmountCurrency} from './shared/determine-amount-currency.js';
 import {loadCustomFields} from './shared/load-custom-fields.js';
+import L from 'leaflet';
+import 'leaflet/dist/leaflet.css';
+
 // TODO fix two maps, perhaps disconnect from entries entirely.
 // TODO map location from preferences
 // TODO field preferences
@@ -217,6 +220,18 @@ let create = function () {
             this.loadCustomFields().then(data => {
                 console.log('Loaded custom fields', data);
                 this.formBehaviour.customFields = data;
+                if(true === data.location) {
+                    console.log('Need to add map.');
+
+                    setTimeout(() => {
+                    let map = L.map(document.getElementById('location_map_0')).setView([51.505, -0.09], 13);
+                    L.tileLayer('https://tile.openstreetmap.org/{z}/{x}/{y}.png', {
+                        maxZoom: 19,
+                        referrerPolicy: 'origin-when-cross-origin',
+                        attribution: '&copy; <a href="http://www.openstreetmap.org/copyright">OpenStreetMap</a>'
+                    }).addTo(map);
+                    }, 2000);
+                }
             });
 
             // load currencies and save in form data.

resources/assets/v3/package.json

@@ -18,6 +18,7 @@
         "i18next-chained-backend": "^5.0.0",
         "i18next-http-backend": "^4.0.0",
         "i18next-localstorage-backend": "^4.2.0",
+        "leaflet": "^1.9.4",
         "patch-package": "^8.0.1",
         "shepherd.js": "^15.2.2",
         "store": "^2.0.12"

resources/views/partials/form/transaction/location.blade.php

@@ -15,7 +15,8 @@
                     data-latitude="{{ $latitude ?? '' }}"
                     data-longitude="{{ $longitude ?? '' }}"
                     data-zoom-level="{{ $zoomLevel ?? '' }}"
-                    :id="'location_map_' + index" class="map-size" :data-index="index"></div>
+
+                    :id="'location_map_' + index" class="map-size location-map" :data-index="index"></div>
                 <span class="muted small">
             <template x-if="!transaction.hasLocation">
                 <span>{{ __('firefly.click_tap_location') }}</span>