aboutsummaryrefslogtreecommitdiff
diff options
context:
space:
mode:
authorbob <bcz@cs.brown.edu>2019-05-03 14:46:31 -0400
committerbob <bcz@cs.brown.edu>2019-05-03 14:46:31 -0400
commit9b33ac1cb790e88558edb3e4626f5a7b759ea3db (patch)
tree5580b2caca6db47320842c57861ae1ec98b8e3f8
parent340b49b4373b2041a167337ec02284e73bfaf3f7 (diff)
added make button option. summarize to text notes that can be frozen to resize.
-rw-r--r--src/client/views/DocumentDecorations.tsx1
-rw-r--r--src/client/views/collections/collectionFreeForm/MarqueeView.tsx20
-rw-r--r--src/client/views/nodes/CollectionFreeFormDocumentView.tsx16
-rw-r--r--src/client/views/nodes/DocumentView.tsx10
-rw-r--r--src/client/views/nodes/FormattedTextBox.tsx20
5 files changed, 48 insertions, 19 deletions
diff --git a/src/client/views/DocumentDecorations.tsx b/src/client/views/DocumentDecorations.tsx
index 2299f4c32..693d6ec55 100644
--- a/src/client/views/DocumentDecorations.tsx
+++ b/src/client/views/DocumentDecorations.tsx
@@ -255,6 +255,7 @@ export class DocumentDecorations extends React.Component<{}, { value: string }>
@action createIcon = (selected: DocumentView[], layoutString: string): Doc => {
let doc = selected[0].props.Document;
let iconDoc = Docs.IconDocument(layoutString);
+ iconDoc.isButton = true;
iconDoc.title = selected.length > 1 ? "ICONset" : "ICON" + StrCast(doc.title);
iconDoc.labelField = this._fieldKey;
iconDoc[this._fieldKey] = selected.length > 1 ? "collection" : undefined;
diff --git a/src/client/views/collections/collectionFreeForm/MarqueeView.tsx b/src/client/views/collections/collectionFreeForm/MarqueeView.tsx
index 82027a6f2..8c81f6990 100644
--- a/src/client/views/collections/collectionFreeForm/MarqueeView.tsx
+++ b/src/client/views/collections/collectionFreeForm/MarqueeView.tsx
@@ -154,7 +154,8 @@ export class MarqueeView extends React.Component<MarqueeViewProps>
e.stopPropagation();
let bounds = this.Bounds;
let selected = this.marqueeSelect().map(d => {
- this.props.removeDocument(d);
+ if (e.key !== "r")
+ this.props.removeDocument(d);
d.x = NumCast(d.x) - bounds.left - bounds.width / 2;
d.y = NumCast(d.y) - bounds.top - bounds.height / 2;
d.page = -1;
@@ -180,12 +181,21 @@ export class MarqueeView extends React.Component<MarqueeViewProps>
// SelectionManager.DeselectAll();
if (e.key === "r") {
let summary = Docs.TextDocument({ x: bounds.left, y: bounds.top, width: 300, height: 100, backgroundColor: "yellow", title: "-summary-" });
- summary.doc1 = selected[0];
- if (selected.length > 1)
- summary.doc2 = selected[1];
- summary.templates = new List<string>([Templates.Summary.Layout]);
+ summary.maximizedDocs = new List<Doc>(selected);
+ // summary.doc1 = selected[0];
+ // if (selected.length > 1)
+ // summary.doc2 = selected[1];
+ // summary.templates = new List<string>([Templates.Summary.Layout]);
this.props.addLiveTextDocument(summary);
e.preventDefault();
+ let scrpt = this.props.getTransform().inverse().transformPoint(bounds.left, bounds.top);
+ selected.map(maximizedDoc => {
+ let maxx = NumCast(maximizedDoc.x, undefined);
+ let maxy = NumCast(maximizedDoc.y, undefined);
+ let maxw = NumCast(maximizedDoc.width, undefined);
+ let maxh = NumCast(maximizedDoc.height, undefined);
+ maximizedDoc.isIconAnimating = new List<number>([scrpt[0], scrpt[1], maxx, maxy, maxw, maxh, Date.now(), 0])
+ });
}
else {
this.props.addDocument(newCollection, false);
diff --git a/src/client/views/nodes/CollectionFreeFormDocumentView.tsx b/src/client/views/nodes/CollectionFreeFormDocumentView.tsx
index 741af82fd..2ba0458f5 100644
--- a/src/client/views/nodes/CollectionFreeFormDocumentView.tsx
+++ b/src/client/views/nodes/CollectionFreeFormDocumentView.tsx
@@ -138,8 +138,8 @@ export class CollectionFreeFormDocumentView extends DocComponent<CollectionFreeF
if (isMinimized === undefined) {
isMinimized = BoolCast(maximizedDoc.isMinimized, false);
}
- let minx = NumCast(minimizedTarget.x, undefined);
- let miny = NumCast(minimizedTarget.y, undefined);
+ let minx = NumCast(minimizedTarget.x, undefined) + NumCast(minimizedTarget.width, undefined) / 2;
+ let miny = NumCast(minimizedTarget.y, undefined) + NumCast(minimizedTarget.height, undefined) / 2;
let maxx = NumCast(maximizedDoc.x, undefined);
let maxy = NumCast(maximizedDoc.y, undefined);
let maxw = NumCast(maximizedDoc.width, undefined);
@@ -164,11 +164,13 @@ export class CollectionFreeFormDocumentView extends DocComponent<CollectionFreeF
let ctrlKey = e.ctrlKey;
if (Math.abs(e.clientX - this._downX) < Utils.DRAG_THRESHOLD &&
Math.abs(e.clientY - this._downY) < Utils.DRAG_THRESHOLD) {
- let maximizedDocs = await Cast(this.props.Document.maximizedDocs, listSpec(Doc));
- if (maximizedDocs) { // bcz: need a better way to associate behaviors with click events on widget-documents
- if (ctrlKey)
- this.props.addDocument && maximizedDocs.filter(d => d instanceof Doc).map(maxDoc => this.props.addDocument!(maxDoc, false));
- this.toggleIcon();
+ if (await BoolCast(this.props.Document.isButton, false)) {
+ let maximizedDocs = await Cast(this.props.Document.maximizedDocs, listSpec(Doc));
+ if (maximizedDocs) { // bcz: need a better way to associate behaviors with click events on widget-documents
+ if (ctrlKey)
+ this.props.addDocument && maximizedDocs.filter(d => d instanceof Doc).map(maxDoc => this.props.addDocument!(maxDoc, false));
+ this.toggleIcon();
+ }
}
}
}
diff --git a/src/client/views/nodes/DocumentView.tsx b/src/client/views/nodes/DocumentView.tsx
index 892850a69..c08e322c0 100644
--- a/src/client/views/nodes/DocumentView.tsx
+++ b/src/client/views/nodes/DocumentView.tsx
@@ -16,7 +16,7 @@ import { Template, Templates } from "./../Templates";
import { DocumentContentsView } from "./DocumentContentsView";
import "./DocumentView.scss";
import React = require("react");
-import { Opt, Doc } from "../../../new_fields/Doc";
+import { Opt, Doc, WidthSym, HeightSym } from "../../../new_fields/Doc";
import { DocComponent } from "../DocComponent";
import { createSchema, makeInterface } from "../../../new_fields/Schema";
import { FieldValue, StrCast, BoolCast } from "../../../new_fields/Types";
@@ -200,6 +200,13 @@ export class DocumentView extends DocComponent<DocumentViewProps, Document>(Docu
let kvp = Docs.KVPDocument(this.props.Document, { width: 300, height: 300 });
CollectionDockingView.Instance.AddRightSplit(kvp);
}
+ makeButton = (e: React.MouseEvent): void => {
+ this.props.Document.isButton = !BoolCast(this.props.Document.isButton, false);
+ if (this.props.Document.isButton && !this.props.Document.nativeWidth) {
+ this.props.Document.nativeWidth = this.props.Document[WidthSym]();
+ this.props.Document.nativeHeight = this.props.Document[HeightSym]();
+ }
+ }
fullScreenClicked = (e: React.MouseEvent): void => {
const doc = Doc.MakeDelegate(FieldValue(this.Document.proto));
if (doc) {
@@ -263,6 +270,7 @@ export class DocumentView extends DocComponent<DocumentViewProps, Document>(Docu
e.preventDefault();
ContextMenu.Instance.addItem({ description: "Full Screen", event: this.fullScreenClicked });
+ ContextMenu.Instance.addItem({ description: this.props.Document.isButton ? "Remove Button" : "Make Button", event: this.makeButton });
ContextMenu.Instance.addItem({ description: "Fields", event: this.fieldsClicked });
ContextMenu.Instance.addItem({ description: "Center", event: () => this.props.focus(this.props.Document) });
ContextMenu.Instance.addItem({ description: "Open Right", event: () => CollectionDockingView.Instance.AddRightSplit(this.props.Document) });
diff --git a/src/client/views/nodes/FormattedTextBox.tsx b/src/client/views/nodes/FormattedTextBox.tsx
index 1d362bdaa..eeb60cb3d 100644
--- a/src/client/views/nodes/FormattedTextBox.tsx
+++ b/src/client/views/nodes/FormattedTextBox.tsx
@@ -17,10 +17,10 @@ import React = require("react");
import { SelectionManager } from "../../util/SelectionManager";
import { DocComponent } from "../DocComponent";
import { createSchema, makeInterface } from "../../../new_fields/Schema";
-import { Opt, Doc } from "../../../new_fields/Doc";
+import { Opt, Doc, WidthSym, HeightSym } from "../../../new_fields/Doc";
import { observer } from "mobx-react";
import { InkingControl } from "../InkingControl";
-import { StrCast, Cast, NumCast } from "../../../new_fields/Types";
+import { StrCast, Cast, NumCast, BoolCast } from "../../../new_fields/Types";
import { RichTextField } from "../../../new_fields/RichTextField";
import { Id } from "../../../new_fields/RefField";
const { buildMenuItems } = require("prosemirror-example-setup");
@@ -128,7 +128,7 @@ export class FormattedTextBox extends DocComponent<(FieldViewProps & FormattedTe
);
} else {
this._proxyReactionDisposer = reaction(() => this.props.isSelected(),
- () => this.props.isSelected() && MainOverlayTextBox.Instance.SetTextDoc(this.props.Document, this.props.fieldKey, this._ref.current!, this.props.ScreenToLocalTransform));
+ () => this.props.isSelected() && !BoolCast(this.props.Document.isButton, false) && MainOverlayTextBox.Instance.SetTextDoc(this.props.Document, this.props.fieldKey, this._ref.current!, this.props.ScreenToLocalTransform));
}
@@ -203,15 +203,23 @@ export class FormattedTextBox extends DocComponent<(FieldViewProps & FormattedTe
}
//REPLACE THIS WITH CAPABILITIES SPECIFIC TO THIS TYPE OF NODE
- textCapability = (e: React.MouseEvent): void => { };
+ textCapability = (e: React.MouseEvent): void => {
+ if (NumCast(this.props.Document.nativeWidth)) {
+ this.props.Document.nativeWidth = undefined;
+ this.props.Document.nativeHeight = undefined;
+ } else {
+ this.props.Document.nativeWidth = this.props.Document[WidthSym]();
+ this.props.Document.nativeHeight = this.props.Document[HeightSym]();
+ }
+ }
specificContextMenu = (e: React.MouseEvent): void => {
if (!this._gotDown) {
e.preventDefault();
return;
}
ContextMenu.Instance.addItem({
- description: "Text Capability",
+ description: NumCast(this.props.Document.nativeWidth) ? "Unfreeze" : "Freeze",
event: this.textCapability
});
@@ -302,7 +310,7 @@ export class FormattedTextBox extends DocComponent<(FieldViewProps & FormattedTe
// tfs: do we need this event handler
onWheel={this.onPointerWheel}
>
- <div className={`formattedTextBox-inner${rounded}`} ref={this._proseRef} />
+ <div className={`formattedTextBox-inner${rounded}`} style={{ pointerEvents: this.props.Document.isButton ? "none" : "all" }} ref={this._proseRef} />
</div>
);
}