浏览代码

[search] Enforce only one instance of certain types of widgets

Romain Rigaux 11 年之前
父节点
当前提交
7094a94d31
共有 2 个文件被更改,包括 26 次插入7 次删除
  1. 4 4
      apps/search/src/search/templates/search2.mako
  2. 22 3
      apps/search/static/js/search.ko.js

+ 4 - 4
apps/search/src/search/templates/search2.mako

@@ -97,15 +97,15 @@ ${ commonheader(_('Search'), "search", user, "80px") | n,unicode }
 
   <div style="float: left; margin-left: 20px" data-bind="visible: columns().length > 0">
     <div class="toolbar-label">${_('WIDGETS')}</div>
-    <div class="draggable-widget" data-bind="draggable: {data: draggableResultset(), options: {'start': function(event, ui){$('.card-body').slideUp('fast');}, 'stop': function(event, ui){$('.card-body').slideDown('fast'); $root.collection.template.isGridLayout(true); }}}" title="${_('Grid Results')}" rel="tooltip" data-placement="top"><a href="#"><i class="fa fa-table"></i></a></div>
-    <div class="draggable-widget" data-bind="draggable: {data: draggableHtmlResultset(), options: {'start': function(event, ui){$('.card-body').slideUp('fast');}, 'stop': function(event, ui){$('.card-body').slideDown('fast'); $root.collection.template.isGridLayout(false); }}}" title="${_('HTML Results')}" rel="tooltip" data-placement="top"><a href="#"><i class="fa fa-code"></i></a></div>
+    <div class="draggable-widget" data-bind="draggable: {data: draggableResultset(), isEnabled: availableDraggableResultset, options: {'start': function(event, ui){$('.card-body').slideUp('fast');}, 'stop': function(event, ui){$('.card-body').slideDown('fast'); $root.collection.template.isGridLayout(true); }}}" title="${_('Grid Results')}" rel="tooltip" data-placement="top"><a href=""><i class="fa fa-table"></i></a></div>
+    <div class="draggable-widget" data-bind="draggable: {data: draggableHtmlResultset(), isEnabled: availableDraggableResultset, options: {'start': function(event, ui){$('.card-body').slideUp('fast');}, 'stop': function(event, ui){$('.card-body').slideDown('fast'); $root.collection.template.isGridLayout(false); }}}" title="${_('HTML Results')}" rel="tooltip" data-placement="top"><a href="#"><i class="fa fa-code"></i></a></div>
     <div class="draggable-widget" data-bind="draggable: {data: draggableFacet(), options: {'start': function(event, ui){$('.card-body').slideUp('fast');}, 'stop': function(event, ui){$('.card-body').slideDown('fast');}}}" title="${_('Text Facet')}" rel="tooltip" data-placement="top"><a href="#"><i class="fa fa-sort-amount-asc"></i></a></div>
     <div class="draggable-widget" data-bind="draggable: {data: draggablePie(), options: {'start': function(event, ui){$('.card-body').slideUp('fast');}, 'stop': function(event, ui){$('.card-body').slideDown('fast');}}}" title="${_('Pie Chart')}" rel="tooltip" data-placement="top"><a href="#"><i class="hcha hcha-pie-chart"></i></a></div>
     <!-- <div class="draggable-widget" data-bind="draggable: {data: draggableHit(), options: {'start': function(event, ui){$('.card-body').slideUp('fast');}, 'stop': function(event, ui){$('.card-body').slideDown('fast');}}}" title="${_('Hit Count')}" rel="tooltip" data-placement="top"><a href="#"><i class="fa fa-tachometer"></i></a></div> -->
     <div class="draggable-widget" data-bind="draggable: {data: draggableBar(), options: {'start': function(event, ui){$('.card-body').slideUp('fast');}, 'stop': function(event, ui){$('.card-body').slideDown('fast');}}}" title="${_('Bar Chart')}" rel="tooltip" data-placement="top"><a href="#"><i class="hcha hcha-bar-chart"></i></a></div>
     <div class="draggable-widget" data-bind="draggable: {data: draggableLine(), options: {'start': function(event, ui){$('.card-body').slideUp('fast');}, 'stop': function(event, ui){$('.card-body').slideDown('fast');}}}" title="${_('Line')}" rel="tooltip" data-placement="top"><a href="#"><i class="hcha hcha-line-chart"></i></a></div>
-    <div class="draggable-widget" data-bind="draggable: {data: draggableHistogram(), options: {'start': function(event, ui){$('.card-body').slideUp('fast');}, 'stop': function(event, ui){$('.card-body').slideDown('fast');}}}" title="${_('Histogram')}" rel="tooltip" data-placement="top"><a href="#"><i class="fa fa-long-arrow-right"></i></a></div>
-    <div class="draggable-widget" data-bind="draggable: {data: draggableFilter(), options: {'start': function(event, ui){$('.card-body').slideUp('fast');}, 'stop': function(event, ui){$('.card-body').slideDown('fast');}}}" title="${_('Filter Bar')}" rel="tooltip" data-placement="top"><a href="#"><i class="fa fa-filter"></i></a></div>
+    <div class="draggable-widget" data-bind="draggable: {data: draggableHistogram(), isEnabled: availableDraggableHistogram, options: {'start': function(event, ui){$('.card-body').slideUp('fast');}, 'stop': function(event, ui){$('.card-body').slideDown('fast');}}}" title="${_('Histogram')}" rel="tooltip" data-placement="top"><a href="#"><i class="fa fa-long-arrow-right"></i></a></div>
+    <div class="draggable-widget" data-bind="draggable: {data: draggableFilter(), isEnabled: availableDraggableFilter, options: {'start': function(event, ui){$('.card-body').slideUp('fast');}, 'stop': function(event, ui){$('.card-body').slideDown('fast');}}}" title="${_('Filter Bar')}" rel="tooltip" data-placement="top"><a href="#"><i class="fa fa-filter"></i></a></div>
     <div class="draggable-widget" data-bind="draggable: {data: draggableMap(), options: {'start': function(event, ui){$('.card-body').slideUp('fast');}, 'stop': function(event, ui){$('.card-body').slideDown('fast');}}}" title="${_('Map')}" rel="tooltip" data-placement="top"><a href="#"><i class="hcha hcha-map-chart"></i></a></div>
   </div>
   <div class="clearfix"></div>

+ 22 - 3
apps/search/static/js/search.ko.js

@@ -352,6 +352,7 @@ var Collection = function (vm, collection) {
 
 
   self.fields = ko.mapping.fromJS(collection.fields);
+  //self.availableFacetFields = ko.computed()
 
   self.addFacet = function (facet_json) {
     $.post("/search/template/new_facet", {
@@ -394,10 +395,10 @@ var Collection = function (vm, collection) {
     return _facet;
   }
 
-  self.getHistogramFacet = function () { // might remove when list of available widgets
+  self.getFacetByType = function (facetType) {
     var _facet = null;
     $.each(self.facets(), function (index, facet) {
-      if (facet.widgetType() == 'histogram-widget') {
+      if (facet.widgetType() == facetType) {
         _facet = facet;
         return false;
       }
@@ -405,6 +406,10 @@ var Collection = function (vm, collection) {
     return _facet;
   }
   
+  self.getHistogramFacet = function () { // might remove when list of available widgets
+    return self.getFacetByType('histogram-widget');
+  }
+  
   self.template.fields = ko.computed(function () {
     var _fields = [];
     $.each(self.template.fieldsAttributes(), function (index, field) {
@@ -602,7 +607,7 @@ var SearchViewModel = function (collection_json, query_json, initial_json) {
   };
 
   self.previewColumns = ko.observable("");
-  self.columns = ko.observable({});
+  self.columns = ko.observable([]);
   loadLayout(self, collection_json.layout);
 
   self.isEditing = ko.observable(false);
@@ -622,6 +627,20 @@ var SearchViewModel = function (collection_json, query_json, initial_json) {
   self.draggablePie = ko.observable(new Widget(12, UUID(), "Pie Chart", "pie-widget"));
   self.draggableFilter = ko.observable(new Widget(12, UUID(), "Filter Bar", "filter-widget"));  
 
+  function getWidgets(equalsTo) {
+	return $.map(self.columns(), function (col){return $.map(col.rows(), function(row){ return $.grep(row.widgets(), function(widget){ return equalsTo(widget); });}) ;})
+  };
+  
+  self.availableDraggableResultset = ko.computed(function() {
+	return getWidgets(function(widget){ return ['resultset-widget', 'html-resultset-widget'].indexOf(widget.widgetType()) != -1;}).length == 0;
+  });
+  self.availableDraggableFilter = ko.computed(function() {
+	return getWidgets(function(widget){ return widget.widgetType() == 'filter-widget';}).length == 0;
+  });  
+  self.availableDraggableHistogram = ko.computed(function() {
+	return getWidgets(function(widget){ return widget.widgetType() == 'histogram-widget';}).length == 0; // + a date facet
+  });
+
   self.init = function () {
     //self.collection.addDynamicFields();
     self.isEditing(true);