1.0.4 - made spiner into ActivityIndicator and part of the API

examples/advanced/Generate Image with dall-e-3.md

@@ -0,0 +1,53 @@
+# Description
+
+This is a more advanced example that generates an image using the DALL-E-3 model. The model is capable of generating images from textual prompts. The prompt is a description of the image you want to generate. The model will generate an image based on the description.
+
+This demonstrates using the OpenAI Client Library directly in javaScript code to interact with the OpenAI API.
+
+# Template Code
+
+```javascript
+<%*
+const selectedText = tp.file.selection();
+if (selectedText === null || selectedText.length === 0) {
+  new Notice("Select text that will serve as the prompt.", 10000);
+  return;
+}
+
+// More info for parameters to the API: https://platform.openai.com/docs/api-reference/images/create
+const model = "dall-e-3";
+const size = "1024x1024"; // for dall-e-3: 1024x1024, 1792x1024, or 1024x1792 for dall-e-3 models.
+const style = "vivid";  // for dall-e-3: vivid or natural
+const quality = "standard";  // for dall-e-3: hd or standard
+
+const openai = new ait.OpenAI({
+  apiKey: ait.defaultClientSettings.defaultApiKey,
+  dangerouslyAllowBrowser: true
+});
+
+const activityIndicator = new ait.ActivityIndicator();
+
+try {
+  activityIndicator.add();
+  const imageB64 = await openai.images.generate({
+    model: model,
+    prompt: selectedText,
+    response_format: "b64_json",
+    size: size,
+    style: style,
+    quality: quality
+  });
+  const now = new Date();
+  const dateString = now.getFullYear() + '-' + (now.getMonth() + 1) + '-' + now.getDate() + '_' + now.getHours() + now.getMinutes() + now.getSeconds();
+  const fileName = "/dalle_" + dateString + ".jpg";
+  const imageBuffer = tp.obsidian.base64ToArrayBuffer(imageB64.data[0].b64_json)
+  app.vault.adapter.writeBinary(fileName, imageBuffer)
+  activityIndicator.remove();
+  return `${selectedText}\n\n![${fileName}](${fileName})\n\n`;
+} catch (error) {
+  new Notice("Error: " + error.message, 10000);
+  activityIndicator.remove();
+  return selectedText;
+}
+%>
+```

manifest.json

@@ -1,7 +1,7 @@
 {
 	"id": "ai-templater",
 	"name": "AI for Templater",
-	"version": "1.0.3",
+	"version": "1.0.4",
 	"minAppVersion": "1.5.11",
 	"description": "AI Extension for the Templater plugin with the OpenAI Client Library.",
 	"author": "TfTHacker",

package.json

@@ -1,6 +1,6 @@
 {
   "name": "openaisdk",
-  "version": "1.0.3",
+  "version": "1.0.4",
   "description": "OpenAI SDK plugin for Obsidian.",
   "main": "main.js",
   "scripts": {

src/open_ai/AitApi.ts

@@ -1,6 +1,7 @@
 // a global window object named ait for access to this plugin, plus access to the OpenAI client library
 
 /* eslint-disable import/no-named-as-default, @typescript-eslint/naming-convention -- for OpenAi export */
+import ActivityIndicator from 'src/utils/ActivityIndicator';
 import type AitPlugin from '../main';
 import type { Settings } from '../settings/settings';
 import ChatBuilder from './ChatBuilder';
@@ -12,11 +13,12 @@ declare global {
     ait?: {
       availableModels: () => Promise<string[]>;
       chat: (promptOrMessages: string | ChatCompletionMessageParam[]) => Promise<string>;
-      ChatBuilder: typeof ChatBuilder;
       defaultClientSettings: Settings;
       plugin: AitPlugin;
+      ActivityIndicator: typeof ActivityIndicator;
+      ChatBuilder: typeof ChatBuilder;
+      OpenAI: typeof OpenAI;
     };
-    OpenAI: typeof OpenAI;
   }
 }
 
@@ -27,7 +29,8 @@ export const setupAitApi = (plugin: AitPlugin) => {
     chat: plugin.openAiApi.chat,
     ChatBuilder: ChatBuilder,
     defaultClientSettings: plugin.settings,
-    plugin: plugin
+    plugin: plugin,
+    ActivityIndicator: ActivityIndicator,
+    OpenAI: OpenAI
   };
-  window.OpenAI = OpenAI;
 };

src/templater/InternalModuleAit.ts

@@ -7,7 +7,7 @@ import { InternalModule } from 'templater-obsidian/src/core/functions/internal_f
 import type { ModuleName } from 'templater-obsidian/src/editor/TpDocumentation';
 import type { ChatCompletionMessageParam } from 'openai/resources';
 import type { TFile } from 'obsidian';
-import Spinner from '../utils/Spinner';
+import ActivityIndicator from '../utils/ActivityIndicator';
 
 export class InternalModuleAit extends InternalModule {
   // @ts-expect-error -- adding internal module to templater
@@ -73,7 +73,7 @@ export class InternalModuleAit extends InternalModule {
       apiKey?: string,
       organization?: string | null
     ) => {
-      const spinner = new Spinner();
+      const spinner = new ActivityIndicator();
       spinner.add();
       try {
         const result =

src/utils/Spinner.ts → src/utils/ActivityIndicator.ts

@@ -1,7 +1,7 @@
-// creates and removes a spinner element that is appended to the active workspace leaf's view header
+// creates and removes a visual indicator element that is appended to the active workspace leaf's view header
 // provides user feedback that the plugin is working on a AI task
 
-class Spinner {
+class ActivityIndicator {
   private spinner: HTMLDivElement | null = null;
   private timerId: NodeJS.Timeout | null = null;
 
@@ -44,4 +44,4 @@ class Spinner {
   }
 }
 
-export default Spinner;
+export default ActivityIndicator;

versions.json

@@ -2,5 +2,6 @@
 	"1.0.0": "1.5.11",
 	"1.0.1": "1.5.11",
 	"1.0.2": "1.5.11",
-	"1.0.3": "1.5.11"
+	"1.0.3": "1.5.11",
+	"1.0.4": "1.5.11"
 }