anchor.diff:            <%= transcription_field.bottom_offset %>);
         <% end %>
       },
  -    afterCreateRow: updateHotHeight,
  -    afterRemoveRow: updateHotHeight,
  -    manualColumnResize: true,
  -    manualRowResize: true,
  -    afterChange: function(changes, source) {
  -      document.getElementById('<%= "fields-#{transcription_field.id}" %>').value = JSON.stringify(this.getData());
  -    },
  -    startRows: <%= transcription_field.starting_rows %>,
     });
   
     // $(container).data('hot-object', hot);
  
positive.code:     rowOffsetFromPageTop = topOffset + (rowHeightAsPagePct*(rowNum));
      fuzzyRowOffsetFromPageTop = rowOffsetFromPageTop - margin;
  
      if(window.viewer.world.getItemCount() > 0) {
        // now transpose for viewport coordinates
        viewportY = fuzzyRowOffsetFromPageTop * window.viewer.world.getItemAt(0).normHeight;
        viewportHeight = fuzzyRowHeightAsPagePct * window.viewer.world.getItemAt(0).normHeight;
  
negative.code:     contextMenu: ['row_above', 'row_below', 'remove_row', 'undo', 'redo', 'cut', 'copy'],
      dropdownMenu: true,
      columns: columnConfig,
      manualColumnResize: true,
      manualRowResize: true,
      startRows: <%= transcription_field.starting_rows %>,
      afterCreateRow: updateHotHeight,
      afterRemoveRow: updateHotHeight,
      afterChange: function(changes, source) {
        document.getElementById('<%= "fields-#{transcription_field.id}" %>').value = JSON.stringify(this.getData());
        if (changes) {
          var rowsCount = this.countRows();
          changes.forEach(([row, prop, oldValue, newValue]) => {
            if (row + 1 === rowsCount) {
              this.alter('insert_row', rowsCount);
            };
          });
        }
      },
      afterSelection: function(row, column, row2, column2, preventScrolling, selectionLayerLevel) {
        <% if transcription_field.row_highlight %>
          highlightRow(row,
            <%= transcription_field.starting_rows %>,
  