Skip to content

Commit 5d71380

Browse files
maski89maski89
committed
Fix missing model manager concept and add AI helper
1 parent 6eb1de4 commit 5d71380

File tree

6 files changed

+399
-3
lines changed

6 files changed

+399
-3
lines changed

‎fragment-sync/3D Models/Model.wpm/Init Manager Concept.js‎

Lines changed: 14 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,14 @@
1+
const initConcept = async () => {
2+
try {
3+
const managers = await VarvEngine.lookupInstances('ModelManager');
4+
if (managers.length === 0) {
5+
await VarvEngine.getConceptFromType('ModelManager').create(null, {});
6+
}
7+
} catch (e) {
8+
// Ignore
9+
}
10+
};
11+
12+
VarvEngine.registerEventCallback('engineReloaded', () => {
13+
initConcept();
14+
});

‎fragment-sync/Helpers/AIHelpers.wpm/AI Helpers LiteLLM.jsx‎

Lines changed: 118 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,118 @@
1+
const LITE_LLM_BASE_URL = '';
2+
const API_KEY_COOKIE_NAME = 'LITE_LLM_API_KEY_PAGE_SESSION';
3+
4+
const retrieveApiKey = () => {
5+
let apiKey;
6+
7+
function getCookie(name) {
8+
const nameEQ = name + '=';
9+
const ca = document.cookie.split(';');
10+
for (let i = 0; i < ca.length; i++) {
11+
let c = ca[i];
12+
while (c.charAt(0) === ' ') c = c.substring(1, c.length);
13+
if (c.indexOf(nameEQ) === 0) return decodeURIComponent(c.substring(nameEQ.length, c.length));
14+
}
15+
return null;
16+
}
17+
18+
function setCookie(name, value) {
19+
const path = window.location.pathname;
20+
document.cookie = `${name}=${encodeURIComponent(value)}; path=${path}; SameSite=Lax`;
21+
}
22+
23+
apiKey = getCookie(API_KEY_COOKIE_NAME);
24+
if (!apiKey) {
25+
apiKey = prompt('Enter your API key for LiteLLM:');
26+
if (apiKey) {
27+
setCookie(API_KEY_COOKIE_NAME, apiKey);
28+
console.log('API key saved to cookie for this page session.');
29+
} else {
30+
throw new Error('API key not provided');
31+
}
32+
} else {
33+
console.log('API key loaded from cookie.');
34+
}
35+
36+
return apiKey;
37+
}
38+
39+
40+
export const recordAudio = (duration) => {
41+
return new Promise((resolve, reject) => {
42+
let chunks = [];
43+
44+
navigator.mediaDevices.getUserMedia({ audio: true }).then(stream => {
45+
const mediaRecorder = new MediaRecorder(stream);
46+
47+
mediaRecorder.ondataavailable = (event) => {
48+
chunks.push(event.data);
49+
};
50+
51+
mediaRecorder.onstop = () => {
52+
const audioBlob = new Blob(chunks, { type: 'audio/wav' });
53+
resolve(audioBlob);
54+
};
55+
56+
mediaRecorder.start();
57+
58+
setTimeout(() => {
59+
mediaRecorder.stop();
60+
}, duration);
61+
}).catch(error => {
62+
reject(error);
63+
});
64+
});
65+
};
66+
67+
export const transcribeAudio = async (duration, audioBlob = false, recordingEndedCallback = false) => {
68+
const apiKey = retrieveApiKey();
69+
70+
let audioBlobToTranscribe = audioBlob;
71+
if (!audioBlobToTranscribe) {
72+
audioBlobToTranscribe = await recordAudio(duration);
73+
}
74+
75+
if (recordingEndedCallback) recordingEndedCallback();
76+
77+
const formData = new FormData();
78+
formData.append('file', audioBlobToTranscribe, 'recording.wav');
79+
formData.append('model', 'whisper-1');
80+
81+
const whisperResponse = await fetch(`${LITE_LLM_BASE_URL}/v1/audio/transcriptions`, {
82+
method: 'POST',
83+
mode: 'cors',
84+
headers: { 'Authorization': `Bearer ${apiKey}` },
85+
body: formData,
86+
});
87+
const whisperData = await whisperResponse.json();
88+
89+
return whisperData.text;
90+
};
91+
92+
export const sendGPTPrompt = async (body) => {
93+
if (!window.API_KEY) {
94+
window.API_KEY = prompt('Please enter your OpenAI API key:');
95+
if (!window.API_KEY) {
96+
console.error('An API_KEY is required to transcribe audio.');
97+
return;
98+
}
99+
}
100+
101+
const options = {
102+
method: 'POST',
103+
mode: 'cors',
104+
headers: {
105+
'Accept': 'application/json',
106+
'Content-Type': 'application/json',
107+
'Authorization': `Bearer ${API_KEY}`
108+
},
109+
body: JSON.stringify(body)
110+
};
111+
console.log('OpenAI API call options:', options);
112+
113+
const gptResponse = await fetch(`${LITE_LLM_BASE_URL}/v1/chat/completions`, options);
114+
const gptData = await gptResponse.json();
115+
return gptData;
116+
};
117+
118+
export const getGPTContent = (gptData) => gptData.choices[0].message.content;

‎fragment-sync/Helpers/AIHelpers.wpm/README.md‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
# AI Helpers
22

3-
The AI Helpers API provides a set of utilities to interact with the OpenAI API. It provides functions for recording audio, transcribing audio to text, and generating text responses using the OpenAI API.
3+
The AI Helpers API provides a set of utilities to interact with the OpenAI API. It provides functions for recording audio, transcribing audio to text, and generating text responses using the OpenAI API or an LiteLLM proxy server. By default the OpenAI API is used. To switch to the LiteLLM helper remove the `default` class from the OpenAI helper and add it to the LiteLLM helper.
44

55

66
## Import

‎prototypes/spatialstrate.zip‎

-133 KB
Binary file not shown.

‎prototypes/spatialstrate/index.html‎

Lines changed: 133 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -6292,7 +6292,7 @@
62926292
}
62936293
</wpm-descriptor></code-fragment><code-fragment data-type="text/markdown" name="README"># AI Helpers
62946294

6295-
The AI Helpers API provides a set of utilities to interact with the OpenAI API. It provides functions for recording audio, transcribing audio to text, and generating text responses using the OpenAI API.
6295+
The AI Helpers API provides a set of utilities to interact with the OpenAI API. It provides functions for recording audio, transcribing audio to text, and generating text responses using the OpenAI API or an LiteLLM proxy server. By default the OpenAI API is used. To switch to the LiteLLM helper remove the `default` class from the OpenAI helper and add it to the LiteLLM helper.
62966296

62976297

62986298
## Import
@@ -6390,6 +6390,124 @@
63906390
return gptData;
63916391
};
63926392

6393+
export const getGPTContent = (gptData) => gptData.choices[0].message.content;
6394+
</code-fragment><code-fragment data-type="text/javascript+babel" name="AI Helpers LiteLLM">const LITE_LLM_BASE_URL = '';
6395+
const API_KEY_COOKIE_NAME = 'LITE_LLM_API_KEY_PAGE_SESSION';
6396+
6397+
const retrieveApiKey = () => {
6398+
let apiKey;
6399+
6400+
function getCookie(name) {
6401+
const nameEQ = name + '=';
6402+
const ca = document.cookie.split(';');
6403+
for (let i = 0; i &lt; ca.length; i++) {
6404+
let c = ca[i];
6405+
while (c.charAt(0) === ' ') c = c.substring(1, c.length);
6406+
if (c.indexOf(nameEQ) === 0) return decodeURIComponent(c.substring(nameEQ.length, c.length));
6407+
}
6408+
return null;
6409+
}
6410+
6411+
function setCookie(name, value) {
6412+
const path = window.location.pathname;
6413+
document.cookie = `${name}=${encodeURIComponent(value)}; path=${path}; SameSite=Lax`;
6414+
}
6415+
6416+
apiKey = getCookie(API_KEY_COOKIE_NAME);
6417+
if (!apiKey) {
6418+
apiKey = prompt('Enter your API key for LiteLLM:');
6419+
if (apiKey) {
6420+
setCookie(API_KEY_COOKIE_NAME, apiKey);
6421+
console.log('API key saved to cookie for this page session.');
6422+
} else {
6423+
throw new Error('API key not provided');
6424+
}
6425+
} else {
6426+
console.log('API key loaded from cookie.');
6427+
}
6428+
6429+
return apiKey;
6430+
}
6431+
6432+
6433+
export const recordAudio = (duration) => {
6434+
return new Promise((resolve, reject) => {
6435+
let chunks = [];
6436+
6437+
navigator.mediaDevices.getUserMedia({ audio: true }).then(stream => {
6438+
const mediaRecorder = new MediaRecorder(stream);
6439+
6440+
mediaRecorder.ondataavailable = (event) => {
6441+
chunks.push(event.data);
6442+
};
6443+
6444+
mediaRecorder.onstop = () => {
6445+
const audioBlob = new Blob(chunks, { type: 'audio/wav' });
6446+
resolve(audioBlob);
6447+
};
6448+
6449+
mediaRecorder.start();
6450+
6451+
setTimeout(() => {
6452+
mediaRecorder.stop();
6453+
}, duration);
6454+
}).catch(error => {
6455+
reject(error);
6456+
});
6457+
});
6458+
};
6459+
6460+
export const transcribeAudio = async (duration, audioBlob = false, recordingEndedCallback = false) => {
6461+
const apiKey = retrieveApiKey();
6462+
6463+
let audioBlobToTranscribe = audioBlob;
6464+
if (!audioBlobToTranscribe) {
6465+
audioBlobToTranscribe = await recordAudio(duration);
6466+
}
6467+
6468+
if (recordingEndedCallback) recordingEndedCallback();
6469+
6470+
const formData = new FormData();
6471+
formData.append('file', audioBlobToTranscribe, 'recording.wav');
6472+
formData.append('model', 'whisper-1');
6473+
6474+
const whisperResponse = await fetch(`${LITE_LLM_BASE_URL}/v1/audio/transcriptions`, {
6475+
method: 'POST',
6476+
mode: 'cors',
6477+
headers: { 'Authorization': `Bearer ${apiKey}` },
6478+
body: formData,
6479+
});
6480+
const whisperData = await whisperResponse.json();
6481+
6482+
return whisperData.text;
6483+
};
6484+
6485+
export const sendGPTPrompt = async (body) => {
6486+
if (!window.API_KEY) {
6487+
window.API_KEY = prompt('Please enter your OpenAI API key:');
6488+
if (!window.API_KEY) {
6489+
console.error('An API_KEY is required to transcribe audio.');
6490+
return;
6491+
}
6492+
}
6493+
6494+
const options = {
6495+
method: 'POST',
6496+
mode: 'cors',
6497+
headers: {
6498+
'Accept': 'application/json',
6499+
'Content-Type': 'application/json',
6500+
'Authorization': `Bearer ${API_KEY}`
6501+
},
6502+
body: JSON.stringify(body)
6503+
};
6504+
console.log('OpenAI API call options:', options);
6505+
6506+
const gptResponse = await fetch(`${LITE_LLM_BASE_URL}/v1/chat/completions`, options);
6507+
const gptData = await gptResponse.json();
6508+
return gptData;
6509+
};
6510+
63936511
export const getGPTContent = (gptData) => gptData.choices[0].message.content;
63946512
</code-fragment></wpm-package></code-folder><code-folder name="Basic"><code-fragment data-type="text/markdown" name="README"># Basic
63956513

@@ -18008,6 +18126,20 @@
1800818126
&lt;ModelUploader />
1800918127
&lt;/Varv>, 1200);
1801018128
}
18129+
</code-fragment><code-fragment auto data-type="text/javascript" name="Init Manager Concept">const initConcept = async () => {
18130+
try {
18131+
const managers = await VarvEngine.lookupInstances('ModelManager');
18132+
if (managers.length === 0) {
18133+
await VarvEngine.getConceptFromType('ModelManager').create(null, {});
18134+
}
18135+
} catch (e) {
18136+
// Ignore
18137+
}
18138+
};
18139+
18140+
VarvEngine.registerEventCallback('engineReloaded', () => {
18141+
initConcept();
18142+
});
1801118143
</code-fragment></wpm-package><wpm-package id="ModelShelf" name="ModelShelf"><code-fragment data-type="wpm/descriptor"><wpm-descriptor>{
1801218144
"description": "A model gallery shelf for all uploaded models.",
1801318145
"dependencies": [

0 commit comments

Comments
 (0)