Browse Source

Added map on the global map page

main
Youen 1 year ago
parent
commit
cc70c4eab1
  1. 41
      js/dist/forum.js
  2. 2
      js/dist/forum.js.map
  3. 43
      js/src/forum/components/GlobalMapPage.tsx
  4. 7
      less/forum.less
  5. 3
      locale/en.yml
  6. 2
      locale/fr.yml

41
js/dist/forum.js vendored

@ -13801,6 +13801,7 @@ var GlobalMapPage = /*#__PURE__*/function (_Page) {
_Page.prototype.oninit.call(this, vnode);
flarum_forum_app__WEBPACK_IMPORTED_MODULE_1___default.a.setTitle(translate('justoverclock-users-map-location.forum.global-map.title'));
this.map = null;
};
_proto.view = function view() {
@ -13808,7 +13809,45 @@ var GlobalMapPage = /*#__PURE__*/function (_Page) {
"class": "GlobalMapPage"
}, m("div", {
className: "container"
}, m("h2", null, translate('justoverclock-users-map-location.forum.global-map.title2'))));
}, m("h2", null, translate('justoverclock-users-map-location.forum.global-map.title2')), m("div", {
className: "global-map"
})));
};
_proto.oncreate = function oncreate(vnode) {
this.onupdate(vnode);
};
_proto.onupdate = function onupdate(vnode) {
var dom = vnode.dom;
var mapElements = dom.getElementsByClassName('global-map');
if (mapElements.length > 0) {
if (!this.map) {
var mapElement = mapElements[0];
var publicToken = flarum_forum_app__WEBPACK_IMPORTED_MODULE_1___default.a.forum.attribute('justoverclock-users-map-location.mapBox-api-key');
var markerIconPath = flarum_forum_app__WEBPACK_IMPORTED_MODULE_1___default.a.forum.attribute('baseUrl') + '/assets/extensions/justoverclock-users-map-location/marker-icon.png';
var markerIcon = L.icon({
iconUrl: markerIconPath,
iconSize: [25, 41],
// size of the icon
iconAnchor: [13, 40]
});
this.map = L.map(mapElement);
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 &copy; <a href="https://www.mapbox.com/">Mapbox</a>',
maxZoom: 18,
edgeBufferTiles: 1,
id: 'mapbox/streets-v11',
tileSize: 512,
zoomOffset: -1,
accessToken: publicToken
}).addTo(this.map);
this.map.setView([46, 2], 6);
}
} else {
this.map = null;
}
};
return GlobalMapPage;

2
js/dist/forum.js.map vendored

File diff suppressed because one or more lines are too long

43
js/src/forum/components/GlobalMapPage.tsx

@ -11,13 +11,56 @@ export default class GlobalMapPage extends Page {
super.oninit(vnode);
app.setTitle(translate('justoverclock-users-map-location.forum.global-map.title'));
this.map = null;
}
view() {
return <div class="GlobalMapPage">
<div className="container">
<h2>{translate('justoverclock-users-map-location.forum.global-map.title2')}</h2>
<div className="global-map"></div>
</div>
</div>;
}
oncreate(vnode) {
this.onupdate(vnode);
}
onupdate(vnode) {
let dom = vnode.dom;
let mapElements = dom.getElementsByClassName('global-map');
if(mapElements.length > 0) {
if(!this.map) {
let mapElement = mapElements[0];
const publicToken = app.forum.attribute('justoverclock-users-map-location.mapBox-api-key');
const markerIconPath = app.forum.attribute('baseUrl') + '/assets/extensions/justoverclock-users-map-location/marker-icon.png';
let markerIcon = L.icon({
iconUrl: markerIconPath,
iconSize: [25, 41], // size of the icon
iconAnchor: [13, 40]
});
this.map = L.map(mapElement);
let 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 &copy; <a href="https://www.mapbox.com/">Mapbox</a>',
maxZoom: 18,
edgeBufferTiles: 1,
id: 'mapbox/streets-v11',
tileSize: 512,
zoomOffset: -1,
accessToken: publicToken,
}).addTo(this.map);
this.map.setView([46, 2], 6);
}
} else {
this.map = null;
}
}
}

7
less/forum.less

@ -24,6 +24,13 @@ input#location {
display: block;
}
}
.global-map {
height: ~"calc(100vh - 170px)";
width: 100%;
border-radius: 10px;
}
/* required styles */
li.item-mapLocation {

3
locale/en.yml

@ -12,3 +12,6 @@ justoverclock-users-map-location:
locationSaved: Location saved successfully!
locationNotFound: Location not found
locationCleared: Your location has been deleted
global-map:
title: Global Map
title2: Map of members

2
locale/fr.yml

@ -14,4 +14,4 @@ justoverclock-users-map-location:
locationCleared: Votre localité a été supprimée
global-map:
title: Carte globale
title2: Carte des membres de la communauté vhélio
title2: Carte des membres
Loading…
Cancel
Save