Эх сурвалжийг харах

HUE-2312 [search] Finalize marker map widget

Now points to real data.
Label is optional.
Automatically fetches needed fields.
Make sure to not fetch fields anymore if widget is deleted.
Adding a self.template.fieldsNames to get all the field names.
Romain Rigaux 11 жил өмнө
parent
commit
d97a138451

+ 16 - 17
apps/search/src/search/templates/search.mako

@@ -86,7 +86,7 @@ ${ commonheader(_('Search'), "search", user, "80px") | n,unicode }
                     draggable: {data: draggableResultset(), isEnabled: availableDraggableResultset,
                     options: {'start': function(event, ui){lastWindowScrollPosition = $(window).scrollTop();$('.card-body').slideUp('fast');},
                               'stop': function(event, ui){$('.card-body').slideDown('fast'); $root.collection.template.isGridLayout(true); checkResultHighlightingAvailability(); }}}"
-         title="${_('Grid Results')}" rel="tooltip" data-placement="top">
+         title="${_('Grid')}" rel="tooltip" data-placement="top">
          <a data-bind="style: { cursor: $root.availableDraggableResultset() ? 'move' : 'default' }">
                        <i class="fa fa-table"></i>
          </a>
@@ -102,7 +102,7 @@ ${ commonheader(_('Search'), "search", user, "80px") | n,unicode }
                                }
                              }
                     }"
-         title="${_('HTML Results')}" rel="tooltip" data-placement="top">
+         title="${_('HTML')}" rel="tooltip" data-placement="top">
          <a data-bind="style: { cursor: $root.availableDraggableResultset() ? 'move' : 'default' }">
                        <i class="fa fa-code"></i>
          </a>
@@ -121,7 +121,7 @@ ${ commonheader(_('Search'), "search", user, "80px") | n,unicode }
                     draggable: {data: draggableLeafletMap(), isEnabled: availableDraggableLeaflet,
                     options: {'start': function(event, ui){lastWindowScrollPosition = $(window).scrollTop();$('.card-body').slideUp('fast');},
                               'stop': function(event, ui){$('.card-body').slideDown('fast', function(){$(window).scrollTop(lastWindowScrollPosition)});}}}"
-         title="${_('Map Results')}" rel="tooltip" data-placement="top">
+         title="${_('Marker Map')}" rel="tooltip" data-placement="top">
          <a data-bind="style: { cursor: 'move' }">
              <i class="fa fa-map-marker"></i>
          </a>
@@ -187,7 +187,7 @@ ${ commonheader(_('Search'), "search", user, "80px") | n,unicode }
                     draggable: {data: draggableMap(), isEnabled: availableDraggableChart,
                     options: {'start': function(event, ui){lastWindowScrollPosition = $(window).scrollTop();$('.card-body').slideUp('fast');},
                               'stop': function(event, ui){$('.card-body').slideDown('fast', function(){$(window).scrollTop(lastWindowScrollPosition)});}}}"
-         title="${_('Map')}" rel="tooltip" data-placement="top">
+         title="${_('Gradient Map')}" rel="tooltip" data-placement="top">
          <a data-bind="style: { cursor: $root.availableDraggableChart() ? 'move' : 'default' }">
                        <i class="hcha hcha-map-chart"></i>
          </a>
@@ -236,17 +236,17 @@ ${ dashboard.layout_skeleton() }
     </div>
 
     <!-- ko if: type() == 'pivot' -->
-      <select data-bind="options: $root.collection.template.availableWidgetFieldsNames, value: properties.facets_form.field, optionsCaption: ' '"></select>
+      ${ _('Limit') } <input type="text" class="input-medium" data-bind="value: properties.limit"/>
+      ${ _('Mincount') } <input type="text" class="input-medium" data-bind="value: properties.mincount"/>
+      ${ _('Plot') } <input type="checkbox" data-bind="checked: properties.graph"></span>
+
+      <select data-bind="options: $root.collection.template.fieldsNames, value: properties.facets_form.field, optionsCaption: ' '"></select>
       <input type="text" class="input-medium" data-bind="value: properties.facets_form.limit"/>
       <input type="text" class="input-medium" data-bind="value: properties.facets_form.mincount"/>
 
       <a href="javascript: void(0)" data-bind="click: $root.collection.addPivotFacetValue">
         <i class="fa fa-plus"></i>
       </a>
-
-      ${ _('Limit') } <input type="text" class="input-medium" data-bind="value: properties.limit"/>
-      ${ _('Mincount') } <input type="text" class="input-medium" data-bind="value: properties.mincount"/>
-      ${ _('Plot') } <input type="checkbox" data-bind="checked: properties.graph"></span>
     <!-- /ko -->
 
     <!-- ko if: type() == 'range' -->
@@ -879,21 +879,19 @@ ${ dashboard.layout_skeleton() }
   <div class="row-fluid">
     <div data-bind="visible: $root.isEditing" style="margin-top: 10px; margin-bottom: 20px; text-align: center">
       ${_('Latitude')}
-      <select data-bind="options: viewModel.collection.fields, optionsText: 'name', value: $root.collection.template.leafletmap.latitudeField, optionsCaption: '${ _('Choose...') }'"></select>
+      <select data-bind="options: $root.collection.template.fieldsNames, value: $root.collection.template.leafletmap.latitudeField, optionsCaption: '${ _('Choose...') }'"></select>
       &nbsp;&nbsp;
       ${_('Longitude')}
-      <select data-bind="options: viewModel.collection.fields, optionsText: 'name', value: $root.collection.template.leafletmap.longitudeField, optionsCaption: '${ _('Choose...') }'"></select>
+      <select data-bind="options: $root.collection.template.fieldsNames, value: $root.collection.template.leafletmap.longitudeField, optionsCaption: '${ _('Choose...') }'"></select>
       &nbsp;&nbsp;
       ${_('Label')}
-      <select data-bind="options: viewModel.collection.fields, optionsText: 'name', value: $root.collection.template.leafletmap.labelField, optionsCaption: '${ _('Choose...') }'"></select>
+      <select data-bind="options: $root.collection.template.fieldsNames, value: $root.collection.template.leafletmap.labelField, optionsCaption: '${ _('Choose...') }'"></select>
     </div>
 
-##    <!-- ko if: $root.collection.template.leafletmap.latitudeField && $root.collection.template.leafletmap.longitudeField -->
-    <div data-bind="leafletMapChart: {visible: ! $root.isRetrievingResults() && $root.collection.template.leafletmap.latitudeField() != null && $root.collection.template.leafletmap.longitudeField() != null, datum: {counts: $root.results()},
+    <div data-bind="leafletMapChart: {visible: ! $root.isRetrievingResults() && $root.collection.template.leafletmapOn(), datum: {counts: $root.results()},
       transformer: leafletMapChartDataTransformer,
       onComplete: function(){ var widget = viewModel.getWidgetById(id); if (widget != null) {widget.isLoading(false)};} }">
     </div>
-##    <!-- /ko -->
   </div>
 
   <div class="widget-spinner" data-bind="visible: $root.isRetrievingResults()">
@@ -1191,7 +1189,6 @@ function timelineChartDataTransformer(rawDatum) {
     values: _data
   });
 
-
   // If multi query
   $(rawDatum.extraSeries).each(function (cnt, item) {
     if (cnt == 0) {
@@ -1232,7 +1229,9 @@ function leafletMapChartDataTransformer(data) {
   var _data = [];
 
   data.counts.forEach(function(record){
-    _data.push({lat: record.leafletmap.latitude(), lng: record.leafletmap.longitude(), label: record.leafletmap.label()});
+    if (record.leafletmap) {
+      _data.push({lat: record.leafletmap.latitude, lng: record.leafletmap.longitude, label: record.leafletmap.label});
+    }
   });
 
   return _data;

+ 43 - 6
apps/search/static/js/search.ko.js

@@ -173,7 +173,7 @@ var Query = function (vm, query) {
   };
 
   self.removeFilter = function (data) {
-	var found = false;
+    var found = false;
     $.each(self.fqs(), function (index, fq) {
       if (fq.id() == data.id()) {
         self.fqs.remove(fq);
@@ -315,6 +315,25 @@ var Collection = function (vm, collection) {
     vm.search();
   });
 
+  self.template.leafletmapOn = ko.computed(function() {
+    return self.template.leafletmap.latitudeField() && self.template.leafletmap.longitudeField();
+  });
+  self.template.leafletmap.latitudeField.subscribe(function (newValue) {
+    if (self.template.leafletmapOn()) {
+      vm.search();
+    }
+  });
+  self.template.leafletmap.longitudeField.subscribe(function (newValue) {
+    if (self.template.leafletmapOn()) {
+      vm.search();
+    }
+  });
+  self.template.leafletmap.labelField.subscribe(function (newValue) {
+    if (self.template.leafletmapOn()) {
+      vm.search();
+    }
+  });
+
   self.template.selectedVisualField = ko.observable();
   self.template.selectedVisualFunction = ko.observable();
   self.template.selectedVisualFunction.subscribe(function (newValue) {
@@ -353,10 +372,6 @@ var Collection = function (vm, collection) {
   });
   self.template.rows.extend({rateLimit: {timeout: 1500, method: "notifyWhenChangesStop"}});
 
-  self.template.leafletmap.latitudeField = ko.observable();
-  self.template.leafletmap.longitudeField = ko.observable();
-  self.template.leafletmap.labelField = ko.observable();
-
   self.fields = ko.mapping.fromJS(collection.fields);
 
   self.availableFacetFields = ko.computed(function() {
@@ -435,6 +450,14 @@ var Collection = function (vm, collection) {
     });
   }
 
+  self.removeLeaflet = function (widget_json) {
+    if (widget_json.widgetType() == "leafletmap-widget") {
+      self.template.leafletmap.latitudeField(null);
+      self.template.leafletmap.longitudeField(null);
+      self.template.leafletmap.labelField(null);
+    }
+  }
+
   self.getFacetById = function (facet_id) {
     var _facet = null;
     $.each(self.facets(), function (index, facet) {
@@ -471,6 +494,11 @@ var Collection = function (vm, collection) {
     });
     return _fields;
   });
+  self.template.fieldsNames = ko.computed(function () {
+    return $.map(self.template.fieldsAttributes(), function(field) {
+      return field.name();
+    });
+  });
 
   self.getTemplateField = function (name) {
     var _field = null;
@@ -972,6 +1000,7 @@ var SearchViewModel = function (collection_json, query_json, initial_json) {
           if (self.collection.template.isGridLayout()) {
             // Table view
             var _docs = [];
+            var leafletmap = {};
             $.each(data.response.docs, function (index, item) {
               var row = [];
               var fields = self.collection.template.fieldsSelected();
@@ -983,12 +1012,19 @@ var SearchViewModel = function (collection_json, query_json, initial_json) {
               } else {
                 row.push(ko.mapping.toJSON(item));
               }
+              if (self.collection.template.leafletmapOn()) {
+                leafletmap = {
+                  'latitude': item[self.collection.template.leafletmap.latitudeField()],
+                  'longitude': item[self.collection.template.leafletmap.longitudeField()],
+                  'label': self.collection.template.leafletmap.labelField() ? item[self.collection.template.leafletmap.labelField()] : ""
+                }
+              }
               var doc = {
                 'id': item[self.collection.idField()],
                 'row': row,
                 'showDetails': ko.observable(item.showDetails),
                 'details': ko.observableArray(item.details),
-                'leafletmap': ko.mapping.fromJS({'latitude': 33.3907928467, 'longitude': -112.012504578, 'label': 'Curacao'}), // TODO pull with fields
+                'leafletmap': leafletmap,
               };
               _docs.push(doc);
             });
@@ -1030,6 +1066,7 @@ var SearchViewModel = function (collection_json, query_json, initial_json) {
 
   self.removeWidget = function (widget_json) {
     self.collection.removeFacet(widget_json.id);
+    self.collection.removeLeaflet(widget_json);
     var refresh = self.query.removeFilter(widget_json);
     self.removeWidgetById(widget_json.id());
 

+ 9 - 2
desktop/libs/libsolr/src/libsolr/api.py

@@ -143,8 +143,15 @@ class SolrApi(object):
     params += self._get_fq(query)
 
     if collection['template']['fieldsSelected'] and collection['template']['isGridLayout']:
-      fields = collection['template']['fieldsSelected'] + [collection['idField']] if collection['idField'] else []
-      params += (('fl', urllib.unquote(utf_quoter(','.join(fields)))),)
+      fields = set(collection['template']['fieldsSelected'] + [collection['idField']] if collection['idField'] else [])
+      # Add field if needed
+      if collection['template']['leafletmap'].get('latitudeField'):
+        fields.add(collection['template']['leafletmap']['latitudeField'])
+      if collection['template']['leafletmap'].get('longitudeField'):
+        fields.add(collection['template']['leafletmap']['longitudeField'])
+      if collection['template']['leafletmap'].get('labelField'):
+        fields.add(collection['template']['leafletmap']['labelField'])
+      params += (('fl', urllib.unquote(utf_quoter(','.join(list(fields))))),)
     else:
       params += (('fl', '*'),)