diff options
| -rw-r--r-- | examples/full.html | 1 | ||||
| -rw-r--r-- | resources/leaflet-route/leaflet-route.js | 280 | ||||
| -rw-r--r-- | src/leaflet-soton.js | 4 |
3 files changed, 144 insertions, 141 deletions
diff --git a/examples/full.html b/examples/full.html index cae1e87..c59fdea 100644 --- a/examples/full.html +++ b/examples/full.html @@ -28,6 +28,7 @@ <script src="../resources/leaflet-locatecontrol/src/L.Control.Locate.js"></script> <script src="../resources/leaflet-hash/leaflet-hash.js"></script> <script src="../resources/leaflet-indoor/leaflet-indoor.js"></script> + <script src="../resources/leaflet-route/leaflet-route.js"></script> <script src="../src/leaflet-soton.js"></script> diff --git a/resources/leaflet-route/leaflet-route.js b/resources/leaflet-route/leaflet-route.js index 501a620..8dd0759 100644 --- a/resources/leaflet-route/leaflet-route.js +++ b/resources/leaflet-route/leaflet-route.js @@ -141,178 +141,180 @@ L.Route = L.FeatureGroup.extend({ } }); -L.Control.Route = L.Control.Sidebar.extend({ - initialize: function (routeLayer, placeholder, options) { - L.Control.Sidebar.prototype.initialize.call(this, placeholder, options); - L.setOptions(this, options); - - this._routeLayer = routeLayer; - - var title = L.DomUtil.create('div', 'ls-routes-title', this._contentContainer); - title.textContent = "University Bus Routes"; - - var routeMasters = this._routeLayer.getRouteMasters(); - - var routeMasterRouteLists = {}; - - var ul = L.DomUtil.create('ul', 'ls-route-master-list', this._contentContainer); - - var routeMasterNames = Object.keys(routeMasters); - if (this.options.routeMasterSort) { - routeMasterNames.sort(this.options.routeMasterSort); - } - - for (var i in routeMasterNames) { - var routeMasterName = routeMasterNames[i]; - var routeMaster = routeMasters[routeMasterName]; - - var li = L.DomUtil.create('li', '', ul); - var a = L.DomUtil.create('a', '', li); - - a.style.background = routeMaster.routes[0].properties.colour; +if ("Sidebar" in L.Control) { + L.Control.Route = L.Control.Sidebar.extend({ + initialize: function (routeLayer, placeholder, options) { + L.Control.Sidebar.prototype.initialize.call(this, placeholder, options); + L.setOptions(this, options); - a.textContent = routeMaster.name; - a.onclick = (function(routeMasterName) { - return function() { - routeMasterRouteLists[activeRouteMaster].style.display = "none"; - routeMasterRouteLists[routeMasterName].style.display = "block"; - activeRouteMaster = routeMasterName; - }; - })(routeMasterName); - - // The route lists + this._routeLayer = routeLayer; - var routeList = this._createRouteList(routeMaster); - routeMasterRouteLists[routeMasterName] = routeList; + var title = L.DomUtil.create('div', 'ls-routes-title', this._contentContainer); + title.textContent = "University Bus Routes"; - routeList.style.display = "none"; + var routeMasters = this._routeLayer.getRouteMasters(); - this._contentContainer.appendChild(routeList); - } + var routeMasterRouteLists = {}; - var activeRouteMaster = "U1"; // TODO: Dont hardcode like this + var ul = L.DomUtil.create('ul', 'ls-route-master-list', this._contentContainer); - routeMasterRouteLists[activeRouteMaster].style.display = "block"; - }, - _createRouteList: function(routeMaster) { - var div = L.DomUtil.create('div', null); + var routeMasterNames = Object.keys(routeMasters); + if (this.options.routeMasterSort) { + routeMasterNames.sort(this.options.routeMasterSort); + } - var ul = L.DomUtil.create('ul', 'ls-route-list', div); + for (var i in routeMasterNames) { + var routeMasterName = routeMasterNames[i]; + var routeMaster = routeMasters[routeMasterName]; - var routeLayer = this._routeLayer; + var li = L.DomUtil.create('li', '', ul); + var a = L.DomUtil.create('a', '', li); - var stopLists = {}; - for (var i in routeMaster.routes) { - var route = routeMaster.routes[i]; + a.style.background = routeMaster.routes[0].properties.colour; - var li = L.DomUtil.create('li', '', ul); - var a = L.DomUtil.create('a', null, li); + a.textContent = routeMaster.name; + a.onclick = (function(routeMasterName) { + return function() { + routeMasterRouteLists[activeRouteMaster].style.display = "none"; + routeMasterRouteLists[routeMasterName].style.display = "block"; + activeRouteMaster = routeMasterName; + }; + })(routeMasterName); - //a.style.borderColor = route.properties.colour; - a.style.background = route.properties.colour; + // The route lists - a.textContent = route.properties.ref; - a.onclick = (function(routeName) { - return function() { - routeLayer.resetRoutes(); - stopLists[activeStopList].style.display = "none"; - stopLists[routeName].style.display = "block"; - activeStopList = routeName; - routeLayer.highlightRoute(routeName); - }; - })(route.properties.name); + var routeList = this._createRouteList(routeMaster); + routeMasterRouteLists[routeMasterName] = routeList; - // The stops + routeList.style.display = "none"; - var stopList = this._createStopList(route); - stopLists[route.properties.name] = stopList; + this._contentContainer.appendChild(routeList); + } - stopList.style.display = "none"; + var activeRouteMaster = "U1"; // TODO: Dont hardcode like this - div.appendChild(stopList); - } + routeMasterRouteLists[activeRouteMaster].style.display = "block"; + }, + _createRouteList: function(routeMaster) { + var div = L.DomUtil.create('div', null); - var activeStopList = routeMaster.routes[0].properties.name; - stopLists[activeStopList].style.display = "block"; - //routeLayer.highlightRoute(activeStopList); + var ul = L.DomUtil.create('ul', 'ls-route-list', div); - return div; - }, - _createStopList: function(route) { - var div = L.DomUtil.create('div', null, this._div); + var routeLayer = this._routeLayer; - var description = L.DomUtil.create('div', 'ls-route-description', div); - description.textContent = route.properties.name.split(": ")[1].replace("=>", "\u2192"); + var stopLists = {}; + for (var i in routeMaster.routes) { + var route = routeMaster.routes[i]; - var ul = L.DomUtil.create('ul', 'ls-stop-list', div); + var li = L.DomUtil.create('li', '', ul); + var a = L.DomUtil.create('a', null, li); - ul.style.listStyleImage = "url(" + LS.imagePath + "bus_stop.png)"; + //a.style.borderColor = route.properties.colour; + a.style.background = route.properties.colour; - var routeLayer = this._routeLayer; - var busStops = routeLayer.getStops(); + a.textContent = route.properties.ref; + a.onclick = (function(routeName) { + return function() { + routeLayer.resetRoutes(); + stopLists[activeStopList].style.display = "none"; + stopLists[routeName].style.display = "block"; + activeStopList = routeName; + routeLayer.highlightRoute(routeName); + }; + })(route.properties.name); - for (var i in route.properties.stops) { - var stop = route.properties.stops[i]; + // The stops - var li = L.DomUtil.create('li', '', ul); + var stopList = this._createStopList(route); + stopLists[route.properties.name] = stopList; - var busStop = busStops[stop]; + stopList.style.display = "none"; - var a = L.DomUtil.create('a', '', li); + div.appendChild(stopList); + } - if (typeof(busStop) !== "undefined") { - a.textContent = busStop.properties.name; - a.onclick = (function(uri) { - return function() { - routeLayer.panToStop(uri, { - animate: true - }); - }; - })(busStop.properties.uri); - a.onmouseover = (function(uri) { - return function() { - routeLayer.highlightStop(uri); - }; - })(busStop.properties.uri); - a.onmouseout = (function(uri) { - return function() { - routeLayer.resetStop(uri); - }; - })(busStop.properties.uri); - } else { - a.textContent = "Name Unknown"; + var activeStopList = routeMaster.routes[0].properties.name; + stopLists[activeStopList].style.display = "block"; + //routeLayer.highlightRoute(activeStopList); + + return div; + }, + _createStopList: function(route) { + var div = L.DomUtil.create('div', null, this._div); + + var description = L.DomUtil.create('div', 'ls-route-description', div); + description.textContent = route.properties.name.split(": ")[1].replace("=>", "\u2192"); + + var ul = L.DomUtil.create('ul', 'ls-stop-list', div); + + ul.style.listStyleImage = "url(" + LS.imagePath + "bus_stop.png)"; + + var routeLayer = this._routeLayer; + var busStops = routeLayer.getStops(); + + for (var i in route.properties.stops) { + var stop = route.properties.stops[i]; + + var li = L.DomUtil.create('li', '', ul); + + var busStop = busStops[stop]; + + var a = L.DomUtil.create('a', '', li); + + if (typeof(busStop) !== "undefined") { + a.textContent = busStop.properties.name; + a.onclick = (function(uri) { + return function() { + routeLayer.panToStop(uri, { + animate: true + }); + }; + })(busStop.properties.uri); + a.onmouseover = (function(uri) { + return function() { + routeLayer.highlightStop(uri); + }; + })(busStop.properties.uri); + a.onmouseout = (function(uri) { + return function() { + routeLayer.resetStop(uri); + }; + })(busStop.properties.uri); + } else { + a.textContent = "Name Unknown"; + } } - } - return div; - } -}); + return div; + } + }); -L.Control.ShowRouteSidebar = L.Control.extend({ - options: { - position: 'topleft', - }, + L.Control.ShowRouteSidebar = L.Control.extend({ + options: { + position: 'topleft', + }, - initialize: function(sidebar, options) { - this._sidebar = sidebar; - }, + initialize: function(sidebar, options) { + this._sidebar = sidebar; + }, - onAdd: function (map) { - var container = L.DomUtil.create('div', 'leaflet-bar leaflet-control'); + onAdd: function (map) { + var container = L.DomUtil.create('div', 'leaflet-bar leaflet-control'); - var link = L.DomUtil.create('a', 'leaflet-bar-part leaflet-bar-part-single', container); - link.href = '#'; + var link = L.DomUtil.create('a', 'leaflet-bar-part leaflet-bar-part-single', container); + link.href = '#'; - var sidebar = this._sidebar; + var sidebar = this._sidebar; - L.DomEvent - .on(link, 'click', L.DomEvent.stopPropagation) - .on(link, 'click', L.DomEvent.preventDefault) - .on(link, 'click', function() { - sidebar.toggle(); - }) - .on(link, 'dblclick', L.DomEvent.stopPropagation); + L.DomEvent + .on(link, 'click', L.DomEvent.stopPropagation) + .on(link, 'click', L.DomEvent.preventDefault) + .on(link, 'click', function() { + sidebar.toggle(); + }) + .on(link, 'dblclick', L.DomEvent.stopPropagation); - return container; - } -}); + return container; + } + }); +} diff --git a/src/leaflet-soton.js b/src/leaflet-soton.js index 98a4f09..3cbb300 100644 --- a/src/leaflet-soton.js +++ b/src/leaflet-soton.js @@ -470,7 +470,7 @@ SELECT * WHERE {\ layer.addData(data[layerName]); } - if (options.busRoutes) { + if ("Route" in L) { var routeLayer = new L.Route(options.busRoutes ? data.busRoutes : emptyFeatureCollection, data.busStops, { routeOptions: { onEachFeature: function(feature, layer) { @@ -494,7 +494,7 @@ SELECT * WHERE {\ }); routeLayer.addTo(map); - if (options.busRouteControl) { + if (options.busRoutes && options.busRouteControl) { var routeControl = new L.Control.Route(routeLayer, "sidebar", { routeMasterSort: function(a, b) { var refs = { |