CAMP/chaloBEST
1
0
Fork 0
Code Issues Pull requests Releases Wiki Activity

lets put a map in there

Browse source
This commit is contained in:
Sanj 2012-02-20 23:48:23 +05:30
parent 7829f6828b
commit 06f75c9f0b
2 changed files with 154 additions and 103 deletions
chaloBEST
static/js
editstops.js
templates
editstops.html

70
chaloBEST/static/js/editstops.js
View file

@ -1,5 +1,8 @@
var API_BASE = "/1.0/"
$(function() {
var API_BASE = "/1.0/",
map;
(function() {
$(function() {
initMap();
$('.tabButton').click(function() {
if ($(this).hasClass("selected")) {
return;
@ -51,9 +54,21 @@ $(function() {
var $loading = $('<span />').addClass("loadingSpan").text("Loading...").appendTo($target);
$.getJSON(url, {}, function(obj) {
$loading.remove();
var stopsGeojson = obj.stops; //TODO: render filtered geojson with known geometries on map
var stopsGeojson = obj.stops;
var stops = stopsGeojson.features;
var $stopsList = getStopsList(stops);
var stopsWithGeom = [];
$.each(stopsGeojson.stops, function(i,v) {
if (!$.isEmptyObject(v.geometry)) {
stopsWithGeom.push(v);
}
});
stopsGeojson.stops = stopsWithGeom;
var currFeatures = jsonLayer.features;
jsonLayer.removeFeatures(currFeatures);
jsonLayer.addFeatures(geojson_format.read(stopsGeojson));
var maxExtent = jsonLayer.getDataExtent();
map.zoomToExtent(maxExtent);
$target.append($stopsList);
$target.data("hasList", true);
$target.data("loading", false);
@ -75,9 +90,9 @@ $(function() {
});
});
});
});
function getStopsList(stops) {
function getStopsList(stops) {
var $ul = $('<ul />').addClass("stopsList").click(function(e) {
var $target = $(e.target);
if ($target.hasClass("selectedStop")) {
@ -97,14 +112,49 @@ function getStopsList(stops) {
$.isEmptyObject(geom) ? $li.addClass("no_has_point") : $li.addClass("has_point");
});
return $ul;
}
}
function getStopForm(stop) {
// console.log(stop);
function getStopForm(stop) {
// console.log(stop);
var $div = $('<div />');
var $displayName = $('<div />').text(stop.display_name).appendTo($div);
var $routes = $('<div />').text("Routes: " + stop.routes).appendTo($div);
// var $form = $('<form />').apendTo($div);
// var $form = $('<form />').apendTo($div);
return $div;
}
}
function initMap() {
var center = new OpenLayers.LonLat(72.855211097628413, 19.010775291486027);
map = new OpenLayers.Map("mapCol", {});
var layers = [];
layers[0] = new OpenLayers.Layer.Google(
"Google Streets", // the default
{numZoomLevels: 20, isBaseLayer: true}
);
geojson_format = new OpenLayers.Format.GeoJSON();
//yes, jsonLayer is global. Yes, I know it's wrong.
jsonLayer = layers[1] = new OpenLayers.Layer.Vector({'geometryType': 'Point'});
// map.addLayer(vector_layer);
map.addLayers(layers);
map.setCenter(center, 12);
mapControl = new OpenLayers.Control.SelectFeature(layers[1]);
zoomControl = new OpenLayers.Control.ZoomToMaxExtent();
map.addControl(mapControl);
// map.addControl(zoomControl);
mapControl.activate();
// zoomControl.activate();
layers[1].events.on({
'featureselected': onFeatureSelect,
'featureunselected': onFeatureUnselect
});
}
function onFeatureSelect(feature) {
console.log("selected", feature);
}
function onFeatureUnselect(feature) {
console.log("unselected", feature);
}
})();

1
chaloBEST/templates/editstops.html
View file

@ -3,6 +3,7 @@
{% block head %}
<link rel="stylesheet" href="/static/css/editstops.css" />
<script type="text/javascript" src="/static/js/editstops.js"></script>
<script type="text/javascript" src="http://openlayers.org/dev/OpenLayers.js"></script>
{% endblock %}