[view/grid][s]: strip out all the menu stuff as somewhat broken both in UI (overflow not working) and functional terms (transform has changed).
* Felt simpler to remove and possibly reinstate later than try and fix now.
This commit is contained in:
parent
3ad97a82e0
commit
22dd818183
14
css/grid.css
14
css/grid.css
@ -24,10 +24,6 @@ table.recline-grid {
|
||||
vertical-align: top;
|
||||
}
|
||||
|
||||
.recline-grid tr td:first-child, .recline-grid tr th:first-child {
|
||||
width: 20px;
|
||||
}
|
||||
|
||||
.recline-grid tbody tr:last-child {
|
||||
border-bottom: 1px solid #ccc;
|
||||
}
|
||||
@ -37,9 +33,7 @@ table.recline-grid {
|
||||
}
|
||||
|
||||
/* direct borrowing from twitter buttons */
|
||||
.recline-grid th,
|
||||
.transform-column-view .expression-preview-table-wrapper th
|
||||
{
|
||||
.recline-grid th {
|
||||
background-color: #e6e6e6;
|
||||
background-repeat: no-repeat;
|
||||
background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#ffffff), color-stop(25%, #ffffff), to(#e6e6e6));
|
||||
@ -189,12 +183,6 @@ div.data-table-cell-content-numeric > a.data-table-cell-edit {
|
||||
* Read-only mode
|
||||
*********************************************************/
|
||||
|
||||
.recline-read-only .recline-grid.no-hidden tr td:first-child,
|
||||
.recline-read-only .recline-grid.no-hidden tr th:first-child
|
||||
{
|
||||
display: none;
|
||||
}
|
||||
|
||||
.recline-read-only .recline-grid .write-op,
|
||||
.recline-read-only .recline-grid a.data-table-cell-edit
|
||||
{
|
||||
|
||||
107
src/view.grid.js
107
src/view.grid.js
@ -29,10 +29,6 @@ my.Grid = Backbone.View.extend({
|
||||
},
|
||||
|
||||
events: {
|
||||
'click .column-header-menu .data-table-menu li a': 'onColumnHeaderClick',
|
||||
'click .row-header-menu': 'onRowHeaderClick',
|
||||
'click .root-header-menu': 'onRootHeaderClick',
|
||||
'click .data-table-menu li a': 'onMenuClick',
|
||||
// does not work here so done at end of render function
|
||||
// 'scroll .recline-grid tbody': 'onHorizontalScroll'
|
||||
},
|
||||
@ -40,74 +36,6 @@ my.Grid = Backbone.View.extend({
|
||||
// ======================================================
|
||||
// Column and row menus
|
||||
|
||||
onColumnHeaderClick: function(e) {
|
||||
this.tempState.currentColumn = $(e.target).closest('.column-header').attr('data-field');
|
||||
},
|
||||
|
||||
onRowHeaderClick: function(e) {
|
||||
this.tempState.currentRow = $(e.target).parents('tr:first').attr('data-id');
|
||||
},
|
||||
|
||||
onRootHeaderClick: function(e) {
|
||||
var tmpl = ' \
|
||||
{{#columns}} \
|
||||
<li><a data-action="showColumn" data-column="{{.}}" href="JavaScript:void(0);">Show column: {{.}}</a></li> \
|
||||
{{/columns}}';
|
||||
var tmp = Mustache.render(tmpl, {'columns': this.state.get('hiddenFields')});
|
||||
this.el.find('.root-header-menu .dropdown-menu').html(tmp);
|
||||
},
|
||||
|
||||
onMenuClick: function(e) {
|
||||
var self = this;
|
||||
e.preventDefault();
|
||||
var actions = {
|
||||
bulkEdit: function() { self.showTransformColumnDialog('bulkEdit', {name: self.tempState.currentColumn}); },
|
||||
facet: function() {
|
||||
self.model.queryState.addFacet(self.tempState.currentColumn);
|
||||
},
|
||||
facet_histogram: function() {
|
||||
self.model.queryState.addHistogramFacet(self.tempState.currentColumn);
|
||||
},
|
||||
filter: function() {
|
||||
self.model.queryState.addTermFilter(self.tempState.currentColumn, '');
|
||||
},
|
||||
sortAsc: function() { self.setColumnSort('asc'); },
|
||||
sortDesc: function() { self.setColumnSort('desc'); },
|
||||
hideColumn: function() { self.hideColumn(); },
|
||||
showColumn: function() { self.showColumn(e); },
|
||||
deleteRow: function() {
|
||||
var self = this;
|
||||
var doc = _.find(self.model.records.models, function(doc) {
|
||||
// important this is == as the currentRow will be string (as comes
|
||||
// from DOM) while id may be int
|
||||
return doc.id == self.tempState.currentRow;
|
||||
});
|
||||
doc.destroy().then(function() {
|
||||
self.model.records.remove(doc);
|
||||
self.trigger('recline:flash', {message: "Row deleted successfully"});
|
||||
}).fail(function(err) {
|
||||
self.trigger('recline:flash', {message: "Errorz! " + err});
|
||||
});
|
||||
}
|
||||
};
|
||||
actions[$(e.target).attr('data-action')]();
|
||||
},
|
||||
|
||||
showTransformColumnDialog: function() {
|
||||
var self = this;
|
||||
var view = new my.ColumnTransform({
|
||||
model: this.model
|
||||
});
|
||||
// pass the flash message up the chain
|
||||
view.bind('recline:flash', function(flash) {
|
||||
self.trigger('recline:flash', flash);
|
||||
});
|
||||
view.state = this.tempState;
|
||||
view.render();
|
||||
this.el.append(view.el);
|
||||
view.el.modal();
|
||||
},
|
||||
|
||||
setColumnSort: function(order) {
|
||||
var sort = [{}];
|
||||
sort[0][this.tempState.currentColumn] = {order: order};
|
||||
@ -141,33 +69,8 @@ my.Grid = Backbone.View.extend({
|
||||
<table class="recline-grid table-striped table-condensed" cellspacing="0"> \
|
||||
<thead class="fixed-header"> \
|
||||
<tr> \
|
||||
{{#notEmpty}} \
|
||||
<th class="column-header"> \
|
||||
<div class="btn-group root-header-menu"> \
|
||||
<a class="btn dropdown-toggle" data-toggle="dropdown"><span class="caret"></span></a> \
|
||||
<ul class="dropdown-menu data-table-menu"> \
|
||||
</ul> \
|
||||
</div> \
|
||||
<span class="column-header-name"></span> \
|
||||
</th> \
|
||||
{{/notEmpty}} \
|
||||
{{#fields}} \
|
||||
<th class="column-header {{#hidden}}hidden{{/hidden}}" data-field="{{id}}" style="width: {{width}}px; max-width: {{width}}px; min-width: {{width}}px;"> \
|
||||
<div class="btn-group column-header-menu"> \
|
||||
<a class="btn dropdown-toggle" data-toggle="dropdown"><i class="icon-cog"></i><span class="caret"></span></a> \
|
||||
<ul class="dropdown-menu data-table-menu pull-right"> \
|
||||
<li><a data-action="facet" href="JavaScript:void(0);">Term Facet</a></li> \
|
||||
<li><a data-action="facet_histogram" href="JavaScript:void(0);">Date Histogram Facet</a></li> \
|
||||
<li><a data-action="filter" href="JavaScript:void(0);">Text Filter</a></li> \
|
||||
<li class="divider"></li> \
|
||||
<li><a data-action="sortAsc" href="JavaScript:void(0);">Sort ascending</a></li> \
|
||||
<li><a data-action="sortDesc" href="JavaScript:void(0);">Sort descending</a></li> \
|
||||
<li class="divider"></li> \
|
||||
<li><a data-action="hideColumn" href="JavaScript:void(0);">Hide this column</a></li> \
|
||||
<li class="divider"></li> \
|
||||
<li class="write-op"><a data-action="bulkEdit" href="JavaScript:void(0);">Transform...</a></li> \
|
||||
</ul> \
|
||||
</div> \
|
||||
<th class="column-header {{#hidden}}hidden{{/hidden}}" data-field="{{id}}" style="width: {{width}}px; max-width: {{width}}px; min-width: {{width}}px;" title="{{label}}"> \
|
||||
<span class="column-header-name">{{label}}</span> \
|
||||
</th> \
|
||||
{{/fields}} \
|
||||
@ -270,14 +173,6 @@ my.GridRow = Backbone.View.extend({
|
||||
},
|
||||
|
||||
template: ' \
|
||||
<td> \
|
||||
<div class="btn-group row-header-menu"> \
|
||||
<a class="btn dropdown-toggle" data-toggle="dropdown"><span class="caret"></span></a> \
|
||||
<ul class="dropdown-menu data-table-menu"> \
|
||||
<li class="write-op"><a data-action="deleteRow" href="JavaScript:void(0);">Delete this row</a></li> \
|
||||
</ul> \
|
||||
</div> \
|
||||
</td> \
|
||||
{{#cells}} \
|
||||
<td data-field="{{field}}" style="width: {{width}}px; max-width: {{width}}px; min-width: {{width}}px;"> \
|
||||
<div class="data-table-cell-content"> \
|
||||
|
||||
@ -2,24 +2,6 @@
|
||||
|
||||
module("View - Grid");
|
||||
|
||||
test('menu - hideColumn', function () {
|
||||
var dataset = Fixture.getDataset();
|
||||
var view = new recline.View.Grid({
|
||||
model: dataset
|
||||
});
|
||||
$('.fixtures .test-datatable').append(view.el);
|
||||
view.render();
|
||||
|
||||
assertPresent('.column-header[data-field="x"]');
|
||||
var hideColumn = view.el.find('.column-header[data-field="x"] a[data-action="hideColumn"]');
|
||||
hideColumn.trigger('click');
|
||||
assertNotPresent('.column-header[data-field="x"]', view.el);
|
||||
|
||||
// also test a bit of state
|
||||
deepEqual(view.state.toJSON(), {hiddenFields: ['x']});
|
||||
view.remove();
|
||||
});
|
||||
|
||||
test('state', function () {
|
||||
var dataset = Fixture.getDataset();
|
||||
var view = new recline.View.Grid({
|
||||
@ -51,8 +33,8 @@ test('new GridRow View', function () {
|
||||
view.render();
|
||||
ok($el.attr('data-id'), '1');
|
||||
var tds = $el.find('td');
|
||||
equal(tds.length, 3);
|
||||
equal($(tds[1]).attr('data-field'), 'a');
|
||||
equal(tds.length, 2);
|
||||
equal($(tds[0]).attr('data-field'), 'a');
|
||||
view.remove();
|
||||
});
|
||||
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user