1 files changed, 54 insertions, 1 deletions

diff --git a/src/client/views/nodes/formattedText/FormattedTextBox.tsx b/src/client/views/nodes/formattedText/FormattedTextBox.tsx
index 3e2befb5f..aee885688 100644
--- a/src/client/views/nodes/formattedText/FormattedTextBox.tsx
+++ b/src/client/views/nodes/formattedText/FormattedTextBox.tsx
@@ -65,6 +65,8 @@ import { removeMarkWithAttrs } from './prosemirrorPatches';
 import { RichTextMenu, RichTextMenuPlugin } from './RichTextMenu';
 import { RichTextRules } from './RichTextRules';
 import { schema } from './schema_rts';
+import { URLField } from '../../../../fields/URLField';
+import { gptImageLabel } from '../../../apis/gpt/GPT';
 // import * as applyDevTools from 'prosemirror-dev-tools';
 
 export interface FormattedTextBoxProps extends FieldViewProps {
@@ -907,7 +909,11 @@ export class FormattedTextBox extends ViewBoxAnnotatableComponent<FormattedTextB
         );
         const appearance = cm.findByDescription('Appearance...');
         const appearanceItems: ContextMenuProps[] = appearance && 'subitems' in appearance ? appearance.subitems : [];
-
+        appearanceItems.push({
+            description: 'Find image tags',
+            event: this.findImageTags,
+            icon: !this.Document._layout_noSidebar ? 'eye-slash' : 'eye',
+        });
         appearanceItems.push({
             description: !this.Document._layout_noSidebar ? 'Hide Sidebar Handle' : 'Show Sidebar Handle',
             event: () => {
@@ -995,6 +1001,53 @@ export class FormattedTextBox extends ViewBoxAnnotatableComponent<FormattedTextB
         !help && cm.addItem({ description: 'Help...', subitems: helpItems, icon: 'eye' });
     };
 
+    findImageTags = () => {
+        const c = this.ProseRef?.getElementsByTagName('img');
+        if (c) {
+            for (let i of c) {
+                this.getImageDesc(i.src);
+                console.log(i);
+            }
+        }
+        // console.log('HI' + this.ProseRef?.getElementsByTagName('img'));
+    };
+
+    static imageUrlToBase64 = async (imageUrl: string): Promise<string> => {
+        try {
+            const response = await fetch(imageUrl);
+            const blob = await response.blob();
+
+            return new Promise((resolve, reject) => {
+                const reader = new FileReader();
+                reader.readAsDataURL(blob);
+                reader.onloadend = () => resolve(reader.result as string);
+                reader.onerror = error => reject(error);
+            });
+        } catch (error) {
+            console.error('Error:', error);
+            throw error;
+        }
+    };
+
+    getImageDesc = async (u: string) => {
+        // if (StrCast(this.dataDoc.description)) return StrCast(this.dataDoc.description); // Return existing description
+        const { href } = (u as URLField).url;
+        const hrefParts = href.split('.');
+        const hrefComplete = `${hrefParts[0]}_o.${hrefParts[1]}`;
+        try {
+            const hrefBase64 = await FormattedTextBox.imageUrlToBase64(hrefComplete);
+            //const response = await gptImageLabel(hrefBase64, 'Tell me what words you see on this image.');
+            const response = await gptImageLabel(hrefBase64, '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);
+            // this.Document[DocData].description = response.trim();
+            // return response; // Return the response
+        } catch (error) {
+            console.log('Error');
+        }
+        // return '';
+    };
+
     animateRes = (resIndex: number, newText: string) => {
         if (resIndex < newText.length) {
             const marks = this._editorView?.state.storedMarks ?? [];