aboutsummaryrefslogtreecommitdiff
path: root/src/client/views/DocumentDecorations.tsx
diff options
context:
space:
mode:
authorSam Wilkins <samwilkins333@gmail.com>2019-12-03 01:46:36 -0500
committerSam Wilkins <samwilkins333@gmail.com>2019-12-03 01:46:36 -0500
commitef94ad7df2a087141ddb8d347d3e3c484ff7609b (patch)
treea7c16be04ff4050da1ff03e02f59df6da4f5f7e2 /src/client/views/DocumentDecorations.tsx
parent62c888ad25c5580441eaf947a1a0f1638939b868 (diff)
const linter rule and restored google docs push, fixed routing
Diffstat (limited to 'src/client/views/DocumentDecorations.tsx')
-rw-r--r--src/client/views/DocumentDecorations.tsx97
1 files changed, 47 insertions, 50 deletions
diff --git a/src/client/views/DocumentDecorations.tsx b/src/client/views/DocumentDecorations.tsx
index 66f47147f..7b0c31e37 100644
--- a/src/client/views/DocumentDecorations.tsx
+++ b/src/client/views/DocumentDecorations.tsx
@@ -24,7 +24,6 @@ import { DocumentView } from "./nodes/DocumentView";
import { FieldView } from "./nodes/FieldView";
import { IconBox } from "./nodes/IconBox";
import React = require("react");
-import { PointData } from '../../new_fields/InkField';
import { DocumentType } from '../documents/DocumentTypes';
const higflyout = require("@hig/flyout");
export const { anchorPoints } = higflyout;
@@ -68,8 +67,6 @@ export class DocumentDecorations extends React.Component<{}, { value: string }>
@observable public pushIcon: IconProp = "arrow-alt-circle-up";
@observable public pullIcon: IconProp = "arrow-alt-circle-down";
@observable public pullColor: string = "white";
- @observable public isAnimatingFetch = false;
- @observable public isAnimatingPulse = false;
@observable public openHover = false;
constructor(props: Readonly<{}>) {
@@ -82,25 +79,25 @@ export class DocumentDecorations extends React.Component<{}, { value: string }>
@action titleChanged = (event: any) => { this._title = event.target.value; };
@action titleBlur = () => { this._edtingTitle = false; };
@action titleEntered = (e: any) => {
- var key = e.keyCode || e.which;
+ const key = e.keyCode || e.which;
// enter pressed
if (key === 13) {
- var text = e.target.value;
+ const text = e.target.value;
if (text[0] === '#') {
this._fieldKey = text.slice(1, text.length);
this._title = this.selectionTitle;
} else if (text.startsWith("::")) {
- let targetID = text.slice(2, text.length);
- let promoteDoc = SelectionManager.SelectedDocuments()[0];
+ const targetID = text.slice(2, text.length);
+ const promoteDoc = SelectionManager.SelectedDocuments()[0];
DocUtils.Publish(promoteDoc.props.Document, targetID, promoteDoc.props.addDocument, promoteDoc.props.removeDocument);
} else if (text.startsWith(">")) {
- let fieldTemplateView = SelectionManager.SelectedDocuments()[0];
+ const fieldTemplateView = SelectionManager.SelectedDocuments()[0];
SelectionManager.DeselectAll();
- let fieldTemplate = fieldTemplateView.props.Document;
- let containerView = fieldTemplateView.props.ContainingCollectionView;
- let docTemplate = fieldTemplateView.props.ContainingCollectionDoc;
+ const fieldTemplate = fieldTemplateView.props.Document;
+ const containerView = fieldTemplateView.props.ContainingCollectionView;
+ const docTemplate = fieldTemplateView.props.ContainingCollectionDoc;
if (containerView && docTemplate) {
- let metaKey = text.startsWith(">>") ? text.slice(2, text.length) : text.slice(1, text.length);
+ const metaKey = text.startsWith(">>") ? text.slice(2, text.length) : text.slice(1, text.length);
if (metaKey !== containerView.props.fieldKey && containerView.props.DataDoc) {
const fd = fieldTemplate.data;
fd instanceof ObjectField && (Doc.GetProto(containerView.props.DataDoc)[metaKey] = ObjectField.MakeCopy(fd));
@@ -115,15 +112,15 @@ export class DocumentDecorations extends React.Component<{}, { value: string }>
else {
if (SelectionManager.SelectedDocuments().length > 0) {
SelectionManager.SelectedDocuments()[0].props.Document.customTitle = !this._title.startsWith("-");
- let field = SelectionManager.SelectedDocuments()[0].props.Document[this._fieldKey];
+ const field = SelectionManager.SelectedDocuments()[0].props.Document[this._fieldKey];
if (typeof field === "number") {
SelectionManager.SelectedDocuments().forEach(d => {
- let doc = d.props.Document.proto ? d.props.Document.proto : d.props.Document;
+ const doc = d.props.Document.proto ? d.props.Document.proto : d.props.Document;
doc[this._fieldKey] = +this._title;
});
} else {
SelectionManager.SelectedDocuments().forEach(d => {
- let doc = d.props.Document.proto ? d.props.Document.proto : d.props.Document;
+ const doc = d.props.Document.proto ? d.props.Document.proto : d.props.Document;
doc[this._fieldKey] = this._title;
});
}
@@ -165,11 +162,11 @@ export class DocumentDecorations extends React.Component<{}, { value: string }>
Doc.AreProtosEqual(documentView.props.Document, CurrentUserUtils.UserDocument)) {
return bounds;
}
- let transform = (documentView.props.ScreenToLocalTransform().scale(documentView.props.ContentScaling())).inverse();
+ const transform = (documentView.props.ScreenToLocalTransform().scale(documentView.props.ContentScaling())).inverse();
var [sptX, sptY] = transform.transformPoint(0, 0);
let [bptX, bptY] = transform.transformPoint(documentView.props.PanelWidth(), documentView.props.PanelHeight());
if (documentView.props.Document.type === DocumentType.LINK) {
- let rect = documentView.ContentDiv!.getElementsByClassName("docuLinkBox-cont")[0].getBoundingClientRect();
+ const rect = documentView.ContentDiv!.getElementsByClassName("docuLinkBox-cont")[0].getBoundingClientRect();
sptX = rect.left;
sptY = rect.top;
bptX = rect.right;
@@ -192,8 +189,8 @@ export class DocumentDecorations extends React.Component<{}, { value: string }>
@action
onBackgroundMove = (e: PointerEvent): void => {
- let dragDocView = SelectionManager.SelectedDocuments()[0];
- let dragData = new DragManager.DocumentDragData(SelectionManager.SelectedDocuments().map(dv => dv.props.Document));
+ const dragDocView = SelectionManager.SelectedDocuments()[0];
+ const dragData = new DragManager.DocumentDragData(SelectionManager.SelectedDocuments().map(dv => dv.props.Document));
const [left, top] = dragDocView.props.ScreenToLocalTransform().scale(dragDocView.props.ContentScaling()).inverse().transformPoint(0, 0);
dragData.offset = dragDocView.props.ScreenToLocalTransform().scale(dragDocView.props.ContentScaling()).transformDirection(e.x - left, e.y - top);
dragData.moveDocument = SelectionManager.SelectedDocuments()[0].props.moveDocument;
@@ -256,8 +253,8 @@ export class DocumentDecorations extends React.Component<{}, { value: string }>
this._downX = e.pageX;
this._downY = e.pageY;
this._removeIcon = false;
- let selDoc = SelectionManager.SelectedDocuments()[0];
- let selDocPos = selDoc.props.ScreenToLocalTransform().scale(selDoc.props.ContentScaling()).inverse().transformPoint(0, 0);
+ const selDoc = SelectionManager.SelectedDocuments()[0];
+ const selDocPos = selDoc.props.ScreenToLocalTransform().scale(selDoc.props.ContentScaling()).inverse().transformPoint(0, 0);
this._minimizedX = selDocPos[0] + 12;
this._minimizedY = selDocPos[1] + 12;
document.removeEventListener("pointermove", this.onMinimizeMove);
@@ -272,12 +269,12 @@ export class DocumentDecorations extends React.Component<{}, { value: string }>
e.stopPropagation();
if (Math.abs(e.pageX - this._downX) > Utils.DRAG_THRESHOLD ||
Math.abs(e.pageY - this._downY) > Utils.DRAG_THRESHOLD) {
- let selDoc = SelectionManager.SelectedDocuments()[0];
- let selDocPos = selDoc.props.ScreenToLocalTransform().scale(selDoc.props.ContentScaling()).inverse().transformPoint(0, 0);
- let snapped = Math.abs(e.pageX - selDocPos[0]) < 20 && Math.abs(e.pageY - selDocPos[1]) < 20;
+ const selDoc = SelectionManager.SelectedDocuments()[0];
+ const selDocPos = selDoc.props.ScreenToLocalTransform().scale(selDoc.props.ContentScaling()).inverse().transformPoint(0, 0);
+ const snapped = Math.abs(e.pageX - selDocPos[0]) < 20 && Math.abs(e.pageY - selDocPos[1]) < 20;
this._minimizedX = snapped ? selDocPos[0] + 4 : e.clientX;
this._minimizedY = snapped ? selDocPos[1] - 18 : e.clientY;
- let selectedDocs = SelectionManager.SelectedDocuments().map(sd => sd);
+ const selectedDocs = SelectionManager.SelectedDocuments().map(sd => sd);
if (selectedDocs.length > 1) {
this._iconDoc = this._iconDoc ? this._iconDoc : this.createIcon(SelectionManager.SelectedDocuments(), CollectionView.LayoutString(""));
@@ -295,15 +292,15 @@ export class DocumentDecorations extends React.Component<{}, { value: string }>
if (e.button === 0) {
document.removeEventListener("pointermove", this.onMinimizeMove);
document.removeEventListener("pointerup", this.onMinimizeUp);
- let selectedDocs = SelectionManager.SelectedDocuments().map(sd => sd);
+ const selectedDocs = SelectionManager.SelectedDocuments().map(sd => sd);
if (this._iconDoc && selectedDocs.length === 1 && this._removeIcon) {
selectedDocs[0].props.removeDocument && selectedDocs[0].props.removeDocument(this._iconDoc);
}
if (!this._removeIcon && selectedDocs.length === 1) { // if you click on the top-left button when just 1 doc is selected, then collapse it. not sure why we don't do it for multiple selections
this.getIconDoc(selectedDocs[0]).then(async icon => {
- let minimizedDoc = await Cast(selectedDocs[0].props.Document.minimizedDoc, Doc);
+ const minimizedDoc = await Cast(selectedDocs[0].props.Document.minimizedDoc, Doc);
if (minimizedDoc) {
- let scrpt = selectedDocs[0].props.ScreenToLocalTransform().scale(selectedDocs[0].props.ContentScaling()).inverse().transformPoint(
+ const scrpt = selectedDocs[0].props.ScreenToLocalTransform().scale(selectedDocs[0].props.ContentScaling()).inverse().transformPoint(
NumCast(minimizedDoc.x) - NumCast(selectedDocs[0].Document.x), NumCast(minimizedDoc.y) - NumCast(selectedDocs[0].Document.y));
SelectionManager.DeselectAll();
DocumentManager.Instance.animateBetweenPoint(scrpt, await DocListCastAsync(minimizedDoc.maximizedDocs));
@@ -317,8 +314,8 @@ export class DocumentDecorations extends React.Component<{}, { value: string }>
@undoBatch
@action createIcon = (selected: DocumentView[], layoutString: string): Doc => {
- let doc = selected[0].props.Document;
- let iconDoc = Docs.Create.IconDocument(layoutString);
+ const doc = selected[0].props.Document;
+ const iconDoc = Docs.Create.IconDocument(layoutString);
iconDoc.isButton = true;
IconBox.AutomaticTitle(iconDoc);
@@ -334,7 +331,7 @@ export class DocumentDecorations extends React.Component<{}, { value: string }>
}
@action
public getIconDoc = async (docView: DocumentView): Promise<Doc | undefined> => {
- let doc = docView.props.Document;
+ const doc = docView.props.Document;
let iconDoc: Doc | undefined = await Cast(doc.minimizedDoc, Doc);
if (!iconDoc || !DocumentManager.Instance.getDocumentView(iconDoc)) {
@@ -344,8 +341,8 @@ export class DocumentDecorations extends React.Component<{}, { value: string }>
return iconDoc;
}
moveIconDoc(iconDoc: Doc) {
- let selView = SelectionManager.SelectedDocuments()[0];
- let where = (selView.props.ScreenToLocalTransform()).scale(selView.props.ContentScaling()).
+ const selView = SelectionManager.SelectedDocuments()[0];
+ const where = (selView.props.ScreenToLocalTransform()).scale(selView.props.ContentScaling()).
transformPoint(this._minimizedX - 12, this._minimizedY - 12);
iconDoc.x = where[0] + NumCast(selView.props.Document.x);
iconDoc.y = where[1] + NumCast(selView.props.Document.y);
@@ -370,8 +367,8 @@ export class DocumentDecorations extends React.Component<{}, { value: string }>
dist = dist < 3 ? 0 : dist;
let usingRule = false;
SelectionManager.SelectedDocuments().map(dv => {
- let ruleProvider = dv.props.ruleProvider;
- let heading = NumCast(dv.props.Document.heading);
+ const ruleProvider = dv.props.ruleProvider;
+ const heading = NumCast(dv.props.Document.heading);
ruleProvider && heading && (Doc.GetProto(ruleProvider)["ruleRounding_" + heading] = `${Math.min(100, dist)}%`);
usingRule = usingRule || (ruleProvider && heading ? true : false);
});
@@ -419,8 +416,8 @@ export class DocumentDecorations extends React.Component<{}, { value: string }>
let dX = 0, dY = 0, dW = 0, dH = 0;
- let moveX = e.clientX - this._lastX; // e.movementX;
- let moveY = e.clientY - this._lastY; // e.movementY;
+ const moveX = e.clientX - this._lastX; // e.movementX;
+ const moveY = e.clientY - this._lastY; // e.movementY;
this._lastX = e.clientX;
this._lastY = e.clientY;
@@ -465,18 +462,18 @@ export class DocumentDecorations extends React.Component<{}, { value: string }>
SelectionManager.SelectedDocuments().forEach(action((element: DocumentView) => {
if (dX !== 0 || dY !== 0 || dW !== 0 || dH !== 0) {
- let doc = PositionDocument(element.props.Document);
- let layoutDoc = PositionDocument(Doc.Layout(element.props.Document));
+ const doc = PositionDocument(element.props.Document);
+ const layoutDoc = PositionDocument(Doc.Layout(element.props.Document));
let nwidth = layoutDoc.nativeWidth || 0;
let nheight = layoutDoc.nativeHeight || 0;
- let width = (layoutDoc.width || 0);
- let height = (layoutDoc.height || (nheight / nwidth * width));
- let scale = element.props.ScreenToLocalTransform().Scale * element.props.ContentScaling();
- let actualdW = Math.max(width + (dW * scale), 20);
- let actualdH = Math.max(height + (dH * scale), 20);
+ const width = (layoutDoc.width || 0);
+ const height = (layoutDoc.height || (nheight / nwidth * width));
+ const scale = element.props.ScreenToLocalTransform().Scale * element.props.ContentScaling();
+ const actualdW = Math.max(width + (dW * scale), 20);
+ const actualdH = Math.max(height + (dH * scale), 20);
doc.x = (doc.x || 0) + dX * (actualdW - width);
doc.y = (doc.y || 0) + dY * (actualdH - height);
- let fixedAspect = e.ctrlKey || (!layoutDoc.ignoreAspect && nwidth && nheight);
+ const fixedAspect = e.ctrlKey || (!layoutDoc.ignoreAspect && nwidth && nheight);
if (fixedAspect && e.ctrlKey && layoutDoc.ignoreAspect) {
layoutDoc.ignoreAspect = false;
layoutDoc.nativeWidth = nwidth = layoutDoc.width || 0;
@@ -529,8 +526,8 @@ export class DocumentDecorations extends React.Component<{}, { value: string }>
@computed
get selectionTitle(): string {
if (SelectionManager.SelectedDocuments().length === 1) {
- let selected = SelectionManager.SelectedDocuments()[0];
- let field = selected.props.Document[this._fieldKey];
+ const selected = SelectionManager.SelectedDocuments()[0];
+ const field = selected.props.Document[this._fieldKey];
if (typeof field === "string") {
return field;
}
@@ -555,12 +552,12 @@ export class DocumentDecorations extends React.Component<{}, { value: string }>
}
}
render() {
- var bounds = this.Bounds;
- let seldoc = SelectionManager.SelectedDocuments().length ? SelectionManager.SelectedDocuments()[0] : undefined;
+ const bounds = this.Bounds;
+ const seldoc = SelectionManager.SelectedDocuments().length ? SelectionManager.SelectedDocuments()[0] : undefined;
if (SelectionManager.GetIsDragging() || bounds.x === Number.MAX_VALUE || !seldoc || this._hidden || isNaN(bounds.r) || isNaN(bounds.b) || isNaN(bounds.x) || isNaN(bounds.y)) {
return (null);
}
- let minimizeIcon = (
+ const minimizeIcon = (
<div className="documentDecorations-minimizeButton" onPointerDown={this.onMinimizeDown}>
{/* 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*/}
{SelectionManager.SelectedDocuments().length === 1 ? IconBox.DocumentIcon(StrCast(SelectionManager.SelectedDocuments()[0].props.Document.layout, "...")) : "..."}