summaryrefslogtreecommitdiff
path: root/chimere/static/main_map.js
diff options
context:
space:
mode:
Diffstat (limited to 'chimere/static/main_map.js')
-rw-r--r--chimere/static/main_map.js413
1 files changed, 413 insertions, 0 deletions
diff --git a/chimere/static/main_map.js b/chimere/static/main_map.js
new file mode 100644
index 0000000..1849713
--- /dev/null
+++ b/chimere/static/main_map.js
@@ -0,0 +1,413 @@
+/* Copyright (C) 2008 Étienne Loks <etienne.loks_AT_peacefrogsDOTnet>
+
+This program is free software: you can redistribute it and/or modify
+it under the terms of the GNU General Public License as
+published by the Free Software Foundation, either version 3 of the
+License, or (at your option) any later version.
+
+This program is distributed in the hope that it will be useful,
+but WITHOUT ANY WARRANTY; without even the implied warranty of
+MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
+GNU General Public License for more details.
+
+You should have received a copy of the GNU General Public License
+along with this program. If not, see <http://www.gnu.org/licenses/>.
+
+See the file COPYING for details.
+*/
+
+/* main map */
+
+var current_cat;
+
+/* open a category section */
+function toggleCategory(id){
+ old = document.getElementById('maincategory_' + current_cat)
+ if(old){
+ old.style.display = 'None';
+ old_img = document.getElementById('maincategory_img_' + current_cat);
+ old_img.src = "/" + extra_url + "static/icons/plus.png";
+ }
+ if (id != current_cat){
+ current_cat = id;
+ document.getElementById('maincategory_' + current_cat).style.display = 'block';
+ img = document.getElementById('maincategory_img_' + current_cat);
+ img.src = "/" + extra_url + "static/icons/minus.png";
+ } else {
+ current_cat = 0;
+ }
+}
+
+/* check all the categories if clicked, unckeck if unclick */
+function checkAll(item, ids){
+ check = false;
+ if(item.checked == true){
+ check = true;
+ }
+ for (i in ids){
+ document.getElementById('category_'+ids[i]).checked = check;
+ }
+}
+
+var map;
+var permalink;
+
+/* default size and offset for icon */
+var size = new OpenLayers.Size(21, 25);
+var offset = new OpenLayers.Pixel(-(size.w/2), -size.h);
+
+/* define global variable */
+var markers = new Array();
+var layerMarkers;
+var layerVectors;
+
+var currentPopup;
+var currentFeature;
+var clicked = false;
+
+/* show a popup */
+function showPop(feature) {
+ if (currentPopup != null) {
+ currentPopup.hide();
+ }
+ if (feature.popup == null) {
+ feature.popup = feature.createPopup();
+ map.addPopup(feature.popup);
+ } else {
+ feature.popup.toggle();
+ }
+ currentPopup = feature.popup;
+ /* hide on click on the cloud */
+ currentPopup.groupDiv.onclick = hidePopUp;
+}
+
+/* check checked categories */
+var checked_categories;
+var display_submited = false;
+
+function updateCheckedCategories(){
+ /* get checked categories */
+ inputs = window.document.forms["frm_categories"];
+ checked_categories = '';
+ display_submited = false;
+ for (var i = 0; i < inputs.length; i++) {
+ input = inputs[i];
+ // 'category_'.length : 9
+ if (input.checked
+ && input.name.substring(9, 0) == 'category_'){
+ id = input.name.substring(9, input.name.length);
+ if(checked_categories) checked_categories += '_';
+ checked_categories += id;
+ }
+ if (input.checked && input.name == 'display_submited'){
+ display_submited = true;
+ }
+ }
+ permalink.updateLink();
+}
+
+/* load marker and route layer from a JSON feature string */
+function loadLayersFromJSON(layer_markers, layer_vectors, geo_objects){
+ for (var i = 0; i < geo_objects.features.length; i++) {
+ var feature = geo_objects.features[i];
+ if (feature.geometry.type == 'Point'){
+ putMarker(layer_markers, feature);
+ } else if (feature.geometry.type == 'LineString') {
+ putRoute(layer_vectors, feature);
+ }
+ }
+}
+
+/* zoom to an area */
+function zoomToArea(top, left, bottom, right){
+ var bounds = new OpenLayers.Bounds(left, bottom, right, top);
+ map.zoomToExtent(bounds, true);
+}
+
+/* zoom to a desired category */
+function zoomToCategory(categorie_ids){
+ updateCheckedCategories();
+ /* 0 stand for all categories */
+ var uri = "/" + extra_url + "getGeoObjects/" + categorie_ids;
+ if (display_submited) uri += "/A_S";
+ OpenLayers.loadURL(uri, '', this, zoomToCategoryExtent);
+}
+
+/* zoom to a selected category from an http response GeoJSON */
+function zoomToCategoryExtent(response){
+ if (response.responseText.indexOf('no results') != -1) return;
+ var fakeLayerVectors = new OpenLayers.Layer.Vector("Fake vector layer");
+ var fakeLayerMarkers = new OpenLayers.Layer.Markers('Fake POIs layer');
+ var json = new OpenLayers.Format.JSON();
+ var geo_objects = json.read(response.responseText);
+ /* load every geo object */
+ loadLayersFromJSON(fakeLayerMarkers, fakeLayerVectors, geo_objects);
+ var bounds = fakeLayerMarkers.getDataExtent();
+ if (bounds){
+ bounds.extend(fakeLayerVectors.getDataExtent());
+ } else {
+ bounds = fakeLayerVectors.getDataExtent();
+ }
+ if(bounds){
+ map.zoomToExtent(bounds);
+ }
+ fakeLayerMarkers.destroy();
+ fakeLayerVectors.destroy();
+}
+
+/* load geo objects with an AJAX request */
+function loadGeoObjects(){
+ updateCheckedCategories();
+ /* 0 stand for all categories */
+ if (!checked_categories) checked_categories = '0';
+ var uri = "/" + extra_url + "getGeoObjects/" + checked_categories;
+ if (display_submited) uri += "/A_S";
+ OpenLayers.loadURL(uri, '', this, setGeoObjects);
+}
+
+/* update the marker and vector layers from an http response GeoJSON */
+function setGeoObjects(response){
+ if(layerMarkers) layerMarkers.destroy();
+ if(layerVectors) layerVectors.destroy();
+ if (response.responseText.indexOf('no results') == -1) {
+ /* clean the marker layer */
+ if (currentPopup) {
+ currentPopup.hide();
+ hide('detail');
+ }
+ layerVectors = new OpenLayers.Layer.Vector("Vector Layer");
+ map.addLayer(layerVectors);
+ layerVectors.setOpacity(0.8);
+ layerMarkers = new OpenLayers.Layer.Markers('POIs');
+ map.addLayer(layerMarkers);
+ layerMarkers.setOpacity(0.8);
+
+ var json = new OpenLayers.Format.JSON();
+ var geo_objects = json.read(response.responseText);
+ /* load every geo object */
+ loadLayersFromJSON(layerMarkers, layerVectors, geo_objects);
+ /*
+ var geojson = new OpenLayers.Format.GeoJSON();
+ var markers_pt = geojson.read(response.responseText);
+ for (var i = 0; i < markers_pt.length; i++) {
+ putMarker2(markers_pt[i]);
+ }*/
+ }
+}
+
+/* put a route on the map */
+function putRoute(layer, route) {
+ var polyline = route.geometry;
+ var point_array = new Array();
+ for (i=0; i<polyline.coordinates.length; i++){
+ var point = new OpenLayers.Geometry.Point(polyline.coordinates[i][0],
+ polyline.coordinates[i][1]);
+ point_array.push(point);
+ }
+ var linestring = new OpenLayers.Geometry.LineString(point_array);
+ currentFeature = new OpenLayers.Feature.Vector();
+
+ var style = OpenLayers.Util.extend({},
+ OpenLayers.Feature.Vector.style['default']);
+ style.strokeColor = route.properties.color;
+ style.strokeWidth = 3;
+ currentFeature.style = style;
+ currentFeature.geometry = linestring;
+ layer.addFeatures([currentFeature]);
+}
+
+
+/* put a marker on the map */
+function putMarker(layer, mark) {
+ /* initialise a new marker with appropriate attribute for setting a
+ marker */
+ lat = mark.geometry.coordinates[1];
+ lon = mark.geometry.coordinates[0];
+ var size = new OpenLayers.Size(mark.properties.icon_width,
+ mark.properties.icon_height);
+ iconclone = new OpenLayers.Icon(media_path + mark.properties.icon_path,
+ size, offset);
+ var feature = new OpenLayers.Feature(markers,
+ new OpenLayers.LonLat(lon, lat).transform(epsg_display_projection,
+ epsg_projection),
+ {icon:iconclone});
+ /*feature.closeBox = false;*/
+ feature.pk = mark.properties.pk;
+ feature.popupClass = OpenLayers.Class(OpenLayers.Popup.FramedCloud);
+ feature.data.popupContentHTML = "<div class='cloud'>";
+ feature.data.popupContentHTML += mark.properties.name;
+ feature.data.popupContentHTML += "</div>";
+ feature.data.overflow = 'hidden';
+ var marker = feature.createMarker();
+ /* manage markers events */
+ var markerClick = function (evt) {
+ currentFeature = this;
+ if (clicked) {
+ if (currentPopup == this.popup) {
+ this.popup.hide();
+ clicked = false;
+ hide('detail');
+ } else {
+ currentPopup.hide();
+ showPop(this);
+ updateDetail(this.pk);
+ }
+ } else {
+ showPop(this);
+ clicked = true;
+ updateDetail(this.pk);
+ }
+ OpenLayers.Event.stop(evt);
+ };
+ var markerOver = function (evt) {
+ document.body.style.cursor='pointer';
+ OpenLayers.Event.stop(evt);
+ };
+ var markerOut = function (evt) {
+ document.body.style.cursor='auto';
+ OpenLayers.Event.stop(evt);
+ };
+ marker.events.register('click', feature, markerClick);
+ marker.events.register('mouseover', feature, markerOver);
+ marker.events.register('mouseout', feature, markerOut);
+ layer.addMarker(marker);
+ return feature;
+}
+
+var hidePopUp = function (evt) {
+ if (clicked) {
+ currentPopup.hide();
+ clicked = false;
+ hide('detail');
+ }
+}
+
+/* update current detail panel with an AJAX request */
+function updateDetail(pk){
+ var uri = "/" + extra_url + "getDetail/" + pk;
+ OpenLayers.loadURL(uri, '', this, setDetail);
+}
+
+/* update the detail panel from an http response */
+function setDetail(response){
+ if (response.responseText.indexOf('no results') == -1) {
+ document.getElementById('detail').innerHTML = response.responseText;
+ show('detail');
+ }
+}
+
+/* show the detail of a category */
+function displayCategoryDetail(category_id) {
+ var uri = "/" + extra_url + "getDescriptionDetail/" + category_id;
+ OpenLayers.loadURL(uri, '', this, setCategoryDetail);
+}
+
+/* update the category detail panel from an http response */
+function setCategoryDetail(response){
+ if (response.responseText.indexOf('no results') == -1) {
+ document.getElementById('category_detail').innerHTML =
+ response.responseText;
+ show('category_detail');
+ }
+}
+
+/* new permalink createParams method - update when facilities are given to
+personalize the permalink */
+function createParams(center, zoom, layers) {
+ center = center || this.map.getCenter();
+ var params = OpenLayers.Util.getParameters(this.base);
+ // If there's still no center, map is not initialized yet.
+ // Break out of this function, and simply return the params from the
+ // base link.
+ if (center) {
+ //zoom
+ params.zoom = zoom || this.map.getZoom();
+ //lon,lat
+ var lat = center.lat;
+ var lon = center.lon;
+ if (this.displayProjection) {
+ var mapPosition = OpenLayers.Projection.transform(
+ { x: lon, y: lat },
+ this.map.getProjectionObject(),
+ this.displayProjection );
+ lon = mapPosition.x;
+ lat = mapPosition.y;
+ }
+ params.lat = Math.round(lat*100000)/100000;
+ params.lon = Math.round(lon*100000)/100000;
+ //layers
+ layers = layers || this.map.layers;
+ params.layers = '';
+ for (var i=0, len=layers.length; i<len; i++) {
+ var layer = layers[i];
+
+ if (layer.isBaseLayer) {
+ params.layers += (layer == this.map.baseLayer) ? "B" : "0";
+ } else {
+ params.layers += (layer.getVisibility()) ? "T" : "F";
+ }
+ }
+ /* only piece of code added */
+ params.checked_categories = checked_categories;
+ params.display_submited = display_submited;
+ }
+ return params;
+}
+
+/* main initialisation function */
+function init(){
+ /* set the main map */
+ var options = {
+ controls:[new OpenLayers.Control.Navigation(),
+ new OpenLayers.Control.PanPanel(),
+ new OpenLayers.Control.ZoomPanel(),
+ new OpenLayers.Control.ScaleLine()],
+ maxResolution: 156543.0399,
+ units: 'm',
+ projection: new OpenLayers.Projection('EPSG:4326'),
+ theme:null,
+ };
+ if (restricted_extent){options['restrictedExtent'] = restricted_extent;}
+ map = new OpenLayers.Map('map', options);
+ permalink = new OpenLayers.Control.Permalink("permalink");
+ permalink.createParams = createParams;
+ map.addControl(permalink);
+ // update with the translated permalink label
+ if(permalink_label && permalink.div && permalink.div.childNodes.length > 0){
+ permalink.div.childNodes[0].textContent = permalink_label;
+ }
+ map.addLayers([map_layer]);
+
+ map.events.register('click', map, hidePopUp);
+
+ /* if from a permalink */
+ if (p_zoom) {
+ var p_centerLonLat = new OpenLayers.LonLat(p_lon, p_lat);
+ map.setCenter(p_centerLonLat, p_zoom);
+ if (p_display_submited) {
+ document.getElementById('display_submited_check').checked = true;
+ }
+ if (p_checked_categories){
+ /* ckeck selected categories and uncheck others */
+ inputs = window.document.forms["frm_categories"];
+ for (var i = 0; i < inputs.length; i++) {
+ input = inputs[i];
+ if (input.name.substring(9, 0) == 'category_'){
+ id = input.name.substring(9, input.name.length);
+ input.checked = false;
+ for (var cc=0; cc < p_checked_categories.length; cc++){
+ if (p_checked_categories[cc] == id){
+ input.checked = true;
+ }
+ }
+ }
+ }
+ }
+ }
+ /* if not zoom to the extent in cookies */
+ else if (!zoomToCurrentExtent(map)){
+ /* if no extent in cookies zoom to default */
+ map.setCenter(centerLonLat, 13);
+ }
+ loadGeoObjects();
+}