Extract system message templates to template files

This commit is contained in:
Cohee
2023-08-22 10:37:18 +03:00
parent d6b06d5828
commit 2615eb8532
11 changed files with 349 additions and 264 deletions

View File

@ -33,7 +33,7 @@ import {
SECRET_KEYS,
secret_state,
} from "./secrets.js";
import { debounce, delay, getStringHash } from "./utils.js";
import { debounce, delay, getStringHash, waitUntilCondition } from "./utils.js";
import { chat_completion_sources, oai_settings } from "./openai.js";
var NavToggle = document.getElementById("nav-toggle");
@ -717,7 +717,12 @@ export async function initMovingUI() {
// ---------------------------------------------------
$("document").ready(function () {
jQuery(async function () {
try {
await waitUntilCondition(() => online_status !== undefined, 1000, 10);
} catch {
console.log('Timeout waiting for online_status');
}
// initial status check
setTimeout(() => {

View File

@ -28,7 +28,7 @@ async function updateQuickReplyPresetList() {
if (result.ok) {
var data = await result.json();
presets = data.quickReplyPresets?.length ? data.quickReplyPresets : [];
console.log(presets)
console.debug('Quick Reply presets', presets);
$("#quickReplyPresets").find('option[value!=""]').remove();
@ -284,7 +284,7 @@ async function doQR(_, text) {
}
text = Number(text)
//use scale starting with 0
//use scale starting with 0
//ex: user inputs "/qr 2" >> qr with data-index 1 (but 2nd item displayed) gets triggered
let QRnum = Number(text - 1)
if (QRnum <= 0) { QRnum = 0 }

75
public/scripts/i18n.js Normal file
View File

@ -0,0 +1,75 @@
import { waitUntilCondition } from "./utils.js";
const storageKey = "language";
export const localeData = await fetch("i18n.json").then(response => response.json());
export function applyLocale(root = document) {
const overrideLanguage = localStorage.getItem("language");
var language = overrideLanguage || navigator.language || navigator.userLanguage;
language = language.toLowerCase();
//load the appropriate language file
if (localeData.lang.indexOf(language) < 0) language = "en";
const $root = root instanceof Document ? $(root) : $(new DOMParser().parseFromString(root, "text/html"));
//find all the elements with `data-i18n` attribute
$root.find("[data-i18n]").each(function () {
//read the translation from the language data
const keys = $(this).data("i18n").split(';'); // Multi-key entries are ; delimited
for (const key of keys) {
const attributeMatch = key.match(/\[(\S+)\](.+)/); // [attribute]key
if (attributeMatch) { // attribute-tagged key
const localizedValue = localeData?.[language]?.[attributeMatch[2]];
if (localizedValue) {
$(this).attr(attributeMatch[1], localizedValue);
}
} else { // No attribute tag, treat as 'text'
const localizedValue = localeData?.[language]?.[key];
if (localizedValue) {
$(this).text(localizedValue);
}
}
}
});
if (root !== document) {
return $root.get(0).body.innerHTML;
}
}
function addLanguagesToDropdown() {
if (!Array.isArray(localeData?.lang)) {
return;
}
for (const lang of localeData.lang) {
const option = document.createElement('option');
option.value = lang;
option.innerText = lang;
$('#ui_language_select').append(option);
}
const selectedLanguage = localStorage.getItem(storageKey);
if (selectedLanguage) {
$('#ui_language_select').val(selectedLanguage);
}
}
jQuery(async () => {
waitUntilCondition(() => !!localeData);
window["applyLocale"] = applyLocale;
applyLocale();
addLanguagesToDropdown();
$('#ui_language_select').on('change', async function () {
const language = $(this).val();
if (language) {
localStorage.setItem(storageKey, language);
} else {
localStorage.removeItem(storageKey);
}
location.reload();
});
});

View File

@ -207,7 +207,6 @@ let movingUIPresets = [];
let context_presets = [];
const storage_keys = {
ui_language: "language",
fast_ui_mode: "TavernAI_fast_ui_mode",
avatar_style: "TavernAI_avatar_style",
chat_display: "TavernAI_chat_display",
@ -1277,26 +1276,6 @@ function doResetPanels() {
$("#movingUIreset").trigger('click');
}
function addLanguagesToDropdown() {
$.getJSON('i18n.json', function (data) {
if (!Array.isArray(data?.lang)) {
return;
}
for (const lang of data.lang) {
const option = document.createElement('option');
option.value = lang;
option.innerText = lang;
$('#ui_language_select').append(option);
}
const selectedLanguage = localStorage.getItem(storage_keys.ui_language);
if (selectedLanguage) {
$('#ui_language_select').val(selectedLanguage);
}
});
}
function setAvgBG() {
const bgimg = new Image();
bgimg.src = $('#bg1')
@ -2025,18 +2004,6 @@ $(document).ready(() => {
saveSettingsDebounced();
});
$('#ui_language_select').on('change', async function () {
const language = $(this).val();
if (language) {
localStorage.setItem(storage_keys.ui_language, language);
} else {
localStorage.removeItem(storage_keys.ui_language);
}
location.reload();
});
$(window).on('focus', function () {
browser_has_focus = true;
});
@ -2052,5 +2019,4 @@ $(document).ready(() => {
registerSlashCommand('cut', doMesCut, [], ' <span class="monospace">(requred number)</span> cuts the specified message from the chat', true, true);
registerSlashCommand('resetpanels', doResetPanels, ['resetui'], ' resets UI panels to original state.', true, true);
registerSlashCommand('bgcol', setAvgBG, [], ' WIP test of auto-bg avg coloring', true, true);
addLanguagesToDropdown();
});

View File

@ -0,0 +1,21 @@
Text formatting commands:
<ul>
<li><tt>*text*</tt> - displays as <i>italics</i></li>
<li><tt>**text**</tt> - displays as <b>bold</b></li>
<li><tt>***text***</tt> - displays as <b><i>bold italics</i></b></li>
<li><tt>```text```</tt> - displays as a code block (new lines allowed between the backticks)</li>
</ul>
<pre><code> like this</code></pre>
<ul>
<li><tt>`text`</tt> - displays as <code>inline code</code></li>
<li><tt> text</tt> - displays as a blockquote (note the space after >)</li>
<blockquote>like this</blockquote>
<li><tt># text</tt> - displays as a large header (note the space)</li>
<h1>like this</h1>
<li><tt>## text</tt> - displays as a medium header (note the space)</li>
<h2>like this</h2>
<li><tt>### text</tt> - displays as a small header (note the space)</li>
<h3>like this</h3>
<li><tt>$$ text $$</tt> - renders a LaTeX formula (if enabled)</li>
<li><tt>$ text $</tt> - renders an AsciiMath formula (if enabled)</li>
</ul>

View File

@ -0,0 +1,11 @@
Hello there! Please select the help topic you would like to learn more about:
<ul>
<li><a href="#" data-displayHelp="1">Slash Commands</a> (or <tt>/help slash</tt>)</li>
<li><a href="#" data-displayHelp="2">Formatting</a> (or <tt>/help format</tt>)</li>
<li><a href="#" data-displayHelp="3">Hotkeys</a> (or <tt>/help hotkeys</tt>)</li>
<li><a href="#" data-displayHelp="4">&lcub;&lcub;Macros&rcub;&rcub;</a> (or <tt>/help macros</tt>)</li>
</ul>
<br>
<b>
Still got questions left? The <a target="_blank" href="https://docs.sillytavern.app/">Official SillyTavern Documentation Website</a> has much more information!
</b>

View File

@ -0,0 +1,13 @@
Hotkeys/Keybinds:
<ul>
<li><tt>Up</tt> = Edit last message in chat</li>
<li><tt>Ctrl+Up</tt> = Edit last USER message in chat</li>
<li><tt>Left</tt> = swipe left</li>
<li><tt>Right</tt> = swipe right (NOTE: swipe hotkeys are disabled when chatbar has something typed into it)</li>
<li><tt>Ctrl+Left</tt> = view locally stored variables (in the browser console window)</li>
<li><tt>Enter</tt> (with chat bar selected) = send your message to AI</li>
<li><tt>Ctrl+Enter</tt> = Regenerate the last AI response</li>
<li><tt>Escape</tt> = stop AI response generation</li>
<li><tt>Ctrl+Shift+Up</tt> = Scroll to context line</li>
<li><tt>Ctrl+Shift+Down</tt> = Scroll chat to bottom</li>
</ul>

View File

@ -0,0 +1,11 @@
System-wide Replacement Macros:
<ul>
<li><tt>&lcub;&lcub;user&rcub;&rcub;</tt> - your current Persona username</li>
<li><tt>&lcub;&lcub;char&rcub;&rcub;</tt> - the Character's name</li>
<li><tt>&lcub;&lcub;input&rcub;&rcub;</tt> - the user input</li>
<li><tt>&lcub;&lcub;time&rcub;&rcub;</tt> - the current time</li>
<li><tt>&lcub;&lcub;date&rcub;&rcub;</tt> - the current date</li>
<li><tt>&lcub;&lcub;idle_duration&rcub;&rcub;</tt> - the time since the last user message was sent</li>
<li><tt>&lcub;&lcub;random:(args)&rcub;&rcub;</tt> - returns a random item from the list. (ex: &lcub;&lcub;random:1,2,3,4&rcub;&rcub; will return 1 of the 4 numbers at random. Works with text lists too.</li>
<li><tt>&lcub;&lcub;roll:(formula)&rcub;&rcub;</tt> - rolls a dice. (ex: &lcub;&lcub;roll:1d6&rcub;&rcub; will roll a 6-sided dice and return a number between 1 and 6)</li>
</ul>

View File

@ -0,0 +1,72 @@
<h3>
<span id="version_display_welcome">SillyTavern</span>
<div id="version_display_welcome"></div>
</h3>
<a href="https://docs.sillytavern.app/usage/update/"" target=" _blank">
Want to update?
</a>
<hr>
<h3>How to start chatting?</h3>
<ol>
<li>Click <code><i class="fa-solid fa-plug"></i></code> and select a <a href="https://docs.sillytavern.app/usage/api-connections/" target="_blank">Chat API</a>.</li>
<li>Click <code><i class="fa-solid fa-address-card"></i></code> and pick a character</li>
</ol>
<hr>
<h3>
Want more characters?
</h3>
<i>
Not controlled by SillyTavern team.
</i>
<ul>
<li>
<a target="_blank" href="https://discord.gg/pygmalionai">
Pygmalion AI Discord
</a>
</li>
<li>
<a target="_blank" href="https://chub.ai/">
Chub (NSFW)
</a>
</li>
</ul>
<hr>
<h3>Confused or lost?</h3>
<ul>
<li>
<span class="note-link-span">?</span> - click these icons!
</li>
<li>
Enter <code>/?</code> in the chat bar
</li>
<li>
<a target="_blank" href="https://docs.sillytavern.app/">
SillyTavern Documentation Site
</a>
</li>
<li>
<a target="_blank" href="https://docs.sillytavern.app/extras/installation/">
Extras Installation Guide
</a>
</li>
</ul>
<hr>
<h3>Still have questions?</h3>
<ul>
<li>
<a target="_blank" href="https://discord.gg/RZdyAEUPvj">
Join the SillyTavern Discord
</a>
</li>
<li>
<a target="_blank" href="https://github.com/SillyTavern/SillyTavern/issues">
Post a GitHub issue
</a>
</li>
<li>
<a target="_blank" href="https://github.com/SillyTavern/SillyTavern#questions-or-suggestions">
Contact the developers
</a>
</li>
</ul>