diff options
Diffstat (limited to 'src/client/views/PropertiesView.tsx')
-rw-r--r-- | src/client/views/PropertiesView.tsx | 52 |
1 files changed, 30 insertions, 22 deletions
diff --git a/src/client/views/PropertiesView.tsx b/src/client/views/PropertiesView.tsx index ac2625f32..c7b0a2ba5 100644 --- a/src/client/views/PropertiesView.tsx +++ b/src/client/views/PropertiesView.tsx @@ -802,7 +802,7 @@ export class PropertiesView extends ObservableReactComponent<PropertiesViewProps }; getField(key: string) { - return this.containsInkDoc ? Field.toString(this.inkDoc?.[DocData][key] as FieldType) : Field.toString(this.selectedDoc?.[DocData][key] as FieldType); + return Field.toString(this.selectedDoc?.[DocData][key] as FieldType); } @computed get shapeXps() { return NumCast(this.selectedDoc?.x); } // prettier-ignore @@ -960,6 +960,22 @@ export class PropertiesView extends ObservableReactComponent<PropertiesViewProps const targetDoc = this.selectedLayoutDoc; return ( <div> + {!targetDoc.layout_isSvg && ( + <div className="color"> + <Toggle + text={'Color with GPT'} + color={SettingsManager.userColor} + icon={<FontAwesomeIcon icon="fill-drip" />} + iconPlacement="left" + align="flex-start" + fillWidth + toggleType={ToggleType.BUTTON} + onClick={undoable(() => { + SmartDrawHandler.Instance.colorWithGPT(targetDoc); + }, 'smoothStrokes')} + /> + </div> + )} <div className="smooth"> <Toggle text={'Smooth Ink Strokes'} @@ -988,22 +1004,6 @@ export class PropertiesView extends ObservableReactComponent<PropertiesViewProps 1 )} </div> - {!targetDoc.layout_isSvg && ( - <div className="color"> - <Toggle - text={'Color with GPT'} - color={SettingsManager.userColor} - icon={<FontAwesomeIcon icon="fill-drip" />} - iconPlacement="left" - align="flex-start" - fillWidth - toggleType={ToggleType.BUTTON} - onClick={undoable(() => { - SmartDrawHandler.Instance.colorWithGPT(targetDoc); - }, 'smoothStrokes')} - /> - </div> - )} </div> ); } @@ -1026,9 +1026,15 @@ export class PropertiesView extends ObservableReactComponent<PropertiesViewProps } @computed get markScal() { return Number(this.getField('stroke_markerScale') || '1'); } // prettier-ignore set markScal(value) { + if (this.containsInkDoc) { + const childDocs = DocListCast(this.selectedDoc[DocData].data); + childDocs.forEach(doc => { + doc[DocData].stroke_markerScale = Number(value); + }); + } this.selectedDoc && (this.selectedDoc[DocData].stroke_markerScale = Number(value)); } - @computed get smoothAmt() { return Number(this.getField('stroke_smoothAmount') || '1'); } // prettier-ignore + @computed get smoothAmt() { return Number(this.getField('stroke_smoothAmount') || '10'); } // prettier-ignore set smoothAmt(value) { this.selectedDoc && (this.selectedDoc[DocData].stroke_smoothAmount = Number(value)); } @@ -1039,9 +1045,8 @@ export class PropertiesView extends ObservableReactComponent<PropertiesViewProps childDocs.forEach(doc => { doc[DocData].stroke_startMarker = value; }); - } else { - this.selectedDoc && (this.selectedDoc[DocData].stroke_startMarker = value); } + this.selectedDoc && (this.selectedDoc[DocData].stroke_startMarker = value); } @computed get markTail() { return this.getField('stroke_endMarker') || ''; } // prettier-ignore set markTail(value) { @@ -1050,9 +1055,8 @@ export class PropertiesView extends ObservableReactComponent<PropertiesViewProps childDocs.forEach(doc => { doc[DocData].stroke_endMarker = value; }); - } else { - this.selectedDoc && (this.selectedDoc[DocData].stroke_endMarker = value); } + this.selectedDoc && (this.selectedDoc[DocData].stroke_endMarker = value); } regInput = (key: string, value: any, setter: (val: string) => {}) => ( @@ -1304,6 +1308,10 @@ export class PropertiesView extends ObservableReactComponent<PropertiesViewProps ); } + /** + * Determines if a selected collection/group document contains any ink strokes to allow users to edit groups + * of ink strokes in the properties menu. + */ containsInk = (selectedDoc: Doc) => { const childDocs: Doc[] = DocListCast(selectedDoc[DocData].data); for (var i = 0; i < childDocs.length; i++) { |