moved static files to separate directories
This commit is contained in:
192
app/static/js/fillingstations.js
Normal file
192
app/static/js/fillingstations.js
Normal file
@@ -0,0 +1,192 @@
|
||||
// initially go to Brandenburger Tor
|
||||
var lat = 52.516275,
|
||||
lon = 13.377704,
|
||||
zoom = 13;
|
||||
|
||||
var map;
|
||||
|
||||
var filling_stations = {};
|
||||
var filling_station_markers;
|
||||
|
||||
query_location = function(updater) {
|
||||
if(navigator.geolocation) {
|
||||
navigator.geolocation.getCurrentPosition(function(position) {
|
||||
lat = position.coords.latitude;
|
||||
lon = position.coords.longitude;
|
||||
if(updater){
|
||||
updater(lat, lon);
|
||||
}
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
update_map = function() {
|
||||
var lonLat = new OpenLayers.LonLat( lon, lat )
|
||||
.transform(
|
||||
new OpenLayers.Projection("EPSG:4326"), // transform from WGS 1984
|
||||
map.getProjectionObject() // to Spherical Mercator Projection
|
||||
);
|
||||
map.setCenter (lonLat, zoom);
|
||||
}
|
||||
|
||||
load_filling_stations = function() {
|
||||
var url = '/filling_stations?latitude=' + lat + '&longitude='+ lon + '&type=all&radius=5&sort=dist';
|
||||
$.ajax({
|
||||
type: 'GET',
|
||||
url: url,
|
||||
success: function(data) {
|
||||
data.stations.forEach(function(station) {
|
||||
if (!(station.id in filling_stations)) {
|
||||
filling_stations[station.id] = station;
|
||||
filling_stations[station.id].marker = false;
|
||||
}
|
||||
});
|
||||
update_filling_station_markers();
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
clicked_on_filling_station_marker = function(station, marker) {
|
||||
return function(data) {
|
||||
console.log(station);
|
||||
console.log(marker);
|
||||
$.ajax({
|
||||
type: 'GET',
|
||||
url: '/filling_stations/favourites/toggle/'+station.id,
|
||||
dataType: 'json',
|
||||
timeout: 1000,
|
||||
success: function(data) {
|
||||
console.log(data);
|
||||
if (data.state == 'favourite') {
|
||||
marker.setUrl('/static/img/filling_station_favourite_marker.png');
|
||||
} else {
|
||||
marker.setUrl('/static/img/filling_station_marker.png');
|
||||
}
|
||||
},
|
||||
contentType : 'application/json'
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
display_station_information = function(station) {
|
||||
return function(event) {
|
||||
console.log(station);
|
||||
|
||||
var info = $('#station_info');
|
||||
info.empty();
|
||||
info.addClass('filling_station_info');
|
||||
|
||||
var cell1 = $('<div>', {'class':'col-md-8'})
|
||||
var cell2 = $('<div>', {'class':'col-md-4'})
|
||||
|
||||
var img = $('<img>', {'src': '/static/logos/'+station.brand.toLowerCase()+'.png'});
|
||||
|
||||
var name = $('<div>').text(station.name);
|
||||
|
||||
var street_number = $('<div>').text(station.street + ' ' + station.houseNumber);
|
||||
|
||||
var postcode_place = $('<div>').text(station.postCode + ' ' + station.place);
|
||||
|
||||
info.append(cell1
|
||||
.append(name)
|
||||
.append(street_number)
|
||||
.append(postcode_place))
|
||||
.append(cell2
|
||||
.append(img));
|
||||
|
||||
console.log(cell1.height())
|
||||
cell2.height(cell1.height());
|
||||
};
|
||||
}
|
||||
|
||||
update_filling_station_markers = function() {
|
||||
for(id in filling_stations) {
|
||||
var station = filling_stations[id];
|
||||
if(!station.marker) {
|
||||
console.log(station.id);
|
||||
var lonLat = new OpenLayers.LonLat(station.lng, station.lat)
|
||||
.transform(new OpenLayers.Projection('EPSG:4326'), map.getProjectionObject());
|
||||
if (station.state == 'favourite') {
|
||||
var icon = new OpenLayers.Icon('/static/img/filling_station_favourite_marker.png');
|
||||
} else {
|
||||
var icon = new OpenLayers.Icon('/static/img/filling_station_marker.png');
|
||||
}
|
||||
var marker = new OpenLayers.Marker(lonLat, icon);
|
||||
marker.events.register('click', marker, clicked_on_filling_station_marker(station, marker));
|
||||
marker.events.register('mouseover', null, display_station_information(station));
|
||||
marker.events.register('mouseout', null, function(e){console.log('out');});
|
||||
filling_station_markers.addMarker(marker);
|
||||
station.marker = true;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
activate_map = function(map_div_id, button_ids, home_lat, home_long, home_zoom, init_stations) {
|
||||
|
||||
// resize to reasonable height
|
||||
$('#' + map_div_id).css('height',0.75*($('#' + map_div_id).css('width')));
|
||||
|
||||
// init map
|
||||
map = new OpenLayers.Map(map_div_id);
|
||||
map.addLayer(new OpenLayers.Layer.OSM());
|
||||
map.events.register('moveend', null, function(e){
|
||||
var p = e.object.center.clone();
|
||||
var p = p.transform(map.getProjectionObject(), 'EPSG:4326');
|
||||
lon = p.lon;
|
||||
lat = p.lat;
|
||||
zoom = e.object.zoom;
|
||||
});
|
||||
filling_station_markers = new OpenLayers.Layer.Markers('Filling Stations');
|
||||
map.addLayer(filling_station_markers);
|
||||
|
||||
// handle initial / favourite stations
|
||||
filling_stations = init_stations;
|
||||
update_filling_station_markers();
|
||||
|
||||
update_map();
|
||||
if ((home_lat == 0) && (home_long == 0)) {
|
||||
query_location(update_map);
|
||||
} else {
|
||||
lat = home_lat;
|
||||
lon = home_long;
|
||||
zoom = home_zoom;
|
||||
console.log(lat, long);
|
||||
update_map();
|
||||
}
|
||||
|
||||
// get button
|
||||
$('#'+button_ids[0]).click(function(e){
|
||||
console.log('clicked get button');
|
||||
load_filling_stations();
|
||||
});
|
||||
// set home button
|
||||
$('#'+button_ids[1]).click(function(e){
|
||||
console.log('clicked set home');
|
||||
$.ajax({
|
||||
type: 'POST',
|
||||
url: '/account/home',
|
||||
data: JSON.stringify({'long': lon, 'lat': lat, 'zoom': zoom}),
|
||||
dataType: 'json',
|
||||
timeout: 1000,
|
||||
contentType : 'application/json'
|
||||
});
|
||||
});
|
||||
// go home button
|
||||
$('#'+button_ids[2]).click(function(e){
|
||||
console.log('clicked the go home button');
|
||||
$.ajax({
|
||||
type: 'GET',
|
||||
url: '/account/home',
|
||||
dataType: 'json',
|
||||
timeout: 1000,
|
||||
success: function(data) {
|
||||
console.log(data);
|
||||
lat = data.lat;
|
||||
lon = data.long;
|
||||
zoom = data.zoom;
|
||||
update_map();
|
||||
},
|
||||
contentType : 'application/json'
|
||||
});
|
||||
});
|
||||
}
|
||||
4
app/static/js/jquery.tablesorter.min.js
vendored
Normal file
4
app/static/js/jquery.tablesorter.min.js
vendored
Normal file
File diff suppressed because one or more lines are too long
80
app/static/js/main.js
Normal file
80
app/static/js/main.js
Normal file
@@ -0,0 +1,80 @@
|
||||
function createChart(id, data, unit) {
|
||||
return AmCharts.makeChart(id, {
|
||||
"type": "serial",
|
||||
//"theme": "chalk",
|
||||
//"marginRight": 40,
|
||||
//"marginLeft": 40,
|
||||
//"autoMarginOffset": 20,
|
||||
"mouseWheelZoomEnabled":true,
|
||||
"dataDateFormat": "YYYY-MM-DD",
|
||||
"valueAxes": [{
|
||||
"id": "v1",
|
||||
"axisAlpha": 0,
|
||||
"position": "left",
|
||||
"ignoreAxisWidth":true,
|
||||
// "title": unit
|
||||
}],
|
||||
"balloon": {
|
||||
"borderThickness": 1,
|
||||
"shadowAlpha": 10,
|
||||
},
|
||||
"graphs": [{
|
||||
"id": "g1",
|
||||
"balloon":{
|
||||
"drop":false,
|
||||
"adjustBorderColor":false,
|
||||
"color":"#ffffff",
|
||||
},
|
||||
"bullet": "round",
|
||||
"bulletBorderAlpha": 1,
|
||||
"bulletColor": "#000000",
|
||||
"bulletSize": 5,
|
||||
"hideBulletsCount": 50,
|
||||
"lineThickness": 2,
|
||||
// "title": unit,
|
||||
//"useLineColorForBulletBorder": true,
|
||||
"valueField": "value",
|
||||
"balloonText": "<span style='font-size:18px;'>[[value]] "+unit+"</span>"
|
||||
}],
|
||||
"chartScrollbar": {
|
||||
"graph": "g1",
|
||||
"oppositeAxis":false,
|
||||
"offset":30,
|
||||
"scrollbarHeight": 80,
|
||||
"backgroundAlpha": 0,
|
||||
"selectedBackgroundAlpha": 0.1,
|
||||
"selectedBackgroundColor": "#888888",
|
||||
"graphFillAlpha": 0,
|
||||
"graphLineAlpha": 0.5,
|
||||
"selectedGraphFillAlpha": 0,
|
||||
"selectedGraphLineAlpha": 1,
|
||||
"autoGridCount":true,
|
||||
"color":"#AAAAAA"
|
||||
},
|
||||
"chartCursor": {
|
||||
"pan": true,
|
||||
"valueLineEnabled": true,
|
||||
"valueLineBalloonEnabled": true,
|
||||
"cursorAlpha":1,
|
||||
"cursorColor":"#258cbb",
|
||||
"limitToGraph":"g1",
|
||||
"valueLineAlpha":0.2,
|
||||
"valueZoomable":true
|
||||
},
|
||||
"valueScrollbar":{
|
||||
"oppositeAxis":false,
|
||||
"offset":50,
|
||||
"scrollbarHeight":10
|
||||
},
|
||||
"categoryField": "date",
|
||||
"categoryAxis": {
|
||||
"parseDates": true,
|
||||
"dashLength": 1,
|
||||
// "minorGridEnabled": true
|
||||
},
|
||||
"export": {
|
||||
"enabled": true
|
||||
},
|
||||
"dataProvider": data
|
||||
});
|
||||
}
|
||||
Reference in New Issue
Block a user