aboutsummaryrefslogtreecommitdiff
path: root/src/client/views/PropertiesView.tsx
diff options
context:
space:
mode:
authorbobzel <zzzman@gmail.com>2025-04-21 13:48:58 -0400
committerbobzel <zzzman@gmail.com>2025-04-21 13:48:58 -0400
commit17e24e780b54f2f7015c0ca955c3aa5091bba19c (patch)
treeb13002c92d58cb52a02b46e4e1d578f1d57125f2 /src/client/views/PropertiesView.tsx
parent22a40443193320487c27ce02bd3f134d13cb7d65 (diff)
parent1f294ef4a171eec72a069a9503629eaf7975d983 (diff)
merged with master and cleaned up outpainting a bit.
Diffstat (limited to 'src/client/views/PropertiesView.tsx')
-rw-r--r--src/client/views/PropertiesView.tsx70
1 files changed, 33 insertions, 37 deletions
diff --git a/src/client/views/PropertiesView.tsx b/src/client/views/PropertiesView.tsx
index 11adf7435..e7186c0e3 100644
--- a/src/client/views/PropertiesView.tsx
+++ b/src/client/views/PropertiesView.tsx
@@ -13,7 +13,7 @@ import ResizeObserver from 'resize-observer-polyfill';
import { ClientUtils, returnEmptyFilter, returnEmptyString, returnFalse, returnTrue, setupMoveUpEvents } from '../../ClientUtils';
import { emptyFunction } from '../../Utils';
import { Doc, DocListCast, Field, FieldResult, FieldType, HierarchyMapping, NumListCast, Opt, ReverseHierarchyMap, StrListCast, returnEmptyDoclist } from '../../fields/Doc';
-import { AclAdmin, DocAcl, DocData } from '../../fields/DocSymbols';
+import { AclAdmin, DocAcl, DocData, DocLayout } from '../../fields/DocSymbols';
import { Id } from '../../fields/FieldSymbols';
import { InkField } from '../../fields/InkField';
import { List } from '../../fields/List';
@@ -181,7 +181,7 @@ export class PropertiesView extends ObservableReactComponent<PropertiesViewProps
@action
docHeight = () => {
const layoutDoc = this.selectedLayoutDoc;
- if (layoutDoc && this.dataDoc) {
+ if (layoutDoc) {
return Math.max(
70,
Math.min(
@@ -205,7 +205,7 @@ export class PropertiesView extends ObservableReactComponent<PropertiesViewProps
const ids = new Set<string>(reqdKeys);
const docs: Doc[] =
DocumentView.Selected().length < 2 //
- ? [this.layoutFields ? Doc.Layout(this.selectedDoc) : this.dataDoc]
+ ? [this.layoutFields ? this.selectedDoc[DocLayout] : this.dataDoc]
: DocumentView.Selected().map(dv => (this.layoutFields ? dv.layoutDoc : dv.dataDoc));
docs.forEach(doc =>
Object.keys(doc)
@@ -264,7 +264,7 @@ export class PropertiesView extends ObservableReactComponent<PropertiesViewProps
const docs =
DocumentView.Selected().length < 2 && this.selectedDoc
? [this.layoutFields
- ? Doc.Layout(this.selectedDoc) //
+ ? this.selectedDoc[DocLayout] //
: this.dataDoc!]
: DocumentView.Selected().map(dv => (this.layoutFields ? dv.layoutDoc : dv.dataDoc)); // prettier-ignore
docs.forEach(doc => {
@@ -282,7 +282,7 @@ export class PropertiesView extends ObservableReactComponent<PropertiesViewProps
const tags = StrListCast(doc.tags);
if (!tags.includes(value)) {
tags.push(value);
- doc[DocData].tags = tags.length ? new List<string>(tags) : undefined;
+ doc.$tags = tags.length ? new List<string>(tags) : undefined;
}
return true;
}
@@ -308,11 +308,7 @@ export class PropertiesView extends ObservableReactComponent<PropertiesViewProps
}
@computed get contextCount() {
- if (this.selectedDocumentView) {
- const target = this.selectedDocumentView.Document;
- return Doc.GetEmbeddings(target).length - 1;
- }
- return 0;
+ return this.selectedDocumentView ? Doc.GetEmbeddings(this.selectedDocumentView.Document).length - 1 : 0;
}
@computed get links() {
@@ -334,7 +330,7 @@ export class PropertiesView extends ObservableReactComponent<PropertiesViewProps
return '-- multiple selected --';
}
if (this.selectedDoc) {
- const layoutDoc = Doc.Layout(this.selectedDoc);
+ const layoutDoc = this.selectedDoc[DocLayout];
const panelHeight = StrCast(Doc.LayoutField(layoutDoc)).includes('FormattedTextBox') ? this.rtfHeight : this.docHeight;
const panelWidth = StrCast(Doc.LayoutField(layoutDoc)).includes('FormattedTextBox') ? this.rtfWidth : this.docWidth;
return (
@@ -498,7 +494,7 @@ export class PropertiesView extends ObservableReactComponent<PropertiesViewProps
const individualTableEntries = [];
const usersAdded: string[] = []; // all shared users being added - organized by denormalized email
- const seldoc = this.layoutDocAcls ? this.selectedLayoutDoc : this.selectedDoc?.[DocData];
+ const seldoc = this.layoutDocAcls ? this.selectedLayoutDoc : this.dataDoc;
// adds each user to usersAdded
SharingManager.Instance.users.forEach(eachUser => {
let userOnDoc = true;
@@ -529,7 +525,7 @@ export class PropertiesView extends ObservableReactComponent<PropertiesViewProps
let permission;
if (this.layoutDocAcls) {
if (target[DocAcl][userKey]) permission = HierarchyMapping.get(target[DocAcl][userKey])?.name;
- else if (target.embedContainer) permission = StrCast(Doc.GetProto(DocCast(target.embedContainer))[userKey]);
+ else if (DocCast(target.embedContainer)) permission = StrCast(Doc.GetProto(DocCast(target.embedContainer)!)[userKey]);
else permission = StrCast(Doc.GetProto(target)?.[userKey]);
} else permission = StrCast(target[userKey]);
individualTableEntries.unshift(this.sharingItem(userEmail, showAdmin, permission!, false)); // adds each user
@@ -550,7 +546,7 @@ export class PropertiesView extends ObservableReactComponent<PropertiesViewProps
if (this.layoutDocAcls) {
if (target[DocAcl][groupKey]) {
permission = HierarchyMapping.get(target[DocAcl][groupKey])?.name;
- } else if (target.embedContainer) permission = StrCast(Doc.GetProto(DocCast(target.embedContainer))[groupKey]);
+ } else if (DocCast(target.embedContainer)) permission = StrCast(Doc.GetProto(DocCast(target.embedContainer)!)[groupKey]);
else permission = StrCast(Doc.GetProto(target)?.[groupKey]);
} else permission = StrCast(target[groupKey]);
groupTableEntries.unshift(this.sharingItem(StrCast(group.title), showAdmin, permission!, false));
@@ -777,7 +773,7 @@ export class PropertiesView extends ObservableReactComponent<PropertiesViewProps
switch (field) {
case 'Xps': selDoc.x = NumCast(this.selectedDoc?.x) + (dirs === 'up' ? 10 : -10); break;
case 'Yps': selDoc.y = NumCast(this.selectedDoc?.y) + (dirs === 'up' ? 10 : -10); break;
- case 'stk': selDoc.stroke_width = NumCast(this.selectedDoc?.[DocData].stroke_width) + (dirs === 'up' ? 0.1 : -0.1); break;
+ case 'stk': selDoc.stroke_width = NumCast(this.selectedDoc?.$stroke_width) + (dirs === 'up' ? 0.1 : -0.1); break;
case 'wid': {
const oldWidth = NumCast(selDoc._width);
const oldHeight = NumCast(selDoc._height);
@@ -825,11 +821,11 @@ export class PropertiesView extends ObservableReactComponent<PropertiesViewProps
};
getField(key: string) {
- return Field.toString(this.selectedDoc?.[DocData][key] as FieldType);
+ return Field.toString(this.selectedDoc?.['$' + key] as FieldType);
}
@computed get selectedStrokes() {
- return this.containsInkDoc ? DocListCast(this.selectedDoc[DocData].data) : DocumentView.SelectedSchemaDoc() ? [DocumentView.SelectedSchemaDoc()!] : DocumentView.SelectedDocs().filter(doc => doc.layout_isSvg);
+ return this.containsInkDoc ? DocListCast(this.selectedDoc.$data) : DocumentView.SelectedSchemaDoc() ? [DocumentView.SelectedSchemaDoc()!] : DocumentView.SelectedDocs().filter(doc => doc.layout_isSvg);
}
@computed get shapeXps() { return NumCast(this.selectedDoc?.x); } // prettier-ignore
set shapeXps(value) { this.selectedDoc && (this.selectedDoc.x = Math.round(value * 100) / 100); } // prettier-ignore
@@ -839,10 +835,10 @@ export class PropertiesView extends ObservableReactComponent<PropertiesViewProps
set shapeWid(value) { this.selectedDoc && (this.selectedDoc._width = Math.round(value * 100) / 100); } // prettier-ignore
@computed get shapeHgt() { return NumCast(this.selectedDoc?._height); } // prettier-ignore
set shapeHgt(value) { this.selectedDoc && (this.selectedDoc._height = Math.round(value * 100) / 100); } // prettier-ignore
- @computed get strokeThk(){ return NumCast(this.selectedStrokes.lastElement()?.[DocData].stroke_width); } // prettier-ignore
+ @computed get strokeThk(){ return NumCast(this.selectedStrokes.lastElement()?.$stroke_width); } // prettier-ignore
set strokeThk(value) {
this.selectedStrokes.forEach(doc => {
- doc[DocData].stroke_width = Math.round(value * 100) / 100;
+ doc.$stroke_width = Math.round(value * 100) / 100;
});
}
@@ -881,28 +877,26 @@ export class PropertiesView extends ObservableReactComponent<PropertiesViewProps
private _lastDash: string = '2';
- @computed get colorFil() { return StrCast(this.selectedStrokes.lastElement()?.[DocData].fillColor); } // prettier-ignore
+ @computed get colorFil() { return StrCast(this.selectedStrokes.lastElement()?.$fillColor); } // prettier-ignore
set colorFil(value) {
this.selectedStrokes.forEach(doc => {
const inkStroke = DocumentView.getDocumentView(doc)?.ComponentView as InkingStroke;
const { inkData } = inkStroke.inkScaledData();
if (InkingStroke.IsClosed(inkData)) {
- doc[DocData].fillColor = value || undefined;
+ doc.$fillColor = value || undefined;
}
});
}
- @computed get colorStk() { return StrCast(this.selectedStrokes.lastElement()?.[DocData].color); } // prettier-ignore
+ @computed get colorStk() { return StrCast(this.selectedStrokes.lastElement()?.$color); } // prettier-ignore
set colorStk(value) {
this.selectedStrokes.forEach(doc => {
- doc[DocData].color = value || undefined;
+ doc.$color = value || undefined;
});
}
@computed get borderColor() {
- const doc = this.selectedDoc;
- const layoutDoc = doc ? Doc.Layout(doc) : doc;
- return StrCast(layoutDoc.color);
+ return StrCast(this.selectedDoc._color);
}
- set borderColor(value) { this.selectedDoc && (this.selectedDoc[DocData].color = value || undefined); } // prettier-ignore
+ set borderColor(value) { this.selectedDoc && (this.selectedDoc.$color = value || undefined); } // prettier-ignore
colorButton(value: string, type: string, setter: () => void) {
return (
@@ -1034,41 +1028,41 @@ export class PropertiesView extends ObservableReactComponent<PropertiesViewProps
set dashdStk(value) {
value && (this._lastDash = value as string);
this.selectedStrokes.forEach(doc => {
- doc[DocData].stroke_dash = value ? this._lastDash : undefined;
+ doc.$stroke_dash = value ? this._lastDash : undefined;
});
}
@computed get widthStk() { return this.getField('stroke_width') || '1'; } // prettier-ignore
set widthStk(value) {
this.selectedStrokes.forEach(doc => {
- doc[DocData].stroke_width = Number(value);
+ doc.$stroke_width = Number(value);
});
}
@computed get markScal() { return Number(this.getField('stroke_markerScale') || '1'); } // prettier-ignore
set markScal(value) {
this.selectedStrokes.forEach(doc => {
- doc[DocData].stroke_markerScale = Number(value);
+ doc.$stroke_markerScale = Number(value);
});
}
@computed get refStrength() { return Number(this.getField('drawing_refStrength') || '50'); } // prettier-ignore
set refStrength(value) {
- this.selectedDoc[DocData].drawing_refStrength = Number(value);
+ this.selectedDoc.$drawing_refStrength = Number(value);
}
@computed get smoothAmt() { return Number(this.getField('stroke_smoothAmount') || '5'); } // prettier-ignore
set smoothAmt(value) {
this.selectedStrokes.forEach(doc => {
- doc[DocData].stroke_smoothAmount = Number(value);
+ doc.$stroke_smoothAmount = Number(value);
});
}
@computed get markHead() { return this.getField('stroke_startMarker') || ''; } // prettier-ignore
set markHead(value) {
this.selectedStrokes.forEach(doc => {
- doc[DocData].stroke_startMarker = value;
+ doc.$stroke_startMarker = value;
});
}
@computed get markTail() { return this.getField('stroke_endMarker') || ''; } // prettier-ignore
set markTail(value) {
this.selectedStrokes.forEach(doc => {
- doc[DocData].stroke_endMarker = value;
+ doc.$stroke_endMarker = value;
});
}
@@ -1356,7 +1350,7 @@ export class PropertiesView extends ObservableReactComponent<PropertiesViewProps
* of ink strokes in the properties menu.
*/
containsInk = (selectedDoc: Doc) => {
- const childDocs: Doc[] = DocListCast(selectedDoc[DocData].data);
+ const childDocs: Doc[] = DocListCast(selectedDoc.$data);
for (let i = 0; i < childDocs.length; i++) {
if (DocumentView.getDocumentView(childDocs[i])?.layoutDoc?.layout_isSvg) {
return true;
@@ -1454,7 +1448,7 @@ export class PropertiesView extends ObservableReactComponent<PropertiesViewProps
@undoBatch
setDescripValue = action((value: string) => {
if (this.selectedLink) {
- this.selectedLink[DocData].link_description = value;
+ this.selectedLink.$link_description = value;
}
});
@@ -1927,7 +1921,9 @@ export class PropertiesView extends ObservableReactComponent<PropertiesViewProps
const selectedItem: boolean = PresBox.Instance.selectedArray.size > 0;
const type = [DocumentType.AUDIO, DocumentType.VID].includes(DocCast(PresBox.Instance.activeItem?.annotationOn)?.type as DocumentType)
? (DocCast(PresBox.Instance.activeItem?.annotationOn)?.type as DocumentType)
- : PresBox.targetRenderedDoc(PresBox.Instance.activeItem)?.type;
+ : PresBox.Instance.activeItem
+ ? PresBox.targetRenderedDoc(PresBox.Instance.activeItem)?.type
+ : undefined;
return (
<div className="propertiesView" style={{ width: this._props.width }}>
<div className="propertiesView-sectionTitle" style={{ width: this._props.width }}>