Merge remote-tracking branch 'justoverclock/main'

assets/leaflet.edgebuffer.js

@@ -0,0 +1,41 @@
+(function (factory, window) {
+  // define an AMD module that relies on 'leaflet'
+  if (typeof define === 'function' && define.amd) {
+    define(['leaflet'], factory);
+
+    // define a Common JS module that relies on 'leaflet'
+  } else if (typeof exports === 'object') {
+    module.exports = factory(require('leaflet'));
+  }
+
+  // attach your plugin to the global 'L' variable
+  if (typeof window !== 'undefined' && window.L && !window.L.EdgeBuffer) {
+    factory(window.L);
+  }
+}(function (L) {
+  L.EdgeBuffer = {
+    previousMethods: {
+      getTiledPixelBounds: L.GridLayer.prototype._getTiledPixelBounds
+    }
+  };
+
+  L.GridLayer.include({
+
+    _getTiledPixelBounds : function(center, zoom, tileZoom) {
+      var pixelBounds = L.EdgeBuffer.previousMethods.getTiledPixelBounds.call(this, center, zoom, tileZoom);
+
+      // Default is to buffer one tiles beyond the pixel bounds (edgeBufferTiles = 1).
+      var edgeBufferTiles = 1;
+      if ((this.options.edgeBufferTiles !== undefined) && (this.options.edgeBufferTiles !== null)) {
+        edgeBufferTiles = this.options.edgeBufferTiles;
+      }
+
+      if (edgeBufferTiles > 0) {
+        var pixelEdgeBuffer = L.GridLayer.prototype.getTileSize.call(this).multiplyBy(edgeBufferTiles);
+        pixelBounds = new L.Bounds(pixelBounds.min.subtract(pixelEdgeBuffer), pixelBounds.max.add(pixelEdgeBuffer));
+      }
+      return pixelBounds;
+    }
+  });
+
+}, window));

composer.json

@@ -28,7 +28,7 @@
     "extra": {
         "flarum-extension": {
             "title": "User Map Location",
-            "category": "features",
+            "category": "feature",
             "icon": {
                 "name": "fas fa-map-marked-alt",
                 "backgroundColor": "purple",

js/dist/forum.js

@@ -13584,6 +13584,8 @@ var AddLocationComponent = /*#__PURE__*/function (_Component) {
   };
 
   _proto.onupdate = function onupdate(vnode) {
+    var _this2 = this;
+
     var dom = vnode.dom;
     var mapElements = dom.getElementsByClassName('location-map');
 
@@ -13605,11 +13607,15 @@ var AddLocationComponent = /*#__PURE__*/function (_Component) {
         var layer = L.tileLayer('https://api.mapbox.com/styles/v1/{id}/tiles/{z}/{x}/{y}?access_token={accessToken}', {
           attribution: 'Map data &copy; <a href="https://www.openstreetmap.org/copyright">OpenStreetMap</a> ' + 'contributors, Imagery © <a href="https://www.mapbox.com/">Mapbox</a>, ' + 'Developed by <a href="https://flarum.it/">Marco Colia</a>',
           maxZoom: 18,
+          edgeBufferTiles: 1,
           id: 'mapbox/streets-v11',
           tileSize: 512,
           zoomOffset: -1,
           accessToken: publicToken
         }).addTo(this.map);
+        setTimeout(function () {
+          _this2.map.invalidateSize();
+        }, 1000);
         this.updateMap();
       }
     } else {
@@ -13636,7 +13642,7 @@ var AddLocationComponent = /*#__PURE__*/function (_Component) {
   };
 
   _proto.save = function save() {
-    var _this2 = this;
+    var _this3 = this;
 
     if (this.search_country == '' || this.search_city == '') {
       if (this.location) {
@@ -13650,14 +13656,14 @@ var AddLocationComponent = /*#__PURE__*/function (_Component) {
           location_longitude: null
         };
         user.save(attributes).then(function () {
-          _this2.search_country = 'France';
+          _this3.search_country = 'France';
-          _this2.search_city = '';
+          _this3.search_city = '';
-          _this2.location = null;
+          _this3.location = null;
           flarum_forum_app__WEBPACK_IMPORTED_MODULE_1___default.a.alerts.show({
             type: 'success'
           }, flarum_forum_app__WEBPACK_IMPORTED_MODULE_1___default.a.translator.trans('justoverclock-users-map-location.forum.locationCleared'));
 
-          _this2.updateMap();
+          _this3.updateMap();
         });
       }
 
@@ -13730,9 +13736,9 @@ var AddLocationComponent = /*#__PURE__*/function (_Component) {
               location_longitude: result.lon
             };
             user.save(attributes).then(function () {
-              _this2.search_country = attributes.location_country || 'France';
+              _this3.search_country = attributes.location_country || 'France';
-              _this2.search_city = ((attributes.location_postcode || '') + ' ' + (attributes.location_city || '')).trim();
+              _this3.search_city = ((attributes.location_postcode || '') + ' ' + (attributes.location_city || '')).trim();
-              _this2.location = {
+              _this3.location = {
                 lat: attributes.location_latitude,
                 lon: attributes.location_longitude
               };
@@ -13740,7 +13746,7 @@ var AddLocationComponent = /*#__PURE__*/function (_Component) {
                 type: 'success'
               }, flarum_forum_app__WEBPACK_IMPORTED_MODULE_1___default.a.translator.trans('justoverclock-users-map-location.forum.locationSaved'));
 
-              _this2.updateMap();
+              _this3.updateMap();
             });
             return "break";
           }();
@@ -13880,6 +13886,10 @@ flarum_forum_app__WEBPACK_IMPORTED_MODULE_0___default.a.initializers.add('justov
     }
   });
   Object(flarum_common_extend__WEBPACK_IMPORTED_MODULE_1__["extend"])(flarum_forum_components_UserCard__WEBPACK_IMPORTED_MODULE_6___default.a.prototype, 'oncreate', function (originalResult, vnode) {
+    var script = document.createElement('script');
+    script.type = 'text/javascript';
+    script.src = app.forum.attribute('baseUrl') + '/assets/extensions/justoverclock-users-map-location/leaflet.edgebuffer.js';
+    document.head.appendChild(script);
     var user = this.attrs.user;
     var location = user.location_latitude() ? {
       lat: user.location_latitude(),
@@ -13896,14 +13906,21 @@ flarum_forum_app__WEBPACK_IMPORTED_MODULE_0___default.a.initializers.add('justov
       iconAnchor: [13, 40]
     });
     var map = L.map(mapElement).setView([location.lat, location.lon], 13);
+    var marker = L.marker([location.lat, location.lon], {
+      icon: markerIcon
+    }).addTo(map);
     var layerUserCard = L.tileLayer('https://api.mapbox.com/styles/v1/{id}/tiles/{z}/{x}/{y}?access_token={accessToken}', {
       attribution: 'Map data &copy; <a href="https://www.openstreetmap.org/copyright">OpenStreetMap</a> contributors, Imagery © <a href="https://www.mapbox.com/">Mapbox</a>, Developed by <a href="https://flarum.it/">Marco Colia</a>',
       maxZoom: 18,
+      edgeBufferTiles: 1,
       id: 'mapbox/streets-v11',
       tileSize: 512,
       zoomOffset: -1,
       accessToken: publicToken
     }).addTo(map);
+    setTimeout(function () {
+      map.invalidateSize();
+    }, 100);
   });
   Object(flarum_common_extend__WEBPACK_IMPORTED_MODULE_1__["extend"])(flarum_forum_components_SettingsPage__WEBPACK_IMPORTED_MODULE_2___default.a.prototype, 'settingsItems', function (items) {
     items.add('location', m(_components_AddLocationComponent__WEBPACK_IMPORTED_MODULE_5__["default"], null));

js/package.json

@@ -5,6 +5,7 @@
   "prettier": "@flarum/prettier-config",
   "dependencies": {
     "@flarum/prettier-config": "^1.0.0",
+    "flarum": "^0.1.0-beta.16",
     "flarum-tsconfig": "^1.0.0",
     "flarum-webpack-config": "^1.0.0",
     "leaflet": "^1.7.1",

js/src/forum/components/AddLocationComponent.js

@@ -88,11 +88,15 @@ export default class AddLocationComponent extends Component {
                 'contributors, Imagery © <a href="https://www.mapbox.com/">Mapbox</a>, ' +
                 'Developed by <a href="https://flarum.it/">Marco Colia</a>',
               maxZoom: 18,
+              edgeBufferTiles: 1,
               id: 'mapbox/streets-v11',
               tileSize: 512,
               zoomOffset: -1,
               accessToken: publicToken,
             }).addTo(this.map);
+            setTimeout(() => {
+              this.map.invalidateSize();
+            },1000);
             
             this.updateMap();
       }

js/src/forum/index.js

@@ -29,6 +29,13 @@ app.initializers.add('justoverclock/users-map-location', (app) => {
   });
 
   extend(UserCard.prototype, 'oncreate', function (originalResult, vnode) {
+
+    let script = document.createElement('script');
+    script.type = 'text/javascript';
+    script.src = app.forum.attribute('baseUrl') + '/assets/extensions/justoverclock-users-map-location/leaflet.edgebuffer.js'
+
+    document.head.appendChild(script);
+    
     const user = this.attrs.user;
     
     let location = user.location_latitude()
@@ -52,15 +59,20 @@ app.initializers.add('justoverclock/users-map-location', (app) => {
     });
 
     let map = L.map(mapElement).setView([location.lat, location.lon], 13);
+    let marker = L.marker([location.lat, location.lon], { icon: markerIcon }).addTo(map);
     let layerUserCard = L.tileLayer('https://api.mapbox.com/styles/v1/{id}/tiles/{z}/{x}/{y}?access_token={accessToken}', {
       attribution:
         'Map data &copy; <a href="https://www.openstreetmap.org/copyright">OpenStreetMap</a> contributors, Imagery © <a href="https://www.mapbox.com/">Mapbox</a>, Developed by <a href="https://flarum.it/">Marco Colia</a>',
       maxZoom: 18,
+      edgeBufferTiles: 1,
       id: 'mapbox/streets-v11',
       tileSize: 512,
       zoomOffset: -1,
       accessToken: publicToken,
     }).addTo(map);
+    setTimeout(() => {
+      map.invalidateSize();
+    },100);
   });
 
   extend(SettingsPage.prototype, 'settingsItems', function (items) {