aboutsummaryrefslogtreecommitdiff
path: root/src/client/views/nodes/DataVizBox/DocCreatorMenu.tsx
diff options
context:
space:
mode:
authoreleanor-park <eleanor_park@brown.edu>2024-10-30 19:39:46 -0400
committereleanor-park <eleanor_park@brown.edu>2024-10-30 19:39:46 -0400
commitc11c760db62f78a07b624b98b209e6ee86036c8e (patch)
treec9587b50042a5115373e91ba8ecf9b76913cd321 /src/client/views/nodes/DataVizBox/DocCreatorMenu.tsx
parentb5944e87f9d4f3149161de4de0d76db486461c76 (diff)
parent4c768162e0436115a05b9c8b0e4d837d626d45ba (diff)
Merge branch 'master' into eleanor-gptdraw
Diffstat (limited to 'src/client/views/nodes/DataVizBox/DocCreatorMenu.tsx')
-rw-r--r--src/client/views/nodes/DataVizBox/DocCreatorMenu.tsx38
1 files changed, 22 insertions, 16 deletions
diff --git a/src/client/views/nodes/DataVizBox/DocCreatorMenu.tsx b/src/client/views/nodes/DataVizBox/DocCreatorMenu.tsx
index 6c649bde3..7c601185e 100644
--- a/src/client/views/nodes/DataVizBox/DocCreatorMenu.tsx
+++ b/src/client/views/nodes/DataVizBox/DocCreatorMenu.tsx
@@ -231,7 +231,8 @@ export class DocCreatorMenu extends ObservableReactComponent<FieldViewProps> {
this._disposers.lightbox = reaction(
() => LightboxView.LightboxDoc(),
doc => {
- doc ? this._shouldDisplay && this.closeMenu() : !this._shouldDisplay && this.openMenu();
+ // NOTE: bcz; commented this out because the doc creator would appear everytime I close out of the lightbox
+ // doc ? this._shouldDisplay && this.closeMenu() : !this._shouldDisplay && this.openMenu();
}
);
//this._disposers.fields = reaction(() => this._dataViz?.axes, cols => this._selectedCols = cols?.map(col => { return {title: col, type: '', desc: ''}}))
@@ -244,7 +245,7 @@ export class DocCreatorMenu extends ObservableReactComponent<FieldViewProps> {
}
updateIcons = (docs: Doc[]) => {
- console.log('called')
+ console.log('called');
docs.map(this.getIcon);
};
@@ -415,7 +416,7 @@ export class DocCreatorMenu extends ObservableReactComponent<FieldViewProps> {
const height = bottom - top;
const width = right - left;
const doc = !field.title.includes('$$')
- ? Docs.Create.TextDocument('', { _height: height, _width: width, title: field.title, x: left, y: top, _text_fontSize: `${height / 2}` })
+ ? Docs.Create.TextDocument('', { _height: height, _width: width, title: field.title, x: left, y: top, text_fontSize: `${height / 2}` })
: Docs.Create.ImageDocument('', { _height: height, _width: width, title: field.title.replace(/\$\$/g, ''), x: left, y: top });
return doc;
});
@@ -918,17 +919,17 @@ export class DocCreatorMenu extends ObservableReactComponent<FieldViewProps> {
@action setExpandedView = (info: { icon: ImageField; doc: Doc } | undefined) => {
if (info) {
const doc = info.doc;
- const wrapper: Doc = Docs.Create.FreeformDocument([info.doc], { _height: NumListCast(doc._height)[0], _width: NumListCast(doc._width)[0], title: ''});
- const newInfo = {icon: new ImageField(''), doc: wrapper}
+ const wrapper: Doc = Docs.Create.FreeformDocument([info.doc], { _height: NumListCast(doc._height)[0], _width: NumListCast(doc._width)[0], title: '' });
+ const newInfo = { icon: new ImageField(''), doc: wrapper };
this._expandedPreview = newInfo;
} else {
this._expandedPreview = info;
}
};
- get editingWindow(){
+ get editingWindow() {
const doc = this._expandedPreview?.doc ?? new Doc();
- const rendered =
+ const rendered = (
<div className="docCreatorMenu-expanded-template-preview">
<CollectionFreeFormView
Document={this._expandedPreview!.doc}
@@ -944,7 +945,7 @@ export class DocCreatorMenu extends ObservableReactComponent<FieldViewProps> {
removeDocument={returnFalse}
PanelWidth={() => this._menuDimensions.width - 10}
PanelHeight={() => this._menuDimensions.height - 60}
- ScreenToLocalTransform={() => new Transform(-this._pageX,-this._pageY, 1)}
+ ScreenToLocalTransform={() => new Transform(-this._pageX, -this._pageY, 1)}
renderDepth={5}
whenChildContentsActiveChanged={emptyFunction}
focus={emptyFunction}
@@ -960,14 +961,21 @@ export class DocCreatorMenu extends ObservableReactComponent<FieldViewProps> {
yPadding={0}
/>
</div>
-
+ );
return (
<div className="docCreatorMenu-expanded-template-preview">
- <div className="top-panel"/>
+ <div className="top-panel" />
{rendered}
<div className="right-buttons-panel">
- <button className="docCreatorMenu-menu-button section-reveal-options top-right" onPointerDown={e => this.setUpButtonClick(e, () => {this._expandedPreview && this.updateIcons(this._suggestedTemplates.slice()); this.setExpandedView(undefined)})}>
+ <button
+ className="docCreatorMenu-menu-button section-reveal-options top-right"
+ onPointerDown={e =>
+ this.setUpButtonClick(e, () => {
+ this._expandedPreview && this.updateIcons(this._suggestedTemplates.slice());
+ this.setExpandedView(undefined);
+ })
+ }>
<FontAwesomeIcon icon="minimize" />
</button>
<button className="docCreatorMenu-menu-button section-reveal-options top-right-lower" onPointerDown={e => this.setUpButtonClick(e, () => this._expandedPreview && this._templateDocs.push(this._expandedPreview.doc))}>
@@ -975,7 +983,6 @@ export class DocCreatorMenu extends ObservableReactComponent<FieldViewProps> {
</button>
</div>
</div>
-
);
}
@@ -2259,11 +2266,11 @@ export class FieldUtils {
title: title,
x: coord.x,
y: coord.y,
- _text_fontSize: `${FieldUtils.calculateFontSize(width, height, content, true)}`,
+ text_fontSize: `${FieldUtils.calculateFontSize(width, height, content, true)}`,
backgroundColor: opts.backgroundColor ?? '',
text_fontColor: opts.color,
contentBold: opts.fontBold,
- textTransform: opts.fontTransform,
+ text_transform: opts.fontTransform,
color: opts.color,
_layout_borderRounding: `${opts.cornerRounding ?? 0}px`,
borderColor: opts.borderColor,
@@ -2305,7 +2312,7 @@ export class FieldUtils {
public static CarouselField = (coords: { tl: [number, number]; br: [number, number] }, parentWidth: number, parentHeight: number, title: string, fields: Doc[]) => {
const { width, height, coord } = FieldUtils.getDimensions(coords, parentWidth, parentHeight);
- const doc = Docs.Create.Carousel3DDocument(fields, { _height: height, _width: width, title: title, x: coord.x, y: coord.y, _text_fontSize: `${height / 2}` });
+ const doc = Docs.Create.Carousel3DDocument(fields, { _height: height, _width: width, title: title, x: coord.x, y: coord.y, text_fontSize: `${height / 2}` });
return doc;
};
@@ -2358,4 +2365,3 @@ export class FieldUtils {
// }]
// };
// }
-