mirror of
				https://github.com/gristlabs/grist-core.git
				synced 2025-06-13 20:53:59 +00:00 
			
		
		
		
	(core) Remove some unused code, especially in ViewConfigTab
Summary: Remove several unused methods in ViewConfigTab.js, and all of SummaryConfig.js. Test Plan: this Reviewers: dsagal Reviewed By: dsagal Differential Revision: https://phab.getgrist.com/D3245
This commit is contained in:
		
							parent
							
								
									d8aacbe3b4
								
							
						
					
					
						commit
						64abfcb0ac
					
				@ -1,129 +0,0 @@
 | 
				
			|||||||
const ko = require('knockout');
 | 
					 | 
				
			||||||
const dispose = require('../lib/dispose');
 | 
					 | 
				
			||||||
const dom = require('../lib/dom');
 | 
					 | 
				
			||||||
const kd = require('../lib/koDom');
 | 
					 | 
				
			||||||
const kf = require('../lib/koForm');
 | 
					 | 
				
			||||||
const koArray = require('../lib/koArray');
 | 
					 | 
				
			||||||
const multiselect = require('../lib/multiselect');
 | 
					 | 
				
			||||||
const modelUtil = require('../models/modelUtil');
 | 
					 | 
				
			||||||
const gutil = require('app/common/gutil');
 | 
					 | 
				
			||||||
 | 
					 | 
				
			||||||
 | 
					 | 
				
			||||||
/**
 | 
					 | 
				
			||||||
 * Maintains the part of side-pane configuration responsible for summary tables. In particular, it
 | 
					 | 
				
			||||||
 * allows the user to see and change group-by columns.
 | 
					 | 
				
			||||||
 * @param {GristDoc} options.gristDoc: the GristDoc instance.
 | 
					 | 
				
			||||||
 * @param {observable} options.section: the observable for the ViewSection RowModel being configured.
 | 
					 | 
				
			||||||
 */
 | 
					 | 
				
			||||||
function SummaryConfig(options) {
 | 
					 | 
				
			||||||
  this.gristDoc = options.gristDoc;
 | 
					 | 
				
			||||||
  this.section = options.section;
 | 
					 | 
				
			||||||
 | 
					 | 
				
			||||||
  // Whether or not this is a summary section at all.
 | 
					 | 
				
			||||||
  this.isSummarySection = this.autoDispose(ko.computed(() =>
 | 
					 | 
				
			||||||
    Boolean(this.section().table().summarySourceTable())));
 | 
					 | 
				
			||||||
 | 
					 | 
				
			||||||
  // Observable for the RowModel for the source table for this summary table.
 | 
					 | 
				
			||||||
  this._summarySourceTable = this.autoDispose(ko.computed(() =>
 | 
					 | 
				
			||||||
    this.section().table().summarySource()
 | 
					 | 
				
			||||||
  ));
 | 
					 | 
				
			||||||
 | 
					 | 
				
			||||||
  // Observable for the array of colRefs for the source group-by columns. It may be saved to sync
 | 
					 | 
				
			||||||
  // to the server, or reverted.
 | 
					 | 
				
			||||||
  this._groupByCols = this.autoDispose(modelUtil.customComputed({
 | 
					 | 
				
			||||||
    read: () => (
 | 
					 | 
				
			||||||
      this.section().viewFields().all().map(f => f.column().summarySourceCol())
 | 
					 | 
				
			||||||
      .concat(
 | 
					 | 
				
			||||||
        // If there are hidden group-by columns, list those as well.
 | 
					 | 
				
			||||||
        this.section().hiddenColumns().map(col => col.summarySourceCol())
 | 
					 | 
				
			||||||
      )
 | 
					 | 
				
			||||||
      .filter(scol => scol)
 | 
					 | 
				
			||||||
    ),
 | 
					 | 
				
			||||||
    save: colRefs => this.gristDoc.docData.sendAction(
 | 
					 | 
				
			||||||
      ["UpdateSummaryViewSection", this.section().getRowId(), colRefs]
 | 
					 | 
				
			||||||
    )
 | 
					 | 
				
			||||||
  }));
 | 
					 | 
				
			||||||
 | 
					 | 
				
			||||||
  // Observable for the same set of colRefs as in this._groupByCols, for faster lookups.
 | 
					 | 
				
			||||||
  this._groupBySourceColSet = this.autoDispose(ko.computed(() => new Set(this._groupByCols())));
 | 
					 | 
				
			||||||
 | 
					 | 
				
			||||||
  // KoArray for the RowModels for the source group-by columns.
 | 
					 | 
				
			||||||
  this._groupByItems = this.autoDispose(koArray.syncedKoArray(this._groupByCols,
 | 
					 | 
				
			||||||
    colRef => this.gristDoc.docModel.columns.getRowModel(colRef)));
 | 
					 | 
				
			||||||
}
 | 
					 | 
				
			||||||
dispose.makeDisposable(SummaryConfig);
 | 
					 | 
				
			||||||
 | 
					 | 
				
			||||||
 | 
					 | 
				
			||||||
/**
 | 
					 | 
				
			||||||
 * Helper that implements the auto-complete search of columns available for group-by.
 | 
					 | 
				
			||||||
 * Calls response() with a list of {label, value} objects, where 'label' is the colId, and 'value'
 | 
					 | 
				
			||||||
 * is the rowId.
 | 
					 | 
				
			||||||
 */
 | 
					 | 
				
			||||||
SummaryConfig.prototype._groupBySearch = function(request, response) {
 | 
					 | 
				
			||||||
  response(
 | 
					 | 
				
			||||||
    this._summarySourceTable().columns().peek().filter(c => {
 | 
					 | 
				
			||||||
      return gutil.startsWith(c.label().toLowerCase(), request.term.toLowerCase()) &&
 | 
					 | 
				
			||||||
        !this._groupBySourceColSet().has(c.getRowId()) && !c.isHiddenCol();
 | 
					 | 
				
			||||||
    })
 | 
					 | 
				
			||||||
    .map(c => ({label: c.label(), value: c.getRowId()}))
 | 
					 | 
				
			||||||
  );
 | 
					 | 
				
			||||||
};
 | 
					 | 
				
			||||||
 | 
					 | 
				
			||||||
 | 
					 | 
				
			||||||
/**
 | 
					 | 
				
			||||||
 * Saves this summary table as an independent table.
 | 
					 | 
				
			||||||
 */
 | 
					 | 
				
			||||||
SummaryConfig.prototype._saveAsTable = function() {
 | 
					 | 
				
			||||||
  return this.gristDoc.docData.sendAction(
 | 
					 | 
				
			||||||
    ["DetachSummaryViewSection", this.section().getRowId()]);
 | 
					 | 
				
			||||||
};
 | 
					 | 
				
			||||||
 | 
					 | 
				
			||||||
 | 
					 | 
				
			||||||
/**
 | 
					 | 
				
			||||||
 * Build the DOM for summary table config.
 | 
					 | 
				
			||||||
 */
 | 
					 | 
				
			||||||
SummaryConfig.prototype.buildSummaryConfigDom = function() {
 | 
					 | 
				
			||||||
  return dom('div',
 | 
					 | 
				
			||||||
    dom.testId('SummaryConfig'),
 | 
					 | 
				
			||||||
    dom('div.multiselect-hint', 'Select columns to group by.'),
 | 
					 | 
				
			||||||
    multiselect(this._groupBySearch.bind(this), this._groupByItems, col => {
 | 
					 | 
				
			||||||
      return dom('div.multiselect-label', kd.text(col.label));
 | 
					 | 
				
			||||||
    }, {
 | 
					 | 
				
			||||||
      // Shows up when no group-by columns are selected
 | 
					 | 
				
			||||||
      hint: "Showing totals.",
 | 
					 | 
				
			||||||
 | 
					 | 
				
			||||||
      add: item => this._groupByCols.modifyAssign(colRefs =>
 | 
					 | 
				
			||||||
        colRefs.push(item.value)),
 | 
					 | 
				
			||||||
 | 
					 | 
				
			||||||
      remove: col => this._groupByCols.modifyAssign(colRefs =>
 | 
					 | 
				
			||||||
        gutil.arrayRemove(colRefs, col.getRowId())),
 | 
					 | 
				
			||||||
 | 
					 | 
				
			||||||
      reorder: (col, nextCol) => this._groupByCols.modifyAssign(colRefs => {
 | 
					 | 
				
			||||||
        gutil.arrayRemove(colRefs, col.getRowId());
 | 
					 | 
				
			||||||
        gutil.arrayInsertBefore(colRefs, col.getRowId(), nextCol ? nextCol.getRowId() : null);
 | 
					 | 
				
			||||||
      }),
 | 
					 | 
				
			||||||
    }),
 | 
					 | 
				
			||||||
 | 
					 | 
				
			||||||
    kf.row(
 | 
					 | 
				
			||||||
      2, kf.buttonGroup(
 | 
					 | 
				
			||||||
        kf.button(() => this._groupByCols.revert(),
 | 
					 | 
				
			||||||
          kd.toggleClass('disabled', this._groupByCols.isSaved),
 | 
					 | 
				
			||||||
          'Cancel'
 | 
					 | 
				
			||||||
        ),
 | 
					 | 
				
			||||||
        kf.button(() => this._groupByCols.save(),
 | 
					 | 
				
			||||||
          kd.toggleClass('disabled', this._groupByCols.isSaved),
 | 
					 | 
				
			||||||
          'Apply'
 | 
					 | 
				
			||||||
        )
 | 
					 | 
				
			||||||
      ),
 | 
					 | 
				
			||||||
      1, kf.buttonGroup(
 | 
					 | 
				
			||||||
        kf.button(() => this._saveAsTable(),
 | 
					 | 
				
			||||||
          { title: 'Save summary as a separate table' },
 | 
					 | 
				
			||||||
          'Detach'
 | 
					 | 
				
			||||||
        )
 | 
					 | 
				
			||||||
      )
 | 
					 | 
				
			||||||
    )
 | 
					 | 
				
			||||||
  );
 | 
					 | 
				
			||||||
};
 | 
					 | 
				
			||||||
 | 
					 | 
				
			||||||
 | 
					 | 
				
			||||||
module.exports = SummaryConfig;
 | 
					 | 
				
			||||||
@ -5,7 +5,6 @@ var dom = require('../lib/dom');
 | 
				
			|||||||
var kd = require('../lib/koDom');
 | 
					var kd = require('../lib/koDom');
 | 
				
			||||||
var kf = require('../lib/koForm');
 | 
					var kf = require('../lib/koForm');
 | 
				
			||||||
var koArray = require('../lib/koArray');
 | 
					var koArray = require('../lib/koArray');
 | 
				
			||||||
var SummaryConfig = require('./SummaryConfig');
 | 
					 | 
				
			||||||
var commands = require('./commands');
 | 
					var commands = require('./commands');
 | 
				
			||||||
var {CustomSectionElement} = require('../lib/CustomSectionElement');
 | 
					var {CustomSectionElement} = require('../lib/CustomSectionElement');
 | 
				
			||||||
const {ChartConfig} = require('./ChartView');
 | 
					const {ChartConfig} = require('./ChartView');
 | 
				
			||||||
@ -16,7 +15,6 @@ const {updatePositions} = require('app/client/lib/sortUtil');
 | 
				
			|||||||
const {attachColumnFilterMenu} = require('app/client/ui/ColumnFilterMenu');
 | 
					const {attachColumnFilterMenu} = require('app/client/ui/ColumnFilterMenu');
 | 
				
			||||||
const {addFilterMenu} = require('app/client/ui/FilterBar');
 | 
					const {addFilterMenu} = require('app/client/ui/FilterBar');
 | 
				
			||||||
const {cssIcon, cssRow} = require('app/client/ui/RightPanel');
 | 
					const {cssIcon, cssRow} = require('app/client/ui/RightPanel');
 | 
				
			||||||
const {VisibleFieldsConfig} = require('app/client/ui/VisibleFieldsConfig');
 | 
					 | 
				
			||||||
const {basicButton, primaryButton} = require('app/client/ui2018/buttons');
 | 
					const {basicButton, primaryButton} = require('app/client/ui2018/buttons');
 | 
				
			||||||
const {labeledLeftSquareCheckbox} = require("app/client/ui2018/checkbox");
 | 
					const {labeledLeftSquareCheckbox} = require("app/client/ui2018/checkbox");
 | 
				
			||||||
const {colors} = require('app/client/ui2018/cssVars');
 | 
					const {colors} = require('app/client/ui2018/cssVars');
 | 
				
			||||||
@ -70,139 +68,10 @@ function ViewConfigTab(options) {
 | 
				
			|||||||
      return this.viewModel.activeSection().parentKey() === 'record';}, this));
 | 
					      return this.viewModel.activeSection().parentKey() === 'record';}, this));
 | 
				
			||||||
  this.isCustom = this.autoDispose(ko.computed(function() {
 | 
					  this.isCustom = this.autoDispose(ko.computed(function() {
 | 
				
			||||||
      return this.viewModel.activeSection().parentKey() === 'custom';}, this));
 | 
					      return this.viewModel.activeSection().parentKey() === 'custom';}, this));
 | 
				
			||||||
 | 
					 | 
				
			||||||
  this._summaryConfig = this.autoDispose(SummaryConfig.create({
 | 
					 | 
				
			||||||
    gristDoc: this.gristDoc,
 | 
					 | 
				
			||||||
    section: this.viewModel.activeSection
 | 
					 | 
				
			||||||
  }));
 | 
					 | 
				
			||||||
 | 
					 | 
				
			||||||
  if (!options.skipDomBuild) {
 | 
					 | 
				
			||||||
    this.gristDoc.addOptionsTab(
 | 
					 | 
				
			||||||
      'View', dom('span.glyphicon.glyphicon-credit-card'),
 | 
					 | 
				
			||||||
      this.buildConfigDomObj(),
 | 
					 | 
				
			||||||
      { 'category': 'options', 'show': this.activeSectionData }
 | 
					 | 
				
			||||||
    );
 | 
					 | 
				
			||||||
  }
 | 
					 | 
				
			||||||
}
 | 
					}
 | 
				
			||||||
dispose.makeDisposable(ViewConfigTab);
 | 
					dispose.makeDisposable(ViewConfigTab);
 | 
				
			||||||
 | 
					
 | 
				
			||||||
 | 
					
 | 
				
			||||||
function getLabelFunc(field) { return field ? field.label() : null; }
 | 
					 | 
				
			||||||
 | 
					 | 
				
			||||||
ViewConfigTab.prototype._buildSectionFieldsConfig = function() {
 | 
					 | 
				
			||||||
  var self = this;
 | 
					 | 
				
			||||||
  return kd.maybe(this.activeSectionData, function(sectionData) {
 | 
					 | 
				
			||||||
    const visibleFieldsConfig = VisibleFieldsConfig.create(null, self.gristDoc, sectionData.section, false);
 | 
					 | 
				
			||||||
    const [fieldsDraggable, hiddenFieldsDraggable] = visibleFieldsConfig.buildSectionFieldsConfigHelper({
 | 
					 | 
				
			||||||
      visibleFields: { itemCreateFunc: getLabelFunc },
 | 
					 | 
				
			||||||
      hiddenFields: {itemCreateFunc: getLabelFunc }
 | 
					 | 
				
			||||||
    });
 | 
					 | 
				
			||||||
    return dom('div',
 | 
					 | 
				
			||||||
      dom.autoDispose(visibleFieldsConfig),
 | 
					 | 
				
			||||||
      kf.collapsible(function(isCollapsed) {
 | 
					 | 
				
			||||||
        return [
 | 
					 | 
				
			||||||
          kf.collapserLabel(isCollapsed, 'Visible Fields', kd.toggleClass('view_config_field_group', true)),
 | 
					 | 
				
			||||||
          dom.testId('ViewConfigTab_visibleFields'),
 | 
					 | 
				
			||||||
          fieldsDraggable,
 | 
					 | 
				
			||||||
        ];
 | 
					 | 
				
			||||||
      }, false),
 | 
					 | 
				
			||||||
 | 
					 | 
				
			||||||
      kf.collapsible(function(isCollapsed) {
 | 
					 | 
				
			||||||
        return [
 | 
					 | 
				
			||||||
          kf.collapserLabel(isCollapsed, 'Hidden Fields', kd.toggleClass('view_config_field_group', true)),
 | 
					 | 
				
			||||||
          dom.testId('ViewConfigTab_hiddenFields'),
 | 
					 | 
				
			||||||
          hiddenFieldsDraggable,
 | 
					 | 
				
			||||||
        ];
 | 
					 | 
				
			||||||
      }, false),
 | 
					 | 
				
			||||||
    );
 | 
					 | 
				
			||||||
  });
 | 
					 | 
				
			||||||
};
 | 
					 | 
				
			||||||
 | 
					 | 
				
			||||||
// Builds object with ViewConfigTab dom builder and settings for the sidepane.
 | 
					 | 
				
			||||||
ViewConfigTab.prototype.buildConfigDomObj = function() {
 | 
					 | 
				
			||||||
  return [{
 | 
					 | 
				
			||||||
      'buildDom': this._buildNameDom.bind(this),
 | 
					 | 
				
			||||||
      'keywords': ['view', 'name', 'title']
 | 
					 | 
				
			||||||
    }, {
 | 
					 | 
				
			||||||
      'buildDom': this._buildSectionNameDom.bind(this),
 | 
					 | 
				
			||||||
      'keywords': ['section', 'viewsection', 'name', 'title']
 | 
					 | 
				
			||||||
    }, {
 | 
					 | 
				
			||||||
      'buildDom': this._buildAdvancedSettingsDom.bind(this),
 | 
					 | 
				
			||||||
      'keywords': ['table', 'demand', 'ondemand', 'big']
 | 
					 | 
				
			||||||
    }, {
 | 
					 | 
				
			||||||
      'header': true,
 | 
					 | 
				
			||||||
      'label': 'Summarize',
 | 
					 | 
				
			||||||
      'showObs': this._summaryConfig.isSummarySection,
 | 
					 | 
				
			||||||
      'items': [{
 | 
					 | 
				
			||||||
        'buildDom': () => this._summaryConfig.buildSummaryConfigDom(),
 | 
					 | 
				
			||||||
        'keywords': ['section', 'summary', 'summarize', 'group', 'breakdown']
 | 
					 | 
				
			||||||
      }]
 | 
					 | 
				
			||||||
    }, {
 | 
					 | 
				
			||||||
      'header': true,
 | 
					 | 
				
			||||||
      'label': 'Sort',
 | 
					 | 
				
			||||||
      'items': [{
 | 
					 | 
				
			||||||
          'buildDom': this.buildSortDom.bind(this),
 | 
					 | 
				
			||||||
          'keywords': ['section', 'sort', 'order']
 | 
					 | 
				
			||||||
        }]
 | 
					 | 
				
			||||||
    }, {
 | 
					 | 
				
			||||||
      'header': true,
 | 
					 | 
				
			||||||
      'label': 'Filter',
 | 
					 | 
				
			||||||
      'items': [{
 | 
					 | 
				
			||||||
          'buildDom': this._buildFilterDom.bind(this),
 | 
					 | 
				
			||||||
          'keywords': ['section', 'filters']
 | 
					 | 
				
			||||||
        }]
 | 
					 | 
				
			||||||
    }, {
 | 
					 | 
				
			||||||
      'header': true,
 | 
					 | 
				
			||||||
      'label': 'Link Sections',
 | 
					 | 
				
			||||||
      'items': [{
 | 
					 | 
				
			||||||
          'buildDom': this._buildLinkDom.bind(this),
 | 
					 | 
				
			||||||
          'keywords': ['section', 'view', 'linking', 'edit', 'autoscroll', 'autofilter']
 | 
					 | 
				
			||||||
        }]
 | 
					 | 
				
			||||||
    }, {
 | 
					 | 
				
			||||||
      'header': true,
 | 
					 | 
				
			||||||
      'label': 'Customize Detail View',
 | 
					 | 
				
			||||||
      'showObs': this.isDetail,
 | 
					 | 
				
			||||||
      'items': [{
 | 
					 | 
				
			||||||
          'buildDom': this._buildDetailTypeDom.bind(this),
 | 
					 | 
				
			||||||
          'keywords': ['section', 'detail']
 | 
					 | 
				
			||||||
        }, {
 | 
					 | 
				
			||||||
          'buildDom': this._buildThemeDom.bind(this),
 | 
					 | 
				
			||||||
          'keywords': ['section', 'theme', 'appearance', 'detail']
 | 
					 | 
				
			||||||
        }, {
 | 
					 | 
				
			||||||
          'buildDom': this._buildLayoutDom.bind(this),
 | 
					 | 
				
			||||||
          'keywords': ['section', 'layout', 'arrangement', 'rearrange']
 | 
					 | 
				
			||||||
        }]
 | 
					 | 
				
			||||||
    }, {
 | 
					 | 
				
			||||||
      'header': true,
 | 
					 | 
				
			||||||
      'label': 'Customize Grid View',
 | 
					 | 
				
			||||||
      'showObs': this.isGrid,
 | 
					 | 
				
			||||||
      'items': [{
 | 
					 | 
				
			||||||
        'buildDom': this._buildGridStyleDom.bind(this),
 | 
					 | 
				
			||||||
        'keywords': ['section', 'zebra', 'stripe', 'appearance', 'grid', 'gridlines', 'style', 'border']
 | 
					 | 
				
			||||||
        }]
 | 
					 | 
				
			||||||
    }, {
 | 
					 | 
				
			||||||
      'header': true,
 | 
					 | 
				
			||||||
      'label': 'Chart',
 | 
					 | 
				
			||||||
      'showObs': this.isChart,
 | 
					 | 
				
			||||||
      'items': [{
 | 
					 | 
				
			||||||
        'buildDom': () => this._buildChartConfigDom()
 | 
					 | 
				
			||||||
      }]
 | 
					 | 
				
			||||||
    }, {
 | 
					 | 
				
			||||||
      'header': true,
 | 
					 | 
				
			||||||
      'label': 'Custom View',
 | 
					 | 
				
			||||||
      'showObs': this.isCustom,
 | 
					 | 
				
			||||||
      'items': this._buildCustomTypeItems(),
 | 
					 | 
				
			||||||
      'keywords': ['section', 'custom']
 | 
					 | 
				
			||||||
    }, {
 | 
					 | 
				
			||||||
      'header': true,
 | 
					 | 
				
			||||||
      'label': 'Column Display',
 | 
					 | 
				
			||||||
      'items': [{
 | 
					 | 
				
			||||||
          'buildDom': this._buildSectionFieldsConfig.bind(this),
 | 
					 | 
				
			||||||
          'keywords': ['section', 'fields', 'hidden', 'hide', 'show', 'visible']
 | 
					 | 
				
			||||||
        }]
 | 
					 | 
				
			||||||
    }];
 | 
					 | 
				
			||||||
};
 | 
					 | 
				
			||||||
 | 
					 | 
				
			||||||
ViewConfigTab.prototype.buildSortDom = function() {
 | 
					ViewConfigTab.prototype.buildSortDom = function() {
 | 
				
			||||||
  return grainjsDom.maybe(this.activeSectionData, (sectionData) => {
 | 
					  return grainjsDom.maybe(this.activeSectionData, (sectionData) => {
 | 
				
			||||||
    const section = sectionData.section;
 | 
					    const section = sectionData.section;
 | 
				
			||||||
@ -462,24 +331,6 @@ ViewConfigTab.prototype._saveSort = function(sortSpec) {
 | 
				
			|||||||
  this.activeSectionData().section.activeSortSpec(sortSpec);
 | 
					  this.activeSectionData().section.activeSortSpec(sortSpec);
 | 
				
			||||||
};
 | 
					};
 | 
				
			||||||
 | 
					
 | 
				
			||||||
ViewConfigTab.prototype._buildNameDom = function() {
 | 
					 | 
				
			||||||
  return kf.row(
 | 
					 | 
				
			||||||
    1, dom('div.glyphicon.glyphicon-tasks.config_icon'),
 | 
					 | 
				
			||||||
    4, kf.label('View'),
 | 
					 | 
				
			||||||
    13, kf.text(this.viewModel.name, {}, dom.testId('ViewManager_viewNameInput'))
 | 
					 | 
				
			||||||
  );
 | 
					 | 
				
			||||||
};
 | 
					 | 
				
			||||||
 | 
					 | 
				
			||||||
ViewConfigTab.prototype._buildSectionNameDom = function() {
 | 
					 | 
				
			||||||
  return kd.maybe(this.activeSectionData, function(sectionData) {
 | 
					 | 
				
			||||||
    return kf.row(
 | 
					 | 
				
			||||||
      1, dom('div.glyphicon.glyphicon-credit-card.config_icon'),
 | 
					 | 
				
			||||||
      4, kf.label('Section'),
 | 
					 | 
				
			||||||
      13, kf.text(sectionData.section.titleDef, {}, dom.testId('ViewConfigTab_sectionNameInput'))
 | 
					 | 
				
			||||||
    );
 | 
					 | 
				
			||||||
  });
 | 
					 | 
				
			||||||
};
 | 
					 | 
				
			||||||
 | 
					 | 
				
			||||||
ViewConfigTab.prototype._makeOnDemand = function(table) {
 | 
					ViewConfigTab.prototype._makeOnDemand = function(table) {
 | 
				
			||||||
  // After saving the changed setting, force the reload of the document.
 | 
					  // After saving the changed setting, force the reload of the document.
 | 
				
			||||||
  const onConfirm = () => {
 | 
					  const onConfirm = () => {
 | 
				
			||||||
@ -540,21 +391,6 @@ ViewConfigTab.prototype._buildAdvancedSettingsDom = function() {
 | 
				
			|||||||
  });
 | 
					  });
 | 
				
			||||||
};
 | 
					};
 | 
				
			||||||
 | 
					
 | 
				
			||||||
ViewConfigTab.prototype._buildDetailTypeDom = function() {
 | 
					 | 
				
			||||||
  return kd.maybe(this.activeSectionData, (sectionData) => {
 | 
					 | 
				
			||||||
    var section = sectionData.section;
 | 
					 | 
				
			||||||
    if (this.isDetail()) {
 | 
					 | 
				
			||||||
      return kf.row(
 | 
					 | 
				
			||||||
        1, kf.label('Type'),
 | 
					 | 
				
			||||||
        1, kf.buttonSelect(section.parentKey,
 | 
					 | 
				
			||||||
          kf.optionButton('detail', 'List', dom.testId('ViewConfigTab_card')),
 | 
					 | 
				
			||||||
          kf.optionButton('single', 'Single', dom.testId('ViewConfigTab_detail'))
 | 
					 | 
				
			||||||
        )
 | 
					 | 
				
			||||||
      );
 | 
					 | 
				
			||||||
    }
 | 
					 | 
				
			||||||
  });
 | 
					 | 
				
			||||||
};
 | 
					 | 
				
			||||||
 | 
					 | 
				
			||||||
ViewConfigTab.prototype._buildFilterDom = function() {
 | 
					ViewConfigTab.prototype._buildFilterDom = function() {
 | 
				
			||||||
  return grainjsDom.maybe(this.activeSectionData, (sectionData) => {
 | 
					  return grainjsDom.maybe(this.activeSectionData, (sectionData) => {
 | 
				
			||||||
    const section = sectionData.section;
 | 
					    const section = sectionData.section;
 | 
				
			||||||
@ -659,31 +495,6 @@ ViewConfigTab.prototype._buildThemeDom = function() {
 | 
				
			|||||||
  });
 | 
					  });
 | 
				
			||||||
};
 | 
					};
 | 
				
			||||||
 | 
					
 | 
				
			||||||
ViewConfigTab.prototype._buildGridStyleDom = function() {
 | 
					 | 
				
			||||||
 | 
					 | 
				
			||||||
  return kd.maybe(this.activeSectionData, (sectionData) => {
 | 
					 | 
				
			||||||
    var section = sectionData.section;
 | 
					 | 
				
			||||||
    return dom('div',
 | 
					 | 
				
			||||||
      kf.row(
 | 
					 | 
				
			||||||
        15, kf.label('Horizontal Gridlines'),
 | 
					 | 
				
			||||||
        2, kf.checkbox(section.optionsObj.prop('horizontalGridlines'),
 | 
					 | 
				
			||||||
                       dom.testId('ViewConfigTab_hGridButton'))
 | 
					 | 
				
			||||||
      ),
 | 
					 | 
				
			||||||
      kf.row(
 | 
					 | 
				
			||||||
        15, kf.label('Vertical Gridlines'),
 | 
					 | 
				
			||||||
        2, kf.checkbox(section.optionsObj.prop('verticalGridlines'),
 | 
					 | 
				
			||||||
                       dom.testId('ViewConfigTab_vGridButton'))
 | 
					 | 
				
			||||||
      ),
 | 
					 | 
				
			||||||
      kf.row(
 | 
					 | 
				
			||||||
        15, kf.label('Zebra Stripes'),
 | 
					 | 
				
			||||||
        2, kf.checkbox(section.optionsObj.prop('zebraStripes'),
 | 
					 | 
				
			||||||
                       dom.testId('ViewConfigTab_zebraStripeButton'))
 | 
					 | 
				
			||||||
      ),
 | 
					 | 
				
			||||||
      dom.testId('ViewConfigTab_gridOptions')
 | 
					 | 
				
			||||||
    );
 | 
					 | 
				
			||||||
  });
 | 
					 | 
				
			||||||
};
 | 
					 | 
				
			||||||
 | 
					 | 
				
			||||||
ViewConfigTab.prototype._buildChartConfigDom = function() {
 | 
					ViewConfigTab.prototype._buildChartConfigDom = function() {
 | 
				
			||||||
  return grainjsDom.maybe(this.viewModel.activeSection, (section) => grainjsDom.create(ChartConfig, this.gristDoc, section));
 | 
					  return grainjsDom.maybe(this.viewModel.activeSection, (section) => grainjsDom.create(ChartConfig, this.gristDoc, section));
 | 
				
			||||||
};
 | 
					};
 | 
				
			||||||
@ -706,40 +517,6 @@ ViewConfigTab.prototype._buildLayoutDom = function() {
 | 
				
			|||||||
  });
 | 
					  });
 | 
				
			||||||
};
 | 
					};
 | 
				
			||||||
 | 
					
 | 
				
			||||||
ViewConfigTab.prototype._buildLinkDom = function() {
 | 
					 | 
				
			||||||
  var linkSpecChanged = ko.computed(() =>
 | 
					 | 
				
			||||||
    !this.viewModel.viewSections().all().every(vs => vs.isActiveLinkSaved()));
 | 
					 | 
				
			||||||
 | 
					 | 
				
			||||||
  return dom('div',
 | 
					 | 
				
			||||||
    dom.autoDispose(linkSpecChanged),
 | 
					 | 
				
			||||||
    kf.buttonGroup(kf.checkButton(this.viewModel.isLinking,
 | 
					 | 
				
			||||||
        dom('span', 'Edit Links', dom.testId('viewConfigTab_link')))),
 | 
					 | 
				
			||||||
    kd.maybe(this.activeSectionData, (sectionData) => {
 | 
					 | 
				
			||||||
      const section = sectionData.section;
 | 
					 | 
				
			||||||
      // This section option affects section linking: it tells a link-target section to show rows
 | 
					 | 
				
			||||||
      // matching any of the rows in link-source section, not only the current cursor row.
 | 
					 | 
				
			||||||
      const filterByAllShown = section.optionsObj.prop('filterByAllShown');
 | 
					 | 
				
			||||||
      return kf.row(
 | 
					 | 
				
			||||||
        15, kf.label('Filter by all shown'),
 | 
					 | 
				
			||||||
        2, kf.checkbox(filterByAllShown, dom.testId('ViewConfigTab_filterByAll'))
 | 
					 | 
				
			||||||
      );
 | 
					 | 
				
			||||||
    }),
 | 
					 | 
				
			||||||
    kd.maybe(linkSpecChanged, () =>
 | 
					 | 
				
			||||||
      kf.prompt(
 | 
					 | 
				
			||||||
        kf.liteButtonGroup(
 | 
					 | 
				
			||||||
          kf.liteButton(() => {
 | 
					 | 
				
			||||||
            commands.allCommands.saveLinks.run();
 | 
					 | 
				
			||||||
            this.viewModel.isLinking(false);
 | 
					 | 
				
			||||||
          }, dom('span.config_icon.left_icon.glyphicon.glyphicon-save'), 'Save'),
 | 
					 | 
				
			||||||
          kf.liteButton(() => commands.allCommands.revertLinks.run(),
 | 
					 | 
				
			||||||
            dom('span.config_icon.left_icon.glyphicon.glyphicon-refresh'), 'Reset'
 | 
					 | 
				
			||||||
          )
 | 
					 | 
				
			||||||
        )
 | 
					 | 
				
			||||||
      )
 | 
					 | 
				
			||||||
    )
 | 
					 | 
				
			||||||
  );
 | 
					 | 
				
			||||||
};
 | 
					 | 
				
			||||||
 | 
					 | 
				
			||||||
/**
 | 
					/**
 | 
				
			||||||
 * Builds the three items for configuring a `Custom View`:
 | 
					 * Builds the three items for configuring a `Custom View`:
 | 
				
			||||||
 *  1) Mode picker: let user choose between 'url' and 'plugin' mode
 | 
					 *  1) Mode picker: let user choose between 'url' and 'plugin' mode
 | 
				
			||||||
 | 
				
			|||||||
							
								
								
									
										11
									
								
								app/client/declarations.d.ts
									
									
									
									
										vendored
									
									
								
							
							
						
						
									
										11
									
								
								app/client/declarations.d.ts
									
									
									
									
										vendored
									
									
								
							@ -98,7 +98,7 @@ declare module "app/client/components/RefSelect" {
 | 
				
			|||||||
}
 | 
					}
 | 
				
			||||||
 | 
					
 | 
				
			||||||
declare module "app/client/components/ViewConfigTab" {
 | 
					declare module "app/client/components/ViewConfigTab" {
 | 
				
			||||||
  import {GristDoc, TabContent} from 'app/client/components/GristDoc';
 | 
					  import {GristDoc} from 'app/client/components/GristDoc';
 | 
				
			||||||
  import {Disposable} from 'app/client/lib/dispose';
 | 
					  import {Disposable} from 'app/client/lib/dispose';
 | 
				
			||||||
  import {KoArray} from "app/client/lib/koArray";
 | 
					  import {KoArray} from "app/client/lib/koArray";
 | 
				
			||||||
  import {ColumnRec, ViewRec, ViewSectionRec} from "app/client/models/DocModel";
 | 
					  import {ColumnRec, ViewRec, ViewSectionRec} from "app/client/models/DocModel";
 | 
				
			||||||
@ -112,21 +112,14 @@ declare module "app/client/components/ViewConfigTab" {
 | 
				
			|||||||
  }
 | 
					  }
 | 
				
			||||||
 | 
					
 | 
				
			||||||
  class ViewConfigTab extends Disposable {
 | 
					  class ViewConfigTab extends Disposable {
 | 
				
			||||||
    constructor(options: {gristDoc: GristDoc, viewModel: ViewRec, skipDomBuild?: boolean});
 | 
					    constructor(options: {gristDoc: GristDoc, viewModel: ViewRec});
 | 
				
			||||||
    public buildConfigDomObj(): TabContent[];
 | 
					 | 
				
			||||||
    public buildSortDom(): DomContents;
 | 
					    public buildSortDom(): DomContents;
 | 
				
			||||||
    // TODO: these should be made private or renamed.
 | 
					    // TODO: these should be made private or renamed.
 | 
				
			||||||
    public _buildSectionFieldsConfig(): DomArg;
 | 
					 | 
				
			||||||
    public _buildNameDom(): DomArg;
 | 
					 | 
				
			||||||
    public _buildSectionNameDom(): DomArg;
 | 
					 | 
				
			||||||
    public _buildAdvancedSettingsDom(): DomArg;
 | 
					    public _buildAdvancedSettingsDom(): DomArg;
 | 
				
			||||||
    public _buildDetailTypeDom(): DomArg;
 | 
					 | 
				
			||||||
    public _buildFilterDom(): DomArg;
 | 
					    public _buildFilterDom(): DomArg;
 | 
				
			||||||
    public _buildThemeDom(): DomArg;
 | 
					    public _buildThemeDom(): DomArg;
 | 
				
			||||||
    public _buildGridStyleDom(): DomArg;
 | 
					 | 
				
			||||||
    public _buildChartConfigDom(): DomContents;
 | 
					    public _buildChartConfigDom(): DomContents;
 | 
				
			||||||
    public _buildLayoutDom(): DomArg;
 | 
					    public _buildLayoutDom(): DomArg;
 | 
				
			||||||
    public _buildLinkDom(): DomArg;
 | 
					 | 
				
			||||||
    public _buildCustomTypeItems(): DomArg;
 | 
					    public _buildCustomTypeItems(): DomArg;
 | 
				
			||||||
  }
 | 
					  }
 | 
				
			||||||
  export = ViewConfigTab;
 | 
					  export = ViewConfigTab;
 | 
				
			||||||
 | 
				
			|||||||
@ -19,8 +19,6 @@ export interface ViewRec extends IRowModel<"_grist_Views"> {
 | 
				
			|||||||
 | 
					
 | 
				
			||||||
  // If the active section is removed, set the next active section to be the default.
 | 
					  // If the active section is removed, set the next active section to be the default.
 | 
				
			||||||
  _isActiveSectionGone: ko.Computed<boolean>;
 | 
					  _isActiveSectionGone: ko.Computed<boolean>;
 | 
				
			||||||
 | 
					 | 
				
			||||||
  isLinking: ko.Observable<boolean>;
 | 
					 | 
				
			||||||
}
 | 
					}
 | 
				
			||||||
 | 
					
 | 
				
			||||||
export function createViewRec(this: ViewRec, docModel: DocModel): void {
 | 
					export function createViewRec(this: ViewRec, docModel: DocModel): void {
 | 
				
			||||||
@ -46,6 +44,4 @@ export function createViewRec(this: ViewRec, docModel: DocModel): void {
 | 
				
			|||||||
      this.activeSectionId(0);
 | 
					      this.activeSectionId(0);
 | 
				
			||||||
    }
 | 
					    }
 | 
				
			||||||
  }));
 | 
					  }));
 | 
				
			||||||
 | 
					 | 
				
			||||||
  this.isLinking = ko.observable(false);
 | 
					 | 
				
			||||||
}
 | 
					}
 | 
				
			||||||
 | 
				
			|||||||
@ -418,7 +418,7 @@ export function createViewSectionRec(this: ViewSectionRec, docModel: DocModel):
 | 
				
			|||||||
 | 
					
 | 
				
			||||||
  this.hasFocus = ko.pureComputed({
 | 
					  this.hasFocus = ko.pureComputed({
 | 
				
			||||||
    // Read may occur for recently disposed sections, must check condition first.
 | 
					    // Read may occur for recently disposed sections, must check condition first.
 | 
				
			||||||
    read: () => !this.isDisposed() && this.view().activeSectionId() === this.id() && !this.view().isLinking(),
 | 
					    read: () => !this.isDisposed() && this.view().activeSectionId() === this.id(),
 | 
				
			||||||
    write: (val) => { if (val) { this.view().activeSectionId(this.id()); } }
 | 
					    write: (val) => { if (val) { this.view().activeSectionId(this.id()); } }
 | 
				
			||||||
  });
 | 
					  });
 | 
				
			||||||
 | 
					
 | 
				
			||||||
 | 
				
			|||||||
@ -282,7 +282,7 @@ export class RightPanel extends Disposable {
 | 
				
			|||||||
      .then(ViewPane => {
 | 
					      .then(ViewPane => {
 | 
				
			||||||
        if (owner.isDisposed()) { return; }
 | 
					        if (owner.isDisposed()) { return; }
 | 
				
			||||||
        viewConfigTab.set(owner.autoDispose(
 | 
					        viewConfigTab.set(owner.autoDispose(
 | 
				
			||||||
          ViewPane.ViewConfigTab.create({gristDoc, viewModel: gristDoc.viewModel, skipDomBuild: true})));
 | 
					          ViewPane.ViewConfigTab.create({gristDoc, viewModel: gristDoc.viewModel})));
 | 
				
			||||||
      })
 | 
					      })
 | 
				
			||||||
      .catch(reportError);
 | 
					      .catch(reportError);
 | 
				
			||||||
    return viewConfigTab;
 | 
					    return viewConfigTab;
 | 
				
			||||||
 | 
				
			|||||||
		Loading…
	
		Reference in New Issue
	
	Block a user