mstr-viz/template-use-react/src/SampleVizDropZones.js

A new dev tool for creating custom visualizations

mstrmojo.requiresCls("mstrmojo.vi.models.CustomVisDropZones");

/**
 * @enum {number} ENUM_ALLOW_DROP_TYPE - { ATTRIBUTE, METRIC, ATTRIBUTE_AND_METRIC, ATTRIBUTE_OR_METRIC }
 */
const { ENUM_ALLOW_DROP_TYPE } = mstrmojo.vi.models.CustomVisDropZones;

// dropzone name list
const ATTRIBUTE = "Attribute";
const METRIC = "Metric";
const TOOLTIP = "Tooltip";

mstrmojo.plugins.<%= pluginName %>.<%= pluginName %>DropZones = mstrmojo.declare(
  mstrmojo.vi.models.CustomVisDropZones,
  null,
  {
    scriptClass: "mstrmojo.plugins.<%= pluginName %>.<%= pluginName %>DropZones",
    cssClass: "<% print(_.toLower(pluginName)) %>-dropzones",
    getCustomDropZones() {
      return [
        {
          name: ATTRIBUTE,
          title: "Drag attributes here",
          maxCapacity: 1,
          allowObjectType: ENUM_ALLOW_DROP_TYPE.ATTRIBUTE,
        },
        {
          name: METRIC,
          title: "Drag metrics here",
          maxCapacity: 1,
          allowObjectType: ENUM_ALLOW_DROP_TYPE.METRIC,
        },
        {
          name: 'Size',
          isSizeBy: true, //config for isSizyBy
          maxCapacity: 1,
          useAbsolute: true, //config to useAbsolute value
          title: mstrmojo.desc(13827, 'Drag metrics here'),
          allowObjectType: ENUM_ALLOW_DROP_TYPE.METRIC
        }, {
            name: 'Colorby',
            isColorBy: true, //config for isColorBy
            maxCapacity: 1,
            title: mstrmojo.desc(13828, 'Drag attributes here'),
            allowObjectType: ENUM_ALLOW_DROP_TYPE.ATTRIBUTE
        },
        {
          name: TOOLTIP,
          isAdditionalInfo: true,
          title: "Drag objects here",
          allowObjectType: ENUM_ALLOW_DROP_TYPE.ATTRIBUTE_AND_METRIC,
        },
      ];
    },
    getActionsForObjectsDropped(
      zone,
      droppedObjects,
      idx,
      replaceObject,
      extras
    ) {
      const actions = [];
      if (this.getDropZoneName(zone) === METRIC) {
        this.getAddDropZoneObjectsActions(
          actions,
          TOOLTIP,
          droppedObjects,
          idx,
          extras
        );
      }
      return actions;
    },
    getActionsForObjectsRemoved(zone, objects) {
      const actions = [];
      if (this.getDropZoneName(zone) === METRIC) {
        this.getRemoveDropZoneObjectsActions(actions, TOOLTIP, objects);
      }
      return actions;
    },
  }
);