diff --git a/server/static/js/CoordinatesDisplay.js b/server/static/js/CoordinatesDisplay.js index c8f2548..8aba642 100644 --- a/server/static/js/CoordinatesDisplay.js +++ b/server/static/js/CoordinatesDisplay.js @@ -1,30 +1,21 @@ -var CoordinatesDisplay = (function(){ - 'use strict'; +'use strict'; - // coord display - var CoordinatesDisplay = L.Control.extend({ - onAdd: function(map) { - var div = L.DomUtil.create('div', 'leaflet-bar leaflet-custom-display'); - function update(ev){ - var latlng = ev.latlng; - 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) { +// coord display +var CoordinatesDisplay = L.Control.extend({ + onAdd: function(map) { + var div = L.DomUtil.create('div', 'leaflet-bar leaflet-custom-display'); + function update(ev){ + var latlng = ev.latlng; + div.innerHTML = "X:" + parseInt(latlng.lng) + " Z:" + parseInt(latlng.lat); } - }); - return { - create: function(opts){ - return new CoordinatesDisplay(opts); + map.on('mousemove', update); + map.on('click', update); + map.on('touch', update); + + return div; + }, + + onRemove: function(map) { } - } - -}()) +}); diff --git a/server/static/js/LayerManager.js b/server/static/js/LayerManager.js index 3f42cc7..1e0908f 100644 --- a/server/static/js/LayerManager.js +++ b/server/static/js/LayerManager.js @@ -1,11 +1,10 @@ -var LayerManager = function(layers){ +'use strict'; - this.addListener = function(listener){ - }; - - this.getCurrentLayer = function(){ - }; - - }; +function LayerManager(layers){ +} +LayerManager.prototype.addListener = function(listener){ +}; + +LayerManager.prototype.getCurrentLayer = function(){ }; diff --git a/server/static/js/RealtimeTileLayer.js b/server/static/js/RealtimeTileLayer.js index a14312e..a75eb13 100644 --- a/server/static/js/RealtimeTileLayer.js +++ b/server/static/js/RealtimeTileLayer.js @@ -1,5 +1,6 @@ -var RealtimeTileLayer = function(wsChannel){ - 'use strict'; +'use strict'; + +function RealtimeTileLayer(wsChannel){ var self = this; 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); } }); +} - - this.getTileSource = function(layerId, x,y,zoom,cacheBust){ - return "api/tile/" + layerId + "/" + x + "/" + y + "/" + zoom + "?_=" + Date.now(); - } - - this.getImageId = function(layerId, x, y, zoom){ - return "tile-" + layerId + "/" + x + "/" + y + "/" + zoom; - } - - this.createLayer = function(layerId){ - return L.TileLayer.extend({ - createTile: function(coords){ - var tile = document.createElement('img'); - tile.src = self.getTileSource(layerId, coords.x, coords.y, coords.z); - tile.id = self.getImageId(layerId, coords.x, coords.y, coords.z); - return tile; - } - }); - }; - - +RealtimeTileLayer.prototype.getTileSource = function(layerId, x,y,zoom,cacheBust){ + return "api/tile/" + layerId + "/" + x + "/" + y + "/" + zoom + "?_=" + Date.now(); +}; + +RealtimeTileLayer.prototype.getImageId = function(layerId, x, y, zoom){ + return "tile-" + layerId + "/" + x + "/" + y + "/" + zoom; +}; + +RealtimeTileLayer.prototype.createLayer = function(layerId){ + var self = this; + + return L.TileLayer.extend({ + createTile: function(coords){ + var tile = document.createElement('img'); + tile.src = self.getTileSource(layerId, coords.x, coords.y, coords.z); + tile.id = self.getImageId(layerId, coords.x, coords.y, coords.z); + return tile; + } + }); }; diff --git a/server/static/js/WebSocketChannel.js b/server/static/js/WebSocketChannel.js index 2db804e..5d49d19 100644 --- a/server/static/js/WebSocketChannel.js +++ b/server/static/js/WebSocketChannel.js @@ -1,38 +1,38 @@ -var WebSocketChannel = function(){ - 'use strict'; - var wsUrl = location.protocol.replace("http", "ws") + "//" + location.host + location.pathname.substring(0, location.pathname.lastIndexOf("/")) + "/api/ws"; +'use strict'; - 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){ - var list = listenerMap[type]; - if (!list){ - list = []; - 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); - } - }; +WebSocketChannel.prototype.addListener = function(type, listener){ + var list = this.listenerMap[type]; + if (!list){ + list = []; + this.listenerMap[type] = list; + } + 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); + } }; diff --git a/server/static/js/main.js b/server/static/js/main.js index 67e8de9..310ba13 100644 --- a/server/static/js/main.js +++ b/server/static/js/main.js @@ -41,7 +41,7 @@ api.getConfig().then(function(cfg){ L.control.layers(layers, overlays).addTo(map); - var el = CoordinatesDisplay.create({ position: 'bottomleft' }); + var el = new CoordinatesDisplay({ position: 'bottomleft' }); el.addTo(map); }); diff --git a/server/static/js/overlays/TravelnetOverlay.js b/server/static/js/overlays/TravelnetOverlay.js index 107ac7e..5b39e23 100644 --- a/server/static/js/overlays/TravelnetOverlay.js +++ b/server/static/js/overlays/TravelnetOverlay.js @@ -1,31 +1,32 @@ -var TravelnetOverlay = (function(){ - 'use strict'; +'use strict'; - var TravelnetIcon = L.icon({ - iconUrl: 'pics/travelnet_inv.png', +var TravelnetIcon = L.icon({ + iconUrl: 'pics/travelnet_inv.png', - iconSize: [64, 64], - iconAnchor: [32, 32], - popupAnchor: [0, -32] - }); + iconSize: [64, 64], + iconAnchor: [32, 32], + popupAnchor: [0, -32] +}); - return L.LayerGroup.extend({ - onAdd: function(map) { - console.log("TravelnetOverlay.onAdd", map); +var TravelnetOverlay = L.LayerGroup.extend({ + initialize: function() { - map.on('baselayerchange', function (e) { - console.log("baselayerchange", e.layer); - }); + }, - api.getMapObjects(-10,-10,-10,10,10,10,"travelnet") - .then(function(list){ - console.log(list); - }) - }, + onAdd: function(map) { + console.log("TravelnetOverlay.onAdd", map); - onRemove: function(map) { - console.log("TravelnetOverlay.onRemove"); - } - }); + map.on('baselayerchange', function (e) { + 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"); + } +});