geoblacklight 0.0.2 → 0.0.3

data/app/assets/javascripts/geoblacklight/modules/collapse.js

@@ -0,0 +1,6 @@
+Blacklight.onLoad(function() {
+  $('#content')
+    .on('click', '#documents [data-layer-id]', function() {
+      $(this).find('.collapse').collapse('toggle');
+    });
+});

data/app/assets/javascripts/geoblacklight/modules/download.js

@@ -0,0 +1,45 @@
+Blacklight.onLoad(function() {
+  var downloads = [];
+  $('[data-download-path]').each(function(i, element) {
+    downloads.push(new GeoBlacklight.Download(element));
+  });
+});
+
+GeoBlacklight.Download = function(element) {
+  var _this = this;
+  _this.element = $(element);
+  _this.url = _this.element.data('download-path');
+  _this.buttonGroup = _this.element.closest('.btn-group');
+  _this.spinner = $('<i class="fa fa-spinner fa-spin fa-2x fa-align-center"></i>');
+  _this.buttonGroup.append(_this.spinner.hide());
+  _this.setupClickListener();
+};
+
+GeoBlacklight.Download.prototype = {
+  setupClickListener: function() {
+    var _this = this;
+    _this.element.on('click', function(e) {
+      e.preventDefault();
+      _this.requestDownload();
+    });
+  },
+  requestDownload: function() {
+    var _this = this;
+    _this.spinner.show();
+    $.ajax({
+      url: _this.url,
+      dataType: 'json'
+    }).done(function(data) {
+      _this.renderFlashMessage(data);
+      _this.spinner.hide();
+    }).fail(function(data, e) {
+      _this.spinner.hide();
+    });
+  },
+  renderFlashMessage: function(response) {
+    $.each(response, function(i, val) {
+      var flashHtml = '<div class="alert alert-' + val[0] + '"><button type="button" class="close" data-dismiss="alert" aria-hidden="true">&times;</button>' + val[1] + '</div>';
+      $('div.flash_messages').append(flashHtml);
+    });
+  }
+};

data/app/assets/javascripts/geoblacklight/modules/geosearch.js

@@ -0,0 +1,77 @@
+!function(global) {
+  "use strict";
+
+  /**
+   * Convert LatLngBounds to array of values.
+   *
+   * Additionally, this will wrap the longitude values for the corners.
+   * @param {L.LatLngBounds} bounds Leaflet LatLngBounds object
+   * @return {Array} Array of values as [sw.x, sw.y, ne.x, ne.y]
+   */
+  L.boundsToBbox = function(bounds) {
+    var sw = bounds.getSouthWest().wrap(),
+        ne = bounds.getNorthEast().wrap();
+    return [
+      L.Util.formatNum(sw.lng, 6),
+      L.Util.formatNum(sw.lat, 6),
+      L.Util.formatNum(ne.lng, 6),
+      L.Util.formatNum(ne.lat, 6)
+    ];
+  };
+
+  L.Control.GeoSearch = L.Control.extend({
+
+    options: {
+      button: false
+    },
+
+    initialize: function(searcher, options) {
+      L.Util.setOptions(this, options);
+      this._searcher = L.Util.bind(searcher, this);
+    },
+
+    onAdd: function(map) {
+      var container = L.DomUtil.create('div', 'leaflet-bar leaflet-control');
+      this._map = map;
+
+      if (this.options.button === true) {
+        this.link = L.DomUtil.create('a', 'leaflet-bar-part search-control',
+          container);
+        this.link.href = '';
+        this.icon = L.DomUtil.create('i', 'glyphicon glyphicon-search',
+          this.link);
+      }
+
+      map.on("moveend", this._search, this);
+
+      return container;
+    },
+
+    _search: function() {
+      var params = this.filterParams(['bbox', 'page']),
+          bounds = L.boundsToBbox(this._map.getBounds());
+
+      params.push('bbox=' + encodeURIComponent(bounds.join(' ')));
+
+      this._searcher(params.join('&'));
+    },
+
+    filterParams: function(filterList) {
+      var querystring = window.location.search.substr(1),
+          params = [];
+
+      if (querystring !== "") {
+        params = $.map(querystring.split('&'), function(value) {
+          if ($.inArray(value.split('=')[0], filterList) > -1) {
+            return null;
+          } else {
+            return value;
+          }
+        });
+      }
+      return params;
+    }
+
+  });
+
+}(this);

data/app/assets/javascripts/geoblacklight/modules/home.js

@@ -0,0 +1,10 @@
+Blacklight.onLoad(function () {
+  $('[data-map="home"]').each(function(i, element) {
+    var geoblacklight = new GeoBlacklight(this),
+        search;
+    search = new L.Control.GeoSearch(function(querystring) {
+      this.link.href = "/catalog?" + querystring;
+    }, { button: true });
+    geoblacklight.map.addControl(search);
+  });
+});

data/app/assets/javascripts/geoblacklight/modules/item.js

@@ -0,0 +1,72 @@
+Blacklight.onLoad(function() {
+  $('[data-map="item"]').each(function(i, element) {
+    var layerMap = new GeoBlacklight.Item(element);
+  });
+});
+
+GeoBlacklight.Item = GeoBlacklight.extend({
+
+  initialize: function(element) {
+    GeoBlacklight.prototype.initialize.call(this, element);
+    this.dataAttributes = $(element).data();
+    this.layer = new L.layerGroup().addTo(this.map);
+    if (this.dataAttributes.available) {
+      this.addPreviewLayer();
+    } else {
+      this.addBoundsOverlay(L.bboxToBounds(this.dataAttributes.mapBbox));
+    }
+  },
+
+  addPreviewLayer: function() {
+    var _this = this;
+    _this.wmsLayer = L.tileLayer.wms(_this.dataAttributes.wmsUrl, {
+      layers: _this.dataAttributes.layerId,
+      format: 'image/png',
+      transparent: true,
+      tiled: true,
+      CRS: 'EPSG:900913',
+      opacity: 0.75
+    });
+    _this.layer.addLayer(_this.wmsLayer);
+    _this.setupInspection();
+  },
+
+  setupInspection: function() {
+    var _this = this;
+    _this.map.on('click', function(e) {
+      spinner = '<span id="attribute-table"><i class="fa fa-spinner fa-spin fa-3x fa-align-center"></i></span>';
+      $('#attribute-table').replaceWith(spinner);
+      var wmsoptions = {
+        URL: _this.dataAttributes.wmsUrl,
+        LAYERS: _this.dataAttributes.layerId,
+        BBOX: _this.map.getBounds().toBBoxString(),
+        WIDTH: $('#map').width(),
+        HEIGHT: $('#map').height(),
+        QUERY_LAYERS: _this.dataAttributes.layerId,
+        X: Math.round(e.containerPoint.x),
+        Y: Math.round(e.containerPoint.y)
+      };
+
+      $.ajax({
+        type: 'POST',
+        url: '/wms/handle',
+        data: wmsoptions,
+        success: function(data) {
+          if (data.hasOwnProperty('error')) {
+            $('#attribute-table').html('Could not find that feature');
+            return;
+          }
+          var t = $('<table id="attribute-table" class="table table-hover table-condensed table-responsive table-striped table-bordered"><thead><tr><th>Attribute</th><th>Value</th></tr></thead><tbody>');
+          $.each(data.values, function(i,val) {
+            t.append('<tr><td>' + val[0] + '</td><td>' + val[1] + '</tr>');
+          });
+          $('#attribute-table').replaceWith(t);
+        },
+        fail: function(error) {
+          console.log(error);
+        }
+      });
+    });
+  }
+
+});

data/app/assets/javascripts/geoblacklight/modules/map-view.js

@@ -1,9 +1,9 @@
 "use strict";
 
-console.log('DEBUG: Inside geoblacklight/modules/map-view.js');
+// console.log('DEBUG: Inside geoblacklight/modules/map-view.js');
 Blacklight.onLoad(function () {
-  $('#geoblacklight-map-view').geoBlacklight_setupMapView();
-  $('#geoblacklight-tools').geoBlacklight_setupTools();
+  // $('#geoblacklight-map-view').geoBlacklight_setupMapView();
+  // $('#geoblacklight-tools').geoBlacklight_setupTools();
 });
 
 /* Requires leaflet */
@@ -21,7 +21,7 @@ Blacklight.onLoad(function () {
     return this.each(function () {
       console.log(this)
       map = L.map('map');
-      console.log(solrDoc)
+      // console.log(solrDoc)
       // var layerBbox;
       // var location = JSON.parse(doc.Location);
       if (solrDoc.solr_bbox){
@@ -30,10 +30,10 @@ Blacklight.onLoad(function () {
                        [solrDoc.solr_ne_pt_0_d, solrDoc.solr_ne_pt_1_d]]);
       }
 
-      /* XXX: externalize configuration for Mapbox application key */
-      var basemap = L.tileLayer('http://otile1.mqcdn.com/tiles/1.0.0/map/{z}/{x}/{y}.png', {
+      var basemap = L.tileLayer('http://otile{s}.mqcdn.com/tiles/1.0.0/map/{z}/{x}/{y}.png', {
         attribution: '&copy; <a href="http://openstreetmap.org">OpenStreetMap</a> contributors, Tiles Courtesy of <a href="http://www.mapquest.com/" target="_blank">MapQuest</a> <img src="http://developer.mapquest.com/content/osm/mq_logo.png">',
-        maxZoom: 18
+        maxZoom: 18,
+        subdomains: '1234' // see http://developer.mapquest.com/web/products/open/map
       }).addTo(map);
 
       map.on('click', function(e){

data/app/assets/javascripts/geoblacklight/modules/results.js

@@ -0,0 +1,50 @@
+Blacklight.onLoad(function() {
+  var dynamicSearcher;
+
+  dynamicSearcher = GeoBlacklight.debounce(function(querystring) {
+    History.pushState(null, null, "/catalog?" + querystring);
+  }, 800);
+
+  History.Adapter.bind(window, 'statechange', function() {
+    var state = History.getState();
+    updatePage(state.url);
+  });
+
+  $('[data-map="index"]').each(function() {
+    var geoblacklight = new GeoBlacklight(this).setHoverListeners(),
+        search = new L.Control.GeoSearch(dynamicSearcher);
+    geoblacklight.map.addControl(search);
+  });
+
+  function updatePage(url) {
+    $.get(url).done(function(data) {
+      var resp = $.parseHTML(data);
+          $doc = $(resp);
+      $("#documents").replaceWith($doc.find("#documents"));
+      $("#sidebar").replaceWith($doc.find("#sidebar"));
+      $("#sortAndPerPage").replaceWith($doc.find("#sortAndPerPage"));
+      if ($("#map").next().length) {
+        $("#map").next().replaceWith($doc.find("#map").next());
+      } else {
+        $("#map").after($doc.find("#map").next());
+      }
+    });
+  }
+
+});
+
+GeoBlacklight.prototype.setHoverListeners = function() {
+  var _this = this;
+
+  $("#content")
+    .on("mouseenter", "#documents [data-layer-id]", function() {
+      var bounds = L.bboxToBounds($(this).data('bbox'));
+      _this.addBoundsOverlay(bounds);
+    })
+    .on("mouseleave", "#documents [data-layer-id]", function() {
+      _this.removeBoundsOverlay();
+    });
+
+  return this;
+
+};

data/app/assets/stylesheets/geoblacklight/_geoblacklight.css.scss

@@ -0,0 +1,20 @@
+/*
+ * This is a manifest file that'll be compiled into application.css, which will include all the files
+ * listed below.
+ *
+ * Any CSS and SCSS file within this directory, lib/assets/stylesheets, vendor/assets/stylesheets,
+ * or vendor/assets/stylesheets of plugins, if any, can be referenced here using a relative path.
+ *
+ * You're free to add application-wide styles to this file and they'll appear at the top of the
+ * compiled file, but it's generally better to create a new file per style scope.
+ *
+ *= require leaflet
+ *= require font-awesome
+ */
+
+@import 'geoblacklight/styles';
+@import 'modules/icons';
+@import 'modules/icon-customization';
+@import 'modules/home';
+@import 'modules/item';
+@import 'modules/results';

data/app/assets/stylesheets/geoblacklight/_styles.css.scss

@@ -0,0 +1,44 @@
+#table-container{
+  overflow:scroll;
+  max-height: 450px;
+}
+
+#control {
+  text-align: center;
+  background: #FFF;
+  position: absolute;
+  left: 24px;
+  top: 120px;
+  height: 200px;
+  width: 28px;
+  border: 1px solid #BBB;
+  -webkit-border-radius: 3px;
+  border-radius: 3px;
+  z-index: 999;
+}
+
+#handle {
+  background: #000;
+  position: absolute;
+  left: -1px;
+  top: 20px;
+  width: 28px;
+  height: 10px;
+}
+
+#bottom {
+  position: absolute;
+  bottom:0px;
+  left: 8px;
+  text-align: center;
+}
+
+#handle:hover {
+  cursor: pointer;
+  background: #444;
+  cursor: ns-resize;
+}
+
+.show-tools .bookmark_toggle {
+  padding: 0px 0px;
+}

data/app/assets/stylesheets/geoblacklight/application.css.scss

@@ -0,0 +1,3 @@
+@import 'bootstrap-sprockets';
+@import 'bootstrap';
+@import 'geoblacklight/geoblacklight';

data/app/assets/stylesheets/geoblacklight/modules/home.css.scss

@@ -0,0 +1,3 @@
+[data-map="home"] {
+  height: 600px;
+}

data/app/assets/stylesheets/geoblacklight/modules/icon-customization.css.scss

@@ -0,0 +1,10 @@
+// Additional customizations beyond generated FontCustom styles
+
+.geoblacklight-icon {
+  color: $gray-light;
+  font-size: 1.2em;
+}
+
+.geoblacklight-stanford {
+  color: #8c1515;
+}

data/app/assets/stylesheets/geoblacklight/modules/icons.css.scss

@@ -0,0 +1,77 @@
+//
+// Icon Font: geoblacklight
+//
+// From https://github.com/geoblacklight/geoblacklight-icons/blob/master/app/assets/stylesheets/_geoblacklight.scss
+
+@font-face {
+  font-family: "geoblacklight";
+  src: font-url("geoblacklight.eot");
+  src: font-url("geoblacklight.eot?#iefix") format("embedded-opentype"),
+       font-url("geoblacklight.woff") format("woff"),
+       font-url("geoblacklight.ttf") format("truetype"),
+       font-url("geoblacklight.svg#geoblacklight") format("svg");
+  font-weight: normal;
+  font-style: normal;
+}
+
+@media screen and (-webkit-min-device-pixel-ratio:0) {
+  @font-face {
+    font-family: "geoblacklight";
+    src: font-url("geoblacklight.svg#geoblacklight") format("svg");
+  }
+}
+
+[data-icon]:before { content: attr(data-icon); }
+
+[data-icon]:before,
+.geoblacklight-berkeley:before,
+.geoblacklight-harvard:before,
+.geoblacklight-image:before,
+.geoblacklight-line:before,
+.geoblacklight-massgis:before,
+.geoblacklight-mit:before,
+.geoblacklight-paper-map:before,
+.geoblacklight-point:before,
+.geoblacklight-polygon:before,
+.geoblacklight-raster:before,
+.geoblacklight-stanford:before,
+.geoblacklight-tufts:before {
+  display: inline-block;
+  font-family: "geoblacklight";
+  font-style: normal;
+  font-weight: normal;
+  font-variant: normal;
+  line-height: 1;
+  text-decoration: inherit;
+  text-rendering: optimizeLegibility;
+  text-transform: none;
+  -moz-osx-font-smoothing: grayscale;
+  -webkit-font-smoothing: antialiased;
+  font-smoothing: antialiased;
+}
+
+.geoblacklight-berkeley:before { content: "\f101"; }
+.geoblacklight-harvard:before { content: "\f103"; }
+.geoblacklight-image:before { content: "\f10a"; }
+.geoblacklight-line:before { content: "\f108"; }
+.geoblacklight-massgis:before { content: "\f106"; }
+.geoblacklight-mit:before { content: "\f104"; }
+.geoblacklight-paper-map:before { content: "\f110"; }
+.geoblacklight-point:before { content: "\f109"; }
+.geoblacklight-polygon:before { content: "\f107"; }
+.geoblacklight-raster:before { content: "\f10d"; }
+.geoblacklight-stanford:before { content: "\f102"; }
+.geoblacklight-tufts:before { content: "\f105"; }
+
+$font-geoblacklight-berkeley: "\f101";
+$font-geoblacklight-harvard: "\f103";
+$font-geoblacklight-image: "\f10a";
+$font-geoblacklight-line: "\f108";
+$font-geoblacklight-massgis: "\f106";
+$font-geoblacklight-mit: "\f104";
+$font-geoblacklight-paper-map: "\f110";
+$font-geoblacklight-point: "\f109";
+$font-geoblacklight-polygon: "\f107";
+$font-geoblacklight-raster: "\f10d";
+$font-geoblacklight-stanford: "\f102";
+$font-geoblacklight-tufts: "\f105";