diff --git a/src/c3nav/site/static/site/js/c3nav.js b/src/c3nav/site/static/site/js/c3nav.js index ff8dbdfd..1855ab37 100644 --- a/src/c3nav/site/static/site/js/c3nav.js +++ b/src/c3nav/site/static/site/js/c3nav.js @@ -64,7 +64,10 @@ c3nav = { $search.addClass('location-view'); } } - if (location !== null) c3nav.add_location_to_map(location); + c3nav.update_map_locations(); + if (location !== null) { + c3nav.fly_to_bounds(); + } }, _locationinput_reset: function (elem) { // reset this locationinput to its last location @@ -185,13 +188,19 @@ c3nav = { val_trimmed = $.trim(val), val_words = val_trimmed.toLowerCase().split(/\s+/), val_words_key = val_words.join(' '), - $autocomplete = $('#autocomplete'); - $(this).parent().removeClass('selected').toggleClass('empty', val === '').data('location', null); - if ($(this).parent().attr('id') === 'destination-input') { + $autocomplete = $('#autocomplete'), + $parent = $(this).parent(); + $parent.toggleClass('empty', val === ''); + if ($parent.is('.selected')) { + $parent.removeClass('selected').data('location', null); + } + + if ($parent.attr('id') === 'destination-input') { $('#search').removeClass('location-view'); + c3nav.update_map_locations(); } $autocomplete.find('.focus').removeClass('focus'); - c3nav.current_locationinput = $(this).parent().attr('id'); + c3nav.current_locationinput = $parent.attr('id'); if (val_trimmed === '') { c3nav._locationinput_reset_autocomplete(); @@ -271,12 +280,13 @@ c3nav = { // setup level control c3nav._levelControl = new LevelControl().addTo(c3nav.map); - c3nav._markerLayers = {}; + c3nav._locationLayers = {}; + c3nav._locationLayerBounds = {}; c3nav._routeLayers = {}; for (var i = c3nav.levels.length - 1; i >= 0; i--) { var level = c3nav.levels[i]; var layerGroup = c3nav._levelControl.addLevel(level[0], level[1]); - c3nav._markerLayers[level[0]] = L.layerGroup().addTo(layerGroup); + c3nav._locationLayers[level[0]] = L.layerGroup().addTo(layerGroup); c3nav._routeLayers[level[0]] = L.layerGroup().addTo(layerGroup); } c3nav._levelControl.finalize(); @@ -285,29 +295,67 @@ c3nav = { c3nav.schedule_refresh_tile_access(); }, - clear_map: function() { - for (var level_id in c3nav._markerLayers) { - c3nav._markerLayers[level_id].clearLayers() + update_map_locations: function () { + var $origin = $('#origin-input'), + $destination = $('#destination-input'), + bounds = {}; + for (var level_id in c3nav._locationLayers) { + c3nav._locationLayers[level_id].clearLayers() } - for (var level_id in c3nav._routeLayers) { - c3nav._routeLayers[level_id].clearLayers() + if ($origin.is('.selected')) { + c3nav._merge_bounds(bounds, c3nav._add_location_to_map($origin.data('location'))) + } + if ($destination.is('.selected')) { + c3nav._merge_bounds(bounds, c3nav._add_location_to_map($destination.data('location'))); + } + c3nav._locationLayerBounds = bounds; + }, + fly_to_bounds: function() { + var level = c3nav._levelControl.currentLevel, + bounds = null; + + if (c3nav._locationLayerBounds[level] !== undefined) { + bounds = c3nav._locationLayerBounds[level]; + } else { + for (var level_id in c3nav._locationLayers) { + if (c3nav._locationLayerBounds[level_id] !== undefined) { + bounds = c3nav._locationLayerBounds[level_id]; + level = level_id + } + } + } + c3nav._levelControl.setLevel(level); + if (bounds !== null) { + c3nav.map.flyToBounds(bounds, { + duration: 1 + }); } }, - add_location_to_map: function(location) { + _add_location_to_map: function(location) { if (location.locations !== undefined) { - var bounds = EmptyBounds; + var bounds = {}; for (var i=0; i