diff options
Diffstat (limited to 'src')
4 files changed, 32 insertions, 19 deletions
diff --git a/src/client/views/collections/CollectionMenu.tsx b/src/client/views/collections/CollectionMenu.tsx index 4b8075f06..cb989d348 100644 --- a/src/client/views/collections/CollectionMenu.tsx +++ b/src/client/views/collections/CollectionMenu.tsx @@ -33,6 +33,7 @@ import { PresBox } from "../nodes/PresBox"; import "./CollectionMenu.scss"; import { CollectionViewType, COLLECTION_BORDER_WIDTH } from "./CollectionView"; import { TabDocView } from "./TabDocView"; +import { RichTextField } from "../../../fields/RichTextField"; @observer export class CollectionMenu extends AntimodeMenu<AntimodeMenuProps> { @@ -121,7 +122,16 @@ export class CollectionViewBaseChrome extends React.Component<CollectionMenuProp _templateCommand = { params: ["target", "source"], title: "item view", script: "self.target.childLayoutTemplate = getDocTemplate(self.source?.[0])", - immediate: undoBatch((source: Doc[]) => source.length && (this.target.childLayoutTemplate = Doc.getDocTemplate(source?.[0]))), + immediate: undoBatch((source: Doc[]) => { + if (source.length === 1 && source[0].type === DocumentType.RTF && Cast(source[0].text, RichTextField, null)?.Text) { + Doc.SetInPlace(this.target, "childLayoutString", Cast(source[0].text, RichTextField, null)?.Text, false); + } else if (source.length) { + this.target.childLayoutTemplate = Doc.getDocTemplate(source?.[0]); + } else { + Doc.SetInPlace(this.target, "childLayoutString", undefined, true); + Doc.SetInPlace(this.target, "childLayoutTemplate", undefined, true); + } + }), initialize: emptyFunction, }; _narrativeCommand = { diff --git a/src/client/views/collections/CollectionView.tsx b/src/client/views/collections/CollectionView.tsx index ba8e23447..e0c40ce77 100644 --- a/src/client/views/collections/CollectionView.tsx +++ b/src/client/views/collections/CollectionView.tsx @@ -71,8 +71,6 @@ export enum CollectionViewType { } export interface CollectionViewCustomProps { filterAddDocument?: (doc: Doc | Doc[]) => boolean; // allows a document that renders a Collection view to filter or modify any documents added to the collection (see PresBox for an example) - childLayoutTemplate?: () => Opt<Doc>; // specify a layout Doc template to use for children of the collection - childLayoutString?: string; // specify a layout string to use for children of the collection childOpacity?: () => number; hideFilter?: true; } @@ -85,8 +83,8 @@ export interface CollectionRenderProps { whenActiveChanged: (isActive: boolean) => void; PanelWidth: () => number; PanelHeight: () => number; - ChildLayoutTemplate?: () => Doc; - ChildLayoutString?: string; + ChildLayoutTemplate?: () => Doc;// specify a layout Doc template to use for children of the collection + ChildLayoutString?: string;// specify a layout string to use for children of the collection } @observer @@ -244,7 +242,8 @@ export class CollectionView extends Touchable<FieldViewProps & CollectionViewCus } screenToLocalTransform = () => this.props.renderDepth ? this.props.ScreenToLocalTransform() : this.props.ScreenToLocalTransform().scale(this.props.PanelWidth() / this.bodyPanelWidth()); - private SubViewHelper = (type: CollectionViewType, renderProps: CollectionRenderProps) => { + private SubView = (type: CollectionViewType, renderProps: CollectionRenderProps) => { + TraceMobx(); const props: SubCollectionViewProps = { ...this.props, ...renderProps, ScreenToLocalTransform: this.screenToLocalTransform, CollectionView: this, annotationsKey: "" }; switch (type) { case CollectionViewType.Schema: return (<CollectionSchemaView key="collview" {...props} />); @@ -263,14 +262,10 @@ export class CollectionView extends Touchable<FieldViewProps & CollectionViewCus case CollectionViewType.Map: return (<CollectionMapView key="collview" {...props} />); case CollectionViewType.Grid: return (<CollectionGridView key="gridview" {...props} />); case CollectionViewType.Freeform: - default: { this.props.Document._freeformLayoutEngine = undefined; return (<CollectionFreeFormView key="collview" {...props} />); } + default: { this.props.Document._freeformLayoutEngine = undefined; return (<CollectionFreeFormView key="collview" {...props} ChildLayoutString={props.ChildLayoutString} />); } } } - private SubView = (type: CollectionViewType, renderProps: CollectionRenderProps) => { - return this.SubViewHelper(type, renderProps); - } - setupViewTypes(category: string, func: (viewType: CollectionViewType) => Doc, addExtras: boolean) { const subItems: ContextMenuProps[] = []; @@ -411,7 +406,7 @@ export class CollectionView extends Touchable<FieldViewProps & CollectionViewCus } childLayoutTemplate = () => this.props.childLayoutTemplate?.() || Cast(this.props.Document.childLayoutTemplate, Doc, null); - childLayoutString = this.props.childLayoutString || StrCast(this.props.Document.childLayoutString); + @computed get childLayoutString() { return StrCast(this.props.Document.childLayoutString); } render() { TraceMobx(); diff --git a/src/client/views/collections/collectionFreeForm/CollectionFreeFormView.tsx b/src/client/views/collections/collectionFreeForm/CollectionFreeFormView.tsx index 306dfe797..86460eee1 100644 --- a/src/client/views/collections/collectionFreeForm/CollectionFreeFormView.tsx +++ b/src/client/views/collections/collectionFreeForm/CollectionFreeFormView.tsx @@ -1497,11 +1497,9 @@ class CollectionFreeFormViewPannableContents extends React.Component<CollectionF e.stopPropagation(); e.preventDefault(); const corner = e.target as any; - console.log(corner.id); if (corner) this._drag = corner.id; const rect = document.getElementById(this._drag); if (rect) { - console.log(this._drag); setupMoveUpEvents(e.target, e, this.onPointerMove, (e) => { }, (e) => { }); } } @@ -1567,8 +1565,6 @@ class CollectionFreeFormViewPannableContents extends React.Component<CollectionF const vfTop: number = NumCast(activeItem.presPinViewY); const vfWidth: number = 100; const vfHeight: number = 100; - console.log(vfTop + " | " + vfLeft); - console.log(this.props.presPinView); return ( <> {!this.props.presPinView ? (null) : <div id="resizable" className="resizable" onPointerDown={this.onPointerDown} style={{ width: vfWidth, height: vfHeight, top: vfTop, left: vfLeft, position: 'absolute' }}> diff --git a/src/client/views/nodes/DocumentContentsView.tsx b/src/client/views/nodes/DocumentContentsView.tsx index 1b2070c0f..90fc5dc64 100644 --- a/src/client/views/nodes/DocumentContentsView.tsx +++ b/src/client/views/nodes/DocumentContentsView.tsx @@ -64,7 +64,19 @@ interface HTMLtagProps { onClick?: ScriptField; onInput?: ScriptField; } -//"<HTMLdiv borderRadius='100px' onClick={this.bannerColor=this.bannerColor==='red'?'green':'red'} width='100%' height='100%' transform='rotate({2*this.x+this.y}deg)'><ImageBox {...props} fieldKey={'data'}/><HTMLspan width='100%' marginTop='50%' height='10%' position='absolute' backgroundColor='{this.bannerColor===`green`?`dark`:`light`}grey'>{this.title}</HTMLspan></HTMLdiv>"@observer + +//"<HTMLdiv borderRadius='100px' onClick={this.bannerColor=this.bannerColor==='red'?'green':'red'} overflow='hidden' position='absolute' width='100%' height='100%' transform='rotate({2*this.x+this.y}deg)'> <ImageBox {...props} fieldKey={'data'}/> <HTMLspan width='200px' top='0' height='35px' textAlign='center' paddingTop='10px' transform='translate(-40px, 45px) rotate(-45deg)' position='absolute' color='{this.bannerColor===`green`?`light`:`dark`}blue' backgroundColor='{this.bannerColor===`green`?`dark`:`light`}blue'> {this.title}</HTMLspan></HTMLdiv>" +//"<HTMLdiv borderRadius='100px' overflow='hidden' position='absolute' width='100%' height='100%' +// transform='rotate({2*this.x+this.y}deg)' +// onClick = { this.bannerColor = this.bannerColor === 'red' ? 'green' : 'red' } > +// <ImageBox {...props} fieldKey={'data'}/> +// <HTMLspan width='200px' top='0' height='35px' textAlign='center' paddingTop='10px' +// transform='translate(-40px, 45px) rotate(-45deg)' position='absolute' +// color='{this.bannerColor===`green`?`light`:`dark`}blue' +// backgroundColor='{this.bannerColor===`green`?`dark`:`light`}blue'> +// {this.title} +// </HTMLspan> +// </HTMLdiv>" @observer export class HTMLtag extends React.Component<HTMLtagProps> { click = (e: React.MouseEvent) => { @@ -170,10 +182,10 @@ export class DocumentContentsView extends React.Component<DocumentViewProps & Fo // add onClick function to props const makeFuncProp = (func: string) => { - const splits = layoutFrame.split(`func=`); + const splits = layoutFrame.split(`${func}=`); if (splits.length > 1) { const code = XRegExp.matchRecursive(splits[1], "{", "}", "", { valueNames: ["between", "left", "match", "right", "between"] }); - layoutFrame = splits[0] + ` ${func}={props.onClick} ` + splits[1].substring(code[1].end + 1); + layoutFrame = splits[0] + ` ${func}={props.${func}} ` + splits[1].substring(code[1].end + 1); return ScriptField.MakeScript(code[1].value, { this: Doc.name, self: Doc.name, value: "string" }); } return undefined; |