Initial commit

lib/assets/javascripts/dashboard/views/public-dataset/table-view/row-view.js

@@ -0,0 +1,135 @@
+const _ = require('underscore');
+const $ = require('jquery');
+const RowView = require('dashboard/components/table/row-view');
+const RowModel = require('dashboard/data/table/row-model');
+
+/**
+ * view used to render each row
+ */
+module.exports = RowView.extend({
+  classLabel: 'cdb.admin.RowView',
+  events: {
+    'click      .row_header': '_onOptionsClick',
+    'mouseout   .row_header': '_onOptionsOut'
+  },
+
+  cellRenderers: {
+    'default': '_renderDefault',
+    'boolean': '_renderBoolean',
+    'number': '_renderNumber',
+    'geometry': '_renderGeometry'
+  },
+
+  initialize: function (opts) {
+    RowView.prototype.initialize.call(this, opts);
+    _.bindAll(this, '_onOptionsClick', '_onOptionsOut');
+    this.options.row_header = true;
+
+    this.retrigger('saving', this.model);
+    this.retrigger('saved', this.model);
+    this.retrigger('errorSaving', this.model);
+  },
+
+  _getRowOptions: function () {
+    throw new Error('Method not migrated, check original implementation');
+  },
+
+  _onOptionsOut: function (e) {
+    var $relatedTarget = $(e.relatedTarget);
+
+    if ($relatedTarget.closest('.dropdown').length == 0 && $relatedTarget.closest('.row_header').length == 0) { // eslint-disable-line eqeqeq
+      if (this.rowOptions) this.rowOptions.hide();
+    }
+  },
+
+  _onOptionsClick: function (e) {
+    var rowOptions;
+    var left;
+    var top;
+    var $target = $(e.target);
+
+    if (this.table.isReadOnly()) {
+      // if data is read only do not allow
+      // to add or remove rows
+      return;
+    }
+    rowOptions = this._getRowOptions();
+    e.preventDefault();
+    $target.append(rowOptions.el);
+
+    left = 30;
+    top = 5;
+
+    // If it is the last td of the table, show the dropdown upwards
+    if ($target.closest('tr').is(':last-child') && $target.closest('tr').index() > 1) {
+      rowOptions.options.vertical_position = 'top';
+      rowOptions.options.tick = 'bottom';
+    } else {
+      rowOptions.options.vertical_position = 'down';
+      rowOptions.options.tick = 'top';
+    }
+
+    rowOptions.setRow(this.model);
+    rowOptions.openAt(left, top);
+    this.rowOptions = rowOptions; // to make it testable;
+    return false;
+  },
+
+  /**
+   * return each cell view
+   */
+  valueView: function (colName, value) {
+    this.table = this.table || this.getTableView().model;
+    var render = '_renderDefault';
+    if (colName.length) {
+      var colType = this.table.getColumnType(colName);
+      render = this.cellRenderers[colType] || render;
+    }
+
+    var obj = $(this[render](value));
+    obj.addClass('cell');
+    if (RowModel.isReservedColumn(colName)) {
+      obj.addClass('disabled');
+    }
+
+    // It is the first cell?
+    if (colName === '' && value === '') {
+      if (this.table.isReadOnly()) {
+        // No row options button
+        obj
+          .addClass('disabled')
+          .html('');
+      } else {
+        // Add row options button
+        obj.addClass('row_header');
+      }
+    }
+    return obj;
+  },
+
+  _renderDefault: function (value, additionalClasses) {
+    additionalClasses = additionalClasses || '';
+
+    var cell;
+
+    if (value === null) {
+      additionalClasses += ' isNull';
+      cell = '<div class="' + additionalClasses + '">null</div>';
+    } else cell = '<div class="' + additionalClasses + '">' + _.escape(value) + '</div>';
+
+    return cell;
+  },
+
+  _renderBoolean: function (value) {
+    return this._renderDefault(value, 'boolean');
+  },
+
+  _renderNumber: function (value) {
+    return this._renderDefault(value, 'number');
+  },
+
+  _renderGeometry: function (value) {
+    // Overriden in public-row-view
+  }
+
+});