aboutsummaryrefslogtreecommitdiff
path: root/src
diff options
context:
space:
mode:
Diffstat (limited to 'src')
-rw-r--r--src/client/util/SettingsManager.scss6
-rw-r--r--src/client/views/DocumentDecorations.tsx2
-rw-r--r--src/client/views/MainView.tsx1
-rw-r--r--src/client/views/OverlayView.scss2
-rw-r--r--src/client/views/OverlayView.tsx2
-rw-r--r--src/client/views/PropertiesButtons.tsx6
-rw-r--r--src/client/views/collections/CollectionDockingView.scss76
-rw-r--r--src/client/views/collections/CollectionDockingView.tsx81
-rw-r--r--src/client/views/nodes/AudioBox.tsx1
-rw-r--r--src/client/views/nodes/DocumentView.tsx4
-rw-r--r--src/client/views/nodes/ImageBox.tsx4
-rw-r--r--src/client/views/nodes/PresBox.scss96
-rw-r--r--src/client/views/nodes/PresBox.tsx176
13 files changed, 242 insertions, 215 deletions
diff --git a/src/client/util/SettingsManager.scss b/src/client/util/SettingsManager.scss
index 560786400..ec513e5d5 100644
--- a/src/client/util/SettingsManager.scss
+++ b/src/client/util/SettingsManager.scss
@@ -97,6 +97,8 @@
.modes-content {
display: flex;
+ margin-left: 10px;
+ font-size: 12;
.modes-select {
// width: 170px;
@@ -112,6 +114,8 @@
.modes-playground,
.default-acl {
display: flex;
+ margin-left: 10px;
+ font-size: 12;
.playground-check,
.acl-check {
@@ -125,10 +129,12 @@
.playground-text {
color: black;
margin-right: 10px;
+ margin-top: 2;
}
.acl-text {
color: black;
+ margin-top: 2;
}
}
diff --git a/src/client/views/DocumentDecorations.tsx b/src/client/views/DocumentDecorations.tsx
index fdf802c6a..c5e3e6752 100644
--- a/src/client/views/DocumentDecorations.tsx
+++ b/src/client/views/DocumentDecorations.tsx
@@ -616,7 +616,7 @@ export class DocumentDecorations extends React.Component<{}, { value: string }>
<div className="documentDecorations-contextMenu" onPointerDown={this.onSettingsDown}>
<FontAwesomeIcon size="lg" icon="cog" />
</div></Tooltip>) : canDelete ? (
- <Tooltip title={<><div className="dash-tooltip">Delete</div></>} placement="top">
+ <Tooltip title={<><div className="dash-tooltip">Close</div></>} placement="top">
<div className="documentDecorations-closeButton" onClick={this.onCloseClick}>
{/* Currently, this is set to be enabled if there is no ink selected. It might be interesting to think about minimizing ink if it's useful? -syip2*/}
<FontAwesomeIcon className="documentdecorations-times" icon={faTimes} size="lg" />
diff --git a/src/client/views/MainView.tsx b/src/client/views/MainView.tsx
index 6ab335b85..d0f543d16 100644
--- a/src/client/views/MainView.tsx
+++ b/src/client/views/MainView.tsx
@@ -899,6 +899,7 @@ export class MainView extends React.Component {
const sidebarDocView = DocumentManager.Instance.getDocumentView(sidebar);
const input = document.createElement("input");
input.type = "file";
+ input.multiple = true;
input.accept = ".zip, application/pdf, video/*, image/*, audio/*";
input.onchange = async _e => {
const upload = Utils.prepend("/uploadDoc");
diff --git a/src/client/views/OverlayView.scss b/src/client/views/OverlayView.scss
index 09a349012..555f4298d 100644
--- a/src/client/views/OverlayView.scss
+++ b/src/client/views/OverlayView.scss
@@ -44,6 +44,6 @@
}
.overlayView-doc {
- z-index: 1;
+ z-index: 9002; //so that it appears above chroma
position: absolute;
} \ No newline at end of file
diff --git a/src/client/views/OverlayView.tsx b/src/client/views/OverlayView.tsx
index 5c3a8185c..49580cde4 100644
--- a/src/client/views/OverlayView.tsx
+++ b/src/client/views/OverlayView.tsx
@@ -182,7 +182,7 @@ export class OverlayView extends React.Component {
offsetx = NumCast(d.x) - e.clientX;
offsety = NumCast(d.y) - e.clientY;
};
- return <div className="overlayView-doc" ref={dref} key={d[Id]} onPointerDown={onPointerDown} style={{ width: NumCast(d._width), height: NumCast(d._height), transform: `translate(${d.x}px, ${d.y}px)` }}>
+ return <div className="overlayView-doc" ref={dref} key={d[Id]} onPointerDown={onPointerDown} style={{ top: d.type === 'presentation' ? 0 : undefined, width: NumCast(d._width), height: NumCast(d._height), transform: `translate(${d.x}px, ${d.y}px)` }}>
<DocumentView
Document={d}
LibraryPath={emptyPath}
diff --git a/src/client/views/PropertiesButtons.tsx b/src/client/views/PropertiesButtons.tsx
index 54effe559..35d4f7f6e 100644
--- a/src/client/views/PropertiesButtons.tsx
+++ b/src/client/views/PropertiesButtons.tsx
@@ -416,14 +416,14 @@ export class PropertiesButtons extends React.Component<{}, {}> {
get deleteButton() {
const targetDoc = this.selectedDoc;
return !targetDoc ? (null) : <Tooltip
- title={<><div className="dash-tooltip">{"Delete Document"}</div></>} placement="top">
+ title={<><div className="dash-tooltip">Close Document</div></>} placement="top">
<div>
<div className={"propertiesButtons-linkButton-empty"}
onPointerDown={this.deleteDocument}>
{<FontAwesomeIcon className="propertiesButtons-icon"
- icon="trash-alt" size="lg" />}
+ icon="times" size="lg" />}
</div>
- <div className="propertiesButtons-title"> delete </div>
+ <div className="propertiesButtons-title"> close </div>
</div>
</Tooltip>;
}
diff --git a/src/client/views/collections/CollectionDockingView.scss b/src/client/views/collections/CollectionDockingView.scss
index 4204ef5bb..6ebd5103b 100644
--- a/src/client/views/collections/CollectionDockingView.scss
+++ b/src/client/views/collections/CollectionDockingView.scss
@@ -20,82 +20,6 @@
}
}
-.miniPres:hover {
- opacity: 1;
-}
-
-.miniPres {
- position: absolute;
- overflow: hidden;
- right: 10;
- top: 10;
- opacity: 0.1;
- transition: all 0.4s;
- /* border: solid 1px; */
- color: white;
- /* box-shadow: black 0.4vw 0.4vw 0.8vw; */
-
- .miniPresOverlay {
- display: grid;
- grid-template-columns: auto auto auto auto auto auto auto auto;
- grid-template-rows: 100%;
- height: 100%;
- justify-items: center;
- align-items: center;
-
- .miniPres-button-text {
- display: flex;
- height: 20;
- font-weight: 400;
- min-width: 100%;
- border-radius: 5px;
- align-items: center;
- justify-content: center;
- transition: all 0.3s;
- }
-
- .miniPres-button-frame {
- justify-self: center;
- align-self: center;
- align-items: center;
- display: grid;
- grid-template-columns: auto auto auto;
- justify-content: space-around;
- font-size: 11;
- margin-left: 7;
- width: 30;
- height: 85%;
- background-color: rgba(91, 157, 221, 0.4);
- border-radius: 5px;
- }
-
- .miniPres-divider {
- width: 0.5px;
- height: 80%;
- border-right: solid 2px #5a5a5a;
- }
-
- .miniPres-button {
- display: flex;
- height: 20;
- min-width: 20;
- border-radius: 100%;
- align-items: center;
- justify-content: center;
- transition: all 0.3s;
- }
-
- .miniPres-button:hover {
- background-color: #5a5a5a;
- }
-
- .miniPres-button-text:hover {
- background-color: #5a5a5a;
- }
- }
-}
-
-
.lm_title {
margin-top: 3px;
border-radius: 5px;
diff --git a/src/client/views/collections/CollectionDockingView.tsx b/src/client/views/collections/CollectionDockingView.tsx
index 998e41bd2..43da0d3cf 100644
--- a/src/client/views/collections/CollectionDockingView.tsx
+++ b/src/client/views/collections/CollectionDockingView.tsx
@@ -191,31 +191,6 @@ export class CollectionDockingView extends React.Component<SubCollectionViewProp
return retVal;
}
- @undoBatch
- @action
- public static ReplaceTab(document: Doc, stack: any): Opt<Doc> {
- if (!CollectionDockingView.Instance) return undefined;
- const instance = CollectionDockingView.Instance;
- const replaceTab = (doc: Doc, child: any): Opt<Doc> => {
- for (const contentItem of child.contentItems) {
- const { config, isStack, isRow, isColumn } = contentItem;
- if (isRow || isColumn || isStack) {
- const val = replaceTab(doc, contentItem);
- if (val) return val;
- } else if (config.component === "DocumentFrameRenderer" &&
- config.props.documentId === doc[Id]) {
- const alias = Doc.MakeAlias(doc);
- config.props.documentId = alias[Id];
- config.title = alias.title;
- instance.stateChanged();
- return alias;
- }
- }
- return undefined;
- };
- return replaceTab(document, instance._goldenLayout.root);
- }
-
//
// Creates a vertical split on the right side of the docking view, and then adds the Document to the right of that split
//
@@ -358,6 +333,32 @@ export class CollectionDockingView extends React.Component<SubCollectionViewProp
return true;
}
+ @undoBatch
+ @action
+ public ReplaceTab = (stack: any, document: Doc, libraryPath?: Doc[]) => {
+ Doc.GetProto(document).lastOpened = new DateField;
+ const docContentConfig = CollectionDockingView.makeDocumentConfig(document, undefined, libraryPath);
+ if (stack === undefined) {
+ let stack: any = this._goldenLayout.root;
+ while (!stack.isStack) {
+ if (stack.contentItems.length) {
+ stack = stack.contentItems[0];
+ } else {
+ stack.addChild({ type: 'stack', content: [docContentConfig] });
+ stack = undefined;
+ break;
+ }
+ }
+ if (stack) {
+ stack.addChild(docContentConfig);
+ }
+ } else {
+ stack.addChild(docContentConfig, undefined);
+ }
+ this.layoutChanged();
+ return true;
+ }
+
setupGoldenLayout() {
const config = StrCast(this.props.Document.dockingConfig);
if (config) {
@@ -839,12 +840,8 @@ export class DockedFrameRenderer extends React.Component<DockedFrameProps> {
} else if (location === "close") {
return CollectionDockingView.CloseRightSplit(doc);
} else if (location === "replace") {
- const alias = CollectionDockingView.ReplaceTab(doc, this._stack);
- if (alias) {
- runInAction(() => this._document = alias);
- return true;
- }
- return false;
+ CollectionDockingView.UseRightSplit(doc);
+ return true;
} else {// if (location === "inPlace") {
return CollectionDockingView.Instance.AddTab(this._stack, doc, libraryPath);
}
@@ -875,26 +872,7 @@ export class DockedFrameRenderer extends React.Component<DockedFrameProps> {
const currentFrame = Cast(presTargetDoc.currentFrame, "number", null);
return currentFrame;
}
- renderMiniPres() {
- return (
- <div className="miniPres"
- style={{ width: 250, height: 30, background: '#323232' }}
- >
- {<div className="miniPresOverlay">
- <div className="miniPres-button" onClick={PresBox.Instance.back}><FontAwesomeIcon icon={"arrow-left"} /></div>
- <div className="miniPres-button" onClick={() => PresBox.Instance.startAutoPres(PresBox.Instance.itemIndex)}><FontAwesomeIcon icon={PresBox.Instance.layoutDoc.presStatus === "auto" ? "pause" : "play"} /></div>
- <div className="miniPres-button" onClick={PresBox.Instance.next}><FontAwesomeIcon icon={"arrow-right"} /></div>
- <div className="miniPres-divider"></div>
- <div className="miniPres-button-text">
- Slide {PresBox.Instance.itemIndex + 1} / {PresBox.Instance.childDocs.length}
- {PresBox.Instance.playButtonFrames}
- </div>
- <div className="miniPres-divider"></div>
- <div className="miniPres-button-text" onClick={PresBox.Instance.updateMinimize}>EXIT</div>
- </div>}
- </div>
- );
- }
+
renderMiniMap() {
return <div className="miniMap" style={{
width: this.returnMiniSize(), height: this.returnMiniSize(), background: StrCast(this._document!._backgroundColor,
@@ -977,7 +955,6 @@ export class DockedFrameRenderer extends React.Component<DockedFrameProps> {
ContainingCollectionView={undefined}
ContainingCollectionDoc={undefined} />
{document._viewType === CollectionViewType.Freeform && !this._document?.hideMinimap ? this.renderMiniMap() : (null)}
- {document._viewType === CollectionViewType.Freeform && this._document?.miniPres ? this.renderMiniPres() : (null)}
</>;
}
diff --git a/src/client/views/nodes/AudioBox.tsx b/src/client/views/nodes/AudioBox.tsx
index 011b6ff87..900963eb0 100644
--- a/src/client/views/nodes/AudioBox.tsx
+++ b/src/client/views/nodes/AudioBox.tsx
@@ -510,7 +510,6 @@ export class AudioBox extends ViewBoxAnnotatableComponent<FieldViewProps, AudioD
labelScript = () => AudioBox.LabelScript;
render() {
- AudioBox.Instance = this;
const interactive = SnappingManager.GetIsDragging() || this.active() ? "-interactive" : "";
this._first = true; // for indicating the first marker that is rendered
this.path && this._buckets.length !== 100 ? this.peaks : null; // render waveform if audio is done recording
diff --git a/src/client/views/nodes/DocumentView.tsx b/src/client/views/nodes/DocumentView.tsx
index 820ee2752..d92dc0ec2 100644
--- a/src/client/views/nodes/DocumentView.tsx
+++ b/src/client/views/nodes/DocumentView.tsx
@@ -763,7 +763,7 @@ export class DocumentView extends DocComponent<DocumentViewProps, Document>(Docu
Doc.AreProtosEqual(this.props.Document, Doc.UserDoc()) && moreItems.push({ description: "Toggle Always Show Link End", event: () => Doc.UserDoc()["documentLinksButton-hideEnd"] = !Doc.UserDoc()["documentLinksButton-hideEnd"], icon: "eye" });
}
- moreItems.push({ description: "Close", event: this.deleteClicked, icon: "trash" });
+ moreItems.push({ description: "Close", event: this.deleteClicked, icon: "times" });
!more && cm.addItem({ description: "More...", subitems: moreItems, icon: "hand-point-right" });
cm.moveAfter(cm.findByDescription("More...")!, cm.findByDescription("OnClick...")!);
@@ -815,7 +815,7 @@ export class DocumentView extends DocComponent<DocumentViewProps, Document>(Docu
@computed get contents() {
const pos = this.props.relative ? "relative " : "absolute";
TraceMobx();
- return (<div style={{ width: "100%", height: "100%" }}>
+ return (<div className="documentView-contentsView" style={{ borderRadius: "inherit", width: "100%", height: "100%" }}>
<DocumentContentsView key={1}
docFilters={this.props.docFilters}
ContainingCollectionView={this.props.ContainingCollectionView}
diff --git a/src/client/views/nodes/ImageBox.tsx b/src/client/views/nodes/ImageBox.tsx
index d668d332b..216c5f39e 100644
--- a/src/client/views/nodes/ImageBox.tsx
+++ b/src/client/views/nodes/ImageBox.tsx
@@ -158,7 +158,7 @@ export class ImageBox extends ViewBoxAnnotatableComponent<FieldViewProps, ImageD
if (field) {
const funcs: ContextMenuProps[] = [];
funcs.push({ description: "Rotate Clockwise 90", event: this.rotate, icon: "expand-arrows-alt" });
- funcs.push({ description: "Make Background", event: () => this.layoutDoc.isBackground = true, icon: "expand-arrows-alt" });
+ funcs.push({ description: "Make Background", event: () => { this.layoutDoc.isBackground = true; this.props.bringToFront?.(this.rootDoc); }, icon: "expand-arrows-alt" });
if (!Doc.UserDoc().noviceMode) {
funcs.push({ description: "Export to Google Photos", event: () => GooglePhotos.Transactions.UploadImages([this.props.Document]), icon: "caret-square-right" });
funcs.push({ description: "Copy path", event: () => Utils.CopyText(field.url.href), icon: "expand-arrows-alt" });
@@ -466,7 +466,7 @@ export class ImageBox extends ViewBoxAnnotatableComponent<FieldViewProps, ImageD
width: this.props.PanelWidth() ? undefined : `${100 / this.props.ContentScaling()}%`,
height: this.props.PanelWidth() ? undefined : `${100 / this.props.ContentScaling()}%`,
pointerEvents: this.layoutDoc.isBackground ? "none" : undefined,
- borderRadius: `${Number(StrCast(this.layoutDoc.borderRoundisng).replace("px", "")) / this.props.ContentScaling()}px`
+ borderRadius: `${Number(StrCast(this.layoutDoc.borderRounding).replace("px", "")) / this.props.ContentScaling()}px`
}} >
<CollectionFreeFormView {...this.props}
forceScaling={true}
diff --git a/src/client/views/nodes/PresBox.scss b/src/client/views/nodes/PresBox.scss
index 54accb012..c4d8f1a4f 100644
--- a/src/client/views/nodes/PresBox.scss
+++ b/src/client/views/nodes/PresBox.scss
@@ -13,7 +13,7 @@ $light-background: #ececec;
width: 100%;
min-width: 20px;
height: 100%;
- min-height: 41px;
+ min-height: 35px;
letter-spacing: 2px;
overflow: hidden;
transition: 0.7s opacity ease;
@@ -801,7 +801,7 @@ $light-background: #ececec;
}
- .miniPresOverlay {
+ .presPanelOverlay {
background-color: #323232;
color: white;
border-radius: 5px;
@@ -816,7 +816,7 @@ $light-background: #ececec;
right: 10px;
transition: all 0.2s;
- .miniPres-button-text {
+ .presPanel-button-text {
display: flex;
height: 20;
width: max-content;
@@ -833,13 +833,13 @@ $light-background: #ececec;
transition: all 0.3s;
}
- .miniPres-divider {
+ .presPanel-divider {
width: 0.5px;
height: 80%;
border-right: solid 1px #5a5a5a;
}
- .miniPres-button-frame {
+ .presPanel-button-frame {
justify-self: center;
align-self: center;
align-items: center;
@@ -854,7 +854,7 @@ $light-background: #ececec;
border-radius: 5px;
}
- .miniPres-button {
+ .presPanel-button {
cursor: pointer;
display: flex;
height: 20;
@@ -867,11 +867,11 @@ $light-background: #ececec;
transition: all 0.3s;
}
- .miniPres-button:hover {
+ .presPanel-button:hover {
background-color: #5a5a5a;
}
- .miniPres-button-text:hover {
+ .presPanel-button-text:hover {
background-color: #5a5a5a;
}
}
@@ -950,4 +950,82 @@ $light-background: #ececec;
.select {
font-size: 100%;
}
-} \ No newline at end of file
+}
+
+.miniPres:hover {
+ opacity: 1;
+}
+
+.miniPres {
+ cursor: grab;
+ position: absolute;
+ overflow: hidden;
+ right: 10;
+ top: 10;
+ opacity: 0.1;
+ transition: all 0.4s;
+ /* border: solid 1px; */
+ color: white;
+ /* box-shadow: black 0.4vw 0.4vw 0.8vw; */
+
+ .miniPresOverlay {
+ display: grid;
+ grid-template-columns: auto auto auto auto auto auto auto auto;
+ grid-template-rows: 100%;
+ height: 100%;
+ justify-items: center;
+ align-items: center;
+
+ .miniPres-button-text {
+ cursor: pointer;
+ display: flex;
+ height: 20;
+ font-weight: 400;
+ min-width: 100%;
+ border-radius: 5px;
+ align-items: center;
+ justify-content: center;
+ transition: all 0.3s;
+ }
+
+ .miniPres-button-frame {
+ justify-self: center;
+ align-self: center;
+ align-items: center;
+ display: grid;
+ grid-template-columns: auto auto auto;
+ justify-content: space-around;
+ font-size: 11;
+ margin-left: 7;
+ width: 30;
+ height: 85%;
+ background-color: rgba(91, 157, 221, 0.4);
+ border-radius: 5px;
+ }
+
+ .miniPres-divider {
+ width: 0.5px;
+ height: 80%;
+ border-right: solid 2px #5a5a5a;
+ }
+
+ .miniPres-button {
+ cursor: pointer;
+ display: flex;
+ height: 20;
+ min-width: 20;
+ border-radius: 100%;
+ align-items: center;
+ justify-content: center;
+ transition: all 0.3s;
+ }
+
+ .miniPres-button:hover {
+ background-color: #5a5a5a;
+ }
+
+ .miniPres-button-text:hover {
+ background-color: #5a5a5a;
+ }
+ }
+}
diff --git a/src/client/views/nodes/PresBox.tsx b/src/client/views/nodes/PresBox.tsx
index f6f6a2333..c9303f153 100644
--- a/src/client/views/nodes/PresBox.tsx
+++ b/src/client/views/nodes/PresBox.tsx
@@ -147,9 +147,12 @@ export class PresBox extends ViewBoxBaseComponent<FieldViewProps, PresBoxSchema>
// Case 3: No more frames in current doc and next slide is defined, therefore move to next slide
} else if (this.childDocs[this.itemIndex + 1] !== undefined) {
const nextSelected = this.itemIndex + 1;
+ if (presTargetDoc.type === DocumentType.AUDIO) AudioBox.Instance.pause();
this.gotoDocument(nextSelected, this.itemIndex);
const targetNext = Cast(activeNext.presentationTargetDoc, Doc, null);
if (activeNext && targetNext.type === DocumentType.AUDIO && activeNext.playAuto) {
+ AudioBox.Instance.playFrom(0);
+ this._moveOnFromAudio = true;
} else this._moveOnFromAudio = false;
}
}
@@ -228,21 +231,25 @@ export class PresBox extends ViewBoxBaseComponent<FieldViewProps, PresBoxSchema>
const docToJump = curDoc;
const willZoom = false;
- //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') {
- this.zoomProgressivizeNext(targetDoc);
- } else if (docToJump === curDoc) {
- //checking if curDoc has navigation open
- if (curDoc.presNavButton && targetDoc) {
- await DocumentManager.Instance.jumpToDocument(targetDoc, false, undefined, srcContext);
- } else if (curDoc.presZoomButton && targetDoc) {
+ // If openDocument is selected then it should open the document for the user
+ if (activeItem.openDocument) {
+ this.props.addDocTab(activeItem, "replace");
+ } 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') {
+ this.zoomProgressivizeNext(targetDoc);
+ } else if (docToJump === curDoc) {
+ //checking if curDoc has navigation open
+ if (curDoc.presNavButton && targetDoc) {
+ await DocumentManager.Instance.jumpToDocument(targetDoc, false, undefined, srcContext);
+ } else if (curDoc.presZoomButton && targetDoc) {
+ //awaiting jump so that new scale can be found, since jumping is async
+ await DocumentManager.Instance.jumpToDocument(targetDoc, true, undefined, srcContext);
+ }
+ } else {
//awaiting jump so that new scale can be found, since jumping is async
- await DocumentManager.Instance.jumpToDocument(targetDoc, true, undefined, srcContext);
+ targetDoc && await DocumentManager.Instance.jumpToDocument(targetDoc, willZoom, undefined, srcContext);
}
- } else {
- //awaiting jump so that new scale can be found, since jumping is async
- targetDoc && await DocumentManager.Instance.jumpToDocument(targetDoc, willZoom, undefined, srcContext);
- }
// After navigating to the document, if it is added as a presPinView then it will
// adjust the pan and scale to that of the pinView when it was added.
// TODO: Add option to remove presPinView
@@ -251,10 +258,6 @@ export class PresBox extends ViewBoxBaseComponent<FieldViewProps, PresBoxSchema>
targetDoc._panY = activeItem.presPinViewY;
targetDoc._viewScale = activeItem.presPinViewScale;
}
- // If openDocument is selected then it should open the document for the user
- if (collectionDocView && activeItem.openDocument) {
- collectionDocView.props.addDocTab(activeItem, "inPlace");
- }
// If website and has presWebsite data associated then on click it should
// go back to that specific website
// TODO: Add progressivize for navigating web (storing websites for given frames)
@@ -353,9 +356,8 @@ export class PresBox extends ViewBoxBaseComponent<FieldViewProps, PresBoxSchema>
for (var i = startSlide; i < this.childDocs.length; i++) {
activeItem = Cast(this.childDocs[this.itemIndex], Doc, null);
targetDoc = Cast(activeItem.presentationTargetDoc, Doc, null);
- if (targetDoc.presDuration && targetDoc.presTransition) {
- duration = NumCast(targetDoc.presDuration) + NumCast(targetDoc.presTransition);
- } else duration = 2500;
+ duration = NumCast(targetDoc.presDuration) + NumCast(targetDoc.presTransition);
+ if (duration <= 100) { duration = 2500; }
if (NumCast(targetDoc.lastFrame) > 0) {
for (var f = 0; f < NumCast(targetDoc.lastFrame); f++) {
await timer(duration / NumCast(targetDoc.lastFrame));
@@ -415,18 +417,36 @@ export class PresBox extends ViewBoxBaseComponent<FieldViewProps, PresBoxSchema>
* The method called to open the presentation as a minimized view
* TODO: Look at old updateMinimize and compare...
*/
- updateMinimize = () => {
- const srcContext = Cast(this.rootDoc.presCollection, Doc, null);
- this.turnOffEdit();
- if (srcContext) {
- if (srcContext.miniPres) {
- srcContext.miniPres = false;
- CollectionDockingView.AddRightSplit(this.rootDoc);
- } else {
- srcContext.miniPres = true;
- this.props.addDocTab?.(this.rootDoc, "close");
- }
+ @undoBatch
+ @action
+ updateMinimize = (e: React.MouseEvent) => {
+ if (this.layoutDoc.inOverlay) {
+ this.layoutDoc.presStatus = 'edit';
+ Doc.RemoveDocFromList((Doc.UserDoc().myOverlayDocuments as Doc), undefined, this.rootDoc);
+ CollectionDockingView.AddRightSplit(this.rootDoc);
+ this.layoutDoc.inOverlay = false;
+ } else {
+ this.layoutDoc.presStatus = 'manual';
+ console.log('test');
+ const pt = this.props.ScreenToLocalTransform().inverse().transformPoint(0, 0);
+ this.rootDoc.x = pt[0] + (this.props.PanelWidth() - 250);
+ this.rootDoc.y = pt[1] + 10;
+ this.rootDoc._height = 35;
+ this.rootDoc._width = 250;
+ this.props.addDocTab?.(this.rootDoc, "close");
+ Doc.AddDocToList((Doc.UserDoc().myOverlayDocuments as Doc), undefined, this.rootDoc);
}
+ // const srcContext = Cast(this.rootDoc.presCollection, Doc, null);
+ // this.turnOffEdit();
+ // if (srcContext) {
+ // if (srcContext.miniPres) {
+ // srcContext.miniPres = false;
+ // CollectionDockingView.AddRightSplit(this.rootDoc);
+ // } else {
+ // srcContext.miniPres = true;
+ // this.props.addDocTab?.(this.rootDoc, "close");
+ // }
+ // }
}
/**
@@ -465,6 +485,7 @@ export class PresBox extends ViewBoxBaseComponent<FieldViewProps, PresBoxSchema>
break;
case 'jump': //Jump Cut
targetDoc.presTransition = 0;
+ activeItem.presZoomButton = true;
activeItem.presSwitchButton = !activeItem.presSwitchButton;
if (activeItem.presSwitchButton) activeItem.presMovement = 'Jump cut';
else activeItem.presMovement = 'None';
@@ -574,8 +595,10 @@ export class PresBox extends ViewBoxBaseComponent<FieldViewProps, PresBoxSchema>
const anchorNode = document.activeElement as HTMLDivElement;
if (anchorNode && anchorNode.className?.includes("lm_title")) return;
if (e.keyCode === 27) { // Escape key
- if (this.layoutDoc.presStatus === "edit") { this._selectedArray = []; this._eleArray = []; this._dragArray = []; }
- else this.layoutDoc.presStatus = "edit"; if (this._presTimer) clearTimeout(this._presTimer);
+ if (this.layoutDoc.inOverlay) this.updateMinimize;
+ else if (this.layoutDoc.presStatus === "edit") { this._selectedArray = []; this._eleArray = []; this._dragArray = []; }
+ else this.layoutDoc.presStatus = "edit";
+ if (this._presTimer) clearTimeout(this._presTimer);
handled = true;
} if ((e.metaKey || e.altKey) && e.keyCode === 65) { // Ctrl-A to select all
if (this.layoutDoc.presStatus === "edit") {
@@ -862,6 +885,8 @@ export class PresBox extends ViewBoxBaseComponent<FieldViewProps, PresBoxSchema>
return effect;
}
+ @undoBatch
+ @action
applyTo = (array: Doc[]) => {
const activeItem = Cast(this.childDocs[this.itemIndex], Doc, null);
const targetDoc = Cast(activeItem?.presentationTargetDoc, Doc, null);
@@ -1096,7 +1121,7 @@ export class PresBox extends ViewBoxBaseComponent<FieldViewProps, PresBoxSchema>
@computed get presentDropdown() {
return (
<div className={`dropdown-play ${this.presentTools ? "active" : ""}`} onClick={e => e.stopPropagation()} onPointerUp={e => e.stopPropagation()} onPointerDown={e => e.stopPropagation()}>
- <div className="dropdown-play-button" onClick={() => this.updateMinimize()}>
+ <div className="dropdown-play-button" onClick={this.updateMinimize}>
Minimize
</div>
<div className="dropdown-play-button" onClick={(action(() => { this.layoutDoc.presStatus = "manual"; this.turnOffEdit(); }))}>
@@ -1287,9 +1312,10 @@ export class PresBox extends ViewBoxBaseComponent<FieldViewProps, PresBoxSchema>
doc.editZoomProgressivize = false;
doc.editScrollProgressivize = false;
const targetDoc = Cast(doc.presentationTargetDoc, Doc, null);
- targetDoc.editSnapZoomProgressivize = false;
- targetDoc.editZoomProgressivize = false;
- targetDoc.editScrollProgressivize = false;
+ if (targetDoc) {
+ targetDoc.editZoomProgressivize = false;
+ targetDoc.editScrollProgressivize = false;
+ }
});
}
@@ -1607,18 +1633,18 @@ export class PresBox extends ViewBoxBaseComponent<FieldViewProps, PresBoxSchema>
@computed get playButtons() {
// Case 1: There are still other frames and should go through all frames before going to next slide
- return (<div className="miniPresOverlay" style={{ display: this.layoutDoc.presStatus !== "edit" ? "inline-flex" : "none" }}>
- <div className="miniPres-button" onClick={this.back}><FontAwesomeIcon icon={"arrow-left"} /></div>
- <div className="miniPres-button" onClick={() => this.startAutoPres(this.itemIndex)}><FontAwesomeIcon icon={this.layoutDoc.presStatus === "auto" ? "pause" : "play"} /></div>
- <div className="miniPres-button" onClick={this.next}><FontAwesomeIcon icon={"arrow-right"} /></div>
- <div className="miniPres-divider"></div>
- <div className="miniPres-button-text" style={{ display: this.props.PanelWidth() > 250 ? "inline-flex" : "none" }}>
+ return (<div className="presPanelOverlay" style={{ display: this.layoutDoc.presStatus !== "edit" ? "inline-flex" : "none" }}>
+ <div className="presPanel-button" onClick={this.back}><FontAwesomeIcon icon={"arrow-left"} /></div>
+ <div className="presPanel-button" onClick={() => this.startAutoPres(this.itemIndex)}><FontAwesomeIcon icon={this.layoutDoc.presStatus === "auto" ? "pause" : "play"} /></div>
+ <div className="presPanel-button" onClick={this.next}><FontAwesomeIcon icon={"arrow-right"} /></div>
+ <div className="presPanel-divider"></div>
+ <div className="presPanel-button-text" style={{ display: this.props.PanelWidth() > 250 ? "inline-flex" : "none" }}>
Slide {this.itemIndex + 1} / {this.childDocs.length}
{this.playButtonFrames}
</div>
- <div className="miniPres-divider"></div>
- {this.props.PanelWidth() > 250 ? <div className="miniPres-button-text" onClick={() => this.layoutDoc.presStatus = "edit"}>EXIT</div>
- : <div className="miniPres-button" onClick={() => this.layoutDoc.presStatus = "edit"}>
+ <div className="presPanel-divider"></div>
+ {this.props.PanelWidth() > 250 ? <div className="presPanel-button-text" onClick={() => this.layoutDoc.presStatus = "edit"}>EXIT</div>
+ : <div className="presPanel-button" onClick={() => this.layoutDoc.presStatus = "edit"}>
<FontAwesomeIcon icon={"times"} />
</div>}
</div>);
@@ -1630,28 +1656,44 @@ export class PresBox extends ViewBoxBaseComponent<FieldViewProps, PresBoxSchema>
// needed to ensure that the childDocs are loaded for looking up fields
this.childDocs.slice();
const mode = StrCast(this.rootDoc._viewType) as CollectionViewType;
- return <div className="presBox-cont" style={{ minWidth: this.layoutDoc.inOverlay ? 240 : undefined }} >
- {this.topPanel}
- {this.toolbar}
- {this.newDocumentToolbarDropdown}
- <div className="presBox-listCont">
- {mode !== CollectionViewType.Invalid ?
- <CollectionView {...this.props}
- ContainingCollectionDoc={this.props.Document}
- PanelWidth={this.props.PanelWidth}
- PanelHeight={this.panelHeight}
- moveDocument={returnFalse}
- childOpacity={returnOne}
- childLayoutTemplate={this.childLayoutTemplate}
- filterAddDocument={this.addDocumentFilter}
- removeDocument={returnFalse}
- dontRegisterView={true}
- focus={this.selectElement}
- ScreenToLocalTransform={this.getTransform} />
- : (null)
- }
+ return this.layoutDoc.inOverlay ?
+ <div className="miniPres" style={{ width: 250, height: 35, background: '#323232', top: 0, zIndex: 3000000 }}>
+ {<div className="miniPresOverlay">
+ <div className="miniPres-button" onClick={this.back}><FontAwesomeIcon icon={"arrow-left"} /></div>
+ <div className="miniPres-button" onClick={() => this.startAutoPres(this.itemIndex)}><FontAwesomeIcon icon={this.layoutDoc.presStatus === "auto" ? "pause" : "play"} /></div>
+ <div className="miniPres-button" onClick={this.next}><FontAwesomeIcon icon={"arrow-right"} /></div>
+ <div className="miniPres-divider"></div>
+ <div className="miniPres-button-text">
+ Slide {this.itemIndex + 1} / {this.childDocs.length}
+ {this.playButtonFrames}
+ </div>
+ <div className="miniPres-divider"></div>
+ <div className="miniPres-button-text" onClick={this.updateMinimize}>EXIT</div>
+ </div>}
</div>
- </div>;
+ :
+ <div className="presBox-cont" style={{ minWidth: this.layoutDoc.inOverlay ? 240 : undefined }} >
+ {this.topPanel}
+ {this.toolbar}
+ {this.newDocumentToolbarDropdown}
+ <div className="presBox-listCont">
+ {mode !== CollectionViewType.Invalid ?
+ <CollectionView {...this.props}
+ ContainingCollectionDoc={this.props.Document}
+ PanelWidth={this.props.PanelWidth}
+ PanelHeight={this.panelHeight}
+ moveDocument={returnFalse}
+ childOpacity={returnOne}
+ childLayoutTemplate={this.childLayoutTemplate}
+ filterAddDocument={this.addDocumentFilter}
+ removeDocument={returnFalse}
+ dontRegisterView={true}
+ focus={this.selectElement}
+ ScreenToLocalTransform={this.getTransform} />
+ : (null)
+ }
+ </div>
+ </div>;
}
}
Scripting.addGlobal(function lookupPresBoxField(container: Doc, field: string, data: Doc) {