Merge pull request #111 from BritishGeologicalSurvey/basic-map

Add basic map to find AGS Graphical logs and deposited data urls

app/main.py

@@ -83,7 +83,7 @@ def custom_openapi():
         return app.openapi_schema
     openapi_schema = get_openapi(
         title="pyagsapi - AGS File Utilities Tools and API",
-        version="4.5.2",
+        version="4.5.3",
         description=("The API performs schema validation, data validation and conversion of your AGS files. "
                      "It also exports a graphical log from AGS data held by NGDC. "
                      "Schema validation and conversion uses https://gitlab.com/ags-data-format-wg/ags-python-library"),

app/static/css/style.css

@@ -0,0 +1,41 @@
+#mapid {
+  width: 100%;
+  height: 600px;
+  cursor: crosshair;
+}
+
+#dOpacitySliderBox {
+  z-index: 3000;
+  position: absolute;
+  bottom: 20px;
+  right: 10px;
+  width: 105px;
+  height: 25px;
+  background-color: rgba(255, 255, 255, 0.9);
+  border: 2px solid #aaaaaa;
+  border-radius: 5px;
+  padding: 5px;
+  padding-bottom: 0px;
+  box-shadow: 2px 2px 4px 0 rgba(0, 0, 0, 0.3);
+  cursor: pointer;
+}
+
+.dOpacitySliderLabel {
+  position: absolute;
+  font-size: 10px;
+  bottom: 0px;
+  left: 25px;
+}
+
+.ui-slider {
+  width: 100px;
+  height: 5px;
+  z-index: 1003;
+}
+
+.ui-slider .ui-slider-handle {
+  box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.3);
+  border-radius: 2px;
+  width: 5px;
+  height: 10px;
+}

app/static/js/L.TileLayer.BetterWMS.js

@@ -0,0 +1,73 @@
+L.TileLayer.BetterWMS = L.TileLayer.WMS.extend({
+
+    onAdd: function (map) {
+      // Triggered when the layer is added to a map.
+      //   Register a click listener, then do all the upstream WMS things
+      L.TileLayer.WMS.prototype.onAdd.call(this, map);
+      map.on('click', this.getFeatureInfo, this);
+    },
+
+    onRemove: function (map) {
+      // Triggered when the layer is removed from a map.
+      //   Unregister a click listener, then do all the upstream WMS things
+      L.TileLayer.WMS.prototype.onRemove.call(this, map);
+      map.off('click', this.getFeatureInfo, this);
+    },
+
+    getFeatureInfo: function (evt) {
+      // Make an AJAX request to the server and hope for the best
+      var url = this.getFeatureInfoUrl(evt.latlng),
+          showResults = L.Util.bind(this.showGetFeatureInfo, this);
+      $.ajax({
+        url: url,
+        success: function (data, status, xhr) {
+          var err = typeof data === 'string' ? null : data;
+          showResults(err, evt.latlng, data);
+        },
+        error: function (xhr, status, error) {
+          showResults(error);  
+        }
+      });
+    },
+
+    getFeatureInfoUrl: function (latlng) {
+      // Construct a GetFeatureInfo request URL given a point
+      var point = this._map.latLngToContainerPoint(latlng, this._map.getZoom()),
+          size = this._map.getSize(),
+
+          params = {
+            request: 'GetFeatureInfo',
+            service: 'WMS',
+            srs: 'EPSG:4326',
+            styles: this.wmsParams.styles,
+            transparent: this.wmsParams.transparent,
+            version: this.wmsParams.version,      
+            format: this.wmsParams.format,
+            bbox: this._map.getBounds().toBBoxString(),
+            height: size.y,
+            width: size.x,
+            layers: this.wmsParams.layers,
+            query_layers: this.wmsParams.layers,
+            info_format: 'text/html'
+          };
+
+      params[params.version === '1.3.0' ? 'i' : 'x'] = point.x;
+      params[params.version === '1.3.0' ? 'j' : 'y'] = point.y;
+
+      return this._url + L.Util.getParamString(params, this._url, true);
+    },
+
+    showGetFeatureInfo: function (err, latlng, content) {
+      if (err) { console.log(err); return; } // do nothing if there's an error
+
+      // Otherwise show the content in a popup, or something.
+      L.popup({ maxWidth: 500})
+        .setLatLng(latlng)
+        .setContent(content)
+        .openOn(this._map);
+    }
+  });
+
+  L.tileLayer.betterWms = function (url, options) {
+    return new L.TileLayer.BetterWMS(url, options);  
+  };