import { isMobile } from './RossAscends-mods.js'; import { amount_gen, callPopup, eventSource, event_types, getRequestHeaders, max_context, setGenerationParamsFromPreset } from '../script.js'; import { textgenerationwebui_settings as textgen_settings, textgen_types } from './textgen-settings.js'; import { tokenizers } from './tokenizers.js'; let mancerModels = []; let togetherModels = []; let infermaticAIModels = []; let dreamGenModels = []; let vllmModels = []; let aphroditeModels = []; export let openRouterModels = []; export async function loadOllamaModels(data) { if (!Array.isArray(data)) { console.error('Invalid Ollama models data', data); return; } if (!data.find(x => x.id === textgen_settings.ollama_model)) { textgen_settings.ollama_model = data[0]?.id || ''; } $('#ollama_model').empty(); for (const model of data) { const option = document.createElement('option'); option.value = model.id; option.text = model.name; option.selected = model.id === textgen_settings.ollama_model; $('#ollama_model').append(option); } } export async function loadTogetherAIModels(data) { if (!Array.isArray(data)) { console.error('Invalid Together AI models data', data); return; } togetherModels = data; if (!data.find(x => x.name === textgen_settings.togetherai_model)) { textgen_settings.togetherai_model = data[0]?.name || ''; } $('#model_togetherai_select').empty(); for (const model of data) { // Hey buddy, I think you've got the wrong door. if (model.display_type === 'image') { continue; } const option = document.createElement('option'); option.value = model.name; option.text = model.display_name; option.selected = model.name === textgen_settings.togetherai_model; $('#model_togetherai_select').append(option); } } export async function loadInfermaticAIModels(data) { if (!Array.isArray(data)) { console.error('Invalid Infermatic AI models data', data); return; } infermaticAIModels = data; if (!data.find(x => x.id === textgen_settings.infermaticai_model)) { textgen_settings.infermaticai_model = data[0]?.id || ''; } $('#model_infermaticai_select').empty(); for (const model of data) { if (model.display_type === 'image') { continue; } const option = document.createElement('option'); option.value = model.id; option.text = model.id; option.selected = model.id === textgen_settings.infermaticai_model; $('#model_infermaticai_select').append(option); } } export async function loadDreamGenModels(data) { if (!Array.isArray(data)) { console.error('Invalid DreamGen models data', data); return; } dreamGenModels = data; if (!data.find(x => x.id === textgen_settings.dreamgen_model)) { textgen_settings.dreamgen_model = data[0]?.id || ''; } $('#model_dreamgen_select').empty(); for (const model of data) { if (model.display_type === 'image') { continue; } const option = document.createElement('option'); option.value = model.id; option.text = model.id; option.selected = model.id === textgen_settings.dreamgen_model; $('#model_dreamgen_select').append(option); } } export async function loadMancerModels(data) { if (!Array.isArray(data)) { console.error('Invalid Mancer models data', data); return; } mancerModels = data; if (!data.find(x => x.id === textgen_settings.mancer_model)) { textgen_settings.mancer_model = data[0]?.id || ''; } $('#mancer_model').empty(); for (const model of data) { const option = document.createElement('option'); option.value = model.id; option.text = model.name; option.selected = model.id === textgen_settings.mancer_model; $('#mancer_model').append(option); } } export async function loadOpenRouterModels(data) { if (!Array.isArray(data)) { console.error('Invalid OpenRouter models data', data); return; } openRouterModels = data; if (!data.find(x => x.id === textgen_settings.openrouter_model)) { textgen_settings.openrouter_model = data[0]?.id || ''; } $('#openrouter_model').empty(); for (const model of data) { const option = document.createElement('option'); option.value = model.id; option.text = model.id; option.selected = model.id === textgen_settings.openrouter_model; $('#openrouter_model').append(option); } // Calculate the cost of the selected model + update on settings change calculateOpenRouterCost(); } export async function loadVllmModels(data) { if (!Array.isArray(data)) { console.error('Invalid vLLM models data', data); return; } vllmModels = data; if (!data.find(x => x.id === textgen_settings.vllm_model)) { textgen_settings.vllm_model = data[0]?.id || ''; } $('#vllm_model').empty(); for (const model of data) { const option = document.createElement('option'); option.value = model.id; option.text = model.id; option.selected = model.id === textgen_settings.vllm_model; $('#vllm_model').append(option); } } export async function loadAphroditeModels(data) { if (!Array.isArray(data)) { console.error('Invalid Aphrodite models data', data); return; } aphroditeModels = data; if (!data.find(x => x.id === textgen_settings.aphrodite_model)) { textgen_settings.aphrodite_model = data[0]?.id || ''; } $('#aphrodite_model').empty(); for (const model of data) { const option = document.createElement('option'); option.value = model.id; option.text = model.id; option.selected = model.id === textgen_settings.aphrodite_model; $('#aphrodite_model').append(option); } } function onMancerModelSelect() { const modelId = String($('#mancer_model').val()); textgen_settings.mancer_model = modelId; $('#api_button_textgenerationwebui').trigger('click'); const limits = mancerModels.find(x => x.id === modelId)?.limits; setGenerationParamsFromPreset({ max_length: limits.context, genamt: limits.completion }, true); } function onTogetherModelSelect() { const modelName = String($('#model_togetherai_select').val()); textgen_settings.togetherai_model = modelName; $('#api_button_textgenerationwebui').trigger('click'); const model = togetherModels.find(x => x.name === modelName); setGenerationParamsFromPreset({ max_length: model.context_length }); } function onInfermaticAIModelSelect() { const modelName = String($('#model_infermaticai_select').val()); textgen_settings.infermaticai_model = modelName; $('#api_button_textgenerationwebui').trigger('click'); const model = infermaticAIModels.find(x => x.id === modelName); setGenerationParamsFromPreset({ max_length: model.context_length }); } function onDreamGenModelSelect() { const modelName = String($('#model_dreamgen_select').val()); textgen_settings.dreamgen_model = modelName; $('#api_button_textgenerationwebui').trigger('click'); // TODO(DreamGen): Consider retuning max_tokens from API and setting it here. } function onOllamaModelSelect() { const modelId = String($('#ollama_model').val()); textgen_settings.ollama_model = modelId; $('#api_button_textgenerationwebui').trigger('click'); } function onOpenRouterModelSelect() { const modelId = String($('#openrouter_model').val()); textgen_settings.openrouter_model = modelId; $('#api_button_textgenerationwebui').trigger('click'); const model = openRouterModels.find(x => x.id === modelId); setGenerationParamsFromPreset({ max_length: model.context_length }); } function onVllmModelSelect() { const modelId = String($('#vllm_model').val()); textgen_settings.vllm_model = modelId; $('#api_button_textgenerationwebui').trigger('click'); } function onAphroditeModelSelect() { const modelId = String($('#aphrodite_model').val()); textgen_settings.aphrodite_model = modelId; $('#api_button_textgenerationwebui').trigger('click'); } function getMancerModelTemplate(option) { const model = mancerModels.find(x => x.id === option?.element?.value); if (!option.id || !model) { return option.text; } const creditsPerPrompt = (model.limits?.context - model.limits?.completion) * model.pricing?.prompt; const creditsPerCompletion = model.limits?.completion * model.pricing?.completion; const creditsTotal = Math.round(creditsPerPrompt + creditsPerCompletion).toFixed(0); return $((`
${DOMPurify.sanitize(model.name)} | ${model.limits?.context} ctx / ${model.limits?.completion} res | Credits per request (max): ${creditsTotal}
`)); } function getTogetherModelTemplate(option) { const model = togetherModels.find(x => x.name === option?.element?.value); if (!option.id || !model) { return option.text; } return $((`
${DOMPurify.sanitize(model.name)} | ${model.context_length || '???'} tokens
${DOMPurify.sanitize(model.description)}
`)); } function getInfermaticAIModelTemplate(option) { const model = infermaticAIModels.find(x => x.id === option?.element?.value); if (!option.id || !model) { return option.text; } return $((`
${DOMPurify.sanitize(model.id)}
`)); } function getDreamGenModelTemplate(option) { const model = dreamGenModels.find(x => x.id === option?.element?.value); if (!option.id || !model) { return option.text; } return $((`
${DOMPurify.sanitize(model.id)}
`)); } function getOpenRouterModelTemplate(option) { const model = openRouterModels.find(x => x.id === option?.element?.value); if (!option.id || !model) { return option.text; } let tokens_dollar = Number(1 / (1000 * model.pricing?.prompt)); let tokens_rounded = (Math.round(tokens_dollar * 1000) / 1000).toFixed(0); const price = 0 === Number(model.pricing?.prompt) ? 'Free' : `${tokens_rounded}k t/$ `; return $((`
${DOMPurify.sanitize(model.name)} | ${model.context_length} ctx | ${price}
`)); } function getVllmModelTemplate(option) { const model = vllmModels.find(x => x.id === option?.element?.value); if (!option.id || !model) { return option.text; } return $((`
${DOMPurify.sanitize(model.id)}
`)); } function getAphroditeModelTemplate(option) { const model = aphroditeModels.find(x => x.id === option?.element?.value); if (!option.id || !model) { return option.text; } return $((`
${DOMPurify.sanitize(model.id)}
`)); } async function downloadOllamaModel() { try { const serverUrl = textgen_settings.server_urls[textgen_types.OLLAMA]; if (!serverUrl) { toastr.info('Please connect to an Ollama server first.'); return; } const html = `Enter a model tag, for example llama2:latest.
See Library for available models.`; const name = await callPopup(html, 'input', '', { okButton: 'Download' }); if (!name) { return; } toastr.info('Download may take a while, please wait...', 'Working on it'); const response = await fetch('/api/backends/text-completions/ollama/download', { method: 'POST', headers: getRequestHeaders(), body: JSON.stringify({ name: name, api_server: serverUrl, }), }); if (!response.ok) { throw new Error(response.statusText); } // Force refresh the model list toastr.success('Download complete. Please select the model from the dropdown.'); $('#api_button_textgenerationwebui').trigger('click'); } catch (err) { console.error(err); toastr.error('Failed to download Ollama model. Please try again.'); } } function calculateOpenRouterCost() { if (textgen_settings.type !== textgen_types.OPENROUTER) { return; } let cost = 'Unknown'; const model = openRouterModels.find(x => x.id === textgen_settings.openrouter_model); if (model?.pricing) { const completionCost = Number(model.pricing.completion); const promptCost = Number(model.pricing.prompt); const completionTokens = amount_gen; const promptTokens = (max_context - completionTokens); const totalCost = (completionCost * completionTokens) + (promptCost * promptTokens); if (!isNaN(totalCost)) { cost = '$' + totalCost.toFixed(3); } } $('#or_prompt_cost').text(cost); // Schedule an update when settings change eventSource.removeListener(event_types.SETTINGS_UPDATED, calculateOpenRouterCost); eventSource.once(event_types.SETTINGS_UPDATED, calculateOpenRouterCost); } export function getCurrentOpenRouterModelTokenizer() { const modelId = textgen_settings.openrouter_model; const model = openRouterModels.find(x => x.id === modelId); switch (model?.architecture?.tokenizer) { case 'Llama2': return tokenizers.LLAMA; case 'Llama3': return tokenizers.LLAMA3; case 'Yi': return tokenizers.YI; case 'Mistral': return tokenizers.MISTRAL; default: return tokenizers.OPENAI; } } export function getCurrentDreamGenModelTokenizer() { const modelId = textgen_settings.dreamgen_model; const model = dreamGenModels.find(x => x.id === modelId); if (model.id.startsWith('opus-v1-sm')) { return tokenizers.MISTRAL; } else if (model.id.startsWith('opus-v1-lg')) { return tokenizers.YI; } else if (model.id.startsWith('opus-v1-xl')) { return tokenizers.LLAMA; } else { return tokenizers.MISTRAL; } } jQuery(function () { $('#mancer_model').on('change', onMancerModelSelect); $('#model_togetherai_select').on('change', onTogetherModelSelect); $('#model_infermaticai_select').on('change', onInfermaticAIModelSelect); $('#model_dreamgen_select').on('change', onDreamGenModelSelect); $('#ollama_model').on('change', onOllamaModelSelect); $('#openrouter_model').on('change', onOpenRouterModelSelect); $('#ollama_download_model').on('click', downloadOllamaModel); $('#vllm_model').on('change', onVllmModelSelect); $('#aphrodite_model').on('change', onAphroditeModelSelect); if (!isMobile()) { $('#mancer_model').select2({ placeholder: 'Select a model', searchInputPlaceholder: 'Search models...', searchInputCssClass: 'text_pole', width: '100%', templateResult: getMancerModelTemplate, }); $('#model_togetherai_select').select2({ placeholder: 'Select a model', searchInputPlaceholder: 'Search models...', searchInputCssClass: 'text_pole', width: '100%', templateResult: getTogetherModelTemplate, }); $('#ollama_model').select2({ placeholder: 'Select a model', searchInputPlaceholder: 'Search models...', searchInputCssClass: 'text_pole', width: '100%', }); $('#model_infermaticai_select').select2({ placeholder: 'Select a model', searchInputPlaceholder: 'Search models...', searchInputCssClass: 'text_pole', width: '100%', templateResult: getInfermaticAIModelTemplate, }); $('#model_dreamgen_select').select2({ placeholder: 'Select a model', searchInputPlaceholder: 'Search models...', searchInputCssClass: 'text_pole', width: '100%', templateResult: getDreamGenModelTemplate, }); $('#openrouter_model').select2({ placeholder: 'Select a model', searchInputPlaceholder: 'Search models...', searchInputCssClass: 'text_pole', width: '100%', templateResult: getOpenRouterModelTemplate, }); $('#vllm_model').select2({ placeholder: 'Select a model', searchInputPlaceholder: 'Search models...', searchInputCssClass: 'text_pole', width: '100%', templateResult: getVllmModelTemplate, }); $('#aphrodite_model').select2({ placeholder: 'Select a model', searchInputPlaceholder: 'Search models...', searchInputCssClass: 'text_pole', width: '100%', templateResult: getAphroditeModelTemplate, }); } });