rename shortuct to mode flag

lineupjs · Mar 25, 2020 · 40bbd8e · 40bbd8e
1 parent a108b23
commit 40bbd8e
Show file tree

Hide file tree

Showing 3 changed files with 25 additions and 24 deletions.
diff --git a/src/ui/header.ts b/src/ui/header.ts
@@ -150,7 +150,8 @@ export function actionCSSClass(title: string) {
 
 function addIconDOM(node: HTMLElement, col: Column, ctx: IRankingHeaderContext, level: number, showLabel: boolean, mode: 'header' | 'sidePanel') {
   return (action: IToolbarAction) => {
-    node.insertAdjacentHTML('beforeend', `<i data-a="${hasShortcut(col, action, mode, 'only') ? 'o' : hasShortcut(col, action, mode, true) ? 's' : 'r'}" title="${action.title}" class="${actionCSSClass(action.title.toString())} ${cssClass(`feature-${action.options.featureLevel || 'basic'}`)} ${cssClass(`feature-${action.options.featureCategory || 'others'}`)}"><span${!showLabel ? ` class="${cssClass('aria')}" aria-hidden="true"` : ''}>${action.title}</span> </i>`);
+    const m = isActionMode(col, action, mode, 'shortcut') ? 'o' : isActionMode(col, action, mode, 'menu+shortcut') ? 's' : 'r';
+    node.insertAdjacentHTML('beforeend', `<i data-a="${m}" title="${action.title}" class="${actionCSSClass(action.title.toString())} ${cssClass(`feature-${action.options.featureLevel || 'basic'}`)} ${cssClass(`feature-${action.options.featureCategory || 'others'}`)}"><span${!showLabel ? ` class="${cssClass('aria')}" aria-hidden="true"` : ''}>${action.title}</span> </i>`);
     const i = <HTMLElement>node.lastElementChild;
     i.onclick = (evt) => {
       evt.stopPropagation();
@@ -166,8 +167,8 @@ export interface IAddIcon {
   (title: string, onClick: IOnClickHandler): void;
 }
 
-function hasShortcut(col: Column, d: IToolbarAction, mode: 'header' | 'sidePanel', value: 'only' | boolean) {
-  const s = d.options.shortcut === undefined ? false : d.options.shortcut;
+function isActionMode(col: Column, d: IToolbarAction, mode: 'header' | 'sidePanel', value: 'menu' | 'menu+shortcut' | 'shortcut') {
+  const s = d.options.mode === undefined ? 'menu' : d.options.mode;
   if (s === value) {
     return true;
   }
@@ -181,8 +182,8 @@ function hasShortcut(col: Column, d: IToolbarAction, mode: 'header' | 'sidePanel
 export function createShortcutMenuItems(node: HTMLElement, level: number, col: Column, ctx: IRankingHeaderContext, mode: 'header' | 'sidePanel', willAutoHide: boolean = true) {
   const addIcon = addIconDOM(node, col, ctx, level, false, mode);
   const toolbar = getToolbar(col, ctx);
-  const shortcuts = toolbar.filter((d) => !hasShortcut(col, d, mode, false));
-  const hybrids = shortcuts.reduce((a, b) => a + (hasShortcut(col, b, mode, true) ? 1 : 0), 0);
+  const shortcuts = toolbar.filter((d) => !isActionMode(col, d, mode, 'menu'));
+  const hybrids = shortcuts.reduce((a, b) => a + (isActionMode(col, b, mode, 'menu+shortcut') ? 1 : 0), 0);
 
   shortcuts.forEach(addIcon);
   const moreEntries = toolbar.length - shortcuts.length + hybrids;
@@ -206,7 +207,7 @@ export function createShortcutMenuItems(node: HTMLElement, level: number, col: C
 /** @internal */
 export function createToolbarMenuItems(node: HTMLElement, level: number, col: Column, ctx: IRankingHeaderContext, mode: 'header' | 'sidePanel') {
   const addIcon = addIconDOM(node, col, ctx, level, true, mode);
-  getToolbar(col, ctx).filter((d) => !hasShortcut(col, d, mode, 'only')).forEach(addIcon);
+  getToolbar(col, ctx).filter((d) => !isActionMode(col, d, mode, 'shortcut')).forEach(addIcon);
 }
 
 /** @internal */

diff --git a/src/ui/interfaces.ts b/src/ui/interfaces.ts
@@ -8,9 +8,9 @@ import {IDialogContext} from './dialogs';
 export interface IUIOptions {
   /**
    * whether to show this action as a shortcut action
-   * @default false
+   * @default 'menu'
    */
-  shortcut: boolean | 'only' | ((col: Column, mode: 'sidePanel' | 'header') => boolean | 'only');
+  mode: 'menu' | 'menu+shortcut' | 'shortcut' | ((col: Column, mode: 'sidePanel' | 'header') => 'menu' | 'menu+shortcut' | 'shortcut');
 
   /**
    * order hint for sorting actions

diff --git a/src/ui/toolbar.ts b/src/ui/toolbar.ts
@@ -85,7 +85,7 @@ const sort: IToolbarAction = {
     ranking.sortBy(col, next === 'asc', next ? order.priority : -1);
   },
   options: {
-    shortcut: 'only',
+    mode: 'shortcut',
     order: 1,
     featureCategory: 'ranking',
     featureLevel: 'basic'
@@ -99,7 +99,7 @@ const sortBy: IToolbarAction = {
     dialog.open();
   },
   options: {
-    shortcut: false,
+    mode: 'menu',
     order: 1,
     featureCategory: 'ranking',
     featureLevel: 'advanced'
@@ -113,7 +113,7 @@ const sortGroupBy: IToolbarAction = {
     dialog.open();
   },
   options: {
-    shortcut: false,
+    mode: 'menu',
     order: 3,
     featureCategory: 'ranking',
     featureLevel: 'advanced'
@@ -191,13 +191,13 @@ const group = ui('Group', (col, evt, ctx, level) => {
   const order = current.indexOf(col);
 
   ranking.groupBy(col, order >= 0 ? -1 : current.length);
-}, {shortcut: 'only', order: 2, featureCategory: 'ranking', featureLevel: 'basic'});
+}, {mode: 'shortcut', order: 2, featureCategory: 'ranking', featureLevel: 'basic'});
 
 // advanced ranking
 const groupBy = ui('Group By &hellip;', (col, evt, ctx, level) => {
   const dialog = new GroupDialog(col, dialogContext(ctx, level, evt), ctx);
   dialog.open();
-}, {shortcut: false, order: 2, featureCategory: 'ranking', featureLevel: 'advanced'});
+}, {mode: 'menu', order: 2, featureCategory: 'ranking', featureLevel: 'advanced'});
 
 function toggleCompressExpand(col: Column, evt: MouseEvent, ctx: IRankingHeaderContext, level: number) {
   ctx.dialogManager.removeAboveLevel(level);
@@ -277,21 +277,21 @@ export const toolbarActions: {[key: string]: IToolbarAction | IToolbarDialogAddo
   remove,
   rename,
   setShowTopN,
-  search: uiDialog('Search &hellip;', SearchDialog, (ctx) => [ctx.provider], {shortcut: true, order: 3, featureCategory: 'ranking', featureLevel: 'basic'}),
-  filterNumber: uiDialog('Filter &hellip;', NumberFilterDialog, (ctx) => [ctx], {shortcut: true, featureCategory: 'ranking', featureLevel: 'basic'}),
-  filterDate: uiDialog('Filter &hellip;', DateFilterDialog, (ctx) => [ctx], {shortcut: true, featureCategory: 'ranking', featureLevel: 'basic'}),
-  filterString: uiDialog('Filter &hellip;', StringFilterDialog, () => [], {shortcut: true, featureCategory: 'ranking', featureLevel: 'basic'}),
-  filterCategorical: uiDialog('Filter &hellip;', CategoricalFilterDialog, () => [], {shortcut: true, featureCategory: 'ranking', featureLevel: 'basic'}),
-  filterOrdinal: uiDialog('Filter &hellip;', CategoricalMappingFilterDialog, () => [], {shortcut: true, featureCategory: 'ranking', featureLevel: 'basic'}),
-  filterBoolean: uiDialog('Filter &hellip;', BooleanFilterDialog, () => [], {shortcut: true, featureCategory: 'ranking', featureLevel: 'basic'}),
-  colorMapped: uiDialog('Color Mapping &hellip;', ColorMappingDialog, () => [], {shortcut: false, featureCategory: 'ui', featureLevel: 'advanced'}),
-  colorMappedCategorical: uiDialog('Color Mapping &hellip;', CategoricalColorMappingDialog, () => [], {shortcut: false, featureCategory: 'ui', featureLevel: 'advanced'}),
-  script: uiDialog('Edit Combine Script &hellip;', ScriptEditDialog, () => [], {shortcut: true, featureCategory: 'model', featureLevel: 'advanced'}),
+  search: uiDialog('Search &hellip;', SearchDialog, (ctx) => [ctx.provider], {mode: 'menu+shortcut', order: 3, featureCategory: 'ranking', featureLevel: 'basic'}),
+  filterNumber: uiDialog('Filter &hellip;', NumberFilterDialog, (ctx) => [ctx], {mode: 'menu+shortcut', featureCategory: 'ranking', featureLevel: 'basic'}),
+  filterDate: uiDialog('Filter &hellip;', DateFilterDialog, (ctx) => [ctx], {mode: 'menu+shortcut', featureCategory: 'ranking', featureLevel: 'basic'}),
+  filterString: uiDialog('Filter &hellip;', StringFilterDialog, () => [], {mode: 'menu+shortcut', featureCategory: 'ranking', featureLevel: 'basic'}),
+  filterCategorical: uiDialog('Filter &hellip;', CategoricalFilterDialog, () => [], {mode: 'menu+shortcut', featureCategory: 'ranking', featureLevel: 'basic'}),
+  filterOrdinal: uiDialog('Filter &hellip;', CategoricalMappingFilterDialog, () => [], {mode: 'menu+shortcut', featureCategory: 'ranking', featureLevel: 'basic'}),
+  filterBoolean: uiDialog('Filter &hellip;', BooleanFilterDialog, () => [], {mode: 'menu+shortcut', featureCategory: 'ranking', featureLevel: 'basic'}),
+  colorMapped: uiDialog('Color Mapping &hellip;', ColorMappingDialog, () => [], {mode: 'menu', featureCategory: 'ui', featureLevel: 'advanced'}),
+  colorMappedCategorical: uiDialog('Color Mapping &hellip;', CategoricalColorMappingDialog, () => [], {mode: 'menu', featureCategory: 'ui', featureLevel: 'advanced'}),
+  script: uiDialog('Edit Combine Script &hellip;', ScriptEditDialog, () => [], {mode: 'menu+shortcut', featureCategory: 'model', featureLevel: 'advanced'}),
   reduce: uiDialog('Reduce by &hellip;', ReduceDialog, () => [], {featureCategory: 'model', featureLevel: 'advanced'}),
   cutoff: uiDialog('Set Cut Off &hellip;', CutOffHierarchyDialog, (ctx) => [ctx.idPrefix], {featureCategory: 'model', featureLevel: 'advanced'}),
   editMapping: uiDialog('Data Mapping &hellip;', MappingDialog, (ctx) => [ctx], {featureCategory: 'model', featureLevel: 'advanced'}),
   editPattern: uiDialog('Edit Pattern &hellip;', EditPatternDialog, (ctx) => [ctx.idPrefix], {featureCategory: 'model', featureLevel: 'advanced'}),
-  editWeights: uiDialog('Edit Weights &hellip;', WeightsEditDialog, () => [], {shortcut: true, featureCategory: 'model', featureLevel: 'advanced'}),
+  editWeights: uiDialog('Edit Weights &hellip;', WeightsEditDialog, () => [], {mode: 'menu+shortcut', featureCategory: 'model', featureLevel: 'advanced'}),
   compositeContained: uiDialog('Contained Columns &hellip;', CompositeChildrenDialog, (ctx) => [ctx], {featureCategory: 'model', featureLevel: 'advanced'}),
   splitCombined: ui('Split Combined Column', (col, _evt, ctx, level) => {
     ctx.dialogManager.removeAboveLevel(level - 1); // close itself