aboutsummaryrefslogtreecommitdiff
diff options
context:
space:
mode:
-rw-r--r--src/client/views/Main.scss21
-rw-r--r--src/client/views/MainView.tsx57
-rw-r--r--src/client/views/MainViewNotifs.scss18
-rw-r--r--src/client/views/MainViewNotifs.tsx32
-rw-r--r--src/client/views/collections/CollectionTreeView.tsx26
-rw-r--r--src/server/authentication/models/current_user_utils.ts1
6 files changed, 79 insertions, 76 deletions
diff --git a/src/client/views/Main.scss b/src/client/views/Main.scss
index 705da7b35..debb941c8 100644
--- a/src/client/views/Main.scss
+++ b/src/client/views/Main.scss
@@ -93,21 +93,6 @@ button:hover {
right: 0px;
}
-.main-notifs-badge {
- position: absolute;
- top: -10px;
- right: -10px;
- color: white;
- background: #f44b42;
- font-weight: 300;
- border-radius: 100%;
- width: 25px;
- height: 25px;
- text-align: center;
- padding-top: 4px;
- font-size: 12px;
-}
-
//toolbar stuff
#toolbar {
position: absolute;
@@ -237,6 +222,12 @@ ul#add-options-list {
padding: 0;
}
}
+.mainView-logout {
+ position: absolute;
+ right: 0;
+ bottom: 0;
+ font-size: 8px;
+}
.mainView-libraryFlyout {
height: 100%;
diff --git a/src/client/views/MainView.tsx b/src/client/views/MainView.tsx
index 1fa231659..e8ffa5987 100644
--- a/src/client/views/MainView.tsx
+++ b/src/client/views/MainView.tsx
@@ -16,7 +16,7 @@ import { ScriptField } from '../../new_fields/ScriptField';
import { BoolCast, Cast, FieldValue, PromiseValue, StrCast, NumCast } from '../../new_fields/Types';
import { CurrentUserUtils } from '../../server/authentication/models/current_user_utils';
import { RouteStore } from '../../server/RouteStore';
-import { emptyFunction, returnEmptyString, returnOne, returnTrue, Utils } from '../../Utils';
+import { emptyFunction, returnEmptyString, returnOne, returnTrue, Utils, returnFalse } from '../../Utils';
import GoogleAuthenticationManager from '../apis/GoogleAuthenticationManager';
import { DocServer } from '../DocServer';
import { Docs, DocumentOptions } from '../documents/Documents';
@@ -40,6 +40,7 @@ import { OverlayView } from './OverlayView';
import PDFMenu from './pdf/PDFMenu';
import { PreviewCursor } from './PreviewCursor';
import { CollectionFreeFormDocumentView } from './nodes/CollectionFreeFormDocumentView';
+import { MainViewNotifs } from './MainViewNotifs';
@observer
export class MainView extends React.Component {
@@ -47,6 +48,7 @@ export class MainView extends React.Component {
@observable addMenuToggle = React.createRef<HTMLInputElement>();
@observable public pwidth: number = 0;
@observable public pheight: number = 0;
+ private _buttonBarHeight = 85;
private dropDisposer?: DragManager.DragDropDisposer;
@observable private dictationState = DictationManager.placeholder;
@@ -138,24 +140,6 @@ export class MainView extends React.Component {
firstScriptTag.parentNode!.insertBefore(tag, firstScriptTag);
window.removeEventListener("keydown", KeyManager.Instance.handle);
window.addEventListener("keydown", KeyManager.Instance.handle);
-
- if (this.userDoc) {
- reaction(() => {
- let workspaces = this.userDoc.workspaces;
- let recent = this.userDoc.recentlyClosed;
- if (!(recent instanceof Doc)) return 0;
- if (!(workspaces instanceof Doc)) return 0;
- let workspacesDoc = workspaces;
- let recentDoc = recent;
- let libraryHeight = this.getPHeight() - workspacesDoc[HeightSym]() - recentDoc[HeightSym]() - 20 + this.userDoc[HeightSym]() * 0.00001;
- return libraryHeight;
- }, (libraryHeight: number) => {
- if (libraryHeight && Math.abs(this.userDoc[HeightSym]() - libraryHeight) > 5) {
- this.userDoc.height = libraryHeight;
- }
- (Cast(this.userDoc.recentlyClosed, Doc) as Doc).allowClear = true;
- }, { fireImmediately: true });
- }
}
componentWillUnMount() {
@@ -340,7 +324,7 @@ export class MainView extends React.Component {
if (this.userDoc && (col = await Cast(this.userDoc.optionalRightCollection, Doc))) {
const l = Cast(col.data, listSpec(Doc));
if (l) {
- runInAction(() => CollectionTreeView.NotifsCol = col);
+ runInAction(() => MainViewNotifs.NotifsCol = col);
}
}
}, 100);
@@ -349,7 +333,7 @@ export class MainView extends React.Component {
drop = action((e: Event, de: DragManager.DropEvent) => {
(de.data as DragManager.DocumentDragData).draggedDocuments.map(doc => Doc.AddDocToList(CurrentUserUtils.UserDocument, "docButtons", doc));
- })
+ });
onDrop = (e: React.DragEvent<HTMLDivElement>) => {
e.preventDefault();
@@ -368,6 +352,9 @@ export class MainView extends React.Component {
getPHeight = () => {
return this.pheight;
}
+ getContentsHeight = () => {
+ return this.pheight - this._buttonBarHeight;
+ }
@observable flyoutWidth: number = 250;
@observable flyoutTranslate: boolean = true;
@@ -465,12 +452,12 @@ export class MainView extends React.Component {
if (!(sidebarContent instanceof Doc)) {
return (null);
}
- (Cast(CurrentUserUtils.UserDocument.libraryButtons, Doc) as Doc).columnWidth = this.flyoutWidthFunc() / 3 - 30;
- let buttonBarHeight = 85;
+ let libraryButtonDoc = Cast(CurrentUserUtils.UserDocument.libraryButtons, Doc) as Doc;
+ libraryButtonDoc.columnWidth = this.flyoutWidthFunc() / 3 - 30;
return <div style={{ display: "flex", flexDirection: "column", position: "absolute", width: "100%", height: "100%" }}>
- <div style={{ position: "relative", height: `${buttonBarHeight}px`, width: "100%" }}>
+ <div style={{ position: "relative", height: `${this._buttonBarHeight}px`, width: "100%" }}>
<DocumentView
- Document={Cast(CurrentUserUtils.UserDocument.libraryButtons, Doc) as Doc}
+ Document={libraryButtonDoc}
DataDoc={undefined}
addDocument={undefined}
addDocTab={this.addDocTabFunc}
@@ -494,20 +481,20 @@ export class MainView extends React.Component {
getScale={returnOne}>
</DocumentView>
</div>
- <div style={{ position: "relative", height: `calc(100% - ${buttonBarHeight}px)`, width: "100%", overflow: "auto" }}>
+ <div style={{ position: "relative", height: `calc(100% - ${this._buttonBarHeight}px)`, width: "100%", overflow: "auto" }}>
<DocumentView
Document={sidebarContent}
DataDoc={undefined}
addDocument={undefined}
addDocTab={this.addDocTabFunc}
pinToPres={emptyFunction}
- removeDocument={undefined}
+ removeDocument={returnFalse}
ruleProvider={undefined}
onClick={undefined}
ScreenToLocalTransform={Transform.Identity}
ContentScaling={returnOne}
PanelWidth={this.flyoutWidthFunc}
- PanelHeight={this.getPHeight}
+ PanelHeight={this.getContentsHeight}
renderDepth={0}
focus={emptyFunction}
backgroundColor={returnEmptyString}
@@ -519,16 +506,16 @@ export class MainView extends React.Component {
zoomToScale={emptyFunction}
getScale={returnOne}>
</DocumentView>
+ <button className="mainView-logout" key="logout" onClick={() => window.location.assign(Utils.prepend(RouteStore.logout))}>
+ {CurrentUserUtils.GuestWorkspace ? "Exit" : "Log Out"}
+ </button>
</div></div>;
}
@computed
get mainContent() {
- if (!this.userDoc) {
- return (<div>{this.dockingContent}</div>);
- }
- let sidebar = this.userDoc.sidebarContainer;
- if (!(sidebar instanceof Doc)) {
+ let sidebar = this.userDoc && this.userDoc.sidebarContainer;
+ if (!this.userDoc || !(sidebar instanceof Doc)) {
return (null);
}
return (
@@ -617,6 +604,7 @@ export class MainView extends React.Component {
return < div id="add-nodes-menu" style={{ left: (this.flyoutTranslate ? this.flyoutWidth : 0) + 20, bottom: 20 }} >
+ <MainViewNotifs></MainViewNotifs>
<input type="checkbox" id="add-menu-toggle" ref={this.addMenuToggle} />
<label htmlFor="add-menu-toggle" ref={this.createDropTarget} title="Close Menu"><p>+</p></label>
@@ -632,7 +620,7 @@ export class MainView extends React.Component {
addDocument={undefined}
addDocTab={this.addDocTabFunc}
pinToPres={emptyFunction}
- removeDocument={undefined}
+ removeDocument={(doc: Doc) => Doc.RemoveDocFromList(CurrentUserUtils.UserDocument, "docButtons", doc)}
ruleProvider={undefined}
onClick={undefined}
ScreenToLocalTransform={Transform.Identity}
@@ -662,7 +650,6 @@ export class MainView extends React.Component {
<button key="marker" onClick={() => InkingControl.Instance.switchTool(InkTool.Highlighter)} title="Highlighter" style={this.selected(InkTool.Highlighter)}><FontAwesomeIcon icon="highlighter" size="lg" /></button>
<button key="eraser" onClick={() => InkingControl.Instance.switchTool(InkTool.Eraser)} title="Eraser" style={this.selected(InkTool.Eraser)}><FontAwesomeIcon icon="eraser" size="lg" /></button>
<InkingControl key="inkControls" />
- <button key="logout" onClick={() => window.location.assign(Utils.prepend(RouteStore.logout))}>{CurrentUserUtils.GuestWorkspace ? "Exit" : "Log Out"}</button>
</div>
</div >;
}
diff --git a/src/client/views/MainViewNotifs.scss b/src/client/views/MainViewNotifs.scss
new file mode 100644
index 000000000..25ec95643
--- /dev/null
+++ b/src/client/views/MainViewNotifs.scss
@@ -0,0 +1,18 @@
+.mainNotifs-container {
+ position:absolute;
+
+ .mainNotifs-badge {
+ position: absolute;
+ top: -10px;
+ right: -10px;
+ color: white;
+ background: #f44b42;
+ font-weight: 300;
+ border-radius: 100%;
+ width: 25px;
+ height: 25px;
+ text-align: center;
+ padding-top: 4px;
+ font-size: 12px;
+ }
+} \ No newline at end of file
diff --git a/src/client/views/MainViewNotifs.tsx b/src/client/views/MainViewNotifs.tsx
new file mode 100644
index 000000000..09fa1cb0c
--- /dev/null
+++ b/src/client/views/MainViewNotifs.tsx
@@ -0,0 +1,32 @@
+import { action, computed, observable } from 'mobx';
+import { observer } from 'mobx-react';
+import "normalize.css";
+import * as React from 'react';
+import { Doc, DocListCast, Opt } from '../../new_fields/Doc';
+import { emptyFunction } from '../../Utils';
+import { SetupDrag } from '../util/DragManager';
+import "./MainViewNotifs.scss";
+import { CollectionDockingView } from './collections/CollectionDockingView';
+
+
+@observer
+export class MainViewNotifs extends React.Component {
+
+ @observable static NotifsCol: Opt<Doc>;
+ openNotifsCol = () => {
+ if (MainViewNotifs.NotifsCol) {
+ CollectionDockingView.AddRightSplit(MainViewNotifs.NotifsCol, undefined);
+ }
+ }
+ render() {
+ const length = MainViewNotifs.NotifsCol ? DocListCast(MainViewNotifs.NotifsCol.data).length : 0;
+ const notifsRef = React.createRef<HTMLDivElement>();
+ const dragNotifs = action(() => MainViewNotifs.NotifsCol!);
+ return <div className="mainNotifs-container" ref={notifsRef}>
+ <button className="mainNotifs-badge" style={length > 0 ? { "display": "initial" } : { "display": "none" }}
+ onClick={this.openNotifsCol} onPointerDown={MainViewNotifs.NotifsCol ? SetupDrag(notifsRef, dragNotifs) : emptyFunction}>
+ {length}
+ </button>
+ </div>;
+ }
+}
diff --git a/src/client/views/collections/CollectionTreeView.tsx b/src/client/views/collections/CollectionTreeView.tsx
index a325e86c6..abaa9662c 100644
--- a/src/client/views/collections/CollectionTreeView.tsx
+++ b/src/client/views/collections/CollectionTreeView.tsx
@@ -517,8 +517,6 @@ export class CollectionTreeView extends CollectionSubView(Document) {
private treedropDisposer?: DragManager.DragDropDisposer;
private _mainEle?: HTMLDivElement;
- @observable static NotifsCol: Opt<Doc>;
-
@computed get resolvedDataDoc() { return BoolCast(this.props.Document.isTemplate) && this.props.DataDoc ? this.props.DataDoc : this.props.Document; }
protected createTreeDropTarget = (ele: HTMLDivElement) => {
@@ -557,31 +555,10 @@ export class CollectionTreeView extends CollectionSubView(Document) {
}
outerXf = () => Utils.GetScreenTransform(this._mainEle!);
onTreeDrop = (e: React.DragEvent) => this.onDrop(e, {});
- openNotifsCol = () => {
- if (CollectionTreeView.NotifsCol) {
- this.props.addDocTab(CollectionTreeView.NotifsCol, undefined, "onRight");
- }
- }
- @computed get renderNotifsButton() {
- const length = CollectionTreeView.NotifsCol ? DocListCast(CollectionTreeView.NotifsCol.data).length : 0;
- const notifsRef = React.createRef<HTMLDivElement>();
- const dragNotifs = action(() => CollectionTreeView.NotifsCol!);
- return <div id="toolbar" key="toolbar">
- <div ref={notifsRef}>
- <button className="toolbar-button round-button" title="Notifs"
- onClick={this.openNotifsCol} onPointerDown={CollectionTreeView.NotifsCol ? SetupDrag(notifsRef, dragNotifs) : emptyFunction}>
- <FontAwesomeIcon icon={faBell} size="sm" />
- </button>
- <div className="main-notifs-badge" style={length > 0 ? { "display": "initial" } : { "display": "none" }}>
- {length}
- </div>
- </div>
- </div >;
- }
@computed get renderClearButton() {
return <div id="toolbar" key="toolbar">
- <button className="toolbar-button round-button" title="Notifs"
+ <button className="toolbar-button round-button" title="Empty"
onClick={undoBatch(action(() => Doc.GetProto(this.props.Document)[this.props.fieldKey] = undefined))}>
<FontAwesomeIcon icon={faTrash} size="sm" />
</button>
@@ -614,7 +591,6 @@ export class CollectionTreeView extends CollectionSubView(Document) {
TreeView.loadId = doc[Id];
Doc.AddDocToList(this.props.Document, this.props.fieldKey, doc, this.childDocs.length ? this.childDocs[0] : undefined, true, false, false, false);
})} />
- {this.props.Document.workspaceLibrary ? this.renderNotifsButton : (null)}
{this.props.Document.allowClear ? this.renderClearButton : (null)}
<ul className="no-indent" style={{ width: "max-content" }} >
{
diff --git a/src/server/authentication/models/current_user_utils.ts b/src/server/authentication/models/current_user_utils.ts
index 7408fd92b..874f49f10 100644
--- a/src/server/authentication/models/current_user_utils.ts
+++ b/src/server/authentication/models/current_user_utils.ts
@@ -115,7 +115,6 @@ export class CurrentUserUtils {
library.xMargin = 5;
library.yMargin = 5;
library.boxShadow = "1 1 3";
- library.workspaceLibrary = true; // flag that this is the document that shows the Notifications button when documents are shared
Library.targetContainer = doc.sidebarContainer;
Library.library = library;
Library.onClick = ScriptField.MakeScript("this.targetContainer.proto = this.library");