diff options
Diffstat (limited to 'scripts.js')
-rw-r--r-- | scripts.js | 206 |
1 files changed, 203 insertions, 3 deletions
@@ -6,17 +6,20 @@ var $sidebars = [ $('#buildingsSidebar'), - $('#sitesSidebar') + $('#sitesSidebar'), + $('#busRoutesSidebar') ]; var $sidebarLi = [ $('#navBuildingsLi'), - $('#navSitesLi') + $('#navSitesLi'), + $('#navBusRoutesLi') ]; var sidebarHideButtons = [ "buildingsSidebarHideButton", - "sitesSidebarHideButton" + "sitesSidebarHideButton", + "busRoutesSidebarHideButton" ]; function hideSidebars() { @@ -64,6 +67,7 @@ indoor: true, popupWidth: 400, popupHeight: 550, + busRoutes: true, zoomControl: false, levelControlPosition: 'bottomleft' }); @@ -130,8 +134,204 @@ } + function createStopList(route) { + var ul = L.DomUtil.create('ul', 'stop-list'); + + ul.style.listStyleImage = "url(" + LS.imagePath + "bus_stop.png)"; + + var busStops = map.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() { + if (document.body.clientWidth <= 767) { + hideSidebars(); + + map.invalidateSize(); + } + + map.routeLayer.panToStop(uri, { + animate: true + }); + }; + })(busStop.properties.uri); + a.onmouseover = (function(uri) { + return function() { + map.routeLayer.highlightStop(uri); + }; + })(busStop.properties.uri); + a.onmouseout = (function(uri) { + return function() { + map.routeLayer.resetStop(uri); + }; + })(busStop.properties.uri); + } else { + a.textContent = "Name Unknown"; + } + } + + return ul; + } + + function createRouteList(routeMaster, routeSelected) { + var ul = L.DomUtil.create('ul', 'route-list'); + + var stopLists = {}; + for (var i in routeMaster.routes) { + var route = routeMaster.routes[i]; + + var li = L.DomUtil.create('li', '', ul); + var a = L.DomUtil.create('a', null, li); + + a.style.background = route.properties.colour; + + a.textContent = "U"; + var strong = document.createElement("strong"); + strong.textContent = route.properties.ref.slice(1); + a.appendChild(strong); + + a.onclick = (function(routeName) { + return function() { + a.style.border = "2px"; + + routeSelected(routeName); + }; + })(route.properties.name); + } + + return ul; + } + + function buildBusRoutesControl() { + function showStopList(name) { + var previousActiveRoute = activeRouteForRouteMaster[activeRouteMaster]; + + console.log("hiding " + previousActiveRoute); + stopLists[previousActiveRoute].style.display = "none"; + descriptions[previousActiveRoute].style.display = "none" + console.log("showing " + name); + stopLists[name].style.display = "block"; + descriptions[name].style.display = "block" + } + + var busRouteSidebarContent = document.getElementById("busRoutesContent"); + + var routeMasters = map.routeLayer.getRouteMasters(); + var routeMasterRouteLists = {}; + var stopLists = {}; + var descriptions = {}; + + var ul = L.DomUtil.create('ul', '', busRouteSidebarContent); + ul.id = "route-master-list"; + + var routeMasterNames = Object.keys(routeMasters); + routeMasterNames.sort(function(a, b) { + var refs = { + "U1": 1, + "U2": 2, + "U6": 6, + "U9": 9, + "U1N": 10 + }; + + return refs[a] - refs[b]; + }); + + var activeRouteMaster = "U1"; + var activeRouteForRouteMaster = {}; + + 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; + a.textContent = "U"; + + var strong = document.createElement("strong"); + strong.textContent = routeMasterName.slice(1); + + console.log(routeMaster); + + a.appendChild(strong); + + activeRouteForRouteMaster[routeMasterName] = routeMaster.routes[0].properties.name; + + a.onclick = (function(routeMasterName) { + return function() { + routeMasterRouteLists[activeRouteMaster].style.display = "none"; + routeMasterRouteLists[routeMasterName].style.display = "block"; + + var activeRoute = activeRouteForRouteMaster[routeMasterName]; + + showStopList(activeRoute); + + activeRouteMaster = routeMasterName; + + map.routeLayer.resetRoutes(); + map.routeLayer.highlightRoute(activeRoute); + }; + })(routeMasterName); + + // The route lists + + var routeList = createRouteList(routeMaster, function(routeName) { + map.routeLayer.resetRoutes(); + + showStopList(routeName); + + activeRouteForRouteMaster[activeRouteMaster] = routeName; + map.routeLayer.highlightRoute(routeName); + }); + + routeMasterRouteLists[routeMasterName] = routeList; + + routeList.style.display = "none"; + busRouteSidebarContent.appendChild(routeList); + + // The stops + for (var i in routeMaster.routes) { + var route = routeMaster.routes[i]; + + // Add the description + var description = L.DomUtil.create('div', 'ls-route-description'); + description.textContent = route.properties.name.split(": ")[1].replace("=>", "\u2192"); + + descriptions[route.properties.name] = description; + + // Add the list of stops + var stopList = createStopList(route); + stopLists[route.properties.name] = stopList; + + if (activeRouteMaster === routeMasterName && + activeRouteForRouteMaster[routeMasterName] === route.properties.name) { + + stopList.style.display = "block"; + description.style.display = "block"; + } else { + stopList.style.display = "none"; + description.style.display = "none"; + } + + busRouteSidebarContent.appendChild(description); + busRouteSidebarContent.appendChild(stopList); + } + } + + routeMasterRouteLists[activeRouteMaster].style.display = "block"; + } + /* Typeahead search functionality */ LS.getData(function(data) { + buildBusRoutesControl(); function buildRow(first, second) { var tr = document.createElement("tr"); |