aboutsummaryrefslogtreecommitdiff
path: root/src
diff options
context:
space:
mode:
Diffstat (limited to 'src')
-rw-r--r--src/client/views/ContextMenu.tsx1
-rw-r--r--src/client/views/GestureOverlay.tsx2
-rw-r--r--src/client/views/InkingStroke.tsx4
-rw-r--r--src/client/views/nodes/ComparisonBox.tsx39
-rw-r--r--src/client/views/nodes/EquationBox.scss4
-rw-r--r--src/client/views/nodes/EquationBox.tsx1
6 files changed, 36 insertions, 15 deletions
diff --git a/src/client/views/ContextMenu.tsx b/src/client/views/ContextMenu.tsx
index 1931d7c2a..eae45221c 100644
--- a/src/client/views/ContextMenu.tsx
+++ b/src/client/views/ContextMenu.tsx
@@ -142,6 +142,7 @@ export class ContextMenu extends ObservableReactComponent<{ noexpand?: boolean }
this.clearItems();
this._display = false;
this._shouldDisplay = false;
+ this._selectedIndex = -1;
return wasOpen;
};
diff --git a/src/client/views/GestureOverlay.tsx b/src/client/views/GestureOverlay.tsx
index 2d6cd03e0..b0a750a9a 100644
--- a/src/client/views/GestureOverlay.tsx
+++ b/src/client/views/GestureOverlay.tsx
@@ -256,7 +256,7 @@ export class GestureOverlay extends ObservableReactComponent<React.PropsWithChil
const actionPerformed = ((name: Gestures) => {
switch (name) {
case Gestures.Line:
- if (cuspArray.length > 2) return undefined;
+ if (cuspArray.length > 2 && Score < 1) return undefined;
// eslint-disable-next-line no-fallthrough
case Gestures.Triangle:
case Gestures.Rectangle:
diff --git a/src/client/views/InkingStroke.tsx b/src/client/views/InkingStroke.tsx
index f847db6c2..f555808ef 100644
--- a/src/client/views/InkingStroke.tsx
+++ b/src/client/views/InkingStroke.tsx
@@ -315,7 +315,7 @@ export class InkingStroke extends ViewBoxAnnotatableComponent<FieldViewProps>()
componentUI = (boundsLeft: number, boundsTop: number): null | JSX.Element => {
const inkDoc = this.Document;
const { inkData, inkStrokeWidth } = this.inkScaledData();
- const screenSpaceCenterlineStrokeWidth = Math.min(3, inkStrokeWidth * this.ScreenToLocalBoxXf().inverse().Scale); // the width of the blue line widget that shows the centerline of the ink stroke
+ const screenSpaceCenterlineStrokeWidth = 3; //Math.min(3, inkStrokeWidth * this.ScreenToLocalBoxXf().inverse().Scale); // the width of the blue line widget that shows the centerline of the ink stroke
const screenInkWidth = this.ScreenToLocalBoxXf().inverse().transformDirection(inkStrokeWidth, inkStrokeWidth);
@@ -433,7 +433,7 @@ export class InkingStroke extends ViewBoxAnnotatableComponent<FieldViewProps>()
StrCast(this.layoutDoc.stroke_lineJoin) as Property.StrokeLinejoin,
StrCast(this.layoutDoc.stroke_lineCap) as Property.StrokeLinecap,
StrCast(this.layoutDoc.stroke_bezier),
- 'none',
+ closed && fillColor && DashColor(fillColor).alpha() ? fillColor : 'none',
startMarker,
endMarker,
markerScale,
diff --git a/src/client/views/nodes/ComparisonBox.tsx b/src/client/views/nodes/ComparisonBox.tsx
index 672c189ba..e0c360132 100644
--- a/src/client/views/nodes/ComparisonBox.tsx
+++ b/src/client/views/nodes/ComparisonBox.tsx
@@ -1,7 +1,7 @@
import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
import { Tooltip } from '@mui/material';
import axios from 'axios';
-import { IReactionDisposer, action, computed, makeObservable, observable, reaction, runInAction } from 'mobx';
+import { IReactionDisposer, action, computed, makeObservable, observable, reaction, runInAction, trace } from 'mobx';
import { observer } from 'mobx-react';
import * as React from 'react';
import ReactLoading from 'react-loading';
@@ -30,6 +30,7 @@ import './ComparisonBox.scss';
import { DocumentView } from './DocumentView';
import { FieldView, FieldViewProps } from './FieldView';
import { FormattedTextBox } from './formattedText/FormattedTextBox';
+import { TraceMobx } from '../../../fields/util';
const API_URL = 'https://api.unsplash.com/search/photos';
@@ -143,19 +144,28 @@ export class ComparisonBox extends ViewBoxAnnotatableComponent<FieldViewProps>()
this._reactDisposer.select = reaction(
() => this._props.isSelected(),
selected => {
- if (selected && this.revealOp !== flashcardRevealOp.SLIDE) this.activateContent();
- !selected && (this._childActive = false);
+ if (selected) {
+ switch (this.revealOp) {
+ default:
+ case flashcardRevealOp.FLIP: this.activateContent(); break;
+ case flashcardRevealOp.SLIDE: break;
+ } // prettier-ignore
+ } else {
+ this._childActive = false;
+ }
}, // what it should update to
{ fireImmediately: true }
);
- this._reactDisposer.hover = reaction(
- () => this._props.isContentActive(),
- hover => {
- if (!hover) {
- this.revealOp === flashcardRevealOp.FLIP && this.animateFlipping(this.frontKey);
- this.revealOp === flashcardRevealOp.SLIDE && this.animateSliding(this._props.PanelWidth() - 3);
+ this._reactDisposer.inactive = reaction(
+ () => !this._props.isContentActive(),
+ inactive => {
+ if (inactive) {
+ switch (this.revealOp) {
+ case flashcardRevealOp.FLIP: this.animateFlipping(this.frontKey); break;
+ case flashcardRevealOp.SLIDE: this.animateSliding(this._props.PanelWidth() - 3); break;
+ } // prettier-ignore
}
- }, // what it should update to
+ },
{ fireImmediately: true }
);
}
@@ -197,7 +207,9 @@ export class ComparisonBox extends ViewBoxAnnotatableComponent<FieldViewProps>()
@computed get clipWidth() { return NumCast(this.layoutDoc[this.clipWidthKey], this.isFlashcard ? 100: 50); } // prettier-ignore
@computed get clipHeight() { return NumCast(this.layoutDoc[this.clipHeightKey], 200); } // prettier-ignore
@computed get revealOp() { return StrCast(this.layoutDoc[this.revealOpKey], StrCast(this.containerDoc?.revealOp, this.isFlashcard ? flashcardRevealOp.FLIP : flashcardRevealOp.SLIDE)) as flashcardRevealOp; } // prettier-ignore
+ set revealOp(op:flashcardRevealOp) { this.layoutDoc[this.revealOpKey] = op; } // prettier-ignore
@computed get revealOpHover() { return BoolCast(this.layoutDoc[this.revealOpKey+"_hover"], BoolCast(this.containerDoc?.revealOp_hover)); } // prettier-ignore
+ set revealOpHover(on:boolean) { this.layoutDoc[this.revealOpKey+"_hover"] = on; } // prettier-ignore
@computed get loading() { return this._loading; } // prettier-ignore
set loading(value) { runInAction(() => { this._loading = value; })} // prettier-ignore
@@ -616,6 +628,12 @@ export class ComparisonBox extends ViewBoxAnnotatableComponent<FieldViewProps>()
const appearance = ContextMenu.Instance.findByDescription('Appearance...');
const appearanceItems = appearance?.subitems ?? [];
appearanceItems.push({ description: 'Create ChatCard', event: () => this.askGPT(GPTCallType.CHATCARD), icon: 'id-card' });
+ appearanceItems.push({
+ description: 'Reveal by ' + (this.revealOp === flashcardRevealOp.FLIP ? 'Sliding' : 'Flipping'),
+ event: () => (this.revealOp = this.revealOp === flashcardRevealOp.FLIP ? flashcardRevealOp.SLIDE : flashcardRevealOp.FLIP),
+ icon: 'id-card',
+ });
+ appearanceItems.push({ description: (this.revealOpHover ? 'Click ' : 'Hover ') + ' to reveal', event: () => (this.revealOpHover = !this.revealOpHover), icon: 'id-card' });
!appearance && ContextMenu.Instance.addItem({ description: 'Appearance...', subitems: appearanceItems, icon: 'eye' });
};
@@ -792,6 +810,7 @@ export class ComparisonBox extends ViewBoxAnnotatableComponent<FieldViewProps>()
);
render() {
+ TraceMobx();
const renderMode = new Map<flashcardRevealOp, () => JSX.Element>([
[flashcardRevealOp.FLIP, this.renderAsFlip],
[flashcardRevealOp.SLIDE, this.renderAsBeforeAfter]]); // prettier-ignore
diff --git a/src/client/views/nodes/EquationBox.scss b/src/client/views/nodes/EquationBox.scss
index 5009ec7a7..cbd13d924 100644
--- a/src/client/views/nodes/EquationBox.scss
+++ b/src/client/views/nodes/EquationBox.scss
@@ -3,7 +3,9 @@
.equationBox-cont {
transform-origin: center;
background-color: #e7e7e7;
+ width: fit-content;
+ min-width: 100%;
> span {
- width: 100%;
+ width: fit-content;
}
}
diff --git a/src/client/views/nodes/EquationBox.tsx b/src/client/views/nodes/EquationBox.tsx
index 290c90d6e..472fa56a0 100644
--- a/src/client/views/nodes/EquationBox.tsx
+++ b/src/client/views/nodes/EquationBox.tsx
@@ -119,7 +119,6 @@ export class EquationBox extends ViewBoxBaseComponent<FieldViewProps>() {
onPointerDown={e => !e.ctrlKey && e.stopPropagation()}
style={{
transform: `scale(${scale})`,
- width: 'fit-content', // `${100 / scale}%`,
height: `${100 / scale}%`,
pointerEvents: !this._props.isSelected() ? 'none' : undefined,
fontSize: StrCast(this.Document._text_fontSize),