youen/flarum-users-map-location
1
0
Fork 0
Code Issues Pull Requests Projects Releases 1 Wiki Activity

Fixed display bugs when map is resized

Browse Source
This commit is contained in:
Youen 2023-08-24 15:26:27 +02:00
parent 967f8dbf15
commit 6600ba7139
4 changed files with 31 additions and 28 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

38
js/dist/forum.js vendored
View File

@ -13584,8 +13584,6 @@ var AddLocationComponent = /*#__PURE__*/function (_Component) {
}; };
_proto.onupdate = function onupdate(vnode) { _proto.onupdate = function onupdate(vnode) {
var _this2 = this;
var dom = vnode.dom; var dom = vnode.dom;
var mapElements = dom.getElementsByClassName('location-map'); var mapElements = dom.getElementsByClassName('location-map');
@ -13605,7 +13603,7 @@ var AddLocationComponent = /*#__PURE__*/function (_Component) {
icon: markerIcon icon: markerIcon
}).addTo(this.map); }).addTo(this.map);
var layer = L.tileLayer('https://api.mapbox.com/styles/v1/{id}/tiles/{z}/{x}/{y}?access_token={accessToken}', { 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>', attribution: 'Map data &copy; <a href="https://www.openstreetmap.org/copyright">OpenStreetMap</a> contributors, Imagery &copy; <a href="https://www.mapbox.com/">Mapbox</a>',
maxZoom: 18, maxZoom: 18,
edgeBufferTiles: 1, edgeBufferTiles: 1,
id: 'mapbox/streets-v11', id: 'mapbox/streets-v11',
@ -13613,9 +13611,6 @@ var AddLocationComponent = /*#__PURE__*/function (_Component) {
zoomOffset: -1, zoomOffset: -1,
accessToken: publicToken accessToken: publicToken
}).addTo(this.map); }).addTo(this.map);
setTimeout(function () {
_this2.map.invalidateSize();
}, 1000);
this.updateMap(); this.updateMap();
} }
} else { } else {
@ -13642,7 +13637,7 @@ var AddLocationComponent = /*#__PURE__*/function (_Component) {
}; };
_proto.save = function save() { _proto.save = function save() {
var _this3 = this; var _this2 = this;
if (this.search_country == '' || this.search_city == '') { if (this.search_country == '' || this.search_city == '') {
if (this.location) { if (this.location) {
@ -13656,14 +13651,14 @@ var AddLocationComponent = /*#__PURE__*/function (_Component) {
location_longitude: null location_longitude: null
}; };
user.save(attributes).then(function () { user.save(attributes).then(function () {
_this3.search_country = 'France'; _this2.search_country = 'France';
_this3.search_city = ''; _this2.search_city = '';
_this3.location = null; _this2.location = null;
flarum_forum_app__WEBPACK_IMPORTED_MODULE_1___default.a.alerts.show({ flarum_forum_app__WEBPACK_IMPORTED_MODULE_1___default.a.alerts.show({
type: 'success' type: 'success'
}, flarum_forum_app__WEBPACK_IMPORTED_MODULE_1___default.a.translator.trans('justoverclock-users-map-location.forum.locationCleared')); }, flarum_forum_app__WEBPACK_IMPORTED_MODULE_1___default.a.translator.trans('justoverclock-users-map-location.forum.locationCleared'));
_this3.updateMap(); _this2.updateMap();
}); });
} }
@ -13736,9 +13731,9 @@ var AddLocationComponent = /*#__PURE__*/function (_Component) {
location_longitude: result.lon location_longitude: result.lon
}; };
user.save(attributes).then(function () { user.save(attributes).then(function () {
_this3.search_country = attributes.location_country || 'France'; _this2.search_country = attributes.location_country || 'France';
_this3.search_city = ((attributes.location_postcode || '') + ' ' + (attributes.location_city || '')).trim(); _this2.search_city = ((attributes.location_postcode || '') + ' ' + (attributes.location_city || '')).trim();
_this3.location = { _this2.location = {
lat: attributes.location_latitude, lat: attributes.location_latitude,
lon: attributes.location_longitude lon: attributes.location_longitude
}; };
@ -13746,7 +13741,7 @@ var AddLocationComponent = /*#__PURE__*/function (_Component) {
type: 'success' type: 'success'
}, flarum_forum_app__WEBPACK_IMPORTED_MODULE_1___default.a.translator.trans('justoverclock-users-map-location.forum.locationSaved')); }, flarum_forum_app__WEBPACK_IMPORTED_MODULE_1___default.a.translator.trans('justoverclock-users-map-location.forum.locationSaved'));
_this3.updateMap(); _this2.updateMap();
}); });
return "break"; return "break";
}(); }();
@ -13910,7 +13905,7 @@ flarum_forum_app__WEBPACK_IMPORTED_MODULE_0___default.a.initializers.add('justov
icon: markerIcon icon: markerIcon
}).addTo(map); }).addTo(map);
var layerUserCard = L.tileLayer('https://api.mapbox.com/styles/v1/{id}/tiles/{z}/{x}/{y}?access_token={accessToken}', { 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>', attribution: 'Map data &copy; <a href="https://www.openstreetmap.org/copyright">OpenStreetMap</a> contributors, Imagery &copy; <a href="https://www.mapbox.com/">Mapbox</a>',
maxZoom: 18, maxZoom: 18,
edgeBufferTiles: 1, edgeBufferTiles: 1,
id: 'mapbox/streets-v11', id: 'mapbox/streets-v11',
@ -13918,9 +13913,16 @@ flarum_forum_app__WEBPACK_IMPORTED_MODULE_0___default.a.initializers.add('justov
zoomOffset: -1, zoomOffset: -1,
accessToken: publicToken accessToken: publicToken
}).addTo(map); }).addTo(map);
setTimeout(function () { /*setTimeout(() => {
map.invalidateSize(); map.invalidateSize();
}, 100); },100);*/
function onMapResized() {
map.invalidateSize();
}
onMapResized();
new ResizeObserver(onMapResized).observe(mapElement);
}); });
Object(flarum_common_extend__WEBPACK_IMPORTED_MODULE_1__["extend"])(flarum_forum_components_SettingsPage__WEBPACK_IMPORTED_MODULE_2___default.a.prototype, 'settingsItems', function (items) { 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)); items.add('location', m(_components_AddLocationComponent__WEBPACK_IMPORTED_MODULE_5__["default"], null));

2
js/dist/forum.js.map vendored
View File

File diff suppressed because one or more lines are too long

7
js/src/forum/components/AddLocationComponent.js
View File

@ -84,9 +84,7 @@ export default class AddLocationComponent extends Component {
this.locationMarker = L.marker([this.location.lat, this.location.lon], { icon: markerIcon }).addTo(this.map); this.locationMarker = L.marker([this.location.lat, this.location.lon], { icon: markerIcon }).addTo(this.map);
let layer = L.tileLayer('https://api.mapbox.com/styles/v1/{id}/tiles/{z}/{x}/{y}?access_token={accessToken}', { let layer = L.tileLayer('https://api.mapbox.com/styles/v1/{id}/tiles/{z}/{x}/{y}?access_token={accessToken}', {
attribution: attribution:
'Map data &copy; <a href="https://www.openstreetmap.org/copyright">OpenStreetMap</a> ' + 'Map data &copy; <a href="https://www.openstreetmap.org/copyright">OpenStreetMap</a> contributors, Imagery &copy; <a href="https://www.mapbox.com/">Mapbox</a>',
'contributors, Imagery © <a href="https://www.mapbox.com/">Mapbox</a>, ' +
'Developed by <a href="https://flarum.it/">Marco Colia</a>',
maxZoom: 18, maxZoom: 18,
edgeBufferTiles: 1, edgeBufferTiles: 1,
id: 'mapbox/streets-v11', id: 'mapbox/streets-v11',
@ -94,9 +92,6 @@ export default class AddLocationComponent extends Component {
zoomOffset: -1, zoomOffset: -1,
accessToken: publicToken, accessToken: publicToken,
}).addTo(this.map); }).addTo(this.map);
setTimeout(() => {
this.map.invalidateSize();
},1000);
this.updateMap(); this.updateMap();
} }

12
js/src/forum/index.js
View File

@ -62,7 +62,7 @@ app.initializers.add('justoverclock/users-map-location', (app) => {
let marker = L.marker([location.lat, location.lon], { icon: markerIcon }).addTo(map); 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}', { let layerUserCard = L.tileLayer('https://api.mapbox.com/styles/v1/{id}/tiles/{z}/{x}/{y}?access_token={accessToken}', {
attribution: 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>', 'Map data &copy; <a href="https://www.openstreetmap.org/copyright">OpenStreetMap</a> contributors, Imagery &copy; <a href="https://www.mapbox.com/">Mapbox</a>',
maxZoom: 18, maxZoom: 18,
edgeBufferTiles: 1, edgeBufferTiles: 1,
id: 'mapbox/streets-v11', id: 'mapbox/streets-v11',
@ -70,9 +70,15 @@ app.initializers.add('justoverclock/users-map-location', (app) => {
zoomOffset: -1, zoomOffset: -1,
accessToken: publicToken, accessToken: publicToken,
}).addTo(map); }).addTo(map);
setTimeout(() => { /*setTimeout(() => {
map.invalidateSize(); map.invalidateSize();
},100); },100);*/
function onMapResized() {
map.invalidateSize();
}
onMapResized();
new ResizeObserver(onMapResized).observe(mapElement);
}); });
extend(SettingsPage.prototype, 'settingsItems', function (items) { extend(SettingsPage.prototype, 'settingsItems', function (items) {