es5 with prototypes

This commit is contained in:
NatureFreshMilk 2019-02-01 12:58:26 +01:00
parent 39be159cda
commit 68f757b7d4
6 changed files with 107 additions and 116 deletions

View File

@ -1,30 +1,21 @@
var CoordinatesDisplay = (function(){ 'use strict';
'use strict';
// coord display // coord display
var CoordinatesDisplay = L.Control.extend({ var CoordinatesDisplay = L.Control.extend({
onAdd: function(map) { onAdd: function(map) {
var div = L.DomUtil.create('div', 'leaflet-bar leaflet-custom-display'); var div = L.DomUtil.create('div', 'leaflet-bar leaflet-custom-display');
function update(ev){ function update(ev){
var latlng = ev.latlng; var latlng = ev.latlng;
div.innerHTML = "X:" + parseInt(latlng.lng) + " Z:" + parseInt(latlng.lat); div.innerHTML = "X:" + parseInt(latlng.lng) + " Z:" + parseInt(latlng.lat);
}
map.on('mousemove', update);
map.on('click', update);
map.on('touch', update);
return div;
},
onRemove: function(map) {
} }
});
return { map.on('mousemove', update);
create: function(opts){ map.on('click', update);
return new CoordinatesDisplay(opts); map.on('touch', update);
return div;
},
onRemove: function(map) {
} }
} });
}())

View File

@ -1,11 +1,10 @@
var LayerManager = function(layers){ 'use strict';
this.addListener = function(listener){ function LayerManager(layers){
}; }
this.getCurrentLayer = function(){
};
};
LayerManager.prototype.addListener = function(listener){
};
LayerManager.prototype.getCurrentLayer = function(){
}; };

View File

@ -1,5 +1,6 @@
var RealtimeTileLayer = function(wsChannel){ 'use strict';
'use strict';
function RealtimeTileLayer(wsChannel){
var self = this; var self = this;
wsChannel.addListener("rendered-tile", function(tc){ wsChannel.addListener("rendered-tile", function(tc){
@ -11,26 +12,25 @@ var RealtimeTileLayer = function(wsChannel){
el.src = self.getTileSource(tc.layerid, tc.x, tc.y, tc.zoom, true); el.src = self.getTileSource(tc.layerid, tc.x, tc.y, tc.zoom, true);
} }
}); });
}
RealtimeTileLayer.prototype.getTileSource = function(layerId, x,y,zoom,cacheBust){
this.getTileSource = function(layerId, x,y,zoom,cacheBust){ return "api/tile/" + layerId + "/" + x + "/" + y + "/" + zoom + "?_=" + Date.now();
return "api/tile/" + layerId + "/" + x + "/" + y + "/" + zoom + "?_=" + Date.now(); };
}
RealtimeTileLayer.prototype.getImageId = function(layerId, x, y, zoom){
this.getImageId = function(layerId, x, y, zoom){ return "tile-" + layerId + "/" + x + "/" + y + "/" + zoom;
return "tile-" + layerId + "/" + x + "/" + y + "/" + zoom; };
}
RealtimeTileLayer.prototype.createLayer = function(layerId){
this.createLayer = function(layerId){ var self = this;
return L.TileLayer.extend({
createTile: function(coords){ return L.TileLayer.extend({
var tile = document.createElement('img'); createTile: function(coords){
tile.src = self.getTileSource(layerId, coords.x, coords.y, coords.z); var tile = document.createElement('img');
tile.id = self.getImageId(layerId, coords.x, coords.y, coords.z); tile.src = self.getTileSource(layerId, coords.x, coords.y, coords.z);
return tile; tile.id = self.getImageId(layerId, coords.x, coords.y, coords.z);
} return tile;
}); }
}; });
}; };

View File

@ -1,38 +1,38 @@
var WebSocketChannel = function(){ 'use strict';
'use strict';
var wsUrl = location.protocol.replace("http", "ws") + "//" + location.host + location.pathname.substring(0, location.pathname.lastIndexOf("/")) + "/api/ws";
var listenerMap = {/* type -> [listeners] */}; function WebSocketChannel(){
this.wsUrl = location.protocol.replace("http", "ws") + "//" + location.host + location.pathname.substring(0, location.pathname.lastIndexOf("/")) + "/api/ws";
this.listenerMap = {/* type -> [listeners] */};
}
this.addListener = function(type, listener){ WebSocketChannel.prototype.addListener = function(type, listener){
var list = listenerMap[type]; var list = this.listenerMap[type];
if (!list){ if (!list){
list = []; list = [];
listenerMap[type] = list; this.listenerMap[type] = list;
} }
list.push(listener);
};
this.connect = function(){
var ws = new WebSocket(wsUrl);
ws.onmessage = function(e){
var event = JSON.parse(e.data);
//rendered-tile, mapobject-created, mapobjects-cleared
var listeners = listenerMap[event.type];
if (listeners){
listeners.forEach(function(listener){
listener(event.data);
});
}
}
ws.onerror = function(){
//reconnect after some time
setTimeout(connect, 1000);
}
};
list.push(listener);
};
WebSocketChannel.prototype.connect = function(){
var ws = new WebSocket(this.wsUrl);
var self = this;
ws.onmessage = function(e){
var event = JSON.parse(e.data);
//rendered-tile, mapobject-created, mapobjects-cleared
var listeners = self.listenerMap[event.type];
if (listeners){
self.listeners.forEach(function(listener){
listener(event.data);
});
}
}
ws.onerror = function(){
//reconnect after some time
setTimeout(connect, 1000);
}
}; };

View File

@ -41,7 +41,7 @@ api.getConfig().then(function(cfg){
L.control.layers(layers, overlays).addTo(map); L.control.layers(layers, overlays).addTo(map);
var el = CoordinatesDisplay.create({ position: 'bottomleft' }); var el = new CoordinatesDisplay({ position: 'bottomleft' });
el.addTo(map); el.addTo(map);
}); });

View File

@ -1,31 +1,32 @@
var TravelnetOverlay = (function(){ 'use strict';
'use strict';
var TravelnetIcon = L.icon({ var TravelnetIcon = L.icon({
iconUrl: 'pics/travelnet_inv.png', iconUrl: 'pics/travelnet_inv.png',
iconSize: [64, 64], iconSize: [64, 64],
iconAnchor: [32, 32], iconAnchor: [32, 32],
popupAnchor: [0, -32] popupAnchor: [0, -32]
}); });
return L.LayerGroup.extend({ var TravelnetOverlay = L.LayerGroup.extend({
onAdd: function(map) { initialize: function() {
console.log("TravelnetOverlay.onAdd", map);
map.on('baselayerchange', function (e) { },
console.log("baselayerchange", e.layer);
});
api.getMapObjects(-10,-10,-10,10,10,10,"travelnet") onAdd: function(map) {
.then(function(list){ console.log("TravelnetOverlay.onAdd", map);
console.log(list);
})
},
onRemove: function(map) { map.on('baselayerchange', function (e) {
console.log("TravelnetOverlay.onRemove"); console.log("baselayerchange", e.layer);
} });
});
}()); api.getMapObjects(-10,-10,-10,10,10,10,"travelnet")
.then(function(list){
console.log(list);
})
},
onRemove: function(map) {
console.log("TravelnetOverlay.onRemove");
}
});