added binding to add loci to current focus

src/mol-plugin-state/manager/structure/focus.ts

@@ -27,7 +27,6 @@ interface StructureFocusManagerState {
 const HISTORY_CAPACITY = 8;
 
 export class StructureFocusManager extends StatefulPluginComponent<StructureFocusManagerState> {
-
     readonly events = {
         historyUpdated: this.ev<undefined>()
     }

src/mol-plugin/behavior/dynamic/representation.ts

@@ -201,10 +201,17 @@ const DefaultFocusLociBindings = {
     clickFocus: Binding([
         Trigger(B.Flag.Primary, M.create()),
     ], 'Representation Focus', 'Click element using ${triggers}'),
+    clickFocusAdd: Binding([
+        Trigger(B.Flag.Primary, M.create({ shift: true })),
+    ], 'Representation Focus Add', 'Click element using ${triggers}'),
     clickFocusSelectMode: Binding([
         Trigger(B.Flag.Secondary, M.create()),
         Trigger(B.Flag.Primary, M.create({ control: true }))
     ], 'Representation Focus', 'Click element using ${triggers}'),
+    clickFocusAddSelectMode: Binding([
+        Trigger(B.Flag.Secondary, M.create({ shift: true })),
+        Trigger(B.Flag.Primary, M.create({ control: true, shift: true }))
+    ], 'Representation Focus Add', 'Click element using ${triggers}'),
 }
 const FocusLociParams = {
     bindings: PD.Value(DefaultFocusLociBindings, { isHidden: true }),
@@ -217,7 +224,7 @@ export const FocusLoci = PluginBehavior.create<FocusLociProps>({
     ctor: class extends PluginBehavior.Handler<FocusLociProps> {
         register(): void {
             this.subscribeObservable(this.ctx.behaviors.interaction.click, ({ current, button, modifiers }) => {
-                const { clickFocus, clickFocusSelectMode } = this.params.bindings;
+                const { clickFocus, clickFocusAdd, clickFocusSelectMode, clickFocusAddSelectMode } = this.params.bindings;
 
                 const binding = this.ctx.selectionMode
                     ? clickFocusSelectMode
@@ -234,6 +241,30 @@ export const FocusLoci = PluginBehavior.create<FocusLociProps>({
                             this.ctx.managers.camera.reset()
                         }
                     }
+                    return
+                }
+
+                const bindingAdd = this.ctx.selectionMode
+                    ? clickFocusAddSelectMode
+                    : clickFocusAdd;
+
+                if (Binding.match(bindingAdd, button, modifiers)) {
+                    const loci = Loci.normalize(current.loci, 'residue')
+                    if (StructureElement.Loci.is(loci)) {
+                        const entry = this.ctx.managers.structure.focus.current
+                        if (entry && Loci.areEqual(entry.loci, loci)) {
+                            this.ctx.managers.structure.focus.clear()
+                        } else {
+                            const union = entry
+                                ? StructureElement.Loci.union(entry.loci, loci)
+                                : loci
+                            this.ctx.managers.structure.focus.setFromLoci(union)
+                            if (isEmptyLoci(union)) {
+                                this.ctx.managers.camera.reset()
+                            }
+                        }
+                    }
+                    return
                 }
             });
         }

src/mol-theme/label.ts

@@ -53,7 +53,7 @@ function countLabel(count: number, label: string) {
 }
 
 function otherLabel(count: number, location: StructureElement.Location, granularity: LabelGranularity, hidePrefix: boolean, reverse: boolean, condensed: boolean) {
-    return `${elementLabel(location, { granularity, hidePrefix, reverse })} <small>[+ ${countLabel(count - 1, `other ${capitalize(granularity)}`)}]</small>`
+    return `${elementLabel(location, { granularity, hidePrefix, reverse, condensed })} <small>[+ ${countLabel(count - 1, `other ${capitalize(granularity)}`)}]</small>`
 }
 
 /** Gets residue count of the model chain segments the unit is a subset of */
@@ -87,10 +87,10 @@ function _structureElementStatsLabel(stats: StructureElement.Stats, countsOnly =
     } else if (!countsOnly) {
         const label: string[] = []
         if (structureCount > 0) {
-            label.push(structureCount === 1 ? elementLabel(stats.firstStructureLoc, { hidePrefix, condensed, granularity: 'structure', reverse }) : otherLabel(structureCount, stats.firstStructureLoc, 'structure', false, reverse, condensed))
+            label.push(structureCount === 1 ? elementLabel(stats.firstStructureLoc, { hidePrefix, condensed, granularity: 'structure', reverse }) : otherLabel(structureCount, stats.firstStructureLoc, 'structure', hidePrefix, reverse, condensed))
         }
         if (chainCount > 0) {
-            label.push(chainCount === 1 ? elementLabel(stats.firstChainLoc, { condensed, granularity: 'chain', reverse }) : otherLabel(chainCount, stats.firstChainLoc, 'chain', false, reverse, condensed))
+            label.push(chainCount === 1 ? elementLabel(stats.firstChainLoc, { condensed, granularity: 'chain', hidePrefix, reverse }) : otherLabel(chainCount, stats.firstChainLoc, 'chain', hidePrefix, reverse, condensed))
             hidePrefix = true;
         }
         if (residueCount > 0) {