aboutsummaryrefslogtreecommitdiff
diff options
context:
space:
mode:
Diffstat
-rw-r--r--src/client/views/ContextMenu.scss4
-rw-r--r--src/client/views/ContextMenu.tsx8
-rw-r--r--src/client/views/ContextMenuItem.tsx2
-rw-r--r--src/client/views/nodes/ComparisonBox.scss87
-rw-r--r--src/client/views/nodes/ComparisonBox.tsx55
-rw-r--r--src/client/views/nodes/ImageBox.tsx2
-rw-r--r--src/client/views/nodes/formattedText/FormattedTextBox.tsx2
-rw-r--r--src/client/views/pdf/AnchorMenu.tsx9
-rw-r--r--src/client/views/pdf/PDFViewer.tsx2
9 files changed, 137 insertions, 34 deletions
diff --git a/src/client/views/ContextMenu.scss b/src/client/views/ContextMenu.scss
index 232362c5c..13ef8acec 100644
--- a/src/client/views/ContextMenu.scss
+++ b/src/client/views/ContextMenu.scss
@@ -116,7 +116,9 @@
}
.contextMenu-itemSelected {
- background: lightgoldenrodyellow;
+ background: white;
+ color: black;
+ // background: lightgoldenrodyellow;
border-style: none;
}
diff --git a/src/client/views/ContextMenu.tsx b/src/client/views/ContextMenu.tsx
index d784a14b8..348d248c8 100644
--- a/src/client/views/ContextMenu.tsx
+++ b/src/client/views/ContextMenu.tsx
@@ -182,7 +182,8 @@ export class ContextMenu extends ObservableReactComponent<{}> {
@computed get menuItems() {
if (!this._searchString) {
- return this._items.map((item, ind) => <ContextMenuItem key={item.description + ind} {...item} noexpand={this.itemsNeedSearch ? true : (item as any).noexpand} closeMenu={this.closeMenu} />);
+ console.log('HERESDF');
+ return this._items.map((item, ind) => <ContextMenuItem key={item.description + ind} {...item} selected={ind === this._selectedIndex} noexpand={this.itemsNeedSearch ? true : (item as any).noexpand} closeMenu={this.closeMenu} />);
}
return this.filteredItems.map((value, index) =>
Array.isArray(value) ? (
@@ -250,6 +251,11 @@ export class ContextMenu extends ObservableReactComponent<{}> {
}
@action
+ setLangIndex = (ind: number) => {
+ this._selectedIndex = ind;
+ };
+
+ @action
onKeyDown = (e: React.KeyboardEvent) => {
if (e.key === 'ArrowDown') {
if (this._selectedIndex < this.flatItems.length - 1) {
diff --git a/src/client/views/ContextMenuItem.tsx b/src/client/views/ContextMenuItem.tsx
index eb1030eec..21faad0c1 100644
--- a/src/client/views/ContextMenuItem.tsx
+++ b/src/client/views/ContextMenuItem.tsx
@@ -12,7 +12,7 @@ export interface OriginalMenuProps {
description: string;
event: (stuff?: any) => void;
undoable?: boolean;
- icon: IconProp | JSX.Element; // maybe should be optional (icon?)
+ icon?: IconProp | JSX.Element; // maybe should be optional (icon?)
closeMenu?: () => void;
}
diff --git a/src/client/views/nodes/ComparisonBox.scss b/src/client/views/nodes/ComparisonBox.scss
index f7389e39b..41ff56514 100644
--- a/src/client/views/nodes/ComparisonBox.scss
+++ b/src/client/views/nodes/ComparisonBox.scss
@@ -28,17 +28,96 @@
padding-bottom: 10px;
padding-left: 5px;
padding-right: 5px;
- width: 100%;
+ // width: 80%;
border-radius: 2px;
height: 15%;
- display: flex;
+ display: inline-block;
bottom: 0;
+ // right: 0;
+
+ &.schema-header-button {
+ color: gray;
+ margin: 3px;
+ cursor: pointer;
+ display: flex;
+ align-items: center;
+ justify-content: center;
+
+ svg {
+ width: 15px;
+ }
+ }
+
+ &.submit {
+ width: 80%;
+ // float: right;
+
+ // position: absolute;
+ // position: 10px;
+ // padding-left: 35%;
+ // padding-right: 80%;
+ // // width: 80px;
+ // // right: 0;
+ // right: 0;
+ // bottom: 0;
+ }
+ &.record {
+ width: 20%;
+ float: left;
+ border-radius: 2px;
+ // right: 0;
+ // height: 30%;
+ }
button {
- flex: 1;
- position: relative;
+ // flex: 1;
+ // position: relative;
}
}
+
+ .dropbtn {
+ background-color: #3498db;
+ color: white;
+ padding: 16px;
+ font-size: 16px;
+ border: none;
+ }
+
+ .dropup {
+ position: absolute;
+ display: inline-block;
+ margin-top: 150px;
+ bottom: 0;
+ }
+
+ .dropup-content {
+ display: none;
+ position: absolute;
+ background-color: #f1f1f1;
+ min-width: 160px;
+ bottom: 40px;
+ z-index: 1000;
+ }
+
+ .dropup-content a {
+ color: black;
+ padding: 12px 16px;
+ text-decoration: none;
+ display: block;
+ }
+
+ .dropup-content a:hover {
+ background-color: #ccc;
+ }
+
+ .dropup:hover .dropup-content {
+ display: block;
+ }
+
+ .dropup:hover .dropbtn {
+ background-color: #2980b9;
+ }
+
textarea {
flex: 1;
padding: 10px;
diff --git a/src/client/views/nodes/ComparisonBox.tsx b/src/client/views/nodes/ComparisonBox.tsx
index 06ecf8893..3d2a1f0a9 100644
--- a/src/client/views/nodes/ComparisonBox.tsx
+++ b/src/client/views/nodes/ComparisonBox.tsx
@@ -602,10 +602,10 @@ export class ComparisonBox extends ViewBoxAnnotatableComponent<FieldViewProps>()
// });
// };
- @observable listening = false;
+ @observable private _listening = false;
@observable transcriptElement = '';
SpeechRecognition = window.SpeechRecognition || window.webkitSpeechRecognition;
- recognition = new this.SpeechRecognition();
+ @observable recognition = new this.SpeechRecognition();
handleResult = (e: SpeechRecognitionEvent) => {
let interimTranscript = '';
@@ -625,31 +625,39 @@ export class ComparisonBox extends ViewBoxAnnotatableComponent<FieldViewProps>()
setListening = () => {
const SpeechRecognition = window.SpeechRecognition || window.webkitSpeechRecognition;
if (SpeechRecognition) {
- console.log('here');
- // const recognition = new SpeechRecognition();
- this.recognition.continuous = true; // Continue listening even if the user pauses
- this.recognition.interimResults = true; // Show interim results
- this.recognition.lang = 'en-US'; // Set language (optional)
+ this.recognition.continuous = true;
+ this.recognition.interimResults = true;
+ this.recognition.lang = 'en-US';
this.recognition.onresult = this.handleResult.bind(this);
- // recognition.onend = this.handleEnd.bind(this);
-
- // this.handleResult;
- // recognition.stop();
}
+ ContextMenu.Instance.setLangIndex(0);
};
- setLanguage = (language: string) => {
+ setLanguage = (e: React.MouseEvent, language: string, ind: number) => {
this.recognition.lang = language;
+ ContextMenu.Instance.setLangIndex(ind);
};
startListening = () => {
this.recognition.start();
- this.listening = true;
+ this._listening = true;
};
stopListening = () => {
this.recognition.stop();
- this.listening = false;
+ this._listening = false;
+ };
+
+ openContextMenu = (x: number, y: number) => {
+ ContextMenu.Instance.clearItems();
+ ContextMenu.Instance.addItem({ description: 'English', event: e => this.setLanguage(e, 'en-US', 0) }); //prettier-ignore
+ ContextMenu.Instance.addItem({ description: 'Spanish', event: e => this.setLanguage(e, 'es-ES', 1 )}); //prettier-ignore
+ ContextMenu.Instance.addItem({ description: 'French', event: e => this.setLanguage(e, 'fr-FR', 2) }); //prettier-ignore
+ ContextMenu.Instance.addItem({ description: 'Italian', event: e => this.setLanguage(e, 'it-IT', 3) }); //prettier-ignore
+ ContextMenu.Instance.addItem({ description: 'Mandarin Chinese', event: e => this.setLanguage(e, 'zh-CH', 4) }); //prettier-ignore
+ ContextMenu.Instance.addItem({ description: 'Japanese', event: e => this.setLanguage(e, 'ja', 5) }); //prettier-ignore
+ ContextMenu.Instance.addItem({ description: 'Korean', event: e => this.setLanguage(e, 'ko', 6) }); //prettier-ignore
+ ContextMenu.Instance.displayMenu(x, y);
};
render() {
@@ -725,7 +733,7 @@ export class ComparisonBox extends ViewBoxAnnotatableComponent<FieldViewProps>()
const dataSplit = StrCast(this.dataDoc.data).includes('Keyword: ') ? StrCast(this.dataDoc.data).split('Keyword: ') : StrCast(this.dataDoc.data).split('Answer: ');
const newDoc = Docs.Create.TextDocument(dataSplit[1]);
if (this.Document.image) DocCast(newDoc).image = DocCast(this.Document.image);
- console.log('D' + this.Document.image);
+ // console.log('D' + this.Document.image);
//if (DocCast(DocCast(newDoc).dataDoc)) DocCast(DocCast(newDoc).dataDoc)['image'] = this.dataDoc['image'];
// console.log('HI' + this.Document.image);
@@ -821,17 +829,24 @@ export class ComparisonBox extends ViewBoxAnnotatableComponent<FieldViewProps>()
</div>
) : null}
</div>
- <div style={{ display: 'inline-block' }}>
- <div className="submit-button" style={{ overflow: 'hidden' }}>
- <button style={{ width: '10px' }} onClick={this.listening ? this.stopListening : this.startListening}>
+ <div>
+ <div className="submit-button" style={{ overflow: 'hidden', display: 'flex', width: '100%' }}>
+ <div
+ className="submit-buttonschema-header-button"
+ onPointerDown={e => this.openContextMenu(e.clientX, e.clientY)}
+ style={{ position: 'absolute', top: '1px', left: '11px', zIndex: '100', width: '5px', height: '5px', cursor: 'pointer' }}>
+ <FontAwesomeIcon color={'white'} icon="caret-down" />
+ </div>
+ <button className="submit-buttonrecord" onClick={this._listening ? this.stopListening : this.startListening} style={{ background: this._listening ? 'lightgray' : '', borderRadius: '2px' }}>
{<FontAwesomeIcon icon="microphone" size="lg" />}
</button>
+
{this.layoutDoc[`_${this._props.fieldKey}_usePath`] !== 'alternate' ? (
- <button type="button" onClick={this.handleRenderGPTClick} style={{ borderRadius: '2px', marginBottom: '3px' }}>
+ <button className="submit-buttonsubmit" type="button" onClick={this.handleRenderGPTClick} style={{ borderRadius: '2px', marginBottom: '3px', width: '300%' }}>
Submit
</button>
) : (
- <button type="button" onClick={this.handleRenderClick} style={{ borderRadius: '2px' }}>
+ <button className="submit-buttonsubmit" type="button" onClick={this.handleRenderClick} style={{ borderRadius: '2px' }}>
Redo the Question
</button>
)}
diff --git a/src/client/views/nodes/ImageBox.tsx b/src/client/views/nodes/ImageBox.tsx
index 65a645560..93c07f3a8 100644
--- a/src/client/views/nodes/ImageBox.tsx
+++ b/src/client/views/nodes/ImageBox.tsx
@@ -377,7 +377,7 @@ export class ImageBox extends ViewBoxAnnotatableComponent<FieldViewProps>() {
const hrefBase64 = await this.createCanvas();
const response = await gptImageLabel(hrefBase64, 'Make flashcards out of this image with each question and answer labeled as "question" and "answer". Do not label each flashcard and do not include asterisks: ');
console.log(response);
- AnchorMenu.Instance.transferToFlashcard(response);
+ AnchorMenu.Instance.transferToFlashcard(response, NumCast(this.layoutDoc['x']), NumCast(this.layoutDoc['y']));
} catch (error) {
console.log('Error');
}
diff --git a/src/client/views/nodes/formattedText/FormattedTextBox.tsx b/src/client/views/nodes/formattedText/FormattedTextBox.tsx
index 0be51816f..3c12db965 100644
--- a/src/client/views/nodes/formattedText/FormattedTextBox.tsx
+++ b/src/client/views/nodes/formattedText/FormattedTextBox.tsx
@@ -1046,7 +1046,7 @@ export class FormattedTextBox extends ViewBoxAnnotatableComponent<FormattedTextB
);
//const response = await gptImageLabel(u, 'Make flashcards out of this text with each question and answer labeled as question and answer. Do not label each flashcard and do not include asterisks: ');
// console.log(response);
- AnchorMenu.Instance.transferToFlashcard(response || 'Something went wrong');
+ AnchorMenu.Instance.transferToFlashcard(response || 'Something went wrong', NumCast(this.dataDoc['x']), NumCast(this.dataDoc['y']));
// this._props.addto_;
// this.Document[DocData].description = response.trim();
// return response; // Return the response
diff --git a/src/client/views/pdf/AnchorMenu.tsx b/src/client/views/pdf/AnchorMenu.tsx
index dcd76979f..31941a299 100644
--- a/src/client/views/pdf/AnchorMenu.tsx
+++ b/src/client/views/pdf/AnchorMenu.tsx
@@ -134,7 +134,7 @@ export class AnchorMenu extends AntimodeMenu<AntimodeMenuProps> {
* Transfers the flashcard text generated by GPT on flashcards and creates a collection out them.
*/
- transferToFlashcard = (text: string) => {
+ transferToFlashcard = (text: string, x: number, y: number) => {
// put each question generated by GPT on the front of the flashcard
var senArr = text.trim().split('Question: ');
var collectionArr: Doc[] = [];
@@ -154,9 +154,10 @@ export class AnchorMenu extends AntimodeMenu<AntimodeMenuProps> {
});
console.log(collectionArr);
- newCol.x = this._x;
- newCol.y = this._y;
- newCol.zIndex = 100;
+ newCol.x = x;
+ newCol.y = y;
+ console.log(this._x);
+ newCol.zIndex = 1000;
this.addToCollection?.(newCol);
this._loading = false;
diff --git a/src/client/views/pdf/PDFViewer.tsx b/src/client/views/pdf/PDFViewer.tsx
index 1af7b1fc0..9d06f81ed 100644
--- a/src/client/views/pdf/PDFViewer.tsx
+++ b/src/client/views/pdf/PDFViewer.tsx
@@ -556,7 +556,7 @@ export class PDFViewer extends ObservableReactComponent<IViewerProps> {
const res = await gptAPICall(queryText, GPTCallType.FLASHCARD);
console.log(res);
- AnchorMenu.Instance.transferToFlashcard(res || 'Something went wrong');
+ AnchorMenu.Instance.transferToFlashcard(res || 'Something went wrong', NumCast(this._props.layoutDoc['x']), NumCast(this._props.layoutDoc['y']));
this._selectionText = '';
} catch (err) {
console.error(err);
generated by cgit v1.2.3-70-g09d2 (git 2.46.0) at 2025-10-06 16:27:16 +0000