Contextual Sidebars Module, Grouping, Deterministic Colour Generation

[timothycdc]

Overview

Add functionality to set 'groups of symbols', used for HLP25. Also adds a deterministic colour generator for groups, using poisson-disk sampling for distantly-spaced colours that do not clash with existing UI colours.

This feature also introduces a UI library for a 'contextual sidebar' that can be programmatically called and accept user input via buttons or dialog, and modify the model in turn. One key example of a sidebar is the group selection sidebar, shown below.

Developer Mode

• Support for modifying groups and tracking groups
• Plenty of useful code examples for sidebars for others to follow
• Extra tests and demos for added features

Contextual Sidebars

• Sidebars are called with dispatch and have the ability to modify the existing model
• Sidebars are dynamic and can change with the current Model. This allows them to respond to user changes on the sheet.
• Sidebars have options that make them user-cancellable, either statically or dynamically under certain conditions. This is shown through the (x) button in the top right corner.
• Sidebars also have support for buttons that are dynamic and can also modify the sheet. This is because dispatch is also passed to the buttons (allowing them to send messages)
• Sidebars also have support for dialog bodies that can contain text and int, with the latter having features to bound a min or max int and overflow prevention.
• Their implementation is similar to UIPopups.

Group Selection Sidebar

• A group selection sidebar that normally cannot be dismissed by the user, prompts the user to choose components to add them to a single group. A new colour is automatically generated for a new group created
• Groups are stored in SymbolT.Model
• Added helpers in Groups.fs to create new groups, add symbols to a group, delete symbols from a group, and delete whole groups.
• Edge case: (x) button for group selection sidebar only shows when there are zero ungrouped components left on the sheet

Screenshots

Type Defs:

module SymbolT =
...
    /// Represents all the symbols and ports on the sheet
    type Model = {
     ...

        GroupMap: Map<GroupId, ComponentId list>
        GroupInfoMap: Map<GroupId, GroupInfo>
        GroupColourLookupMap : Map<ComponentId, string>
        }

    type GroupId = GroupId of string
    type GroupInfo = {
        Id: GroupId
        CreationDate: DateTime
        Colour: string
    }

Other notes/current issues:

• Still need to deal with groups in SymbolT.Model persisting across changing projects/sheets.
• Should groups be loaded/saved into the project file? Currently not implemented
• MergeWires, SplitWires, Wire Label and Not Connected cannot be put into groups.