aboutsummaryrefslogtreecommitdiff
path: root/src/client/views/collections/CollectionDockingView.tsx
diff options
context:
space:
mode:
Diffstat (limited to 'src/client/views/collections/CollectionDockingView.tsx')
-rw-r--r--src/client/views/collections/CollectionDockingView.tsx93
1 files changed, 60 insertions, 33 deletions
diff --git a/src/client/views/collections/CollectionDockingView.tsx b/src/client/views/collections/CollectionDockingView.tsx
index 77e6e1c93..6c50ea0f2 100644
--- a/src/client/views/collections/CollectionDockingView.tsx
+++ b/src/client/views/collections/CollectionDockingView.tsx
@@ -20,7 +20,7 @@ import { emptyFunction, returnEmptyString, returnFalse, returnOne, returnTrue, U
import { DocServer } from "../../DocServer";
import { Docs } from '../../documents/Documents';
import { DocumentManager } from '../../util/DocumentManager';
-import { DragLinksAsDocuments, DragManager } from "../../util/DragManager";
+import { DragManager } from "../../util/DragManager";
import { SelectionManager } from '../../util/SelectionManager';
import { Transform } from '../../util/Transform';
import { undoBatch } from "../../util/UndoManager";
@@ -32,6 +32,9 @@ import React = require("react");
import { ButtonSelector } from './ParentDocumentSelector';
import { DocumentType } from '../../documents/DocumentTypes';
import { ComputedField } from '../../../new_fields/ScriptField';
+import { InteractionUtils } from '../../util/InteractionUtils';
+import { TraceMobx } from '../../../new_fields/util';
+import { Scripting } from '../../util/Scripting';
library.add(faFile);
const _global = (window /* browser */ || global /* node */) as any;
@@ -39,7 +42,7 @@ const _global = (window /* browser */ || global /* node */) as any;
export class CollectionDockingView extends React.Component<SubCollectionViewProps> {
@observable public static Instances: CollectionDockingView[] = [];
@computed public static get Instance() { return CollectionDockingView.Instances[0]; }
- public static makeDocumentConfig(document: Doc, dataDoc: Doc | undefined, width?: number) {
+ public static makeDocumentConfig(document: Doc, dataDoc: Doc | undefined, width?: number, libraryPath?: Doc[]) {
return {
type: 'react-component',
component: 'DocumentFrameRenderer',
@@ -47,7 +50,8 @@ export class CollectionDockingView extends React.Component<SubCollectionViewProp
width: width,
props: {
documentId: document[Id],
- dataDocumentId: dataDoc && dataDoc[Id] !== document[Id] ? dataDoc[Id] : ""
+ dataDocumentId: dataDoc && dataDoc[Id] !== document[Id] ? dataDoc[Id] : "",
+ libraryPath: libraryPath ? libraryPath.map(d => d[Id]) : []
//collectionDockingView: CollectionDockingView.Instance
}
};
@@ -95,12 +99,12 @@ export class CollectionDockingView extends React.Component<SubCollectionViewProp
@undoBatch
@action
- public OpenFullScreen(docView: DocumentView) {
+ public OpenFullScreen(docView: DocumentView, libraryPath?: Doc[]) {
const document = Doc.MakeAlias(docView.props.Document);
const dataDoc = docView.props.DataDoc;
const newItemStackConfig = {
type: 'stack',
- content: [CollectionDockingView.makeDocumentConfig(document, dataDoc)]
+ content: [CollectionDockingView.makeDocumentConfig(document, dataDoc, undefined, libraryPath)]
};
const docconfig = this._goldenLayout.root.layoutManager.createContentItem(newItemStackConfig, this._goldenLayout);
this._goldenLayout.root.contentItems[0].addChild(docconfig);
@@ -174,12 +178,12 @@ export class CollectionDockingView extends React.Component<SubCollectionViewProp
//
@undoBatch
@action
- public static AddRightSplit(document: Doc, dataDoc: Doc | undefined, minimize: boolean = false) {
+ public static AddRightSplit(document: Doc, dataDoc: Doc | undefined, libraryPath?: Doc[]) {
if (!CollectionDockingView.Instance) return false;
const instance = CollectionDockingView.Instance;
const newItemStackConfig = {
type: 'stack',
- content: [CollectionDockingView.makeDocumentConfig(document, dataDoc)]
+ content: [CollectionDockingView.makeDocumentConfig(document, dataDoc, undefined, libraryPath)]
};
const newContentItem = instance._goldenLayout.root.layoutManager.createContentItem(newItemStackConfig, instance._goldenLayout);
@@ -199,11 +203,6 @@ export class CollectionDockingView extends React.Component<SubCollectionViewProp
collayout.config.width = 50;
newContentItem.config.width = 50;
}
- if (minimize) {
- // bcz: this makes the drag image show up better, but it also messes with fixed layout sizes
- // newContentItem.config.width = 10;
- // newContentItem.config.height = 10;
- }
newContentItem.callDownwards('_$init');
instance.layoutChanged();
return true;
@@ -211,9 +210,9 @@ export class CollectionDockingView extends React.Component<SubCollectionViewProp
@undoBatch
@action
- public AddTab = (stack: any, document: Doc, dataDocument: Doc | undefined) => {
+ public AddTab = (stack: any, document: Doc, dataDocument: Doc | undefined, libraryPath?: Doc[]) => {
Doc.GetProto(document).lastOpened = new DateField;
- const docContentConfig = CollectionDockingView.makeDocumentConfig(document, dataDocument);
+ const docContentConfig = CollectionDockingView.makeDocumentConfig(document, dataDocument, undefined, libraryPath);
if (stack === undefined) {
let stack: any = this._goldenLayout.root;
while (!stack.isStack) {
@@ -344,7 +343,7 @@ export class CollectionDockingView extends React.Component<SubCollectionViewProp
const docid = (e.target as any).DashDocId;
const tab = (e.target as any).parentElement as HTMLElement;
DocServer.GetRefField(docid).then(action(async (sourceDoc: Opt<Field>) =>
- (sourceDoc instanceof Doc) && DragLinksAsDocuments(tab, x, y, sourceDoc)));
+ (sourceDoc instanceof Doc) && DragManager.StartLinkTargetsDrag(tab, x, y, sourceDoc)));
}
if (className === "lm_drag_handle" || className === "lm_close" || className === "lm_maximise" || className === "lm_minimise" || className === "lm_close_tab") {
this._flush = true;
@@ -417,20 +416,14 @@ export class CollectionDockingView extends React.Component<SubCollectionViewProp
};
ReactDOM.render(<span title="Drag as document"
className="collectionDockingView-dragAsDocument"
- onPointerDown={
- e => {
- e.preventDefault();
- e.stopPropagation();
- DragManager.StartDocumentDrag([dragSpan], new DragManager.DocumentDragData([doc]), e.clientX, e.clientY, {
- handlers: { dragComplete: emptyFunction },
- hideSource: false
- });
- }}><FontAwesomeIcon icon="file" size="lg" /></span>, dragSpan);
+ onPointerDown={e => {
+ e.preventDefault();
+ e.stopPropagation();
+ DragManager.StartDocumentDrag([dragSpan], new DragManager.DocumentDragData([doc]), e.clientX, e.clientY);
+ }}>
+ <FontAwesomeIcon icon="file" size="lg" />
+ </span>, dragSpan);
ReactDOM.render(<ButtonSelector Document={doc} Stack={stack} />, gearSpan);
- // ReactDOM.render(<ParentDocSelector Document={doc} addDocTab={(doc, data, where) => {
- // where === "onRight" ? CollectionDockingView.AddRightSplit(doc, dataDoc) : CollectionDockingView.Instance.AddTab(stack, doc, dataDoc);
- // return true;
- // }} />, upDiv);
tab.reactComponents = [dragSpan, gearSpan, upDiv];
tab.element.append(dragSpan);
tab.element.append(gearSpan);
@@ -482,6 +475,28 @@ export class CollectionDockingView extends React.Component<SubCollectionViewProp
this.AddTab(stack, Docs.Create.FreeformDocument([], { width: this.props.PanelWidth(), height: this.props.PanelHeight(), title: "Untitled Collection" }), undefined);
}
});
+
+ // starter code for bezel to add new pane
+ // stack.element.on("touchstart", (e: TouchEvent) => {
+ // if (e.targetTouches.length === 2) {
+ // let pt1 = e.targetTouches.item(0);
+ // let pt2 = e.targetTouches.item(1);
+ // let threshold = 40 * window.devicePixelRatio;
+ // if (pt1 && pt2 && InteractionUtils.TwoPointEuclidist(pt1, pt2) < threshold) {
+ // let edgeThreshold = 30 * window.devicePixelRatio;
+ // let center = InteractionUtils.CenterPoint([pt1, pt2]);
+ // let stackRect: DOMRect = stack.element.getBoundingClientRect();
+ // let nearLeft = center.X - stackRect.x < edgeThreshold;
+ // let nearTop = center.Y - stackRect.y < edgeThreshold;
+ // let nearRight = stackRect.right - center.X < edgeThreshold;
+ // let nearBottom = stackRect.bottom - center.Y < edgeThreshold;
+ // let ns = [nearLeft, nearTop, nearRight, nearBottom].filter(n => n);
+ // if (ns.length === 1) {
+
+ // }
+ // }
+ // }
+ // });
stack.header.controlsContainer.find('.lm_close') //get the close icon
.off('click') //unbind the current click handler
.click(action(async function () {
@@ -532,11 +547,13 @@ interface DockedFrameProps {
documentId: FieldId;
dataDocumentId: FieldId;
glContainer: any;
+ libraryPath: (FieldId[]);
//collectionDockingView: CollectionDockingView
}
@observer
export class DockedFrameRenderer extends React.Component<DockedFrameProps> {
_mainCont: HTMLDivElement | null = null;
+ @observable private _libraryPath: Doc[] = [];
@observable private _panelWidth = 0;
@observable private _panelHeight = 0;
@observable private _document: Opt<Doc>;
@@ -554,6 +571,14 @@ export class DockedFrameRenderer extends React.Component<DockedFrameProps> {
DocServer.GetRefField(this.props.dataDocumentId).then(action((f: Opt<Field>) => this._dataDoc = f as Doc));
}
}));
+ this.props.libraryPath && this.setupLibraryPath();
+ }
+
+ async setupLibraryPath() {
+ Promise.all(this.props.libraryPath.map(async docid => {
+ const d = await DocServer.GetRefField(docid);
+ return d instanceof Doc ? d : undefined;
+ })).then(action((list: (Doc | undefined)[]) => this._libraryPath = list.filter(d => d).map(d => d as Doc)));
}
/**
@@ -640,25 +665,26 @@ export class DockedFrameRenderer extends React.Component<DockedFrameProps> {
get previewPanelCenteringOffset() { return this.nativeWidth() && !this.layoutDoc!.ignoreAspect ? (this._panelWidth - this.nativeWidth() * this.contentScaling()) / 2 : 0; }
get widthpercent() { return this.nativeWidth() && !this.layoutDoc!.ignoreAspect ? `${(this.nativeWidth() * this.contentScaling()) / this.panelWidth() * 100}%` : undefined; }
- addDocTab = (doc: Doc, dataDoc: Opt<Doc>, location: string) => {
+ addDocTab = (doc: Doc, dataDoc: Opt<Doc>, location: string, libraryPath?: Doc[]) => {
SelectionManager.DeselectAll();
if (doc.dockingConfig) {
- MainView.Instance.openWorkspace(doc);
- return true;
+ return MainView.Instance.openWorkspace(doc);
} else if (location === "onRight") {
- return CollectionDockingView.AddRightSplit(doc, dataDoc);
+ return CollectionDockingView.AddRightSplit(doc, dataDoc, libraryPath);
} else if (location === "close") {
return CollectionDockingView.CloseRightSplit(doc);
} else {
- return CollectionDockingView.Instance.AddTab(this._stack, doc, dataDoc);
+ return CollectionDockingView.Instance.AddTab(this._stack, doc, dataDoc, libraryPath);
}
}
@computed get docView() {
+ TraceMobx();
if (!this._document) return (null);
const document = this._document;
const resolvedDataDoc = document.layout instanceof Doc ? document : this._dataDoc;
return <DocumentView key={document[Id]}
+ LibraryPath={this._libraryPath}
Document={document}
DataDoc={resolvedDataDoc}
bringToFront={emptyFunction}
@@ -694,3 +720,4 @@ export class DockedFrameRenderer extends React.Component<DockedFrameProps> {
</div >);
}
}
+Scripting.addGlobal(function openOnRight(doc: any) { CollectionDockingView.AddRightSplit(doc, undefined); });
generated by cgit v1.2.3-70-g09d2 (git 2.46.0) at 2025-11-13 12:38:15 +0000