Add MediumEditor to jasmine and jshint

.jshintrc

@@ -10,5 +10,6 @@
   "unused": true,
   "boss": true,
   "eqnull": true,
-  "browser": true
+  "browser": true,
+  "predef": ["MediumEditor"]
 }

dist/js/medium-editor-tables.js

@@ -269,6 +269,8 @@ Table.prototype = {
     var table = this._doc.getElementById('medium-editor-table');
     table.removeAttribute('id');
     placeCaretAtNode(this._doc, table.querySelector('td'), true);
+
+    this._editor.checkSelection();
   },
 
   _html: function (rows, cols) {
@@ -342,8 +344,8 @@ Table.prototype = {
 
   _isLastCell: function (el, row, table) {
     return (
-      --row.cells.length == el.cellIndex &&
-      --table.rows.length == row.rowIndex
+      (row.cells.length - 1) === el.cellIndex &&
+      (table.rows.length - 1) === row.rowIndex
     );
   },
 
@@ -355,88 +357,50 @@ Table.prototype = {
   }
 };
 
-function MediumEditorTable(options) {
-  this.options = extend(options, {
-    columns: 10,
-    rows: 10
-  });
-  this.parent = true;
-  this.hasForm = true;
-  this.isFormVisible = false;
-  this.createButton();
-}
-
-MediumEditorTable.prototype = {
-  createButton: function () {
-    this._createButtonElement();
-    this._bindButtonClick();
-  },
-
-  isDisplayed: function () {
-    return this.isFormVisible;
-  },
-
-  getForm: function () {
-    if (!this.builder) {
-      this.builder = new Builder({
-        onClick: function (rows, columns) {
-          this.table.insert(rows, columns);
-          this.hideForm();
-        }.bind(this),
-        ownerDocument: this.document,
-        rows: this.options.rows,
-        columns: this.options.columns
-      });
-      this.table = new Table(this.base);
-    }
-
-    return this.builder.getElement();
-  },
+var MediumEditorTable = MediumEditor.extensions.form.extend({
+  name: 'table',
 
-  getButton: function () {
-    if (this.options.buttonLabel) {
-      this.button.innerHTML = this.options.buttonLabel;
-    } else if (this.base.options.buttonLabels === 'fontawesome') {
-      this.button.innerHTML = '<i class="fa fa-table"></i>';
-    }
-    return this.button;
-  },
+  aria: 'create table',
+  action: 'table',
+  contentDefault: 'TBL',
+  contentFA: '<i class="fa fa-table"></i>',
 
-  onHide: function () {
-    this.hideForm();
+  handleClick: function () {
+    this[this.isActive() === true ? 'hide' : 'show']();
   },
 
-  hideForm: function () {
-    this.isFormVisible = false;
+  hide: function () {
+    this.setInactive();
     this.builder.hide();
-    this.button.classList.remove('medium-editor-button-active');
   },
 
   show: function () {
-    this.isFormVisible = true;
+    this.setActive();
     this.builder.show(this.button.offsetLeft);
-    this.button.classList.add('medium-editor-button-active');
-    var elements = document.getElementsByClassName('medium-editor-table-builder-grid');
+    var elements = this.document.getElementsByClassName('medium-editor-table-builder-grid');
     for (var i = 0; i < elements.length; i++) {
       // TODO: what is 16 and what is 2?
-      elements[i].style.height = (16 * this.options.rows + 2) + 'px';
-      elements[i].style.width = (16 * this.options.columns + 2) + 'px';
+      elements[i].style.height = (16 * this.rows + 2) + 'px';
+      elements[i].style.width = (16 * this.columns + 2) + 'px';
     }
   },
 
-  _createButtonElement: function () {
-    this.button = document.createElement('button');
-    this.button.className = 'medium-editor-action';
-    this.button.innerHTML = 'tbl';
-  },
+  getForm: function () {
+    this.builder = new Builder({
+      onClick: function (rows, columns) {
+        this.table.insert(rows, columns);
+        this.hide();
+      }.bind(this),
+      ownerDocument: this.document,
+      rows: this.rows || 10,
+      columns: this.columns || 10
+    });
 
-  _bindButtonClick: function () {
-    this.button.addEventListener('click', function (e) {
-      e.preventDefault();
-      this[this.isFormVisible === true ? 'hideForm' : 'show']();
-    }.bind(this));
+    this.table = new Table(this.base);
+
+    return this.builder.getElement();
   }
-};
+});
 
   return MediumEditorTable;
 }()));

grunt/jasmine.js

@@ -5,6 +5,7 @@ module.exports = {
       specs: 'spec/*.spec.js',
       helpers: 'spec/helpers/*.js',
       styles: 'dist/css/*.css',
+      vendor: 'node_modules/medium-editor/dist/js/medium-editor.js',
       junit: {
         path: 'reports/jasmine/',
         consolidate: true