aboutsummaryrefslogtreecommitdiff
path: root/src
diff options
context:
space:
mode:
Diffstat (limited to 'src')
-rw-r--r--src/client/util/DocumentManager.ts15
-rw-r--r--src/client/util/DragManager.ts10
-rw-r--r--src/client/views/collections/CollectionMenu.tsx10
-rw-r--r--src/client/views/nodes/ComparisonBox.scss2
-rw-r--r--src/client/views/nodes/PresBox.tsx70
-rw-r--r--src/client/views/presentationview/PresElementBox.tsx18
6 files changed, 89 insertions, 36 deletions
diff --git a/src/client/util/DocumentManager.ts b/src/client/util/DocumentManager.ts
index dc911ea75..2670de7a6 100644
--- a/src/client/util/DocumentManager.ts
+++ b/src/client/util/DocumentManager.ts
@@ -128,19 +128,24 @@ export class DocumentManager {
}
- static addRightSplit = (doc: Doc, finished?: () => void) => {
- CollectionDockingView.AddSplit(doc, "right");
- finished?.();
+ static addView = (doc: Doc, finished?: () => void, presCollection?: Doc) => {
+ if (presCollection) {
+ const collectionDocView = DocumentManager.Instance.getDocumentView(presCollection);
+ if (collectionDocView) collectionDocView.props.addDocTab(doc, "replace");
+ } else {
+ CollectionDockingView.AddSplit(doc, "right");
+ finished?.();
+ }
}
public jumpToDocument = async (
targetDoc: Doc, // document to display
willZoom: boolean, // whether to zoom doc to take up most of screen
- createViewFunc = DocumentManager.addRightSplit, // how to create a view of the doc if it doesn't exist
+ createViewFunc = DocumentManager.addView, // how to create a view of the doc if it doesn't exist
docContext?: Doc, // context to load that should contain the target
linkDoc?: Doc, // link that's being followed
closeContextIfNotFound: boolean = false, // after opening a context where the document should be, this determines whether the context should be closed if the Doc isn't actually there
originatingDoc: Opt<Doc> = undefined, // doc that initiated the display of the target odoc
- finished?: () => void
+ finished?: () => void,
): Promise<void> => {
const getFirstDocView = DocumentManager.Instance.getFirstDocumentView;
const focusAndFinish = () => { finished?.(); return false; };
diff --git a/src/client/util/DragManager.ts b/src/client/util/DragManager.ts
index 3a0f306f3..9e91b4f55 100644
--- a/src/client/util/DragManager.ts
+++ b/src/client/util/DragManager.ts
@@ -201,7 +201,14 @@ export namespace DragManager {
}
// drag a document and drop it (or make an alias/copy on drop)
- export function StartDocumentDrag(eles: HTMLElement[], dragData: DocumentDragData, downX: number, downY: number, options?: DragOptions) {
+ export function StartDocumentDrag(
+ eles: HTMLElement[],
+ dragData: DocumentDragData,
+ downX: number,
+ downY: number,
+ options?: DragOptions,
+ dropEvent?: () => any
+ ) {
const addAudioTag = (dropDoc: any) => {
dropDoc && !dropDoc.creationDate && (dropDoc.creationDate = new DateField);
dropDoc instanceof Doc && DocUtils.MakeLinkToActiveAudio(dropDoc);
@@ -209,6 +216,7 @@ export namespace DragManager {
};
const finishDrag = (e: DragCompleteEvent) => {
const docDragData = e.docDragData;
+ if (dropEvent) dropEvent(); // glr: optional additional function to be called - in this case with presentation trails
if (docDragData && !docDragData.droppedDocuments.length) {
docDragData.dropAction = dragData.userDropAction || dragData.dropAction;
docDragData.droppedDocuments =
diff --git a/src/client/views/collections/CollectionMenu.tsx b/src/client/views/collections/CollectionMenu.tsx
index b2b1b7d25..d08b31340 100644
--- a/src/client/views/collections/CollectionMenu.tsx
+++ b/src/client/views/collections/CollectionMenu.tsx
@@ -400,11 +400,11 @@ export class CollectionViewBaseChrome extends React.Component<CollectionMenuProp
if (targetDoc) {
TabDocView.PinDoc(targetDoc, false);
const activeDoc = PresBox.Instance.childDocs[PresBox.Instance.childDocs.length - 1];
- if (targetDoc.type === DocumentType.PDF || targetDoc.type === DocumentType.RTF || targetDoc.type === DocumentType.WEB) {
+ if (targetDoc.type === DocumentType.PDF || targetDoc.type === DocumentType.RTF || targetDoc.type === DocumentType.WEB || targetDoc._viewType === CollectionViewType.Stacking) {
const scroll = targetDoc._scrollTop;
activeDoc.presPinView = true;
activeDoc.presPinViewScroll = scroll;
- } else {
+ } else if ((targetDoc.type === DocumentType.COL && targetDoc._viewType === CollectionViewType.Freeform) || targetDoc.type === DocumentType.IMG) {
const x = targetDoc._panX;
const y = targetDoc._panY;
const scale = targetDoc._viewScale;
@@ -412,6 +412,10 @@ export class CollectionViewBaseChrome extends React.Component<CollectionMenuProp
activeDoc.presPinViewX = x;
activeDoc.presPinViewY = y;
activeDoc.presPinViewScale = scale;
+ } else if (targetDoc.type === DocumentType.COMPARISON) {
+ const width = targetDoc._clipWidth;
+ activeDoc.presPinClipWidth = width;
+ activeDoc.presPinView = true;
}
}
}
@@ -421,7 +425,7 @@ export class CollectionViewBaseChrome extends React.Component<CollectionMenuProp
const presPinWithViewIcon = <img src={`/assets/pinWithView.png`} style={{ margin: "auto", width: 19 }} />;
const targetDoc = this.selectedDoc;
{/* return (!targetDoc || (targetDoc._viewType !== CollectionViewType.Freeform && targetDoc.type !== DocumentType.IMG)) ? (null) : <Tooltip title={<><div className="dash-tooltip">{"Pin to presentation trail with current view"}</div></>} placement="top"> */ }
- return (targetDoc && (targetDoc._viewType === CollectionViewType.Freeform || targetDoc.type === DocumentType.IMG || targetDoc.type === DocumentType.PDF || targetDoc.type === DocumentType.WEB || targetDoc.type === DocumentType.RTF)) ? <Tooltip title={<><div className="dash-tooltip">{"Pin to presentation trail with current view"}</div></>} placement="top">
+ return (targetDoc && (targetDoc._viewType === CollectionViewType.Freeform || targetDoc._viewType === CollectionViewType.Stacking || targetDoc.type === DocumentType.IMG || targetDoc.type === DocumentType.PDF || targetDoc.type === DocumentType.WEB || targetDoc.type === DocumentType.RTF || targetDoc.type === DocumentType.COMPARISON)) ? <Tooltip title={<><div className="dash-tooltip">{"Pin to presentation trail with current view"}</div></>} placement="top">
<button className="antimodeMenu-button" style={{ borderRight: "1px solid gray", borderLeft: "1px solid gray", justifyContent: 'center' }}
onClick={() => this.pinWithView(targetDoc)}>
{presPinWithViewIcon}
diff --git a/src/client/views/nodes/ComparisonBox.scss b/src/client/views/nodes/ComparisonBox.scss
index acf6b1636..44cf5d046 100644
--- a/src/client/views/nodes/ComparisonBox.scss
+++ b/src/client/views/nodes/ComparisonBox.scss
@@ -13,6 +13,7 @@
left: 0;
height: 100%;
overflow: hidden;
+ transition: 200ms;
.beforeBox-cont {
height: 100%;
@@ -26,6 +27,7 @@
width: 3px;
display: inline-block;
background: white;
+ transition: 200ms;
.slide-handle {
position: absolute;
diff --git a/src/client/views/nodes/PresBox.tsx b/src/client/views/nodes/PresBox.tsx
index 8e3679452..3b7794815 100644
--- a/src/client/views/nodes/PresBox.tsx
+++ b/src/client/views/nodes/PresBox.tsx
@@ -46,6 +46,12 @@ export enum PresEffect {
None = "none",
}
+enum PresStatus {
+ Autoplay = "auto",
+ Manual = "manual",
+ Edit = "edit"
+}
+
type PresBoxSchema = makeInterface<[typeof documentSchema]>;
const PresBoxDocument = makeInterface(documentSchema);
@@ -75,6 +81,14 @@ export class PresBox extends ViewBoxBaseComponent<FieldViewProps, PresBoxSchema>
@computed get itemIndex() { return NumCast(this.rootDoc._itemIndex); }
@computed get activeItem() { return Cast(this.childDocs[this.itemIndex], Doc, null); }
@computed get targetDoc() { return Cast(this.activeItem?.presentationTargetDoc, Doc, null); }
+ @computed get scrollable(): boolean {
+ if (this.targetDoc.type === DocumentType.PDF || this.targetDoc.type === DocumentType.WEB || this.targetDoc.type === DocumentType.RTF || this.targetDoc._viewType === CollectionViewType.Stacking) return true;
+ else return false;
+ }
+ @computed get panable(): boolean {
+ if ((this.targetDoc.type === DocumentType.COL && this.targetDoc._viewType === CollectionViewType.Freeform) || this.targetDoc.type === DocumentType.IMG) return true;
+ else return false;
+ }
@computed get presElement() { return Cast(Doc.UserDoc().presElement, Doc, null); }
constructor(props: any) {
super(props);
@@ -117,7 +131,7 @@ export class PresBox extends ViewBoxBaseComponent<FieldViewProps, PresBoxSchema>
this.rootDoc.presBox = this.rootDoc;
this.rootDoc._forceRenderEngine = "timeline";
this.rootDoc._replacedChrome = "replaced";
- this.layoutDoc.presStatus = "edit";
+ this.layoutDoc.presStatus = PresStatus.Edit;
this.layoutDoc._gridGap = 0;
this.layoutDoc._yMargin = 0;
this.turnOffEdit(true);
@@ -156,7 +170,7 @@ export class PresBox extends ViewBoxBaseComponent<FieldViewProps, PresBoxSchema>
else targetDoc.editing = true;
// if (activeItem.zoomProgressivize) this.zoomProgressivizeNext(targetDoc);
// Case 2: 'Play on next' for audio or video therefore first navigate to the audio/video before it should be played
- } else if ((targetDoc.type === DocumentType.AUDIO || targetDoc.type === DocumentType.VID) && !activeItem.playAuto && activeItem.playNow && this.layoutDoc.presStatus !== 'auto') {
+ } else if ((targetDoc.type === DocumentType.AUDIO || targetDoc.type === DocumentType.VID) && !activeItem.playAuto && activeItem.playNow && this.layoutDoc.presStatus !== PresStatus.Autoplay) {
if (targetDoc.type === DocumentType.AUDIO) AudioBox.Instance.playFrom(NumCast(activeItem.presStartTime));
// if (targetDoc.type === DocumentType.VID) { VideoBox.Instance.Play() };
activeItem.playNow = false;
@@ -256,7 +270,7 @@ export class PresBox extends ViewBoxBaseComponent<FieldViewProps, PresBoxSchema>
const targetDoc: Doc = this.targetDoc;
const srcContext = await DocCastAsync(targetDoc.context);
const presCollection = Cast(this.layoutDoc.presCollection, Doc, null);
- const collectionDocView = presCollection ? await DocumentManager.Instance.getDocumentView(presCollection) : undefined;
+ const collectionDocView = presCollection ? DocumentManager.Instance.getDocumentView(presCollection) : undefined;
this.turnOffEdit();
if (this.itemIndex >= 0) {
if (srcContext && targetDoc) {
@@ -272,21 +286,23 @@ export class PresBox extends ViewBoxBaseComponent<FieldViewProps, PresBoxSchema>
this.updateCurrentPresentation();
const docToJump = curDoc;
const willZoom = false;
-
+ const openInTab = () => {
+ collectionDocView ? collectionDocView.props.addDocTab(activeItem, "replace") : this.props.addDocTab(activeItem, "replace:left");
+ }
// If openDocument is selected then it should open the document for the user
if (activeItem.openDocument) {
- collectionDocView ? collectionDocView.props.addDocTab(activeItem, "replace") : this.props.addDocTab(activeItem, "replace:left");
+ openInTab();
} else
//docToJump stayed same meaning, it was not in the group or was the last element in the group
- if (activeItem.zoomProgressivize && this.rootDoc.presStatus !== 'edit') {
+ if (activeItem.zoomProgressivize && this.rootDoc.presStatus !== PresStatus.Edit) {
this.zoomProgressivizeNext(targetDoc);
} else if (docToJump === curDoc) {
//checking if curDoc has navigation open
if (curDoc.presMovement === PresMovement.Pan && targetDoc) {
- await DocumentManager.Instance.jumpToDocument(targetDoc, false, undefined, srcContext);
+ await DocumentManager.Instance.jumpToDocument(targetDoc, false, () => { openInTab() }, srcContext); // documents open in new tab instead of on right
} else if ((curDoc.presMovement === PresMovement.Zoom || curDoc.presMovement === PresMovement.Jump) && targetDoc) {
//awaiting jump so that new scale can be found, since jumping is async
- await DocumentManager.Instance.jumpToDocument(targetDoc, true, undefined, srcContext);
+ await DocumentManager.Instance.jumpToDocument(targetDoc, true, () => { openInTab() }, srcContext); // documents open in new tab instead of on right
}
} else {
//awaiting jump so that new scale can be found, since jumping is async
@@ -301,6 +317,8 @@ export class PresBox extends ViewBoxBaseComponent<FieldViewProps, PresBoxSchema>
bestTarget && runInAction(() => {
if (bestTarget.type === DocumentType.PDF || bestTarget.type === DocumentType.WEB || bestTarget.type === DocumentType.RTF || bestTarget._viewType === CollectionViewType.Stacking) {
bestTarget._scrollY = activeItem.presPinViewScroll;
+ } else if (bestTarget.type === DocumentType.COMPARISON) {
+ bestTarget._clipWidth = activeItem.presPinClipWidth;
} else {
bestTarget._viewTransition = activeItem.presTransition ? `transform ${activeItem.presTransition}ms` : 'all 0.5s';
bestTarget._panX = activeItem.presPinViewX;
@@ -418,13 +436,13 @@ export class PresBox extends ViewBoxBaseComponent<FieldViewProps, PresBoxSchema>
if (i === this.childDocs.length - 1) {
setTimeout(() => {
clearTimeout(this._presTimer);
- if (this.layoutDoc.presStatus === 'auto' && !this.layoutDoc.presLoop) this.layoutDoc.presStatus = "manual";
+ if (this.layoutDoc.presStatus === 'auto' && !this.layoutDoc.presLoop) this.layoutDoc.presStatus = PresStatus.Manual;
else if (this.layoutDoc.presLoop) this.startAutoPres(0);
}, duration);
}
}
};
- this.layoutDoc.presStatus = "auto";
+ this.layoutDoc.presStatus = PresStatus.Auto;
this.startPresentation(startSlide);
this.gotoDocument(startSlide, this.itemIndex);
load();
@@ -432,9 +450,9 @@ export class PresBox extends ViewBoxBaseComponent<FieldViewProps, PresBoxSchema>
@action
pauseAutoPres = () => {
- if (this.layoutDoc.presStatus === "auto") {
+ if (this.layoutDoc.presStatus === PresStatus.Auto) {
if (this._presTimer) clearTimeout(this._presTimer);
- this.layoutDoc.presStatus = "manual";
+ this.layoutDoc.presStatus = PresStatus.Manual;
this.layoutDoc.presLoop = false;
}
}
@@ -491,12 +509,12 @@ export class PresBox extends ViewBoxBaseComponent<FieldViewProps, PresBoxSchema>
updateMinimize = () => {
const docView = DocumentManager.Instance.getDocumentView(this.layoutDoc);
if (this.layoutDoc.inOverlay) {
- this.layoutDoc.presStatus = 'edit';
+ this.layoutDoc.presStatus = PresStatus.Edit;
Doc.RemoveDocFromList((Doc.UserDoc().myOverlayDocs as Doc), undefined, this.rootDoc);
CollectionDockingView.AddSplit(this.rootDoc, "right");
this.layoutDoc.inOverlay = false;
} else if (this.layoutDoc.context && docView) {
- this.layoutDoc.presStatus = 'edit';
+ this.layoutDoc.presStatus = PresStatus.Edit;
clearTimeout(this._presTimer);
const pt = this.props.ScreenToLocalTransform().inverse().transformPoint(0, 0);
this.rootDoc.x = pt[0] + (this.props.PanelWidth() - 250);
@@ -506,7 +524,7 @@ export class PresBox extends ViewBoxBaseComponent<FieldViewProps, PresBoxSchema>
docView.props.removeDocument?.(this.layoutDoc);
Doc.AddDocToList((Doc.UserDoc().myOverlayDocs as Doc), undefined, this.rootDoc);
} else {
- this.layoutDoc.presStatus = 'edit';
+ this.layoutDoc.presStatus = PresStatus.Edit;
clearTimeout(this._presTimer);
const pt = this.props.ScreenToLocalTransform().inverse().transformPoint(0, 0);
this.rootDoc.x = pt[0] + (this.props.PanelWidth() - 250);
@@ -593,7 +611,7 @@ export class PresBox extends ViewBoxBaseComponent<FieldViewProps, PresBoxSchema>
return true;
}
childLayoutTemplate = () => this.rootDoc._viewType !== CollectionViewType.Stacking ? undefined : this.presElement;
- removeDocument = (doc: Doc) => { Doc.RemoveDocFromList(this.dataDoc, this.fieldKey, doc); };
+ removeDocument = (doc: Doc) => { return Doc.RemoveDocFromList(this.dataDoc, this.fieldKey, doc); };
getTransform = () => this.props.ScreenToLocalTransform().translate(-5, -65);// listBox padding-left and pres-box-cont minHeight
panelHeight = () => this.props.PanelHeight() - 40;
active = (outsideReaction?: boolean) => ((Doc.GetSelectedTool() === InkTool.None && !this.layoutDoc._isBackground) &&
@@ -662,7 +680,7 @@ export class PresBox extends ViewBoxBaseComponent<FieldViewProps, PresBoxSchema>
// Key for when the presentaiton is active
@undoBatch
- keyEvents = action((e: KeyboardEvent) => {
+ keyEvents = action(async (e: KeyboardEvent) => {
if (e.target instanceof HTMLInputElement) return;
let handled = false;
const anchorNode = document.activeElement as HTMLDivElement;
@@ -687,15 +705,19 @@ export class PresBox extends ViewBoxBaseComponent<FieldViewProps, PresBoxSchema>
if (this._presTimer) clearTimeout(this._presTimer);
handled = true;
} if (e.keyCode === 32) { // spacebar to 'present' or autoplay
- if (this.layoutDoc.presStatus !== "edit") this.startAutoPres(0);
- else this.next();
+ if (this.layoutDoc.presStatus === "manual") this.startAutoPres(this.itemIndex);
+ else if (this.layoutDoc.presStatus === "auto") if (this._presTimer) clearTimeout(this._presTimer);
handled = true;
} if (e.keyCode === 8) { // delete selected items
if (this.layoutDoc.presStatus === "edit") {
- this._selectedArray.forEach((doc, i) => this.removeDocument(doc));
- this._selectedArray = [];
- this._eleArray = [];
- this._dragArray = [];
+ await Promise.all<boolean>(this._selectedArray.map((doc, i): boolean => {
+ const removed: boolean = this.removeDocument(doc);
+ console.log("Is removed? : " + i + " | " + removed);
+ return removed;
+ }));
+ action(() => this._selectedArray = []);
+ action(() => this._eleArray = []);
+ action(() => this._dragArray = []);
handled = true;
}
} if (handled) {
@@ -1755,7 +1777,7 @@ export class PresBox extends ViewBoxBaseComponent<FieldViewProps, PresBoxSchema>
@computed get frameListHeader() {
return (<div className="frameList-header">
- Frames
+ &nbsp; Frames {this.panable ? <i>Panable</i> : this.scrollable ? <i>Scrollable</i> : (null)}
<div className={"frameList-headerButtons"}>
<Tooltip title={<><div className="dash-tooltip">{"Add frame by example"}</div></>}><div className={"headerButton"} onClick={e => { e.stopPropagation(); this.newFrame(); }}>
<FontAwesomeIcon icon={"plus"} onPointerDown={e => e.stopPropagation()} />
diff --git a/src/client/views/presentationview/PresElementBox.tsx b/src/client/views/presentationview/PresElementBox.tsx
index ab4cadab0..aea00f812 100644
--- a/src/client/views/presentationview/PresElementBox.tsx
+++ b/src/client/views/presentationview/PresElementBox.tsx
@@ -20,6 +20,8 @@ import { DragManager } from "../../util/DragManager";
import { CurrentUserUtils } from "../../util/CurrentUserUtils";
import { undoBatch } from "../../util/UndoManager";
import { EditableView } from "../EditableView";
+import { DocUtils } from "../../documents/Documents";
+import { DateField } from "../../../fields/DateField";
export const presSchema = createSchema({
presentationTargetDoc: Doc,
@@ -175,8 +177,9 @@ export class PresElementBox extends ViewBoxBaseComponent<FieldViewProps, PresDoc
doc.className = "presItem-slide";
dragItem.push(doc);
});
+ const dropEvent = () => runInAction(() => this._dragging = false);
if (activeItem) {
- DragManager.StartDocumentDrag(dragItem.map(ele => ele), dragData, e.clientX, e.clientY);
+ DragManager.StartDocumentDrag(dragItem.map(ele => ele), dragData, e.clientX, e.clientY, undefined, dropEvent);
runInAction(() => this._dragging = true);
return true;
}
@@ -242,13 +245,22 @@ export class PresElementBox extends ViewBoxBaseComponent<FieldViewProps, PresDoc
PresBox.Instance._dragArray.push(this._dragRef.current!);
}
+ /**
+ * Method called for updating the view of the currently selected document
+ *
+ * @param targetDoc
+ * @param activeItem
+ */
@undoBatch
@action
- pinWithView = (targetDoc: Doc, activeItem: Doc) => {
+ updateView = (targetDoc: Doc, activeItem: Doc) => {
console.log(targetDoc.type);
if (targetDoc.type === DocumentType.PDF || targetDoc.type === DocumentType.WEB || targetDoc.type === DocumentType.RTF) {
const scroll = targetDoc._scrollTop;
activeItem.presPinViewScroll = scroll;
+ } else if (targetDoc.type === DocumentType.COMPARISON) {
+ const clipWidth = targetDoc._clipWidth;
+ activeItem.presPinClipWidth = clipWidth;
} else {
const x = targetDoc._panX;
const y = targetDoc._panY;
@@ -316,7 +328,7 @@ export class PresElementBox extends ViewBoxBaseComponent<FieldViewProps, PresDoc
<div className={"presItem-slideButtons"}>
<Tooltip title={<><div className="dash-tooltip">{"Update view"}</div></>}>
<div className="slideButton"
- onClick={() => this.pinWithView(targetDoc, activeItem)}
+ onClick={() => this.updateView(targetDoc, activeItem)}
style={{ fontWeight: 700, display: activeItem.presPinView ? "flex" : "none" }}>V</div>
</Tooltip>
<Tooltip title={<><div className="dash-tooltip">{this.rootDoc.presExpandInlineButton ? "Minimize" : "Expand"}</div></>}><div className={"slideButton"} onClick={e => { e.stopPropagation(); this.presExpandDocumentClick(); }}>
generated by cgit v1.2.3-70-g09d2 (git 2.46.0) at 2025-10-06 15:34:34 +0000