Merge pull request #59 from EDAcation/feat/color-overview

EDAcation · Apr 29, 2024 · ef19cc0 · ef19cc0
2 parents e7d6e76 + bfd0685
commit ef19cc0
Show file tree

Hide file tree

Showing 3 changed files with 36 additions and 2 deletions.
diff --git a/src/views/digitaljs/src/viewers/stats/elements/colors.ts b/src/views/digitaljs/src/viewers/stats/elements/colors.ts
@@ -0,0 +1,29 @@
+import {getElementGroups} from 'edacation';
+
+import {DataGrid} from './datagrid';
+
+export class ColorOverviewList extends DataGrid<Record<string, never>> {
+    constructor() {
+        super(['color', 'name']);
+
+        const groups = Array.from(new Set(getElementGroups().values()));
+        groups.sort((g1, g2) => {
+            const order1 = g1.sorting ?? Infinity;
+            const order2 = g2.sorting ?? Infinity;
+            return order1 > order2 ? 1 : -1;
+        });
+
+        for (const group of groups) {
+            this.addRow([
+                {
+                    elem: group.color,
+                    borderColor: group.color,
+                    borders: ['left']
+                },
+                {
+                    elem: group.name
+                }
+            ]);
+        }
+    }
+}
diff --git a/src/views/digitaljs/src/viewers/stats/elements/datagrid.ts b/src/views/digitaljs/src/viewers/stats/elements/datagrid.ts
@@ -12,7 +12,7 @@ export interface DataGridCell {
     borders?: CellBorder[]; // Default: no borders
 }
 
-class DataGrid<EventsDirectory> extends CustomElement<EventsDirectory> {
+export class DataGrid<EventsDirectory> extends CustomElement<EventsDirectory> {
     protected rootElem: HTMLElement;
 
     protected cells: DataGridCell[][];

diff --git a/src/views/digitaljs/src/viewers/stats/index.ts b/src/views/digitaljs/src/viewers/stats/index.ts
@@ -4,6 +4,7 @@ import type {YosysStats} from '../../types';
 import {BaseViewer} from '../base';
 
 import {ModuleExplorerGrid, ModuleOverviewGrid, PrimitivesOverviewGrid, TabsContainer} from './elements';
+import {ColorOverviewList} from './elements/colors';
 import type {InteractiveDataGrid, InteractiveDatagridConfig} from './elements/datagrid';
 import {type Module, buildModuleTree} from './modules';
 
@@ -15,6 +16,7 @@ export class StatsViewer extends BaseViewer<YosysStats> {
     private moduleOverview: ModuleOverviewGrid;
     private moduleExplorer: ModuleExplorerGrid;
     private primitivesOverview: PrimitivesOverviewGrid;
+    private colorsList: ColorOverviewList;
 
     constructor(mainView: View, initData: YosysStats) {
         super(mainView, initData);
@@ -33,10 +35,13 @@ export class StatsViewer extends BaseViewer<YosysStats> {
         this.primitivesOverview = new PrimitivesOverviewGrid(this.modules);
         this.setupConfigStore(this.primitivesOverview);
 
+        this.colorsList = new ColorOverviewList();
+
         this.tabsContainer = new TabsContainer([
             {id: 'overview', title: 'Overview', element: this.moduleOverview},
             {id: 'explorer', title: 'Explorer', element: this.moduleExplorer},
-            {id: 'primitives', title: 'Primitives', element: this.primitivesOverview}
+            {id: 'primitives', title: 'Primitives', element: this.primitivesOverview},
+            {id: 'colors', title: 'Element Colors', element: this.colorsList}
         ]);
     }