From 3ea18aa715711b4abd5658a3668e3c4b6015218f Mon Sep 17 00:00:00 2001 From: Rufus Pollock Date: Fri, 17 Feb 2012 23:43:27 +0000 Subject: [PATCH] [#25,refactor][s]: rename header(s) -> field(s) throughout. --- demo/js/app.js | 2 +- src/backend.js | 30 +++++++++++++++--------------- src/model.js | 11 +++++++++++ src/view-flot-graph.js | 10 +++++----- src/view.js | 40 ++++++++++++++++++++-------------------- test/model.test.js | 12 ++++++------ test/view.test.js | 4 ++-- 7 files changed, 60 insertions(+), 49 deletions(-) diff --git a/demo/js/app.js b/demo/js/app.js index a78bcf9d..df171885 100755 --- a/demo/js/app.js +++ b/demo/js/app.js @@ -51,7 +51,7 @@ function demoDataset() { title: 'My Test Dataset' , name: '1-my-test-dataset' , id: datasetId - , headers: ['x', 'y', 'z'] + , fields: ['x', 'y', 'z'] }, documents: [ {id: 0, x: 1, y: 2, z: 3} diff --git a/src/backend.js b/src/backend.js index 98dff9da..524cfb5b 100644 --- a/src/backend.js +++ b/src/backend.js @@ -48,7 +48,7 @@ this.recline.Model = this.recline.Model || {}; // // To use it you should provide in your constructor data: // - // * metadata (including headers array) + // * metadata (including fields array) // * documents: list of hashes, each hash being one doc. A doc *must* have an id attribute which is unique. // // Example: @@ -60,7 +60,7 @@ this.recline.Model = this.recline.Model || {}; // metadata: { // id: 'my-id', // title: 'My Title', - // headers: ['x', 'y', 'z'], + // fields: ['x', 'y', 'z'], // }, // documents: [ // {id: 0, x: 1, y: 2, z: 3}, @@ -153,11 +153,11 @@ this.recline.Model = this.recline.Model || {}; }); var dfd = $.Deferred(); wrapInTimeout(jqxhr).done(function(schema) { - headers = _.map(schema.data, function(item) { + fields = _.map(schema.data, function(item) { return item.name; }); model.set({ - headers: headers + fields: fields }); model.docCount = schema.count; dfd.resolve(model, jqxhr); @@ -228,7 +228,7 @@ this.recline.Model = this.recline.Model || {}; var dfd = $.Deferred(); wrapInTimeout(jqxhr).done(function(results) { model.set({ - headers: results.fields + fields: results.fields }); dfd.resolve(model, jqxhr); }) @@ -293,7 +293,7 @@ this.recline.Model = this.recline.Model || {}; $.getJSON(model.get('url'), function(d) { result = self.gdocsToJavascript(d); - model.set({'headers': result.header}); + model.set({'fields': result.field}); // cache data onto dataset (we have loaded whole gdoc it seems!) model._dataCache = result.data; dfd.resolve(model); @@ -303,9 +303,9 @@ this.recline.Model = this.recline.Model || {}; query: function(dataset, queryObj) { var dfd = $.Deferred(); - var fields = dataset.get('headers'); + var fields = dataset.get('fields'); - // zip the field headers with the data rows to produce js objs + // zip the fields with the data rows to produce js objs // TODO: factor this out as a common method with other backends var objs = _.map(dataset._dataCache, function (d) { var obj = {}; @@ -318,9 +318,9 @@ this.recline.Model = this.recline.Model || {}; gdocsToJavascript: function(gdocsSpreadsheet) { /* :options: (optional) optional argument dictionary: - columnsToUse: list of columns to use (specified by header names) + columnsToUse: list of columns to use (specified by field names) colTypes: dictionary (with column names as keys) specifying types (e.g. range, percent for use in conversion). - :return: tabular data object (hash with keys: header and data). + :return: tabular data object (hash with keys: field and data). Issues: seems google docs return columns in rows in random order and not even sure whether consistent across rows. */ @@ -329,7 +329,7 @@ this.recline.Model = this.recline.Model || {}; options = arguments[1]; } var results = { - 'header': [], + 'field': [], 'data': [] }; // default is no special info on type of columns @@ -340,14 +340,14 @@ this.recline.Model = this.recline.Model || {}; // either extract column headings from spreadsheet directly, or used supplied ones if (options.columnsToUse) { // columns set to subset supplied - results.header = options.columnsToUse; + results.field = options.columnsToUse; } else { // set columns to use to be all available if (gdocsSpreadsheet.feed.entry.length > 0) { for (var k in gdocsSpreadsheet.feed.entry[0]) { if (k.substr(0, 3) == 'gsx') { var col = k.substr(4) - results.header.push(col); + results.field.push(col); } } } @@ -357,8 +357,8 @@ this.recline.Model = this.recline.Model || {}; var rep = /^([\d\.\-]+)\%$/; $.each(gdocsSpreadsheet.feed.entry, function (i, entry) { var row = []; - for (var k in results.header) { - var col = results.header[k]; + for (var k in results.field) { + var col = results.field[k]; var _keyname = 'gsx$' + col; var value = entry[_keyname]['$t']; // if labelled as % and value contains %, convert diff --git a/src/model.js b/src/model.js index 81c25efb..9185113b 100644 --- a/src/model.js +++ b/src/model.js @@ -6,6 +6,17 @@ this.recline.Model = this.recline.Model || {}; // ## A Dataset model // +// A model must have the following (Backbone) attributes: +// +// * fields: (aka columns) is the array of fields (column) to display. Each +// entry in fields is a hash having at a minimum: +// * id: a unique identifer for this field- usually this should match the key in the documents hash +// * label: the visible label used for this field +// * type: the type of the data +// * data_key: the key used in the documents (usually this will be the same as +// id but having this allows us to set more than one column reading the same +// field. +// // Other than standard list of Backbone methods it has two important attributes: // // * currentDocuments: a DocumentList containing the Documents we have currently loaded for viewing (you update currentDocuments by calling getRows) diff --git a/src/view-flot-graph.js b/src/view-flot-graph.js index ecae709e..eb37489b 100644 --- a/src/view-flot-graph.js +++ b/src/view-flot-graph.js @@ -44,9 +44,9 @@ my.FlotGraph = Backbone.View.extend({ \
\ \
\
\ @@ -54,9 +54,9 @@ my.FlotGraph = Backbone.View.extend({ \
\ \
\
\ @@ -86,7 +86,7 @@ my.FlotGraph = Backbone.View.extend({ var self = this; this.el = $(this.el); _.bindAll(this, 'render', 'redraw'); - // we need the model.headers to render properly + // we need the model.fields to render properly this.model.bind('change', this.render); this.model.currentDocuments.bind('add', this.redraw); this.model.currentDocuments.bind('reset', this.redraw); diff --git a/src/view.js b/src/view.js index ed7effaf..ef95d332 100644 --- a/src/view.js +++ b/src/view.js @@ -112,7 +112,7 @@ my.DataExplorer = Backbone.View.extend({ this.router = new Backbone.Router(); this.setupRouting(); - // retrieve basic data like headers etc + // retrieve basic data like fields etc // note this.model and dataset returned are the same this.model.fetch() .done(function(dataset) { @@ -207,7 +207,7 @@ my.DataTable = Backbone.View.extend({ this.model.currentDocuments.bind('reset', this.render); this.model.currentDocuments.bind('remove', this.render); this.state = {}; - this.hiddenHeaders = []; + this.hiddenFields = []; }, events: { @@ -246,7 +246,7 @@ my.DataTable = Backbone.View.extend({ onRootHeaderClick: function(e) { util.position('data-table-menu', e); - util.render('rootActions', 'data-table-menu', {'columns': this.hiddenHeaders}); + util.render('rootActions', 'data-table-menu', {'columns': this.hiddenFields}); }, onMenuClick: function(e) { @@ -331,12 +331,12 @@ my.DataTable = Backbone.View.extend({ }, hideColumn: function() { - this.hiddenHeaders.push(this.state.currentColumn); + this.hiddenFields.push(this.state.currentColumn); this.render(); }, showColumn: function(e) { - this.hiddenHeaders = _.without(this.hiddenHeaders, $(e.target).data('column')); + this.hiddenFields = _.without(this.hiddenFields, $(e.target).data('column')); this.render(); }, @@ -356,7 +356,7 @@ my.DataTable = Backbone.View.extend({ \ \ {{/notEmpty}} \ - {{#headers}} \ + {{#fields}} \ \
\ \ @@ -364,7 +364,7 @@ my.DataTable = Backbone.View.extend({
\ \ \ - {{/headers}} \ + {{/fields}} \ \ \ \ @@ -373,14 +373,14 @@ my.DataTable = Backbone.View.extend({ toTemplateJSON: function() { var modelData = this.model.toJSON() - modelData.notEmpty = ( this.headers.length > 0 ) - modelData.headers = this.headers; + modelData.notEmpty = ( this.fields.length > 0 ) + modelData.fields = this.fields; return modelData; }, render: function() { var self = this; - this.headers = _.filter(this.model.get('headers'), function(header) { - return _.indexOf(self.hiddenHeaders, header) == -1; + this.fields = _.filter(this.model.get('fields'), function(field) { + return _.indexOf(self.hiddenFields, field) == -1; }); var htmls = $.mustache(this.template, this.toTemplateJSON()); this.el.html(htmls); @@ -390,11 +390,11 @@ my.DataTable = Backbone.View.extend({ var newView = new my.DataTableRow({ model: doc, el: tr, - headers: self.headers, + fields: self.fields, }); newView.render(); }); - this.el.toggleClass('no-hidden', (self.hiddenHeaders.length == 0)); + this.el.toggleClass('no-hidden', (self.hiddenFields.length == 0)); return this; } }); @@ -402,11 +402,11 @@ my.DataTable = Backbone.View.extend({ // ## DataTableRow View for rendering an individual document. // // Since we want this to update in place it is up to creator to provider the element to attach to. -// In addition you must pass in a headers in the constructor options. This should be list of headers for the DataTable. +// In addition you must pass in a fields in the constructor options. This should be list of fields for the DataTable. my.DataTableRow = Backbone.View.extend({ initialize: function(options) { _.bindAll(this, 'render'); - this._headers = options.headers; + this._fields = options.fields; this.el = $(this.el); this.model.bind('change', this.render); }, @@ -414,7 +414,7 @@ my.DataTableRow = Backbone.View.extend({ template: ' \ \ {{#cells}} \ - \ + \
\   \
{{value}}
\ @@ -431,8 +431,8 @@ my.DataTableRow = Backbone.View.extend({ toTemplateJSON: function() { var doc = this.model; - var cellData = _.map(this._headers, function(header) { - return {header: header, value: doc.get(header)} + var cellData = _.map(this._fields, function(field) { + return {field: field, value: doc.get(field)} }) return { id: this.id, cells: cellData } }, @@ -461,10 +461,10 @@ my.DataTableRow = Backbone.View.extend({ onEditorOK: function(e) { var cell = $(e.target); var rowId = cell.parents('tr').attr('data-id'); - var header = cell.parents('td').attr('data-header'); + var field = cell.parents('td').attr('data-field'); var newValue = cell.parents('.data-table-cell-editor').find('.data-table-cell-editor-editor').val(); var newData = {}; - newData[header] = newValue; + newData[field] = newValue; this.model.set(newData); my.notify("Updating row...", {loader: true}); this.model.save().then(function(response) { diff --git a/test/model.test.js b/test/model.test.js index e8c2edab..102ae4c8 100644 --- a/test/model.test.js +++ b/test/model.test.js @@ -6,7 +6,7 @@ var memoryData = { title: 'My Test Dataset' , name: '1-my-test-dataset' , id: 'test-dataset' - , headers: ['x', 'y', 'z'] + , fields: ['x', 'y', 'z'] }, documents: [ {id: 0, x: 1, y: 2, z: 3} @@ -32,7 +32,7 @@ test('Memory Backend: basics', function () { var data = dataset.backend.datasets[memoryData.metadata.id]; dataset.fetch().then(function(datasetAgain) { equal(dataset.get('name'), data.metadata.name); - deepEqual(dataset.get('headers'), data.metadata.headers); + deepEqual(dataset.get('fields'), data.metadata.fields); equal(dataset.docCount, 6); }); }); @@ -196,7 +196,7 @@ test('Webstore Backend', function() { }); dataset.fetch().done(function(dataset) { - deepEqual(['__id__', 'date', 'geometry', 'amount'], dataset.get('headers')); + deepEqual(['__id__', 'date', 'geometry', 'amount'], dataset.get('fields')); equal(3, dataset.docCount) dataset.query().done(function(docList) { equal(3, docList.length) @@ -295,7 +295,7 @@ test('DataProxy Backend', function() { }); dataset.fetch().done(function(dataset) { - deepEqual(['__id__', 'date', 'price'], dataset.get('headers')); + deepEqual(['__id__', 'date', 'price'], dataset.get('fields')); equal(null, dataset.docCount) dataset.query().done(function(docList) { equal(10, docList.length) @@ -490,8 +490,8 @@ test("GDoc Backend", function() { }); dataset.fetch().then(function(dataset) { - console.log('inside dataset:', dataset, dataset.get('headers'), dataset.get('data')); - deepEqual(['column-2', 'column-1'], dataset.get('headers')); + console.log('inside dataset:', dataset, dataset.get('fields'), dataset.get('data')); + deepEqual(['column-2', 'column-1'], dataset.get('fields')); //equal(null, dataset.docCount) dataset.query().then(function(docList) { equal(3, docList.length); diff --git a/test/view.test.js b/test/view.test.js index e8eb9755..74939941 100644 --- a/test/view.test.js +++ b/test/view.test.js @@ -13,13 +13,13 @@ test('new DataTableRow View', function () { var view = new recline.View.DataTableRow({ model: doc , el: $el - , headers: ['a', 'b'] + , fields: ['a', 'b'] }); view.render(); ok($el.attr('data-id'), '1'); var tds = $el.find('td'); equal(tds.length, 3); - equal($(tds[1]).attr('data-header'), 'a'); + equal($(tds[1]).attr('data-field'), 'a'); }); })(this.jQuery);