added overviewDetail to SidePanel, for Caleydo/lineup_app#3 Caleydo/l…

…ineup_app#4 Caleydo/lineup_app#5 Caleydo/lineup_app#6
Caleydo · Aug 27, 2018 · 391fd54 · 391fd54
1 parent 267cc37
commit 391fd54
Show file tree

Hide file tree

Showing 5 changed files with 16 additions and 13 deletions.
diff --git a/src/model/OverviewDetailColumn.ts b/src/model/OverviewDetailColumn.ts
@@ -27,7 +27,7 @@ export interface IDetailColumnDesc extends IValueColumnDesc<boolean> {
  * a checkbox column for selections
  */
 @SupportType()
-@toolbar('sort', 'stratify')
+@toolbar('sort', 'stratify', 'selectionToOverviewDetail', 'overviewDetailToSelection')
 @Category('support')
 export default class OverviewDetailColumn extends ValueColumn<boolean> {
   private static DETAILED_GROUP: IGroup = {

diff --git a/src/model/index.ts b/src/model/index.ts
@@ -89,6 +89,7 @@ export {default as Ranking, ISortCriteria} from './Ranking';
 export {default as ReduceColumn, createReduceDesc, IReduceDesc, IReduceColumnDesc} from './ReduceColumn';
 export {default as ScriptColumn, createScriptDesc, IScriptDesc, IScriptColumnDesc} from './ScriptColumn';
 export {default as SelectionColumn, createSelectionDesc, ISelectionColumnDesc} from './SelectionColumn';
+export {default as DeteilColumn, createDetailDesc, IDetailColumnDesc} from './OverviewDetailColumn';
 export * from './SetColumn';
 export {default as SetColumn} from './SetColumn';
 export {default as StackColumn, createStackDesc} from './StackColumn';

diff --git a/src/ui/panel/SidePanel.ts b/src/ui/panel/SidePanel.ts
@@ -9,6 +9,7 @@ import {
   createGroupDesc,
   createAggregateDesc,
   createSelectionDesc,
+  createDetailDesc,
   IColumnDesc
 } from '../../model';
 import {categoryOfDesc} from '../../model/annotations';
@@ -56,6 +57,7 @@ export default class SidePanel {
       createImpositionDesc(),
       createRankDesc(),
       createSelectionDesc(),
+      createDetailDesc(),
       createGroupDesc(),
       createAggregateDesc(),
     ],

diff --git a/src/ui/taggle/Taggle.ts b/src/ui/taggle/Taggle.ts
@@ -43,10 +43,8 @@ export default class Taggle extends ALineUp {
       this.panel.node.insertAdjacentHTML('afterbegin', `<div class="lu-rule-button-chooser"><label>
             <input class="spaceFilling" type="checkbox">
             <span>Overview</span>
-            <input class="expand" type="checkbox">
-            <span>Expand</span>
-            <input class="s2d" type="button" value="S2D">
-            <input class="d2s" type="button" value="D2S">
+            <input id="lu-toggle-expand" class="expand" type="checkbox">
+            <span for="lu-toggle-expand">Expand</span>
             <div></div>
           </label></div>`);
       const spaceFilling = spaceFillingRule(this.options);
@@ -67,14 +65,6 @@ export default class Taggle extends ALineUp {
         const selected = expandInput.checked;
         this.renderer!.expandTextureRenderer(selected);
       };
-      const s2dInput = <HTMLInputElement>this.spaceFilling.querySelector('input.s2d');
-      s2dInput.onclick = () => {
-        this.renderer!.s2d();
-      };
-      const d2sInput = <HTMLInputElement>this.spaceFilling.querySelector('input.d2s');
-      d2sInput.onclick = () => {
-        this.renderer!.d2s();
-      };
     }
     this.forward(this.renderer, `${ALineUp.EVENT_HIGHLIGHT_CHANGED}.main`);
   }

diff --git a/src/ui/toolbar.ts b/src/ui/toolbar.ts
@@ -297,6 +297,16 @@ export const toolbarActions: { [key: string]: IToolbarAction | IToolbarDialogAdd
     const ss = new Set(s);
     const others = order.filter((d) => !ss.has(d));
     ctx.provider.setSelection(others);
+  }),
+  selectionToOverviewDetail: ui('S2D', (_col, _evt, ctx, level) => {
+    ctx.dialogManager.removeAboveLevel(level - 1); // close itself
+    const s = ctx.provider.getSelection();
+    ctx.provider.setDetail(s);
+  }),
+  overviewDetailToSelection: ui('D2S', (_col, _evt, ctx, level) => {
+    ctx.dialogManager.removeAboveLevel(level - 1); // close itself
+    const d = ctx.provider.getDetail();
+    ctx.provider.setSelection(d);
   })
 }, toolbarAddons);