From 3c8cb517c811f94dce1e3d8430e07af316642365 Mon Sep 17 00:00:00 2001 From: sotech117 Date: Thu, 13 Apr 2023 05:39:21 -0400 Subject: 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. --- src/client/views/Main.tsx | 2 + src/client/views/MainView.tsx | 1 + src/client/views/collections/TreeView.scss | 5 ++- src/client/views/collections/TreeView.tsx | 51 ++++++++++++++++++++++- src/client/views/nodes/trails/PresBox.tsx | 20 +++++++++ src/client/views/nodes/trails/PresElementBox.scss | 4 ++ src/client/views/nodes/trails/PresElementBox.tsx | 34 ++++++++++++++- 7 files changed, 111 insertions(+), 6 deletions(-) (limited to 'src/client/views') diff --git a/src/client/views/Main.tsx b/src/client/views/Main.tsx index 6b18caed0..1aeb93d42 100644 --- a/src/client/views/Main.tsx +++ b/src/client/views/Main.tsx @@ -15,6 +15,7 @@ import { TrackMovements } from '../util/TrackMovements'; import { CollectionView } from './collections/CollectionView'; import { MainView } from './MainView'; import * as dotenv from 'dotenv'; // see https://github.com/motdotla/dotenv#how-do-i-use-dotenv-with-import +import { BranchingTrailManager } from '../util/BranchingTrailManager'; dotenv.config(); AssignAllExtensions(); @@ -48,6 +49,7 @@ FieldLoader.ServerLoadStatus = { requested: 0, retrieved: 0 }; // bcz: not sure new LinkManager(); new TrackMovements(); new ReplayMovements(); + new BranchingTrailManager(); root.render(); }, 0); })(); diff --git a/src/client/views/MainView.tsx b/src/client/views/MainView.tsx index 60459cf30..1fc5ee1d7 100644 --- a/src/client/views/MainView.tsx +++ b/src/client/views/MainView.tsx @@ -63,6 +63,7 @@ import { PreviewCursor } from './PreviewCursor'; import { PropertiesView } from './PropertiesView'; import { DashboardStyleProvider, DefaultStyleProvider } from './StyleProvider'; import { TopBar } from './topbar/TopBar'; +import { BranchingTrailManager } from '../util/BranchingTrailManager'; const _global = (window /* browser */ || global) /* node */ as any; @observer diff --git a/src/client/views/collections/TreeView.scss b/src/client/views/collections/TreeView.scss index 7eab03e1d..cb6432687 100644 --- a/src/client/views/collections/TreeView.scss +++ b/src/client/views/collections/TreeView.scss @@ -25,10 +25,11 @@ width: 100%; height: 100%; position: absolute; + left: 10px; .treeView-expandIcon { - display: none; - left: -10px; + // display: none; + left: -8px; position: absolute; } diff --git a/src/client/views/collections/TreeView.tsx b/src/client/views/collections/TreeView.tsx index 75e76019e..153c2c71a 100644 --- a/src/client/views/collections/TreeView.tsx +++ b/src/client/views/collections/TreeView.tsx @@ -227,6 +227,37 @@ export class TreeView extends React.Component { } }; + @undoBatch + @action + recurToggle = (childList: Doc[]) => { + if (childList.length > 0) { + childList.forEach(child => { + console.log(child); + child.runProcess = !!!child.runProcess; + child.toggleChildrenRun?.(); + }); + } + }; + + @undoBatch + @action + getRunningChildren = (childList: Doc[]) => { + if (childList.length === 0) { + return []; + } + + const runningChildren = []; + childList.forEach(child => { + if (child.runProcess && child.getChildrenToRun) { + if (child.runProcess) { + runningChildren.push(child); + } + runningChildren.push(...(child.getChildrenToRun?.() ?? [])); + } + }); + return runningChildren; + }; + constructor(props: any) { super(props); if (!TreeView._openLevelScript) { @@ -235,6 +266,18 @@ export class TreeView extends React.Component { } this._openScript = Doc.IsSystem(this.props.document) ? undefined : () => TreeView._openLevelScript!; this._editTitleScript = Doc.IsSystem(this.props.document) ? () => TreeView._openLevelScript! : () => TreeView._openTitleScript!; + + // set for child processing highligting + // this.dataDoc.testing = 'testing'; + this.dataDoc.hasChildren = this.childDocs.length > 0; + // this.dataDoc.children = this.childDocs; + this.dataDoc.toggleChildrenRun = () => { + this.recurToggle(this.childDocs); + }; + + this.dataDoc.getChildrenToRun = () => { + return this.getRunningChildren(this.childDocs); + }; } _treeEle: any; @@ -696,7 +739,11 @@ export class TreeView extends React.Component { ) : (
- + = 1 ? 'block' : 'none' }} + icon={checked === 'check' ? 'check' : checked === 'x' ? 'times' : checked === 'unchecked' ? 'square' : !this.treeViewOpen ? 'caret-right' : 'caret-down'} + />
{this.onCheckedClick ? null : typeof iconType === 'string' ? : iconType}
@@ -899,7 +946,7 @@ export class TreeView extends React.Component { })} Document={this.doc} fitWidth={returnTrue} - DataDoc={undefined} + DataDoc={this.dataDoc} scriptContext={this} hideDecorationTitle={this.props.treeView.outlineMode} hideResizeHandles={this.props.treeView.outlineMode} 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() { 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() { // 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() { 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() { 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() { } }; + @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() { 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() { ); + if (!Doc.noviceMode && hasChildren) { + // TODO: replace with if treeveiw, has childrenDocs + items.push( + Run child processes (tree only)}> +
{ + e.stopPropagation(); + this.lfg(e); + }} + style={{ fontWeight: 700 }}> + e.stopPropagation()} /> +
+ + ); + } items.push( Remove from presentation}>
@@ -528,7 +558,7 @@ export class PresElementBox extends ViewBoxBaseComponent() { ) : (