forked from MTSR/mapserver
working basic routing
This commit is contained in:
parent
8a534d7643
commit
38f519092e
@ -4,7 +4,11 @@ body {
|
|||||||
overflow: hidden;
|
overflow: hidden;
|
||||||
}
|
}
|
||||||
|
|
||||||
#image-map {
|
#app {
|
||||||
|
height: 100%;
|
||||||
|
}
|
||||||
|
|
||||||
|
.full-screen {
|
||||||
width: 100%;
|
width: 100%;
|
||||||
height: 100%;
|
height: 100%;
|
||||||
border: 1px solid #ccc;
|
border: 1px solid #ccc;
|
||||||
|
@ -15,8 +15,7 @@
|
|||||||
<title>Minetest Mapserver</title>
|
<title>Minetest Mapserver</title>
|
||||||
</head>
|
</head>
|
||||||
<body>
|
<body>
|
||||||
<div id="image-map"></div>
|
<div id="app"></div>
|
||||||
<div id="search-content"></div>
|
|
||||||
|
|
||||||
<!-- libraries -->
|
<!-- libraries -->
|
||||||
<script src="js/lib/mithril.min.js"></script>
|
<script src="js/lib/mithril.min.js"></script>
|
||||||
|
66
static/js/components/Map.js
Normal file
66
static/js/components/Map.js
Normal file
@ -0,0 +1,66 @@
|
|||||||
|
import wsChannel from '../WebSocketChannel.js';
|
||||||
|
import SimpleCRS from '../SimpleCRS.js';
|
||||||
|
import CoordinatesDisplay from '../CoordinatesDisplay.js';
|
||||||
|
import WorldInfoDisplay from '../WorldInfoDisplay.js';
|
||||||
|
import SearchControl from '../SearchControl.js';
|
||||||
|
import Overlaysetup from '../Overlaysetup.js';
|
||||||
|
import layerManager from '../LayerManager.js';
|
||||||
|
import config from '../config.js';
|
||||||
|
|
||||||
|
export default {
|
||||||
|
view(vnode){
|
||||||
|
return m("div", { class: "full-screen" });
|
||||||
|
},
|
||||||
|
|
||||||
|
oncreate(vnode){
|
||||||
|
console.log("oncreate", vnode);
|
||||||
|
const cfg = config.get();
|
||||||
|
|
||||||
|
var map = L.map(vnode.dom, {
|
||||||
|
minZoom: 2,
|
||||||
|
maxZoom: 12,
|
||||||
|
center: [+vnode.attrs.lat, +vnode.attrs.lon],
|
||||||
|
zoom: +vnode.attrs.zoom,
|
||||||
|
crs: SimpleCRS
|
||||||
|
});
|
||||||
|
|
||||||
|
vnode.state.map = map;
|
||||||
|
|
||||||
|
map.attributionControl.addAttribution('<a href="https://github.com/minetest-tools/mapserver">Minetest Mapserver</a>');
|
||||||
|
|
||||||
|
var overlays = {};
|
||||||
|
|
||||||
|
layerManager.setup(wsChannel, cfg.layers, map, +vnode.attrs.layerId);
|
||||||
|
|
||||||
|
//All overlays
|
||||||
|
Overlaysetup(cfg, map, overlays, wsChannel, layerManager);
|
||||||
|
|
||||||
|
new CoordinatesDisplay({ position: 'bottomleft' }).addTo(map);
|
||||||
|
new WorldInfoDisplay(wsChannel, { position: 'bottomright' }).addTo(map);
|
||||||
|
|
||||||
|
if (cfg.enablesearch){
|
||||||
|
new SearchControl(wsChannel, { position: 'topright' }).addTo(map);
|
||||||
|
}
|
||||||
|
|
||||||
|
//layer control
|
||||||
|
L.control.layers(layerManager.layerObjects, overlays, { position: "topright" }).addTo(map);
|
||||||
|
|
||||||
|
//TODO: overlay persistence (state, localstorage)
|
||||||
|
//TODO: update hash
|
||||||
|
},
|
||||||
|
|
||||||
|
onbeforeupdate(newVnode, oldVnode) {
|
||||||
|
return false;
|
||||||
|
},
|
||||||
|
|
||||||
|
onupdate(vnode){
|
||||||
|
console.log("onupdate", vnode);
|
||||||
|
|
||||||
|
//TODO: compare and update center,zoom,layer
|
||||||
|
},
|
||||||
|
|
||||||
|
onremove(vnode){
|
||||||
|
console.log("onremove", vnode);
|
||||||
|
vnode.state.map.remove();
|
||||||
|
}
|
||||||
|
}
|
12
static/js/config.js
Normal file
12
static/js/config.js
Normal file
@ -0,0 +1,12 @@
|
|||||||
|
|
||||||
|
var config;
|
||||||
|
|
||||||
|
export default {
|
||||||
|
get(){
|
||||||
|
return config;
|
||||||
|
},
|
||||||
|
|
||||||
|
set(cfg){
|
||||||
|
config = cfg;
|
||||||
|
}
|
||||||
|
}
|
@ -1,5 +1,16 @@
|
|||||||
|
|
||||||
import { getConfig } from './api.js';
|
import { getConfig } from './api.js';
|
||||||
import { setup } from './map.js';
|
//import { setup } from './map.js';
|
||||||
|
import routes from './routes.js';
|
||||||
|
import wsChannel from './WebSocketChannel.js';
|
||||||
|
import config from './config.js';
|
||||||
|
|
||||||
getConfig().then(setup);
|
//TODO: migrate #/layer/zoom/lat/lon to #!/map/...
|
||||||
|
//TODO: migrate #/zoom/lat/lon to #!/map/...
|
||||||
|
|
||||||
|
getConfig().then(cfg => {
|
||||||
|
config.set(cfg);
|
||||||
|
wsChannel.connect();
|
||||||
|
m.route(document.getElementById("app"), "/map/0/13/0/0", routes);
|
||||||
|
//setup(cfg);
|
||||||
|
});
|
||||||
|
@ -9,8 +9,6 @@ import layerManager from './LayerManager.js';
|
|||||||
|
|
||||||
export function setup(cfg){
|
export function setup(cfg){
|
||||||
|
|
||||||
wsChannel.connect();
|
|
||||||
|
|
||||||
var map = L.map('image-map', {
|
var map = L.map('image-map', {
|
||||||
minZoom: 2,
|
minZoom: 2,
|
||||||
maxZoom: 12,
|
maxZoom: 12,
|
||||||
|
@ -1,5 +1,5 @@
|
|||||||
|
|
||||||
m.mount(document.getElementById("image-map"), {
|
m.mount(document.getElementById("app"), {
|
||||||
view: function(){
|
view: function(){
|
||||||
return m("div", "I'm sorry, your browser is just too old ;)");
|
return m("div", "I'm sorry, your browser is just too old ;)");
|
||||||
}
|
}
|
||||||
|
13
static/js/routes.js
Normal file
13
static/js/routes.js
Normal file
@ -0,0 +1,13 @@
|
|||||||
|
|
||||||
|
import Map from './components/Map.js';
|
||||||
|
|
||||||
|
var Home = {
|
||||||
|
view: function() {
|
||||||
|
return "Home"
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
export default {
|
||||||
|
"/": Home,
|
||||||
|
"/map/:layerId/:zoom/:lon/:lat": Map
|
||||||
|
}
|
Loading…
Reference in New Issue
Block a user