//Define Variables var Ext, OpenLayers, GeoExt, alert, google, mappanel, Proj4js, printCapabilities, printDialog, saveStrategy, map, WGS84, WGS84_google_mercator, os, google_hybrid, google_physical, google_satellite, wfs_style, wfs_layer, symbolizer, grid_layer, groupLayer, mapPanel, printPage, store, gridSelectStore, gridSelect, modifyControl, gridPanel, toggleGroup, slider, LayerNodeUI, treeConfig, tree, legendPanel, westPanel; //set up the Proxy OpenLayers.ProxyHost = "/cgi-bin/proxy.cgi?url="; Ext.onReady(function() { //set up a save strategy var saveStrategy = new OpenLayers.Strategy.Save(); saveStrategy.events.register('success', null, saveSuccess); saveStrategy.events.register('fail', null, saveFail); function saveSuccess(event) { Ext.Msg.alert('Success', 'Changes saved successfully.'); } function saveFail(event) { Ext.Msg.alert('Error', 'Changes not saved. If error persists please contact support at gld186@bham.ac.uk'); } //set up projections Proj4js.defs["EPSG:27700"] = "+proj=tmerc +lat_0=49 +lon_0=-2 +k=0.9996012717 +x_0=400000 +y_0=-100000 +ellps=airy +datum=OSGB36 +units=m +no_defs "; Proj4js.defs["EPSG:900913"] = "+title= Google Mercator EPSG:900913 +proj=merc +a=6378137 +b=6378137 +lat_ts=0.0 +lon_0=0.0 +x_0=0.0 +y_0=0 +k=1.0 +units=m +nadgrids=@null +no_defs"; // World Geodetic System 1984 projection var WGS84 = new OpenLayers.Projection("EPSG:4326"); // WGS84 Google Mercator projection var WGS84_google_mercator = new OpenLayers.Projection("EPSG:900913"); // OS British National Grid var os = new OpenLayers.Projection("EPSG:27700"); var bounds = new OpenLayers.Bounds(-128 * 156543.0339, -128 * 156543.0339, 128 * 156543.0339, 128 * 156543.0339); //Create the map object var map = new OpenLayers.Map('map_element',{ maxExtent: bounds, maxResolution: "auto", units: 'm', projection: os, displayProjection: os, controls:[ //adds scaleline new OpenLayers.Control.ScaleLine(), //add load mask new OpenLayers.Control.LoadingPanel(), //adds Permlink new OpenLayers.Control.Permalink(), //allows the user pan ability new OpenLayers.Control.Navigation(), //displays the pan/zoom tools new OpenLayers.Control.PanZoom(), //displays the mouse position's coordinates new OpenLayers.Control.MousePosition( {div:document.getElementById("")}) ] } ); //Create Google Map Layer objects var google_hybrid = new OpenLayers.Layer.Google( "Google Hybrid", {type: google.maps.MapTypeId.HYBRID, numZoomLevels: 22, transitionEffect: "resize"} ); var google_physical = new OpenLayers.Layer.Google( "Google Physical", {type: google.maps.MapTypeId.TERRAIN, transitionEffect: "resize"} ); var google_satellite = new OpenLayers.Layer.Google( "Google Satellite", {type: google.maps.MapTypeId.SATELLITE, numZoomLevels: 22, transitionEffect: "resize"} ); // Create WFS layer style var wfs_style = { title: "Features", pointRadius: 5, fillColor: "#4169E1", fillOpacity: 0.4, strokeColor: "#FF0000", strokeOpacity: 1, strokeWidth: 1 }; // Create WFS layers var wfs_layer = new OpenLayers.Layer.Vector("Features", { strategies: [new OpenLayers.Strategy.BBOX(), saveStrategy], protocol: new OpenLayers.Protocol.WFS({ reportError: true, visibility: true, url: "http://gislidar.serveftp.com/geoserver/wfs", featureType: "glo_lidarweb", featureNS: "http://lidartest.org", geometryName: "geom", version: "1.0.0", srsName: "EPSG:27700", projection: WGS84_google_mercator }), styleMap: new OpenLayers.StyleMap(wfs_style) }); //Create Grid layer style var symbolizer = { title: "5km Grid", pointRadius: 5, fillColor: "white", fillOpacity: 0, strokeColor: "black", strokeOpacity: 1, strokeWidth: 1, label: "${TILE_NAME}" }; // Create Grid layer var grid_layer = new OpenLayers.Layer.Vector("5km Grid", { strategies: [new OpenLayers.Strategy.Fixed()], protocol: new OpenLayers.Protocol.WFS({ visibility: true, url: "http://gislidar.serveftp.com/geoserver/wfs", featureType: "OS5km", featureNS: "http://lidartest.org", geometryName: "the_geom", version: "1.0.0", srsName: "EPSG:27700", projection: WGS84_google_mercator }), styleMap: new OpenLayers.StyleMap(symbolizer) }); // Create Lidar layers var groupLayer = new OpenLayers.Layer.WMS("Choose Lidar Visualisation", "http://gislidar.serveftp.com/geoserver/wms", { layers: [ "Lidar:DTM_Hillshade", "Lidar:DTM_SVF", "Lidar:DTM_Slope", "Lidar:DTM_PCA" ], legend: true, format: "image/png", transparent: true }, {singleTile: false, isBaseLayer: false, buffer: 0, visibility: false, displayInLayerSwitcher: false, transitionEffect: "resize"} ); // Create Ist edition OS layer var firsted = new OpenLayers.Layer.WMS("1st Edition OS", "http://gislidar.serveftp.com/geoserver/wms", { layers: 'firsted', format: "image/png", legend: false, transparent: true, numZoomLevels: 22 }, { singleTile: false, ratio: 1, transitionEffect: "resize", isBaseLayer: false, visibility: false } ); // Create OpenStreet Map layer var osm = new OpenLayers.Layer.OSM(); //Create Feature Store var store = new GeoExt.data.FeatureStore({ fields: [ {name: "name", type: "string"}, {name: "feature_description", type: "string"}, {name: "period", type: "string"}, {name: "source", type: "string"}, {name: "value", type: "float"}, {name: "recorded_by", type: "string"} ], layer: wfs_layer, addFeatureFilter: function(feature) { return feature.state !== OpenLayers.State.DELETE; } }); // configure store for grid select combo box var gridSelectStore = new Ext.data.SimpleStore({fields: [{ name: 'lon', type: 'float' }, { name: 'lat', type: 'float' }, { name: 'zoom', type: 'float' }, { name: 'label', type: 'string' }], data: [['-242805', '6757851', '13', 'SO80NE'], ['-250871', '6757827', '13', 'SO80NW'], ['-242845', '6774041', '13', 'SO81NE'], ['-242825', '6765942', '13', 'SO81SE'], ['-226672', '6757875', '13', 'SO90NE'], ['-234739', '6757867', '13', 'SO90NW'], ['-226680', '6774066', '13', 'SO91NE'], ['-234763', '6774058', '13', 'SO91NW'], ['-226676', '6765966', '13', 'SO91SE'], ['-234751', '6765958', '13', 'SO91SW']]}); var gridSelect = new Ext.form.ComboBox({ tpl: '', store: gridSelectStore, title: "Select grid", displayField: "label", typeAhead: true, mode: "local", forceSelection: true, triggerAction: 'all', width: 125, emptyText: "Select Grid", selectOnFocus: true, listeners: { "select": function (combo, record) { map.setCenter(new OpenLayers.LonLat(record.data.lon, record.data.lat), record.data.zoom); } } }); //initial extent control var returnExtentBtn = new Ext.Button({ tooltip: "Return to Initial Extent", text: "Return to Intial Extent", iconCls: "refresh-icon", handler: function () { map.setCenter(new OpenLayers.LonLat(-234751.659113951,6765958.19414546), 12); } }); //Create WFS Modify Feature Controls var modifyControl = new OpenLayers.Control.ModifyFeature(wfs_layer); map.addControl(modifyControl); modifyControl.activate(); //Set up print provider var printProvider = new GeoExt.data.PrintProvider({ method: "POST", // "POST" recommended for production use capabilities: printCapabilities, // from the info.json script in the html url: "http://gislidar.serveftp.com/geoserver/pdf/print.pdf", customParams: { mapTitle: "Lidar WebGIS", dpi: "150", comment: "Map printed by GeoServer." } }); //Create Grid Panel for Gridstore var gridPanel = new Ext.grid.EditorGridPanel({ renderTo: "south", height: 150, region: "south", viewConfig: {forceFit: true}, store: store, listeners: { afteredit: function(e) { var feature = e.record.get("feature"); if(feature.state !== OpenLayers.State.INSERT) { feature.state = OpenLayers.State.UPDATE; } } }, sm: new GeoExt.grid.FeatureSelectionModel({ selectControl: modifyControl.selectControl, singleSelect: true }), cm: new Ext.grid.ColumnModel({ defaults: { sortable: true, editor: {xtype: "textfield"} }, columns: [ {header: "Name", dataIndex: "name"}, {header: "Feature Description", dataIndex: "feature_description"}, {header: "Period", dataIndex: "period"}, {header: "Source", dataIndex: "source"}, {header: "Value", dataIndex: "value"}, {header: "Recorded by", dataIndex: "recorded_by"} ] }), bbar: [{ text:"Zoom to...", handler:function() { gridPanel.getSelectionModel().each(function(rec){ var feature = rec.get("feature"); mapPanel.map.zoomToExtent(feature.geometry.getBounds()); }); } }] }); // Configure Toggle Group var toggleGroup = "draw controls"; // set up Viewport new Ext.Viewport({ layout: "border", items: [{ region: "north", contentEl: "title", height: 110, split: true, useSplitTips: true, collapseMode: "mini" }, { region: "west", title: 'LAYER CONTROL', iconCls: 'layers', collapsedIconCls: 'layers', contentEl: "layertree", autoScroll: true, width: 225, split: true, useSplitTips: true, collapsed: true, collapsible: true, plugins: [Ext.ux.PanelCollapsedTitle] }, { region: "south", title: 'ADD/VIEW FEATURE INFO', iconCls: 'directory_attribute', collapsedIconCls: 'directory_attribute', contentEl: "south", autoScroll: true, height: 205, collapsed: true, collapsible: true, split: true, useSplitTips: true, plugins: [Ext.ux.PanelCollapsedTitle] }, { region: "center", id: "mappanel", title: "Map: Cotswold Escarpment", xtype: "gx_mappanel", map: map, layers: [osm, firsted, google_hybrid,google_physical,google_satellite, groupLayer, grid_layer, wfs_layer], split: true, useSplitTips: true, center: new OpenLayers.LonLat(-234751.659113951,6765958.19414546), zoom: 12, bbar: ["Select Archaeological Feature Type: ", new GeoExt.Action({ control: new OpenLayers.Control.DrawFeature( wfs_layer, OpenLayers.Handler.Polygon, { handlerOptions: {multi: true} } ), map: map, text: "Create Polygon", toggleGroup: toggleGroup, iconCls: 'layer_shape_polygon', enableToggle: true }), new GeoExt.Action({ control: new OpenLayers.Control.DrawFeature( wfs_layer, OpenLayers.Handler.Path, { handlerOptions: {multi: true} } ), map: map, text: "Create Line", toggleGroup: toggleGroup, iconCls: 'layer_shape_line', enableToggle: true }), new GeoExt.Action({ control: new OpenLayers.Control.DrawFeature( wfs_layer, OpenLayers.Handler.Point, { handlerOptions: {multi: true} } ), map: map, text: "Create Point", toggleGroup: toggleGroup, iconCls: 'layer_shape_point', enableToggle: true }), { text: "Delete", iconCls: 'delete', handler: function() { gridPanel.getSelectionModel().each(function(rec) { var feature = rec.get("feature"); modifyControl.unselectFeature(feature); wfs_layer.removeFeatures([feature]); store.remove(rec); if(feature.state !== OpenLayers.State.INSERT) { feature.state = OpenLayers.State.DELETE; wfs_layer.addFeatures([feature]); } }); } }, "->", { text: "Save Features", iconCls: 'saveicon', handler: function() { store.commitChanges(); saveStrategy.save(); } } ], tbar: ["Zoom to Grid: ", gridSelect,returnExtentBtn,{ }, "->", { text: "Help", iconCls: 'help', handler: function() { window.open('http://gislidar.serveftp.com/geoserver/www/Application_Manual_v_0.1.pdf', '_blank'); } }, { text: "Print PDF...", iconCls: 'printicon', handler: function(){ printDialog = new Ext.Window({ title: "Print Preview", modal: true, layout: "fit", width: 450, autoHeight: true, items: [{ xtype: "gx_printmappanel", sourceMap: mapPanel, printProvider: printProvider }], bbar: [{ text: "Create PDF", handler: function(){ printDialog.items.get(0).print(); } }] }); printDialog.show(); } }] }, { region: "east", contentEl: "guide", title: 'GUIDE/DATA EXPORT', iconCls: 'information', collapsedIconCls: 'information', autoScroll: true, width: 200, split: true, collapsible: true, collapsed: true, useSplitTips: true, plugins: [Ext.ux.PanelCollapsedTitle], items: [{ xtype: 'panel', title: 'Info', html: 'Questions/Comments ****@bham.ac.uk', autoScroll: true, padding: 5, height: 260 },{ xtype: 'panel', contentEl: "output", title: 'Export Data', html: 'Please select a data export option below. {label}
Internet Archaeology is an open access journal based in the Department of Archaeology, University of York. Except where otherwise noted, content from this work may be used under the terms of the Creative Commons Attribution 3.0 (CC BY) Unported licence, which permits unrestricted use, distribution, and reproduction in any medium, provided that attribution to the author(s), the title of the work, the Internet Archaeology journal and the relevant URL/DOI are given.
Terms and Conditions | Legal Statements | Privacy Policy | Cookies Policy | Citing Internet Archaeology
Internet Archaeology content is preserved for the long term with the Archaeology Data Service. Help sustain and support open access publication by donating to our Open Access Archaeology Fund.
File last updated: Wed Oct 23 2013