aboutsummaryrefslogtreecommitdiff
path: root/src/client/views/nodes/CollectionFreeFormDocumentView.tsx
diff options
context:
space:
mode:
authorbobzel <zzzman@gmail.com>2023-11-29 10:02:34 -0500
committerbobzel <zzzman@gmail.com>2023-11-29 10:02:34 -0500
commitba3b3f6f261074bd3f35012bde8730f5d4a36905 (patch)
tree6f6c7b141f8bc5881113378801d4b2940cfde36a /src/client/views/nodes/CollectionFreeFormDocumentView.tsx
parentac360607bee82f0fef769eada99dc0b3f85ae70a (diff)
numerous changes to fix bugs and to fix/remove old or hacky code. fixed doc dec resizing. moving this.rootDoc => this.Document . fixing template artifacts.
Diffstat (limited to 'src/client/views/nodes/CollectionFreeFormDocumentView.tsx')
-rw-r--r--src/client/views/nodes/CollectionFreeFormDocumentView.tsx51
1 files changed, 34 insertions, 17 deletions
diff --git a/src/client/views/nodes/CollectionFreeFormDocumentView.tsx b/src/client/views/nodes/CollectionFreeFormDocumentView.tsx
index dd16ab71b..5b4fb3e29 100644
--- a/src/client/views/nodes/CollectionFreeFormDocumentView.tsx
+++ b/src/client/views/nodes/CollectionFreeFormDocumentView.tsx
@@ -1,6 +1,6 @@
import { action, computed, observable } from 'mobx';
import { observer } from 'mobx-react';
-import { Doc, Opt } from '../../../fields/Doc';
+import { Doc, DocListCast, Opt } from '../../../fields/Doc';
import { List } from '../../../fields/List';
import { listSpec } from '../../../fields/Schema';
import { ComputedField } from '../../../fields/ScriptField';
@@ -15,14 +15,16 @@ import { StyleProp } from '../StyleProvider';
import './CollectionFreeFormDocumentView.scss';
import { DocumentView, DocumentViewProps, OpenWhere } from './DocumentView';
import React = require('react');
+import { ScriptingGlobals } from '../../util/ScriptingGlobals';
export interface CollectionFreeFormDocumentViewWrapperProps extends DocumentViewProps {
x: number;
y: number;
z: number;
- width: number; // -1 means use PanelWidth which should be the same as the Document's width, but avoids the delay of waiting for the width prop to change in PanelWidth function
- height: number; // -1 means use PanelHeight
+ width: number;
+ height: number;
zIndex?: number;
+ autoDim?: number; // 1 means use Panel Width/Height, 0 means use width/height
rotation?: number;
color?: string;
backgroundColor?: string;
@@ -72,8 +74,8 @@ export class CollectionFreeFormDocumentViewWrapper extends DocComponent<Collecti
w_Transition = () => this.Transition; // prettier-ignore
w_DataTransition = () => this.DataTransition; // prettier-ignore
- PanelWidth = () => this.Width > 0 ? this.Width : this.props.PanelWidth?.(); // prettier-ignore
- PanelHeight = () => this.Height > 0 ? this.Height : this.props.PanelHeight?.(); // prettier-ignore
+ PanelWidth = () => this.props.autoDim ? this.props.PanelWidth?.() : this.Width; // prettier-ignore
+ PanelHeight = () => this.props.autoDim ? this.props.PanelHeight?.() : this.Height; // prettier-ignore
@action
componentDidUpdate() {
this.WrapperKeys.forEach(keys => ((this as any)[keys.upper] = (this.props as any)[keys.lower]));
@@ -113,7 +115,7 @@ export interface CollectionFreeFormDocumentViewProps {
@observer
export class CollectionFreeFormDocumentView extends DocComponent<CollectionFreeFormDocumentViewProps & DocumentViewProps>() {
get displayName() { // this makes mobx trace() statements more descriptive
- return 'CollectionFreeFormDocumentView(' + this.rootDoc.title + ')';
+ return 'CollectionFreeFormDocumentView(' + this.Document.title + ')';
} // prettier-ignore
public static animFields: { key: string; val?: number }[] = [
{ key: 'x' },
@@ -148,14 +150,14 @@ export class CollectionFreeFormDocumentView extends DocComponent<CollectionFreeF
public static getValues(doc: Doc, time: number, fillIn: boolean = true) {
return CollectionFreeFormDocumentView.animFields.reduce((p, val) => {
- p[val.key] = Cast(doc[`${val.key}-indexed`], listSpec('number'), fillIn ? [NumCast(doc[val.key], val.val)] : []).reduce((p, v, i) => ((i <= Math.round(time) && v !== undefined) || p === undefined ? v : p), undefined as any as number);
+ p[val.key] = Cast(doc[`${val.key}_indexed`], listSpec('number'), fillIn ? [NumCast(doc[val.key], val.val)] : []).reduce((p, v, i) => ((i <= Math.round(time) && v !== undefined) || p === undefined ? v : p), undefined as any as number);
return p;
}, {} as { [val: string]: Opt<number> });
}
public static getStringValues(doc: Doc, time: number) {
return CollectionFreeFormDocumentView.animStringFields.reduce((p, val) => {
- p[val] = Cast(doc[`${val}-indexed`], listSpec('string'), [StrCast(doc[val])]).reduce((p, v, i) => ((i <= Math.round(time) && v !== undefined) || p === undefined ? v : p), undefined as any as string);
+ p[val] = Cast(doc[`${val}_indexed`], listSpec('string'), [StrCast(doc[val])]).reduce((p, v, i) => ((i <= Math.round(time) && v !== undefined) || p === undefined ? v : p), undefined as any as string);
return p;
}, {} as { [val: string]: Opt<string> });
}
@@ -163,40 +165,52 @@ export class CollectionFreeFormDocumentView extends DocComponent<CollectionFreeF
public static setStringValues(time: number, d: Doc, vals: { [val: string]: Opt<string> }) {
const timecode = Math.round(time);
Object.keys(vals).forEach(val => {
- const findexed = Cast(d[`${val}-indexed`], listSpec('string'), []).slice();
+ const findexed = Cast(d[`${val}_indexed`], listSpec('string'), []).slice();
findexed[timecode] = vals[val] as any as string;
- d[`${val}-indexed`] = new List<string>(findexed);
+ d[`${val}_indexed`] = new List<string>(findexed);
});
}
public static setValues(time: number, d: Doc, vals: { [val: string]: Opt<number> }) {
const timecode = Math.round(time);
Object.keys(vals).forEach(val => {
- const findexed = Cast(d[`${val}-indexed`], listSpec('number'), []).slice();
+ const findexed = Cast(d[`${val}_indexed`], listSpec('number'), []).slice();
findexed[timecode] = vals[val] as any as number;
- d[`${val}-indexed`] = new List<number>(findexed);
+ d[`${val}_indexed`] = new List<number>(findexed);
});
}
+ public static gotoKeyFrame(doc: Doc, newFrame: number) {
+ if (doc) {
+ const childDocs = DocListCast(doc[Doc.LayoutFieldKey(doc)]);
+ const currentFrame = Cast(doc._currentFrame, 'number', null);
+ if (currentFrame === undefined) {
+ doc._currentFrame = 0;
+ CollectionFreeFormDocumentView.setupKeyframes(childDocs, 0);
+ }
+ CollectionFreeFormView.updateKeyframe(undefined, [...childDocs, doc], currentFrame || 0);
+ doc._currentFrame = newFrame === undefined ? 0 : Math.max(0, newFrame);
+ }
+ }
public static setupKeyframes(docs: Doc[], currTimecode: number, makeAppear: boolean = false) {
docs.forEach(doc => {
if (doc.appearFrame === undefined) doc.appearFrame = currTimecode;
- if (!doc['opacity-indexed']) {
+ if (!doc['opacity_indexed']) {
// opacity is unlike other fields because it's value should not be undefined before it appears to enable it to fade-in
- doc['opacity-indexed'] = new List<number>(numberRange(currTimecode + 1).map(t => (!doc.z && makeAppear && t < NumCast(doc.appearFrame) ? 0 : 1)));
+ doc['opacity_indexed'] = new List<number>(numberRange(currTimecode + 1).map(t => (!doc.z && makeAppear && t < NumCast(doc.appearFrame) ? 0 : 1)));
}
CollectionFreeFormDocumentView.animFields.forEach(val => (doc[val.key] = ComputedField.MakeInterpolatedNumber(val.key, 'activeFrame', doc, currTimecode, val.val)));
CollectionFreeFormDocumentView.animStringFields.forEach(val => (doc[val] = ComputedField.MakeInterpolatedString(val, 'activeFrame', doc, currTimecode)));
CollectionFreeFormDocumentView.animDataFields(doc).forEach(val => (doc[val] = ComputedField.MakeInterpolatedDataField(val, 'activeFrame', doc, currTimecode)));
const targetDoc = doc; // data fields, like rtf 'text' exist on the data doc, so
//doc !== targetDoc && (targetDoc.embedContainer = doc.embedContainer); // the computed fields don't see the layout doc -- need to copy the embedContainer to the data doc (HACK!!!) and set the activeFrame on the data doc (HACK!!!)
- targetDoc.activeFrame = ComputedField.MakeFunction('self.embedContainer?._currentFrame||0');
+ targetDoc.activeFrame = ComputedField.MakeFunction('this.embedContainer?._currentFrame||0');
targetDoc.dataTransition = 'inherit';
});
}
@action public float = () => {
- const topDoc = this.rootDoc;
+ const topDoc = this.Document;
const containerDocView = this.props.docViewPath().lastElement();
const screenXf = containerDocView?.screenToLocalTransform();
if (screenXf) {
@@ -238,7 +252,7 @@ export class CollectionFreeFormDocumentView extends DocComponent<CollectionFreeF
// undefined - this is not activated by a group
isGroupActive = () => {
if (this.CollectionFreeFormView.isAnyChildContentActive()) return undefined;
- const isGroup = this.rootDoc._isGroup && (!this.rootDoc.backgroundColor || this.rootDoc.backgroundColor === 'transparent');
+ const isGroup = this.Document.isGroup && (!this.layoutDoc.backgroundColor || this.layoutDoc.backgroundColor === 'transparent');
return isGroup ? (this.props.isDocumentActive?.() ? 'group' : this.props.isGroupActive?.() ? 'child' : 'inactive') : this.props.isGroupActive?.() ? 'child' : undefined;
};
public static CollectionFreeFormDocViewClassName = 'collectionFreeFormDocumentView-container';
@@ -265,3 +279,6 @@ export class CollectionFreeFormDocumentView extends DocComponent<CollectionFreeF
);
}
}
+ScriptingGlobals.add(function gotoFrame(doc: any, newFrame: any) {
+ CollectionFreeFormDocumentView.gotoKeyFrame(doc, newFrame);
+});