Compile and make compatible all the scattered code I had for empowering trails for dash meeting. Still much to do with ui, but basic functionaltiy is there. Two key things, 1) navigation for branching trails, and 2) ability to runSubroutines on tested trails.

3 files changed, 56 insertions, 2 deletions

diff --git a/src/client/views/nodes/trails/PresBox.tsx b/src/client/views/nodes/trails/PresBox.tsx
index 3589a9065..2836a39fb 100644
--- a/src/client/views/nodes/trails/PresBox.tsx
+++ b/src/client/views/nodes/trails/PresBox.tsx
@@ -35,6 +35,7 @@ import { FieldView, FieldViewProps } from '../FieldView';
 import { ScriptingBox } from '../ScriptingBox';
 import './PresBox.scss';
 import { PresEffect, PresEffectDirection, PresMovement, PresStatus } from './PresEnums';
+import { BranchingTrailManager } from '../../../util/BranchingTrailManager';
 const { Howl } = require('howler');
 
 export interface pinDataTypes {
@@ -278,6 +279,19 @@ export class PresBox extends ViewBoxBaseComponent<FieldViewProps>() {
             return listItems.filter(doc => !doc.unrendered);
         }
     };
+
+    // go to documents chain
+    runSubroutines = (childrenToRun: Doc[], normallyNextSlide: Doc) => {
+        console.log(childrenToRun, normallyNextSlide, 'runSUBFUNC');
+        if (childrenToRun[0] === normallyNextSlide) {
+            return;
+        }
+
+        childrenToRun.forEach(child => {
+            DocumentManager.Instance.showDocument(child, {});
+        });
+    };
+
     // Called when the user activates 'next' - to move to the next part of the pres. trail
     @action
     next = () => {
@@ -314,6 +328,11 @@ export class PresBox extends ViewBoxBaseComponent<FieldViewProps>() {
             // Case 1: No more frames in current doc and next slide is defined, therefore move to next slide
             const slides = DocListCast(this.rootDoc[StrCast(this.presFieldKey, 'data')]);
             const curLast = this.selectedArray.size ? Math.max(...Array.from(this.selectedArray).map(d => slides.indexOf(DocCast(d)))) : this.itemIndex;
+
+            // before moving onto next slide, run the subroutines :)
+            const currentDoc = this.childDocs[this.itemIndex];
+            this.runSubroutines(currentDoc.getChildrenToRun?.(), this.childDocs[this.itemIndex + 1]);
+
             this.nextSlide(curLast + 1 === this.childDocs.length ? (this.layoutDoc.presLoop ? 0 : curLast) : curLast + 1);
             progressiveReveal(true); // shows first progressive document, but without a transition effect
         } else {
@@ -684,6 +703,7 @@ export class PresBox extends ViewBoxBaseComponent<FieldViewProps>() {
     navigateToActiveItem = (afterNav?: () => void) => {
         const activeItem: Doc = this.activeItem;
         const targetDoc: Doc = this.targetDoc;
+        BranchingTrailManager.Instance.observeDocumentChange(targetDoc, this);
         const finished = () => {
             afterNav?.();
             console.log('Finish Slide Nav: ' + targetDoc.title);
diff --git a/src/client/views/nodes/trails/PresElementBox.scss b/src/client/views/nodes/trails/PresElementBox.scss
index 4f95f0c1f..9ac2b5a94 100644
--- a/src/client/views/nodes/trails/PresElementBox.scss
+++ b/src/client/views/nodes/trails/PresElementBox.scss
@@ -4,6 +4,10 @@ $light-background: #ececec;
 $slide-background: #d5dce2;
 $slide-active: #5b9fdd;
 
+.testingv2 {
+    background-color: red;
+}
+
 .presItem-container {
     cursor: grab;
     display: flex;
diff --git a/src/client/views/nodes/trails/PresElementBox.tsx b/src/client/views/nodes/trails/PresElementBox.tsx
index 92696240b..96f6a514b 100644
--- a/src/client/views/nodes/trails/PresElementBox.tsx
+++ b/src/client/views/nodes/trails/PresElementBox.tsx
@@ -180,7 +180,7 @@ export class PresElementBox extends ViewBoxBaseComponent<FieldViewProps>() {
                 e.stopPropagation();
                 e.preventDefault();
                 this.presBoxView?.modifierSelect(this.rootDoc, this._itemRef.current!, this._dragRef.current!, e.shiftKey || e.ctrlKey || e.metaKey, e.ctrlKey || e.metaKey, e.shiftKey);
-                this.presBoxView?.activeItem && this.showRecording(this.presBoxView?.activeItem);
+                // this.presBoxView?.activeItem && this.showRecording(this.presBoxView?.activeItem);
             });
         }
     };
@@ -403,6 +403,19 @@ export class PresElementBox extends ViewBoxBaseComponent<FieldViewProps>() {
         }
     };
 
+    @undoBatch
+    @action
+    lfg = (e: React.MouseEvent) => {
+        e.stopPropagation();
+        console.log('lfg called');
+        // TODO: fix this bug
+        const { toggleChildrenRun } = this.rootDoc;
+        toggleChildrenRun?.();
+
+        // call this.rootDoc.recurChildren() to get all the children
+        // if (iconClick) PresElementBox.showVideo = false;
+    };
+
     @computed
     get toolbarWidth(): number {
         const presBoxDocView = DocumentManager.Instance.getDocumentView(this.presBox);
@@ -418,6 +431,7 @@ export class PresElementBox extends ViewBoxBaseComponent<FieldViewProps>() {
         const presColorBool: boolean = presBoxColor ? presBoxColor !== Colors.WHITE && presBoxColor !== 'transparent' : false;
         const targetDoc: Doc = this.targetDoc;
         const activeItem: Doc = this.rootDoc;
+        const hasChildren: boolean = Cast(this.rootDoc?.hasChildren, 'boolean') || false;
 
         const items: JSX.Element[] = [];
         items.push(
@@ -482,6 +496,22 @@ export class PresElementBox extends ViewBoxBaseComponent<FieldViewProps>() {
                 </div>
             </Tooltip>
         );
+        if (!Doc.noviceMode && hasChildren) {
+            // TODO: replace with if treeveiw, has childrenDocs
+            items.push(
+                <Tooltip key="children" title={<div className="dash-tooltip">Run child processes (tree only)</div>}>
+                    <div
+                        className="slideButton"
+                        onClick={e => {
+                            e.stopPropagation();
+                            this.lfg(e);
+                        }}
+                        style={{ fontWeight: 700 }}>
+                        <FontAwesomeIcon icon={'circle-play'} onPointerDown={e => e.stopPropagation()} />
+                    </div>
+                </Tooltip>
+            );
+        }
         items.push(
             <Tooltip key="trash" title={<div className="dash-tooltip">Remove from presentation</div>}>
                 <div className={'slideButton'} onClick={this.removeItem}>
@@ -528,7 +558,7 @@ export class PresElementBox extends ViewBoxBaseComponent<FieldViewProps>() {
                 ) : (
                     <div
                         ref={this._dragRef}
-                        className={`presItem-slide ${isCurrent ? 'active' : ''}`}
+                        className={`presItem-slide ${isCurrent ? 'active' : ''}${this.rootDoc.runProcess ? ' testingv2' : ''}`}
                         style={{
                             display: 'infline-block',
                             backgroundColor: this.props.styleProvider?.(this.layoutDoc, this.props, StyleProp.BackgroundColor),