aboutsummaryrefslogtreecommitdiff
diff options
context:
space:
mode:
Diffstat
-rw-r--r--src/client/documents/Documents.ts3
-rw-r--r--src/client/views/Main.scss15
-rw-r--r--src/client/views/MainView.tsx33
-rw-r--r--src/client/views/collections/CollectionBaseView.tsx1
-rw-r--r--src/client/views/collections/CollectionStackingView.scss44
-rw-r--r--src/client/views/collections/CollectionStackingView.tsx54
-rw-r--r--src/client/views/collections/CollectionView.tsx3
-rw-r--r--src/mobile/ImageUpload.scss21
-rw-r--r--src/mobile/ImageUpload.tsx1
-rw-r--r--src/server/authentication/models/current_user_utils.ts2
10 files changed, 168 insertions, 9 deletions
diff --git a/src/client/documents/Documents.ts b/src/client/documents/Documents.ts
index 3d65826a9..b17544229 100644
--- a/src/client/documents/Documents.ts
+++ b/src/client/documents/Documents.ts
@@ -292,6 +292,9 @@ export namespace Docs {
export function TreeDocument(documents: Array<Doc>, options: DocumentOptions) {
return CreateInstance(collProto, new List(documents), { schemaColumns: new List(["title"]), ...options, viewType: CollectionViewType.Tree });
}
+ export function StackingDocument(documents: Array<Doc>, options: DocumentOptions) {
+ return CreateInstance(collProto, new List(documents), { schemaColumns: new List(["title"]), ...options, viewType: CollectionViewType.Stacking });
+ }
export function DockDocument(documents: Array<Doc>, config: string, options: DocumentOptions, id?: string) {
return CreateInstance(collProto, new List(documents), { ...options, viewType: CollectionViewType.Docking, dockingConfig: config }, id);
}
diff --git a/src/client/views/Main.scss b/src/client/views/Main.scss
index d63b0147b..302c49c10 100644
--- a/src/client/views/Main.scss
+++ b/src/client/views/Main.scss
@@ -97,6 +97,21 @@ 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;
diff --git a/src/client/views/MainView.tsx b/src/client/views/MainView.tsx
index af224747d..1d491d11f 100644
--- a/src/client/views/MainView.tsx
+++ b/src/client/views/MainView.tsx
@@ -1,5 +1,5 @@
import { IconName, library } from '@fortawesome/fontawesome-svg-core';
-import { faFilePdf, faFilm, faFont, faGlobeAsia, faImage, faMusic, faObjectGroup, faPenNib, faRedoAlt, faTable, faTree, faUndoAlt } from '@fortawesome/free-solid-svg-icons';
+import { faFilePdf, faFilm, faFont, faGlobeAsia, faImage, faMusic, faObjectGroup, faPenNib, faRedoAlt, faTable, faTree, faUndoAlt, faBell } from '@fortawesome/free-solid-svg-icons';
import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
import { action, computed, configure, observable, runInAction, trace } from 'mobx';
import { observer } from 'mobx-react';
@@ -25,7 +25,7 @@ import { DocumentView } from './nodes/DocumentView';
import { PreviewCursor } from './PreviewCursor';
import { SearchBox } from './SearchBox';
import { SelectionManager } from '../util/SelectionManager';
-import { FieldResult, Field, Doc, Opt } from '../../new_fields/Doc';
+import { FieldResult, Field, Doc, Opt, DocListCast } from '../../new_fields/Doc';
import { Cast, FieldValue, StrCast } from '../../new_fields/Types';
import { DocServer } from '../DocServer';
import { listSpec } from '../../new_fields/Schema';
@@ -137,12 +137,14 @@ export class MainView extends React.Component {
// bcz: strangely, we need a timeout to prevent exceptions/issues initializing GoldenLayout (the rendering engine for Main Container)
setTimeout(() => {
this.openWorkspace(mainDoc);
- let pendingDocument = Docs.SchemaDocument(["title"], [], { title: "New Mobile Uploads" });
- mainDoc.optionalRightCollection = pendingDocument;
+ // let pendingDocument = Docs.StackingDocument([], { title: "New Mobile Uploads" });
+ // mainDoc.optionalRightCollection = pendingDocument;
}, 0);
}
}
+ @observable _notifsCol: Opt<Doc>;
+
@action
openWorkspace = async (doc: Doc, fromHistory = false) => {
CurrentUserUtils.MainDocId = doc[Id];
@@ -153,12 +155,19 @@ export class MainView extends React.Component {
setTimeout(async () => {
if (col) {
const l = Cast(col.data, listSpec(Doc));
- if (l && l.length > 0) {
- CollectionDockingView.Instance.AddRightSplit(col);
+ if (l) {
+ runInAction(() => this._notifsCol = col);
}
}
}, 100);
}
+
+ openNotifsCol = () => {
+ if (this._notifsCol) {
+ CollectionDockingView.Instance.AddRightSplit(this._notifsCol);
+ }
+ }
+
@action
onResize = (r: any) => {
this.pwidth = r.offset.width;
@@ -254,11 +263,23 @@ export class MainView extends React.Component {
/* @TODO this should really be moved into a moveable toolbar component, but for now let's put it here to meet the deadline */
@computed
get miscButtons() {
+ const length = this._notifsCol ? DocListCast(this._notifsCol.data).length : 0;
+ const notifsRef = React.createRef<HTMLDivElement>();
+ const dragNotifs = action(() => this._notifsCol!);
let logoutRef = React.createRef<HTMLDivElement>();
return [
<button className="clear-db-button" key="clear-db" onClick={e => e.shiftKey && e.altKey && DocServer.DeleteDatabase()}>Clear Database</button>,
<div id="toolbar" key="toolbar">
+ <div ref={notifsRef}>
+ <button className="toolbar-button round-button" title="Notifs"
+ onClick={this.openNotifsCol} onPointerDown={this._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>
<button className="toolbar-button round-button" title="Search" onClick={this.toggleSearch}><FontAwesomeIcon icon="search" size="sm" /></button>
<button className="toolbar-button round-button" title="Undo" onClick={() => UndoManager.Undo()}><FontAwesomeIcon icon="undo-alt" size="sm" /></button>
<button className="toolbar-button round-button" title="Redo" onClick={() => UndoManager.Redo()}><FontAwesomeIcon icon="redo-alt" size="sm" /></button>
diff --git a/src/client/views/collections/CollectionBaseView.tsx b/src/client/views/collections/CollectionBaseView.tsx
index 5686ccfef..2bccde241 100644
--- a/src/client/views/collections/CollectionBaseView.tsx
+++ b/src/client/views/collections/CollectionBaseView.tsx
@@ -16,6 +16,7 @@ export enum CollectionViewType {
Schema,
Docking,
Tree,
+ Stacking
}
export interface CollectionRenderProps {
diff --git a/src/client/views/collections/CollectionStackingView.scss b/src/client/views/collections/CollectionStackingView.scss
new file mode 100644
index 000000000..803e680e5
--- /dev/null
+++ b/src/client/views/collections/CollectionStackingView.scss
@@ -0,0 +1,44 @@
+@import "../globalCssVariables";
+
+.collectionStackingView {
+ top: 0;
+ left: 0;
+ display: flex;
+ flex-direction: column;
+ width: 100%;
+ height: 100%;
+ position: absolute;
+ overflow-y: scroll;
+ min-width: 250px;
+ border-width: 0;
+ box-shadow: $intermediate-color 0.2vw 0.2vw 0.8vw;
+ border-color: $light-color-secondary;
+ border-style: solid;
+ border-radius: 0 0 $border-radius $border-radius;
+ box-sizing: border-box;
+
+ .collectionStackingView-docView-container {
+ width: 45%;
+ margin: 5% 2.5%;
+ padding-left: 2.5%;
+ height: auto;
+ }
+
+ .collectionStackingView-flexCont {
+ display: flex;
+ flex-direction: row;
+ flex-wrap: wrap;
+ align-items: center;
+ }
+
+ .collectionStackingView-description {
+ font-size: 100%;
+ margin-bottom: 1vw;
+ padding: 10px;
+ height: 2vw;
+ width: 100%;
+ font-family: $sans-serif;
+ background: $dark-color;
+ color: $light-color;
+ }
+} \ No newline at end of file
diff --git a/src/client/views/collections/CollectionStackingView.tsx b/src/client/views/collections/CollectionStackingView.tsx
new file mode 100644
index 000000000..a1cb73123
--- /dev/null
+++ b/src/client/views/collections/CollectionStackingView.tsx
@@ -0,0 +1,54 @@
+import React = require("react");
+import { observer } from "mobx-react";
+import { CollectionSubView } from "./CollectionSubView";
+import Measure from "react-measure";
+import { Doc, WidthSym, HeightSym } from "../../../new_fields/Doc";
+import { DocumentView } from "../nodes/DocumentView";
+import { Transform } from "../../util/Transform";
+import { emptyFunction, returnOne } from "../../../Utils";
+import "./CollectionStackingView.scss";
+import { runInAction, action, observable, computed } from "mobx";
+import { StrCast } from "../../../new_fields/Types";
+
+@observer
+export class CollectionStackingView extends CollectionSubView(doc => doc) {
+ getPreviewTransform = (): Transform => this.props.ScreenToLocalTransform();
+
+ @action
+ moveDocument = (doc: Doc, targetCollection: Doc, addDocument: (document: Doc) => boolean): boolean => {
+ this.props.removeDocument(doc);
+ addDocument(doc);
+ return true;
+ }
+
+ render() {
+ const docs = this.childDocs;
+ return (
+ <div className="collectionStackingView" onWheel={(e: React.WheelEvent) => e.stopPropagation()}>
+ <div className="collectionStackingView-description">{StrCast(this.props.Document.documentText, StrCast(this.props.Document.title, "stacking collection"))}</div>
+ <div className="collectionStackingView-flexCont">
+ {docs.map(d => {
+ return (<div className="collectionStackingView-docView-container">
+ <DocumentView Document={d}
+ addDocument={this.props.addDocument} removeDocument={this.props.removeDocument}
+ moveDocument={this.moveDocument}
+ ContainingCollectionView={this.props.CollectionView}
+ isTopMost={false}
+ ScreenToLocalTransform={this.getPreviewTransform}
+ focus={emptyFunction}
+ ContentScaling={returnOne}
+ PanelWidth={d[WidthSym]}
+ PanelHeight={d[HeightSym]}
+ selectOnLoad={false}
+ parentActive={this.props.active}
+ addDocTab={this.props.addDocTab}
+ bringToFront={emptyFunction}
+ toggleMinimized={emptyFunction}
+ whenActiveChanged={this.props.active} />
+ </div>);
+ })}
+ </div>
+ </div>
+ );
+ }
+} \ No newline at end of file
diff --git a/src/client/views/collections/CollectionView.tsx b/src/client/views/collections/CollectionView.tsx
index bfdef8e8c..39c8af4ab 100644
--- a/src/client/views/collections/CollectionView.tsx
+++ b/src/client/views/collections/CollectionView.tsx
@@ -12,6 +12,7 @@ import { CollectionDockingView } from "./CollectionDockingView";
import { CollectionSchemaView } from "./CollectionSchemaView";
import { CollectionTreeView } from "./CollectionTreeView";
import { CollectionFreeFormView } from './collectionFreeForm/CollectionFreeFormView';
+import { CollectionStackingView } from './CollectionStackingView';
export const COLLECTION_BORDER_WIDTH = 2;
library.add(faTh);
@@ -31,6 +32,7 @@ export class CollectionView extends React.Component<FieldViewProps> {
case CollectionViewType.Schema: return (<CollectionSchemaView {...props} CollectionView={this} />);
case CollectionViewType.Docking: return (<CollectionDockingView {...props} CollectionView={this} />);
case CollectionViewType.Tree: return (<CollectionTreeView {...props} CollectionView={this} />);
+ case CollectionViewType.Stacking: return (<CollectionStackingView {...props} CollectionView={this} />);
case CollectionViewType.Freeform:
default:
return (<CollectionFreeFormView {...props} CollectionView={this} />);
@@ -48,6 +50,7 @@ export class CollectionView extends React.Component<FieldViewProps> {
}
ContextMenu.Instance.addItem({ description: "Schema", event: undoBatch(() => this.props.Document.viewType = CollectionViewType.Schema), icon: "th-list" });
ContextMenu.Instance.addItem({ description: "Treeview", event: undoBatch(() => this.props.Document.viewType = CollectionViewType.Tree), icon: "tree" });
+ ContextMenu.Instance.addItem({ description: "Stacking", event: undoBatch(() => this.props.Document.viewType = CollectionViewType.Stacking), icon: "th-list" });
}
}
diff --git a/src/mobile/ImageUpload.scss b/src/mobile/ImageUpload.scss
index d0b7d4e41..65305dd04 100644
--- a/src/mobile/ImageUpload.scss
+++ b/src/mobile/ImageUpload.scss
@@ -1,7 +1,13 @@
+@import "../client/views/globalCssVariables.scss";
+
.imgupload_cont {
- height: 100vh;
+ display: flex;
+ justify-content: center;
+ flex-direction: column;
+ align-items: center;
width: 100vw;
- align-content: center;
+ height: 100vh;
+
.button_file {
text-align: center;
height: 50%;
@@ -10,4 +16,15 @@
color: grey;
font-size: 3em;
}
+
+ .upload_label {
+ width: 80vw;
+ height: 40vh;
+ background: $dark-color;
+ font-size: 10vw;
+ font-family: $sans-serif;
+ text-align: center;
+ padding-top: 20vh;
+ color: white;
+ }
} \ No newline at end of file
diff --git a/src/mobile/ImageUpload.tsx b/src/mobile/ImageUpload.tsx
index 690937339..84bbfeb14 100644
--- a/src/mobile/ImageUpload.tsx
+++ b/src/mobile/ImageUpload.tsx
@@ -71,6 +71,7 @@ const onFileLoad = async (file: React.ChangeEvent<HTMLInputElement>) => {
ReactDOM.render((
<div className="imgupload_cont">
{/* <button className = "button_file" = {onPointerDown}> Open Image </button> */}
+ <label htmlFor="input_image_file" className="upload_label">Upload an Image</label>
<input type="file" accept="image/*" onChange={onFileLoad} className="input_file" id="input_image_file"></input>
<img id="img_preview" src=""></img>
<div id="message" />
diff --git a/src/server/authentication/models/current_user_utils.ts b/src/server/authentication/models/current_user_utils.ts
index b947f5e01..e85aa2c74 100644
--- a/src/server/authentication/models/current_user_utils.ts
+++ b/src/server/authentication/models/current_user_utils.ts
@@ -37,7 +37,7 @@ export class CurrentUserUtils {
doc.title = this.email;
doc.data = new List<Doc>();
doc.excludeFromLibrary = true;
- doc.optionalRightCollection = Docs.SchemaDocument(["title"], [], { title: "Pending documents" });
+ doc.optionalRightCollection = Docs.StackingDocument([], { title: "New mobile uploads" });
// doc.library = Docs.TreeDocument([doc], { title: `Library: ${CurrentUserUtils.email}` });
// (doc.library as Doc).excludeFromLibrary = true;
return doc;
generated by cgit v1.2.3-70-g09d2 (git 2.46.0) at 2025-10-07 06:40:59 +0000