rixty
/
SillyTavern
mirror of https://github.com/SillyTavern/SillyTavern.git
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity
SillyTavern/public/index.html

4960 lines
390 KiB
HTML
Raw Blame History

<!DOCTYPE html>
<html>
<head>
<base href="/">
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, viewport-fit=cover, initial-scale=1, maximum-scale=1.0, user-scalable=no">
<meta name="apple-mobile-web-app-capable" content="yes">
<meta name="darkreader-lock">
<meta name="robots" content="noindex, nofollow" />
<link rel="manifest" crossorigin="use-credentials" href="manifest.json">
<link href="webfonts/NotoSans/stylesheet.css" rel="stylesheet">
<!-- fontawesome webfonts-->
<link href="css/fontawesome.css" rel="stylesheet">
<link href="css/solid.css" rel="stylesheet">
<link href="css/jquery-ui.min.css" rel="stylesheet">
<link href="css/bright.min.css" rel="stylesheet">
<link href="css/cropper.min.css" rel="stylesheet">
<link href="css/toastr.min.css" rel="stylesheet">
<link href="css/select2.min.css" rel="stylesheet">
<link rel="apple-touch-icon" sizes="57x57" href="img/apple-icon-57x57.png" />
<link rel="apple-touch-icon" sizes="72x72" href="img/apple-icon-72x72.png" />
<link rel="apple-touch-icon" sizes="114x114" href="img/apple-icon-114x114.png" />
<link rel="apple-touch-icon" sizes="144x144" href="img/apple-icon-144x144.png" />
<script src="lib/object-hasown.js"></script>
<script src="lib/jquery-3.5.1.min.js"></script>
<script src="lib/jquery-ui.min.js"></script>
<script src="lib/jquery.transit.min.js"></script>
<script src="lib/jquery-cookie-1.4.1.min.js"></script>
<script src="lib/jquery.ui.touch-punch.min.js"></script>
<script src="lib/showdown.min.js"></script>
<script src="lib/showdown-katex.min.js"></script>
<script src="lib/popper.js"></script>
<script src="lib/purify.min.js"></script>
<script src="lib/highlight.min.js"></script>
<script src="lib/moment.min.js"></script>
<script src="lib/cropper.min.js"></script>
<script src="lib/jquery-cropper.min.js"></script>
<script src="lib/toastr.min.js"></script>
<script src="lib/fuse.js"></script>
<script src="lib/select2.min.js"></script>
<script src="lib/select2-search-placeholder.js"></script>
<script src="lib/seedrandom.min.js"></script>
<script src="lib/droll.js"></script>
<script src="lib/localforage.min.js"></script>
<script src="lib/handlebars.js"></script>
<script src="lib/pagination.js"></script>
<script src="lib/toolcool-color-picker.js"></script>
<script src="lib/svg-inject.js"></script>
<script type="module" src="lib/structured-clone/monkey-patch.js"></script>
<script type="module" src="lib/swiped-events.js"></script>
<script type="module" src="lib/eventemitter.js"></script>
<script type="module" src="scripts/power-user.js"></script>
<link rel="stylesheet" type="text/css" href="style.css">
<link rel="stylesheet" type="text/css" href="css/st-tailwind.css">
<link rel="stylesheet" type="text/css" href="css/tags.css">
<link rel="stylesheet" type="text/css" href="css/rm-groups.css">
<link rel="stylesheet" type="text/css" href="css/group-avatars.css">
<link rel="stylesheet" type="text/css" href="css/toggle-dependent.css">
<link rel="stylesheet" type="text/css" href="css/world-info.css">
<link rel="stylesheet" type="text/css" href="css/extensions-panel.css">
<link rel="stylesheet" type="text/css" href="css/select2-overrides.css">
<link rel="stylesheet" type="text/css" href="css/mobile-styles.css">
<link rel="stylesheet" href="css/bg_load.css">
<link rel="stylesheet" type="text/css" href="css/user.css">
<link rel="icon" type="image/x-icon" href="favicon.ico">
<script type="module" src="scripts/i18n.js"></script>
<script type="module" src="script.js"></script>
<script type="module" src="scripts/world-info.js"></script>
<script type="module" src="scripts/group-chats.js"></script>
<script type="module" src="scripts/kai-settings.js"></script>
<script type="module" src="scripts/textgen-settings.js"></script>
<script type="module" src="scripts/mancer-settings.js"></script>
<script type="module" src="scripts/bookmarks.js"></script>
<script type="module" src="scripts/horde.js"></script>
<script type="module" src="scripts/RossAscends-mods.js"></script>
<script type="module" src="scripts/slash-commands.js"></script>
<script type="module" src="scripts/tags.js"></script>
<script type="module" src="scripts/secrets.js"></script>
<script type="module" src="scripts/extensions.js"></script>
<script type="module" src="scripts/authors-note.js"></script>
<script type="module" src="scripts/preset-manager.js"></script>
<script type="module" src="scripts/filters.js"></script>
<script type="module" src="scripts/personas.js"></script>
<script type="module" src="scripts/server-history.js"></script>
<script type="module" src="scripts/setting-search.js"></script>
<script type="module" src="scripts/bulk-edit.js"></script>
<script type="module" src="scripts/cfg-scale.js"></script>
<script type="module" src="scripts/chats.js"></script>
<title>SillyTavern</title>
</head>
<body class="no-blur">
<div id="bg_custom"></div>
<div id="bg1"></div>
<div id="character_context_menu" class="hidden">
<ul>
<li><button id="character_context_menu_favorite" data-i18n="Favorite">Favorite</button></li>
<li><button id="character_context_menu_tag" data-i18n="Tag">Tag</button></li>
<li><button id="character_context_menu_duplicate" data-i18n="Duplicate">Duplicate</button></li>
<li><button id="character_context_menu_persona" data-i18n="Persona">Persona</button></li>
<li><button id="character_context_menu_delete" data-i18n="Delete">Delete</button></li>
</ul>
</div>
<!-- top bar central settings buttons -->
<div id="top-bar">
</div>
<div id="top-settings-holder">
<!-- background selection menu -->
<div id="ai-config-button" class="drawer">
<div class="drawer-toggle drawer-header">
<div id="leftNavDrawerIcon" class="drawer-icon fa-solid fa-sliders closedIcon" data-i18n="[title]AI Response Configuration" title="AI Response Configuration"></div>
</div>
<div id="left-nav-panel" class="drawer-content fillLeft closedDrawer">
<div id="left-nav-panelheader" class="fa-solid fa-grip drag-grabber"></div>
<div id="lm_button_panel_pin_div" data-i18n="[title]AI Configuration panel will stay open" title="Locked = AI Configuration panel will stay open">
<input type="checkbox" id="lm_button_panel_pin">
<label for="lm_button_panel_pin">
<div class="unchecked fa-solid fa-unlock "></div>
<div class="checked fa-solid fa-lock "></div>
</label>
</div>
<div id="clickSlidersTips" data-i18n="clickslidertips" class="toggle-description wide100p editable-slider-notification">
Click slider numbers to input manually.
</div>
<div id="labModeWarning" class="redWarningBG textAlignCenter displayNone">MAD LAB MODE ON</div>
<a href="https://docs.sillytavern.app/usage/common-settings/" target="_blank" title="Documentation on sampling parameters.">
<span name="samplerHelpButton" class="note-link-span topRightInset fa-solid fa-circle-question"></span>
</a>
<div class="scrollableInner">
<div class="flex-container" id="ai_response_configuration">
<div id="respective-presets-block" class="width100p">
<div id="kobold_api-presets">
<h4 class="margin0"><span data-i18n="kobldpresets">Kobold Presets</span>
<a href="https://docs.sillytavern.app/usage/api-connections/koboldai/" class="notes-link" target="_blank">
<span class="fa-solid fa-circle-question note-link-span"></span>
</a>
</h4>
<div class="flex-container flexNoGap">
<select id="settings_preset" data-preset-manager-for="kobold" class="flex1 flexBasis100p text_pole">
<option value="gui" data-i18n="guikoboldaisettings">GUI KoboldAI Settings</option>
</select>
<div class="flex-container flexBasis100p justifyCenter">
<input type="file" hidden data-preset-manager-file="kobold" accept=".json, .settings">
<i data-newbie-hidden data-preset-manager-update="kobold" class="menu_button fa-solid fa-save" title="Update current preset" data-i18n="[title]Update current preset"></i>
<i data-newbie-hidden data-preset-manager-new="kobold" class="menu_button fa-solid fa-paste" title="Save preset as" data-i18n="[title]Save preset as"></i>
<i data-newbie-hidden data-preset-manager-import="kobold" class="menu_button fa-solid fa-file-import" title="Import preset" data-i18n="[title]Import preset"></i>
<i data-newbie-hidden data-preset-manager-export="kobold" class="menu_button fa-solid fa-file-export" title="Export preset" data-i18n="[title]Export preset"></i>
<i data-newbie-hidden data-preset-manager-restore="kobold" class="menu_button fa-solid fa-recycle" title="Restore current preset" data-i18n="[title]Restore current preset"></i>
<i data-newbie-hidden data-preset-manager-delete="kobold" class="menu_button fa-solid fa-trash-can" title="Delete the preset" data-i18n="[title]Delete the preset"></i>
</div>
</div>
</div>
<div id="novel_api-presets">
<h4 class="margin0">
<span data-i18n="novelaipreserts">NovelAI Presets</span>
<a href="https://docs.sillytavern.app/usage/api-connections/novelai/" class="notes-link" target="_blank">
<span class="fa-solid fa-circle-question note-link-span"></span>
</a>
</h4>
<div class="flex-container flexNoGap">
<select id="settings_preset_novel" class="flex1 flexBasis100p text_pole" data-preset-manager-for="novel">
<option value="gui" data-i18n="default">Default</option>
</select>
<div class="flex-container flexBasis100p justifyCenter">
<input type="file" hidden data-preset-manager-file="novel" accept=".json, .settings">
<i data-newbie-hidden data-preset-manager-update="novel" class="menu_button fa-solid fa-save" title="Update current preset" data-i18n="[title]Update current preset"></i>
<i data-newbie-hidden data-preset-manager-new="novel" class="menu_button fa-solid fa-paste" title="Save preset as" data-i18n="[title]Save preset as"></i>
<i data-newbie-hidden data-preset-manager-import="novel" class="menu_button fa-solid fa-file-import" title="Import preset" data-i18n="[title]Import preset"></i>
<i data-newbie-hidden data-preset-manager-export="novel" class="menu_button fa-solid fa-file-export" title="Export preset" data-i18n="[title]Export preset"></i>
<i data-newbie-hidden data-preset-manager-restore="novel" class="menu_button fa-solid fa-recycle" title="Restore current preset" data-i18n="[title]Restore current preset"></i>
<i data-newbie-hidden data-preset-manager-delete="novel" class="menu_button fa-solid fa-trash-can" title="Delete the preset" data-i18n="[title]Delete the preset"></i>
</div>
</div>
</div>
<div id="openai_api-presets">
<div>
<h4 class="margin0"><span data-i18n="openaipresets">Chat Completion Presets</span></h4>
<div class="flex-container flexNoGap">
<select id="settings_preset_openai" class="flex1 text_pole" data-preset-manager-for="openai">
<option value="gui" data-i18n="default">Default</option>
</select>
<div class="flex-container flexBasis100p justifyCenter">
<input id="openai_preset_import_file" type="file" accept=".json,.settings" hidden />
<i id="update_oai_preset" class="menu_button fa-solid fa-save" title="Update current preset" data-i18n="[title]Update current preset"></i>
<i id="new_oai_preset" class="menu_button fa-solid fa-paste" title="Save preset as" data-i18n="[title]Save preset as"></i>
<i data-newbie-hidden title="Import preset" id="import_oai_preset" class="menu_button fa-solid fa-file-import" data-i18n="[title]Import preset"></i>
<i data-newbie-hidden title="Export preset" id="export_oai_preset" class="menu_button fa-solid fa-file-export" data-i18n="[title]Export preset"></i>
<i data-newbie-hidden id="delete_oai_preset" class="menu_button fa-solid fa-trash-can" title="Delete the preset" data-i18n="[title]Delete the preset"></i>
</div>
</div>
</div>
</div>
<div id="textgenerationwebui_api-presets">
<h4 class="margin0"><span data-i18n="Text Completion presets">Text Completion presets</span></h4>
<div class="flex-container flexNoGap">
<select id="settings_preset_textgenerationwebui" class="flex1 text_pole" data-preset-manager-for="textgenerationwebui">
</select>
<div class="flex-container flexBasis100p justifyCenter">
<input type="file" hidden data-preset-manager-file="textgenerationwebui" accept=".json, .settings">
<i data-newbie-hidden data-preset-manager-update="textgenerationwebui" class="menu_button fa-solid fa-save" title="Update current preset" data-i18n="[title]Update current preset"></i>
<i data-newbie-hidden data-preset-manager-new="textgenerationwebui" class="menu_button fa-solid fa-paste" title="Save preset as" data-i18n="[title]Save preset as"></i>
<i data-newbie-hidden data-preset-manager-import="textgenerationwebui" class="menu_button fa-solid fa-file-import" title="Import preset" data-i18n="[title]Import preset"></i>
<i data-newbie-hidden data-preset-manager-export="textgenerationwebui" class="menu_button fa-solid fa-file-export" title="Export preset" data-i18n="[title]Export preset"></i>
<i data-newbie-hidden data-preset-manager-restore="textgenerationwebui" class="menu_button fa-solid fa-recycle" title="Restore current preset" data-i18n="[title]Restore current preset"></i>
<i data-newbie-hidden data-preset-manager-delete="textgenerationwebui" class="menu_button fa-solid fa-trash-can" title="Delete the preset" data-i18n="[title]Delete the preset"></i>
</div>
</div>
</div>
</div>
<div data-newbie-hidden id="ai_module_block_novel" class="width100p">
<div class="range-block">
<div class="range-block-title justifyLeft" data-i18n="AI Module">
AI Module
</div>
<div class="toggle-description justifyLeft" data-i18n="Changes the style of the generated text.">
Changes the style of the generated text.
</div>
<select id="nai_prefix">
<option value="vanilla" data-i18n="No Module">No Module</option>
<option value="special_instruct" data-i18n="Instruct">Instruct</option>
<option value="special_proseaugmenter" data-i18n="Prose Augmenter">Prose Augmenter</option>
<option value="theme_textadventure" data-i18n="Text Adventure">Text Adventure</option>
</select>
</div>
</div>
<div id="common-gen-settings-block" class="width100p">
<div id="pro-settings-block" class="flex-container gap10h5v justifyCenter">
<div id="amount_gen_block" class="alignitemscenter flex-container marginBot5 flexFlowColumn flexBasis48p flexGrow flexShrink gap0">
<small data-i18n="response legth(tokens)">Response (tokens)</small>
<input class="neo-range-slider" type="range" id="amount_gen" name="volume" min="16" max="2048" step="1">
<div data-randomization-disabled="true" class="wide100p">
<input class="neo-range-input" type="number" min="16" max="2048" step="1" data-for="amount_gen" id="amount_gen_counter">
</div>
<div id="streaming_textgenerationwebui_block" class="flex-container alignitemscenter justifyCenter marginTop5">
<label class="checkbox_label" for="streaming_textgenerationwebui">
<input type="checkbox" id="streaming_textgenerationwebui" />
<small data-i18n="Streaming">Streaming
<div class="margin5 fa-solid fa-circle-info opacity50p" title="Display the response bit by bit as it is generated.&#13;When this is off, responses will be displayed all at once when they are complete."></div>
</small>
</label>
</div>
<div id="streaming_kobold_block" class="flex-container alignitemscenter justifyCenter marginTop5">
<label class="checkbox_label" for="streaming_kobold">
<input type="checkbox" id="streaming_kobold" />
<small data-i18n="Streaming">Streaming
<div class="margin5 fa-solid fa-circle-info opacity50p" title="Display the response bit by bit as it is generated.&#13;When this is off, responses will be displayed all at once when they are complete."></div>
</small>
</label>
</div>
</div>
<div id="max_context_block" class="alignitemscenter flex-container marginBot5 flexFlowColumn flexBasis48p flexGrow flexShrink gap0">
<small data-i18n="context size(tokens)">Context (tokens)</small>
<input class="neo-range-slider" type="range" id="max_context" name="volume" min="512" max="8192" step="64">
<div data-randomization-disabled="true" class="wide100p">
<input class="neo-range-input" type="number" min="512" max="8192" step="64" data-for="max_context" id="max_context_counter">
</div>
<div class="flex-container alignitemscenter justifyCenter marginTop5" id="max_context_unlocked_block">
<label class="checkbox_label">
<input id="max_context_unlocked" type="checkbox" />
<small><span data-i18n="unlocked">Unlocked</span>
<div id="max_context_unlocked_warning" class="fa-solid fa-circle-info opacity50p " title="Only select models support context sizes greater than 4096 tokens.&#13;Increase only if you know what you're doing."></div>
</small>
</label>
</div>
</div>
</div>
<hr>
</div>
<div id="respective-ranges-and-temps" class="width100p">
<!--
<div name="OldKoboldTempAndRepPenBlock" class="flex-container gap10h5v justifyCenter" id="range_block">
</div>
-->
<div id="range_block_novel">
<div class="range-block">
<label class="checkbox_label widthFreeExpand">
<input id="streaming_novel" type="checkbox" />
<span data-i18n="Streaming">Streaming</span>
</label>
<div class="toggle-description justifyLeft">
<span data-i18n="Display the response bit by bit as it is generated.">
Display the response bit by bit as it is generated.</span><br>
<span data-i18n="When this is off, responses will be displayed all at once when they are complete.">
When this is off, responses will be displayed all at once when they are complete.
</span>
</div>
</div>
<div class="range-block">
<div class="range-block-title" data-i18n="temperature">
Temperature
</div>
<div class="range-block-range-and-counter">
<div class="range-block-range">
<input type="range" id="temp_novel" name="volume" min="0.1" max="2.50" step="0.01">
</div>
<div class="range-block-counter">
<input type="number" min="0.1" max="2.50" step="0.01" data-for="temp_novel" id="temp_counter_novel">
</div>
</div>
</div>
<div class="range-block">
<div class="range-block-title" data-i18n="rep.pen">
Repetition Penalty
</div>
<div class="range-block-range-and-counter">
<div class="range-block-range">
<input type="range" id="rep_pen_novel" name="volume" min="1" max="8" step="0.05">
</div>
<div class="range-block-counter">
<input type="number" min="1" max="8" step="0.05" data-for="rep_pen_novel" id="rep_pen_counter_novel">
</div>
</div>
</div>
<div data-newbie-hidden class="range-block">
<div class="range-block-title" data-i18n="Rep. Pen. Range.">
Repetition Penalty Range
</div>
<div class="range-block-range-and-counter">
<div class="range-block-range">
<input type="range" id="rep_pen_size_novel" name="volume" min="0" max="8192" step="1">
</div>
<div class="range-block-counter">
<input type="number" min="0" max="8192" step="1" data-for="rep_pen_size_novel" id="rep_pen_size_counter_novel">
</div>
</div>
</div>
<div data-newbie-hidden class="range-block">
<div class="range-block-title" data-i18n="Rep. Pen. Slope">
Repetition Penalty Slope
</div>
<div class="range-block-range-and-counter">
<div class="range-block-range">
<input type="range" id="rep_pen_slope_novel" name="volume" min="0" max="10" step="0.01">
</div>
<div class="range-block-counter">
<input type="number" min="0" max="10" step="0.01" data-for="rep_pen_slope_novel" id="rep_pen_slope_counter_novel">
</div>
</div>
</div>
<div data-newbie-hidden class="range-block">
<div class="range-block-title" data-i18n="Rep. Pen. Freq.">
Repetition Penalty Frequency
</div>
<div class="range-block-range-and-counter">
<div class="range-block-range">
<input type="range" id="rep_pen_freq_novel" name="volume" min="0" max="1" step="0.001">
</div>
<div class="range-block-counter">
<input type="number" min="0" max="1" step="0.001" data-for="rep_pen_freq_novel" id="rep_pen_freq_counter_novel">
</div>
</div>
</div>
<div data-newbie-hidden class="range-block">
<div class="range-block-title" data-i18n="Rep. Pen. Presence">
Repetition Penalty Presence
</div>
<div class="range-block-range-and-counter">
<div class="range-block-range">
<input type="range" id="rep_pen_presence_novel" name="volume" min="0" max="1" step="0.001">
</div>
<div class="range-block-counter">
<input type="number" min="0" max="1" step="0.001" data-for="rep_pen_presence_novel" id="rep_pen_presence_counter_novel">
</div>
</div>
</div>
<div data-newbie-hidden class="range-block">
<div class="range-block-title" data-i18n="Tail Free Sampling">
Tail Free Sampling
</div>
<div class="range-block-range-and-counter">
<div class="range-block-range">
<input type="range" id="tail_free_sampling_novel" name="volume" min="0" max="1" step="0.001">
</div>
<div class="range-block-counter">
<input type="number" min="0" max="1" step="0.001" data-for="tail_free_sampling_novel" id="tail_free_sampling_counter_novel">
</div>
</div>
</div>
<div data-newbie-hidden class="range-block">
<div class="range-block-title" data-i18n="Phrase Repetition Penalty">
Phrase Repetition Penalty
</div>
<select id="phrase_rep_pen_novel">
<option value="off" data-i18n="Off">Off</option>
<option value="very_light" data-i18n="Very light">Very light</option>
<option value="light" data-i18n="Light">Light</option>
<option value="medium" data-i18n="Medium">Medium</option>
<option value="aggressive" data-i18n="Aggressive">Aggressive</option>
<option value="very_aggressive" data-i18n="Very aggressive">Very aggressive</option>
</select>
</div>
</div>
<div id="range_block_openai">
<div data-newbie-hidden class="range-block">
<label class="checkbox_label">
<input id="oai_max_context_unlocked" type="checkbox" />
<span data-i18n="Unlocked Context Size">
Unlocked Context Size
</span>
</label>
<div class="toggle-description justifyLeft">
<span data-i18n="Unrestricted maximum value for the context slider">
Unrestricted maximum value for the context size slider. Enable only if you know
what you're doing.
</span>
</div>
</div>
<div class="range-block">
<div class="range-block-title" data-i18n="Context Size (tokens)">
Context Size (tokens)
</div>
<div class="range-block-range-and-counter">
<div class="range-block-range">
<input type="range" id="openai_max_context" name="volume" min="512" max="4095" step="1">
</div>
<div class="range-block-counter" data-randomization-disabled="true">
<input type="number" min="512" max="4095" step="1" data-for="openai_max_context" id="openai_max_context_counter">
</div>
</div>
</div>
<div class="range-block">
<div class="range-block-title" data-i18n="Max Response Length (tokens)">
Max Response Length (tokens)
</div>
<div class="wide100p">
<input type="number" id="openai_max_tokens" name="openai_max_tokens" class="text_pole" min="50" max="8000">
</div>
</div>
<div data-source="openrouter">
Max prompt cost: <span id="openrouter_max_prompt_cost">Unknown</span>
</div>
<hr>
<div class="range-block">
<label for="stream_toggle" title="Enables OpenAI completion streaming" class="checkbox_label widthFreeExpand">
<input id="stream_toggle" type="checkbox" /><span data-i18n="Streaming">
Streaming</span>
</label>
<div class="toggle-description justifyLeft">
<span data-i18n="Display the response bit by bit as it is generated.">Display
the response bit by bit as it is generated.</span><br>
<span data-i18n="When this is off, responses will be displayed all at once when they are complete.">When
this is off, responses will be displayed all at once when they are
complete.</span>
</div>
</div>
<div class="range-block" data-source="openai,claude,windowai,openrouter,ai21,scale,palm">
<div class="range-block-title" data-i18n="Temperature">
Temperature
</div>
<div class="range-block-range-and-counter">
<div class="range-block-range">
<input type="range" id="temp_openai" name="volume" min="0" max="2.0" step="0.01">
</div>
<div class="range-block-counter">
<input type="number" min="0" max="2.0" step="0.01" data-for="temp_openai" id="temp_counter_openai">
</div>
</div>
</div>
<div data-newbie-hidden class="range-block" data-source="openai,openrouter,ai21">
<div class="range-block-title" data-i18n="Frequency Penalty">
Frequency Penalty
</div>
<div class="range-block-range-and-counter">
<div class="range-block-range">
<input type="range" id="freq_pen_openai" name="volume" min="-2" max="2" step="0.01">
</div>
<div class="range-block-counter">
<input type="number" min="-2" max="2" step="0.01" data-for="freq_pen_openai" id="freq_pen_counter_openai">
</div>
</div>
</div>
<div data-newbie-hidden class="range-block" data-source="openai,openrouter,ai21">
<div class="range-block-title" data-i18n="Presence Penalty">
Presence Penalty
</div>
<div class="range-block-range-and-counter">
<div class="range-block-range">
<input type="range" id="pres_pen_openai" name="volume" min="-2" max="2" step="0.01">
</div>
<div class="range-block-counter">
<input type="number" min="-2" max="2" step="0.01" data-for="pres_pen_openai" id="pres_pen_counter_openai">
</div>
</div>
</div>
<div data-newbie-hidden class="range-block" data-source="ai21">
<div class="range-block-title" data-i18n="Count Penalty">
Count Penalty
</div>
<div class="range-block-range-and-counter">
<div class="range-block-range">
<input type="range" id="count_pen" name="volume" min="0" max="1" step="0.01">
</div>
<div class="range-block-counter">
<input type="number" min="0" max="1" step="0.01" data-for="count_pen" id="count_pen_counter">
</div>
</div>
</div>
<div data-newbie-hidden class="range-block" data-source="claude,openrouter,ai21,palm">
<div class="range-block-title" data-i18n="Top K">
Top K
</div>
<div class="range-block-range-and-counter">
<div class="range-block-range">
<input type="range" id="top_k_openai" name="volume" min="0" max="200" step="1">
</div>
<div class="range-block-counter">
<input type="number" min="0" max="200" step="1" data-for="top_k_openai" id="top_k_counter_openai">
</div>
</div>
</div>
<div data-newbie-hidden class="range-block" data-source="openai,claude,openrouter,ai21,scale,palm">
<div class="range-block-title" data-i18n="Top-p">
Top P
</div>
<div class="range-block-range-and-counter">
<div class="range-block-range">
<input type="range" id="top_p_openai" name="volume" min="0" max="1" step="0.01">
</div>
<div class="range-block-counter">
<input type="number" min="0" max="1" step="0.01" data-for="top_p_openai" id="top_p_counter_openai">
</div>
</div>
</div>
<div class="inline-drawer m-t-1 wide100p">
<div class="inline-drawer-toggle inline-drawer-header">
<b data-i18n="Quick Edit">Quick Prompts Edit</b>
<div class="fa-solid fa-circle-chevron-down inline-drawer-icon down"></div>
</div>
<div class="inline-drawer-content">
<div class="range-block m-t-1">
<div class="justifyLeft" data-i18n="Main">Main</div>
<div class="wide100p">
<textarea id="main_prompt_quick_edit_textarea" class="text_pole textarea_compact autoSetHeight" rows="6" placeholder="&mdash;" data-pm-prompt="main"></textarea>
</div>
</div>
<div class="range-block m-t-1">
<div class="justifyLeft" data-i18n="NSFW">NSFW</div>
<div class="wide100p">
<textarea id="nsfw_prompt_quick_edit_textarea" class="text_pole textarea_compact autoSetHeight" rows="6" placeholder="&mdash;" data-pm-prompt="nsfw"></textarea>
</div>
</div>
<div class="range-block m-t-1">
<div class="justifyLeft" data-i18n="Jailbreak">Jailbreak</div>
<div class="wide100p">
<textarea id="jailbreak_prompt_quick_edit_textarea" class="text_pole textarea_compact autoSetHeight" rows="6" placeholder="&mdash;" data-pm-prompt="jailbreak"></textarea>
</div>
</div>
<div id="claude_assistant_prefill_block" data-source="claude" class="range-block">
<span id="claude_assistant_prefill_text" data-i18n="Assistant Prefill">Assistant Prefill</span>
<textarea id="claude_assistant_prefill" class="text_pole textarea_compact" name="assistant_prefill autoSetHeight" rows="3" maxlength="10000" data-i18n="[placeholder]Start Claude's answer with..." placeholder="Start Claude's answer with..."></textarea>
</div>
</div>
</div>
<div data-newbie-hidden class="inline-drawer wide100p">
<div class="inline-drawer-toggle inline-drawer-header">
<b data-i18n="Utility Prompts">Utility Prompts</b>
<div class="fa-solid fa-circle-chevron-down inline-drawer-icon down"></div>
</div>
<div class="inline-drawer-content">
<div class="range-block m-t-1">
<div class="range-block-title openai_restorable">
<span data-i18n="Impersonation prompt">Impersonation prompt</span>
<div id="impersonation_prompt_restore" title="Restore default prompt" class="right_menu_button">
<div class="fa-solid fa-clock-rotate-left"></div>
</div>
</div>
<div class="toggle-description justifyLeft" data-i18n="Prompt that is used for Impersonation function">
Prompt that is used for Impersonation function
</div>
<div class="wide100p">
<textarea id="impersonation_prompt_textarea" class="text_pole textarea_compact autoSetHeight" name="impersonation_prompt" rows="3" placeholder="&mdash;"></textarea>
</div>
</div>
<div class="range-block m-t-1">
<div class="range-block-title openai_restorable" data-i18n="World Info Format Template">
<span>World Info format template</span>
<div id="wi_format_restore" title="Restore default format" class="right_menu_button">
<div class="fa-solid fa-clock-rotate-left"></div>
</div>
</div>
<div class="toggle-description justifyLeft" data-i18n="Wraps activated World Info entries before inserting into the prompt.">
Wraps activated World Info entries before inserting into the prompt. Use
<tt>{0}</tt> to mark a place where the content is inserted.
</div>
<div class="wide100p">
<textarea id="wi_format_textarea" class="text_pole textarea_compact autoSetHeight" rows="3" placeholder="&mdash;"></textarea>
</div>
</div>
<div class="range-block m-t-1">
<div class="range-block-title openai_restorable" data-i18n="Scenario Format Template">
<span>Scenario format template</span>
<div id="scenario_format_restore" title="Restore default format" class="right_menu_button">
<div class="fa-solid fa-clock-rotate-left"></div>
</div>
</div>
<div class="toggle-description justifyLeft" data-i18n="Use scenario to mark a place where the content is inserted.">
Use <tt>{{scenario}}</tt> to mark a place where the content is inserted.
</div>
<div class="wide100p">
<textarea id="scenario_format_textarea" class="text_pole textarea_compact autoSetHeight" rows="3" placeholder="&mdash;"></textarea>
</div>
</div>
<div class="range-block m-t-1">
<div class="range-block-title openai_restorable" data-i18n="Personality Format Template">
<span>Personality format template</span>
<div id="personality_format_restore" title="Restore default format" class="right_menu_button">
<div class="fa-solid fa-clock-rotate-left"></div>
</div>
</div>
<div class="toggle-description justifyLeft" data-i18n="Use personality to mark a place where the content is inserted.">
Use <tt>{{personality}}</tt> to mark a place where the content is inserted.
</div>
<div class="wide100p">
<textarea id="personality_format_textarea" class="text_pole textarea_compact autoSetHeight" rows="3" placeholder="&mdash;"></textarea>
</div>
</div>
<div class="range-block m-t-1">
<div class="range-block-title openai_restorable" data-i18n="Group Nudge Prompt Template">
<span>Group Nudge prompt template</span>
<div id="group_nudge_prompt_restore" title="Restore default format" class="right_menu_button">
<div class="fa-solid fa-clock-rotate-left"></div>
</div>
</div>
<div class="toggle-description justifyLeft">
<span data-i18n="Sent at the end of the group chat history to force reply from a specific character.">
Sent at the end of the group chat history to force reply from a specific character.
</span>
</div>
<div class="wide100p">
<textarea id="group_nudge_prompt_textarea" class="text_pole textarea_compact autoSetHeight" rows="3" placeholder="&mdash;"></textarea>
</div>
</div>
<div class="range-block m-t-1">
<div class="range-block-title openai_restorable" data-i18n="New Chat">
<span>New Chat</span>
<div id="newchat_prompt_restore" title="Restore new chat prompt" class="right_menu_button">
<div class="fa-solid fa-clock-rotate-left"></div>
</div>
</div>
<div class="toggle-description justifyLeft">
<span data-i18n="Set at the beginning of the chat history to indicate that a new chat is about to start.">
Set at the beginning of the chat history to indicate that a new chat is about to start.
</span>
</div>
<div class="wide100p">
<textarea id="newchat_prompt_textarea" class="text_pole textarea_compact autoSetHeight" name="new_chat" rows="3" placeholder="&mdash;"></textarea>
</div>
</div>
<div class="range-block m-t-1">
<div class="range-block-title openai_restorable">
<span data-i18n="New Group Chat">New Group Chat</span>
<div id="newgroupchat_prompt_restore" title="Restore default prompt" data-i18n="[title]Restore new group chat prompt" class="right_menu_button">
<div class="fa-solid fa-clock-rotate-left"></div>
</div>
</div>
<div class="toggle-description justifyLeft">
<span data-i18n="Set at the beginning of the chat history to indicate that a new group chat is about to start.">
Set at the beginning of the chat history to indicate that a new group chat is about to start.
</span>
</div>
<div class="wide100p">
<textarea id="newgroupchat_prompt_textarea" class="text_pole textarea_compact autoSetHeight" name="new_group_chat" rows="3" placeholder="&mdash;"></textarea>
</div>
</div>
<div class="range-block m-t-1">
<div class="range-block-title openai_restorable">
<span data-i18n="New Example Chat">New Example Chat</span>
<div id="newexamplechat_prompt_restore" title="Restore new example chat prompt" data-i18n="[title]Restore default prompt" class="right_menu_button">
<div class="fa-solid fa-clock-rotate-left"></div>
</div>
</div>
<div class="toggle-description justifyLeft">
<span data-i18n="Set at the beginning of Dialogue examples to indicate that a new example chat is about to start.">
Set at the beginning of Dialogue examples to indicate that a new example chat is about to start.
</span>
</div>
<div class="wide100p">
<textarea id="newexamplechat_prompt_textarea" class="text_pole textarea_compact autoSetHeight" name="new_example_chat" rows="3" placeholder="&mdash;"></textarea>
</div>
</div>
<div class="range-block m-t-1">
<div class="range-block-title openai_restorable" data-i18n="Continue nudge">
<span>Continue nudge</span>
<div id="continue_nudge_prompt_restore" title="Restore new chat prompt" class="right_menu_button">
<div class="fa-solid fa-clock-rotate-left"></div>
</div>
</div>
<div class="toggle-description justifyLeft">
<span data-i18n="Set at the beginning of the chat history to indicate that a new chat is about to start.">
Set at the end of the chat history when the continue button is pressed.
</span>
</div>
<div class="wide100p">
<textarea id="continue_nudge_prompt_textarea" class="text_pole textarea_compact autoSetHeight" name="continue_nudge" rows="3" placeholder="&mdash;"></textarea>
</div>
</div>
<div class="range-block m-t-1">
<div class="range-block-title justifyLeft" data-i18n="Replace empty message">
Replace empty message
</div>
<div class="toggle-description justifyLeft">
<span data-i18n="Send this text instead of nothing when the text box is empty.">
Send this text instead of nothing when the text box is empty.
</span>
</div>
<div class="wide100p">
<textarea id="send_if_empty_textarea" class="text_pole textarea_compact autoSetHeight" name="send_if_empty" rows="3" placeholder="&mdash;"></textarea>
</div>
</div>
</div>
</div>
<hr data-source="openai,claude">
<div class="range-block" data-source="openai,claude">
<div class="range-block-title justifyLeft" data-i18n="OpenAI Reverse Proxy">
OpenAI / Claude Reverse Proxy
</div>
<div class="toggle-description justifyLeft">
<span data-i18n="Alternative server URL (leave empty to use the default value).">
Alternative server URL (leave empty to use the default value).<br>
</span>
<div id="ReverseProxyWarningMessage" class="reverse_proxy_warning">
<b data-i18n="Remove your real OAI API Key from the API panel BEFORE typing anything into this box">
Remove your real OAI API Key from the API panel BEFORE typing anything
into this box.
</b>
<hr>
<b data-i18n="We cannot provide support for problems encountered while using an unofficial OpenAI proxy">
We cannot provide support for problems encountered while using an
unofficial OpenAI proxy.
</b>
</div>
</div>
<div class="wide100p">
<input id="openai_reverse_proxy" type="text" class="text_pole" placeholder="https://api.openai.com/v1" maxlength="500" />
</div>
</div>
<div class="range-block" data-source="openai,claude">
<div class="range-block-title justifyLeft" data-i18n="Proxy Password">
Proxy Password
</div>
<div class="toggle-description justifyLeft">
<span data-i18n="Will be used as a password for the proxy instead of API key.">
Will be used as a password for the proxy instead of API key.<br>
</span>
</div>
<div class="flex-container width100p">
<input id="openai_proxy_password" type="password" class="text_pole flex1" placeholder="" maxlength="500" form="openai_form" />
<div id="openai_proxy_password_show" title="Peek a password" class="menu_button fa-solid fa-eye-slash fa-fw"></div>
</div>
</div>
<div data-newbie-hidden class="range-block" data-source="openai,openrouter">
<div class="range-block-title justifyLeft" data-i18n="Seed">
Seed
</div>
<div class="toggle-description justifyLeft" data-i18n="Set to get deterministic results. Use -1 for random seed.">
Set to get deterministic results. Use -1 for random seed.
</div>
<div class="wide100p">
<input type="number" id="seed_openai" name="seed_openai" class="text_pole" min="-1" max="2147483647" value="-1">
</div>
</div>
</div>
</div>
<div id="advanced-ai-config-block" class="width100p">
<div id="kobold_api-settings">
<div class="flex-container gap10h5v justifyCenter">
<div class="alignitemscenter flex-container flexFlowColumn flexBasis48p flexGrow flexShrink gap0">
<small>
<span data-i18n="temperature">Temperature</span>
<div class="fa-solid fa-circle-info opacity50p" title="Temperature controls the randomness in token selection:&#13;- low temperature (<1.0) leads to more predictable text, favoring higher probability tokens.&#13;- high temperature (>1.0) increases creativity and diversity in the output by giving lower probability tokens a better chance.&#13;Set to 1.0 for the original probabilities."></div>
</small>
<input class="neo-range-slider" type="range" id="temp" name="volume" min="0.0" max="4.0" step="0.01">
<input class="neo-range-input" type="number" min="0.0" max="4.0" step="0.01" data-for="temp" id="temp_counter">
</div>
<div data-newbie-hidden class="alignitemscenter flex-container flexFlowColumn flexBasis48p flexGrow flexShrink gap0">
<small>
<span data-i18n="Top K">Top K</span>
<div class="fa-solid fa-circle-info opacity50p" title="Top K sets a maximum amount of top tokens that can be chosen from.&#13;E.g Top K is 20, this means only the 20 highest ranking tokens will be kept (regardless of their probabilities being diverse or limited).&#13;Set to 0 to disable."></div>
</small>
<input class="neo-range-slider" type="range" id="top_k" name="volume" min="0" max="100" step="1">
<input class="neo-range-input" type="number" min="0" max="100" step="1" data-for="top_k" id="top_k_counter">
</div>
<div data-newbie-hidden class="alignitemscenter flex-container flexFlowColumn flexBasis48p flexGrow flexShrink gap0">
<small>
Top P
<div class="fa-solid fa-circle-info opacity50p" title="Top P adds up all the top tokens required to add up to the target percentage.&#13;E.g If the Top 2 tokens are both 25%, and Top P is 0.50, only the Top 2 tokens are considered.&#13;Set to 1.0 to disable."></div>
</small>
<input class="neo-range-slider" type="range" id="top_p" name="volume" min="0" max="1" step="0.01">
<input class="neo-range-input" type="number" min="0" max="1" step="0.01" data-for="top_p" id="top_p_counter">
</div>
<div data-newbie-hidden class="alignitemscenter flex-container flexFlowColumn flexBasis48p flexGrow flexShrink gap0">
<small>
<span data-i18n="Typical P">Typical P</span>
<div class="fa-solid fa-circle-info opacity50p" title="Typical P Sampling prioritizes tokens based on their deviation from the average entropy of the set.&#13;It maintains tokens whose cumulative probability is close to a predefined threshold (e.g., 0.5), emphasizing those with average information content.&#13;Set to 1.0 to disable."></div>
</small>
<input class="neo-range-slider" type="range" id="typical_p" name="volume" min="0" max="1" step="0.001">
<input class="neo-range-input" type="number" min="0" max="1" step="0.001" data-for="typical_p" id="typical_p_counter">
</div>
<div class="alignitemscenter flex-container flexFlowColumn flexBasis48p flexGrow flexShrink gap0">
<small>
<span data-i18n="Min P">Min P</span>
<div class="fa-solid fa-circle-info opacity50p" title="Min P sets a base minimum probability.&#13;This is scaled according to the top token's probability.&#13;E.g If Top token is 80% probability, and Min P is 0.1, only tokens higher than 8% would be considered.&#13;Set to 0 to disable."></div>
</small>
<input class="neo-range-slider" type="range" id="min_p" name="volume" min="0" max="1" step="0.001">
<input class="neo-range-input" type="number" min="0" max="1" step="0.001" data-for="min_p" id="min_p_counter">
</div>
<div data-newbie-hidden class="alignitemscenter flex-container flexFlowColumn flexBasis48p flexGrow flexShrink gap0">
<small>
<span data-i18n="Top A">Top A</span>
<div class="fa-solid fa-circle-info opacity50p" title="Top A sets a threshold for token selection based on the square of the highest token probability.&#13;E.g if the Top-A value is 0.2 and the top token's probability is 50%, tokens with probabilities below 5% (0.2 * 0.5^2) are excluded.&#13;Set to 0 to disable."></div>
</small>
<input class="neo-range-slider" type="range" id="top_a" name="volume" min="0" max="1" step="0.001">
<input class="neo-range-input" type="number" min="0" max="1" step="0.001" data-for="top_a" id="top_a_counter">
</div>
<div data-newbie-hidden class="alignitemscenter flex-container flexFlowColumn flexBasis48p flexGrow flexShrink gap0">
<small>
<span data-i18n="Tail Free Sampling">Tail Free Sampling</span>
<div class="fa-solid fa-circle-info opacity50p" title="Tail-Free Sampling (TFS) analyzes the rate of change in token probabilities using derivatives.&#13;It retains tokens up to a threshold (e.g., 0.3) based on the normalized second derivative.&#13;Set to 1.0 to disable."></div>
</small>
<input class="neo-range-slider" type="range" id="tfs" name="volume" min="0" max="1" step="0.001">
<input class="neo-range-input" type="number" min="0" max="1" step="0.001" data-for="tfs" id="tfs_counter">
</div>
<div class="alignitemscenter flex-container flexFlowColumn flexBasis48p flexGrow flexShrink gap0">
<small>
<span data-i18n="rep.pen">Repetition Penalty</span>
</small>
<input class="neo-range-slider" type="range" id="rep_pen" name="volume" min="1" max="3" step="0.01">
<input class="neo-range-input" type="number" min="1" max="3" step="0.01" data-for="rep_pen" id="rep_pen_counter">
</div>
<div class="alignitemscenter flex-container flexFlowColumn flexBasis48p flexGrow flexShrink gap0">
<small>
<span data-i18n="rep.pen range">Repetition Penalty Range</span>
</small>
<input class="neo-range-slider" type="range" id="rep_pen_range" name="volume" min="0" max="4096" step="1">
<input class="neo-range-input" type="number" min="0" max="4096" step="1" data-for="rep_pen_range" id="rep_pen_range_counter">
</div>
<div data-newbie-hidden class="alignitemscenter flex-container flexFlowColumn flexBasis48p flexGrow flexShrink gap0">
<small>
<span data-i18n="Rep. Pen. Slope">Repetition Penalty Slope</span>
</small>
<input class="neo-range-slider" type="range" id="rep_pen_slope" name="volume" min="0" max="10" step="0.01">
<input class="neo-range-input" type="number" min="0" max="10" step="0.01" data-for="rep_pen_slope" id="rep_pen_slope_counter">
</div>
<div data-newbie-hidden name="miroStatBlock-kobold" class="wide100p">
<h4 class="wide100p textAlignCenter" data-i18n="Mirostat">Mirostat</h4>
<div class="flex-container flexFlowRow gap10px flexShrink">
<div class="alignitemscenter flex-container flexFlowColumn flexGrow flexShrink gap0" data-i18n="Mirostat Mode">
<small>Mode
<div class="fa-solid fa-circle-info opacity50p" title="A value of 0 disables Mirostat entirely. 1 is for Mirostat 1.0, and 2 is for Mirostat 2.0"></div>
</small>
<input class="neo-range-slider" type="range" id="mirostat_mode_kobold" name="volume" min="0" max="2" step="1" />
<input class="neo-range-input" type="number" min="0" max="2" step="1" data-for="mirostat_mode_kobold" id="mirostat_mode_counter_kobold">
</div>
<div class="alignitemscenter flex-container flexFlowColumn flexGrow flexShrink gap0" data-i18n="Mirostat Tau">
<small>Tau
<div class="fa-solid fa-circle-info opacity50p" title="Controls variability of Mirostat outputs"></div>
</small>
<input class="neo-range-slider" type="range" id="mirostat_tau_kobold" name="volume" min="0" max="20" step="0.01" />
<input class="neo-range-input" type="number" min="0" max="20" step="0.01" data-for="mirostat_tau_kobold" id="mirostat_tau_counter_kobold">
</div>
<div class="alignitemscenter flex-container flexFlowColumn flexGrow flexShrink gap0" data-i18n="Mirostat Eta">
<small>Eta
<div class="fa-solid fa-circle-info opacity50p" title="Controls learning rate of Mirostat"></div>
</small>
<input class="neo-range-slider" type="range" id="mirostat_eta_kobold" name="volume" min="0" max="1" step="0.01" />
<input class="neo-range-input" type="number" min="0" max="1" step="0.01" data-for="mirostat_eta_kobold" id="mirostat_eta_counter_kobold">
</div>
</div>
<hr class="wide100p">
</div>
<div data-newbie-hidden class="alignitemscenter justifyCenter flex-container flexFlowColumn flexBasis48p flexGrow flexShrink gap0">
<label class="checkbox_label alignItemsBaseline" for="use_default_badwordsids">
<input id="use_default_badwordsids" type="checkbox" />
<span>
<span data-i18n="Ban EOS Token">Ban EOS Token</span>
<small class="fa-solid fa-circle-info opacity50p" title="Ban the End-of-Sequence (EOS) token with KoboldCpp (and possibly also other tokens with KoboldAI).&#13;Good for story writing, but should not be used for chat and instruct mode."></small>
</span>
</label>
</div>
<div data-newbie-hidden class="alignitemscenter textAlignCenter flexBasis48p flexGrow flexShrink gap0">
<!-- <hr class="wide100p"> -->
<small data-i18n="Seed">Seed</small>
<!-- Max value is 2**64 - 1 -->
<input type="number" id="seed_kobold" class="text_pole wideMax100px" min="-1" value="-1" max="18446744073709551615" />
</div>
<div data-newbie-hidden id="grammar_block" class="wide100p">
<hr class="wide100p">
<h4 class="wide100p textAlignCenter"><span data-i18n="GBNF Grammar">GBNF Grammar</span>
<a href="https://github.com/ggerganov/llama.cpp/blob/master/grammars/README.md" target="_blank">
<small>
<div class="fa-solid fa-circle-question note-link-span"></div>
</small>
</a>
</h4>
<textarea id="grammar" rows="4" class="text_pole textarea_compact monospace" placeholder="Type in the desired custom grammar"></textarea>
</div>
<div data-newbie-hidden name="KoboldSamplerOrderBlock" class="range-block flexFlowColumn">
<hr class="wide100p">
<div class="range-block-title">
<span data-i18n="Samplers Order">Samplers Order</span>
</div>
<div class="toggle-description widthUnset" data-i18n="Samplers will be applied in a top-down order. Use with caution.">
Samplers will be applied in a top-down order.
Use with caution.
</div>
<div id="kobold_order" class="prompt_order">
<div data-id="0">
<span data-i18n="Top K">Top K</span>
<small>0</small>
</div>
<div data-id="1">
<span data-i18n="Top A">Top A</span>
<small>1</small>
</div>
<div data-id="2">
<span data-i18n="Top P">Top P & Min P</span>
<small>2</small>
</div>
<div data-id="3">
<span data-i18n="Tail Free Sampling">Tail Free Sampling</span>
<small>3</small>
</div>
<div data-id="4">
<span data-i18n="Typical P">Typical P</span>
<small>4</small>
</div>
<div data-id="5">
<span data-i18n="Temperature">Temperature</span>
<small>5</small>
</div>
<div data-id="6">
<span data-i18n="Repetition Penalty">Repetition Penalty</span>
<small>6</small>
</div>
</div>
<div id="samplers_order_recommended" class="menu_button menu_button_icon">
<span data-i18n="Load koboldcpp order">Load koboldcpp order</span>
</div>
</div>
</div>
</div><!-- end of kobold settings-->
<div data-newbie-hidden id="novel_api-settings">
<div class="range-block">
<div class="range-block-title openai_restorable">
<span data-i18n="Preamble">Preamble</span>
<div id="nai_preamble_restore" title="Restore default prompt" data-i18n="[title]Restore default prompt" class="right_menu_button">
<div class="fa-solid fa-clock-rotate-left "></div>
</div>
</div>
<div class="toggle-description justifyLeft" data-i18n="Use style tags to modify the writing style of the output.">
Use style tags to modify the writing style of the output.
</div>
<div class="wide100p">
<textarea id="nai_preamble_textarea" class="text_pole textarea_compact" name="nai_preamble" rows="2" placeholder=""></textarea>
</div>
</div>
<div class="range-block">
<div class="range-block-title justifyLeft">
<span data-i18n="Banned Tokens">Banned Tokens</span>
</div>
<div class="toggle-description justifyLeft" data-i18n="Sequences you don't want to appear in the output. One per line.">
Sequences you don't want to appear in the output. One per line. Text or [token ids].
</div>
<div class="wide100p">
<textarea id="nai_banned_tokens" class="text_pole textarea_compact" name="nai_banned_tokens" rows="3" placeholder="Example:&#10;some text&#10;[42, 69, 1337]"></textarea>
</div>
</div>
<div class="range-block">
<div class="range-block-title title_restorable">
<span data-i18n="Logit Bias">Logit Bias</span>
<div id="novelai_logit_bias_new_entry" class="menu_button menu_button_icon">
<i class="fa-xs fa-solid fa-plus"></i>
<small data-i18n="Add">Add</small>
</div>
</div>
<div class="toggle-description justifyLeft" data-i18n="Helps to ban or reenforce the usage of certain words">
Helps to ban or reinforce the usage of certain tokens.
</div>
<div class="flex-container flexFlowColumn wide100p">
<div class="novelai_logit_bias_list"></div>
</div>
</div>
<div class="range-block">
<hr>
<div class="range-block-title justifyLeft" data-i18n="CFG Scale">
CFG Scale
</div>
<div class="range-block-range-and-counter">
<div class="range-block-range">
<input type="range" id="cfg_scale_novel" name="volume" min="1" max="3" step="0.05">
</div>
<div class="range-block-counter">
<input type="number" min="1" max="3" step="0.05" data-for="cfg_scale_novel" id="cfg_scale_counter_novel">
</div>
</div>
</div>
<div class="range-block">
<div class="range-block-title justifyLeft">
<span data-i18n="Negative Prompt">Negative Prompt</span>
</div>
<div class="wide100p">
<textarea id="nai_cfg_uc" class="text_pole textarea_compact" name="cfg_uc" rows="2" data-i18n="[placeholder]Add text here that would make the AI generate things you don't want in your outputs." placeholder="Add text here that would make the AI generate things you don't want in your outputs."></textarea>
</div>
<small class="margin-bot-10px" data-i18n="Used if CFG Scale is unset globally, per chat or character">
Used if CFG Scale is unset globally, per chat or character
</small>
<hr>
</div>
<div class="range-block">
<div class="range-block-title" data-i18n="Top P">
Top P
</div>
<div class="range-block-range-and-counter">
<div class="range-block-range">
<input type="range" id="top_p_novel" name="volume" min="0" max="1" step="0.001">
</div>
<div class="range-block-counter">
<input type="number" min="0" max="1" step="0.001" data-for="top_p_novel" id="top_p_counter_novel">
</div>
</div>
</div>
<div class="range-block">
<div class="range-block-title" data-i18n="Top A">
Top A
</div>
<div class="range-block-range-and-counter">
<div class="range-block-range">
<input type="range" id="top_a_novel" name="volume" min="0" max="1" step="0.001">
</div>
<div class="range-block-counter">
<input type="number" min="0" max="1" step="0.001" data-for="top_a_novel" id="top_a_counter_novel">
</div>
</div>
</div>
<div class="range-block">
<div class="range-block-title" data-i18n="Top K">
Top K
</div>
<div class="range-block-range-and-counter">
<div class="range-block-range">
<input type="range" id="top_k_novel" name="volume" min="0" max="300" step="1">
</div>
<div class="range-block-counter">
<input type="number" min="0" max="300" step="1" data-for="top_k_novel" id="top_k_counter_novel">
</div>
</div>
</div>
<div class="range-block">
<div class="range-block-title" data-i18n="Mirostat Tau">
Mirostat Tau
</div>
<div class="range-block-range-and-counter">
<div class="range-block-range">
<input type="range" id="mirostat_tau_novel" name="volume" min="0" max="6" step="0.01">
</div>
<div class="range-block-counter">
<input type="number" min="0" max="6" step="0.01" data-for="mirostat_tau_novel" id="mirostat_tau_counter_novel">
</div>
</div>
</div>
<div class="range-block">
<div class="range-block-title" data-i18n="Mirostat LR">
Mirostat LR
</div>
<div class="range-block-range-and-counter">
<div class="range-block-range">
<input type="range" id="mirostat_lr_novel" name="volume" min="0" max="1" step="0.01">
</div>
<div class="range-block-counter">
<input type="number" min="0" max="1" step="0.01" data-for="mirostat_lr_novel" id="mirostat_lr_counter_novel">
</div>
</div>
</div>
<div class="range-block">
<div class="range-block-title" data-i18n="Typical P">
Typical P
</div>
<div class="range-block-range-and-counter">
<div class="range-block-range">
<input type="range" id="typical_p_novel" name="volume" min="0" max="1" step="0.001">
</div>
<div class="range-block-counter">
<input type="number" min="0" max="1" step="0.001" data-for="typical_p_novel" id="typical_p_counter_novel">
</div>
</div>
</div>
<div class="range-block">
<div class="range-block-title" data-i18n="Min Length">
Min Length
</div>
<div class="range-block-range-and-counter">
<div class="range-block-range">
<input type="range" id="min_length_novel" name="volume" min="1" max="150" step="1">
</div>
<div class="range-block-counter">
<input type="number" min="1" max="150" step="1" data-for="min_length_novel" id="min_length_counter_novel">
</div>
</div>
</div>
<div class="range-block flexFlowColumn">
<div class="range-block-title">
<span data-i18n="Samplers Order">Samplers Order</span>
</div>
<div class="toggle-description widthUnset" data-i18n="Samplers will be applied in a top-down order. Use with caution.">
Samplers will be applied in a top-down order. Use with caution.
</div>
<div id="novel_order" class="prompt_order">
<div data-id="0">
<span data-i18n="Temperature">Temperature</span>
<small>0</small>
<div class="toggle_button right_menu_button"></div>
</div>
<div data-id="1">
<span data-i18n="Top K Sampling">Top K Sampling</span>
<small>1</small>
<div class="toggle_button right_menu_button"></div>
</div>
<div data-id="2">
<span data-i18n="Nucleus Sampling">Nucleus Sampling</span>
<small>2</small>
<div class="toggle_button right_menu_button"></div>
</div>
<div data-id="3">
<span data-i18n="Tail Free Sampling">Tail Free Sampling</span>
<small>3</small>
<div class="toggle_button right_menu_button"></div>
</div>
<div data-id="4">
<span data-i18n="Top A Sampling">Top A Sampling</span>
<small>4</small>
<div class="toggle_button right_menu_button"></div>
</div>
<div data-id="5">
<span data-i18n="Typical P">Typical P</span>
<small>5</small>
<div class="toggle_button right_menu_button"></div>
</div>
<div data-id="6">
<span data-i18n="CFG">CFG</span>
<small>6</small>
<div class="toggle_button right_menu_button"></div>
</div>
<!-- Yes, there is no 7. It was a removed Top G sampling. RIP. -->
<div data-id="8">
<span data-i18n="Mirostat">Mirostat</span>
<small>8</small>
<div class="toggle_button right_menu_button"></div>
</div>
</div>
</div>
</div><!-- end of novel settings-->
<div id="textgenerationwebui_api-settings">
<div data-newbie-hidden data-tg-type="aphrodite" class="flex-container flexFlowColumn alignitemscenter flexBasis100p flexGrow flexShrink gap0">
<small data-i18n="Multiple swipes per generation">Multiple swipes per generation</small>
<input type="number" id="n_textgenerationwebui" class="text_pole textAlignCenter" min="1" value="1" />
</div>
<div class="flex-container gap10h5v justifyCenter">
<div class="alignitemscenter flex-container flexFlowColumn flexBasis48p flexGrow flexShrink gap0">
<small>
<span data-i18n="temperature">Temperature</span>
<div class="fa-solid fa-circle-info opacity50p" title="Temperature controls the randomness in token selection:&#13;- low temperature (<1.0) leads to more predictable text, favoring higher probability tokens.&#13;- high temperature (>1.0) increases creativity and diversity in the output by giving lower probability tokens a better chance.&#13;Set to 1.0 for the original probabilities."></div>
</small>
<input class="neo-range-slider" type="range" id="temp_textgenerationwebui" name="volume" min="0.0" max="4.0" step="0.01" x-setting-id="temp">
<input class="neo-range-input" type="number" min="0.0" max="4.0" step="0.01" data-for="temp_textgenerationwebui" id="temp_counter_textgenerationwebui">
</div>
<div data-newbie-hidden class="alignitemscenter flex-container flexFlowColumn flexBasis48p flexGrow flexShrink gap0">
<small>
<span data-i18n="Top K">Top K</span>
<div class="fa-solid fa-circle-info opacity50p" title="Top K sets a maximum amount of top tokens that can be chosen from.&#13;E.g Top K is 20, this means only the 20 highest ranking tokens will be kept (regardless of their probabilities being diverse or limited).&#13;Set to 0 to disable."></div>
</small>
<input class="neo-range-slider" type="range" id="top_k_textgenerationwebui" name="volume" min="0" max="200" step="1">
<input class="neo-range-input" type="number" min="0" max="200" step="1" data-for="top_k_textgenerationwebui" id="top_k_counter_textgenerationwebui">
</div>
<div data-newbie-hidden class="alignitemscenter flex-container flexFlowColumn flexBasis48p flexGrow flexShrink gap0">
<small>
<span data-i18n="Top P">Top P</span>
<div class="fa-solid fa-circle-info opacity50p" title="Top P adds up all the top tokens required to add up to the target percentage.&#13;E.g If the Top 2 tokens are both 25%, and Top P is 0.50, only the Top 2 tokens are considered.&#13;Set to 1.0 to disable."></div>
</small>
<input class="neo-range-slider" type="range" id="top_p_textgenerationwebui" name="volume" min="0" max="1" step="0.01">
<input class="neo-range-input" type="number" min="0" max="1" step="0.01" data-for="top_p_textgenerationwebui" id="top_p_counter_textgenerationwebui">
</div>
<div data-newbie-hidden class="alignitemscenter flex-container flexFlowColumn flexBasis48p flexGrow flexShrink gap0">
<small>Typical P</small>
<input class="neo-range-slider" type="range" id="typical_p_textgenerationwebui" name="volume" min="0" max="1" step="0.01">
<input class="neo-range-input" type="number" min="0" max="1" step="0.01" data-for="typical_p_textgenerationwebui" id="typical_p_counter_textgenerationwebui">
</div>
<div class="alignitemscenter flex-container flexFlowColumn flexBasis48p flexGrow flexShrink gap0">
<small>
<span data-i18n="Min P">Min P</span>
<div class="fa-solid fa-circle-info opacity50p" title="Min P sets a base minimum probability.&#13;This is scaled according to the top token's probability.&#13;E.g If Top token is 80% probability, and Min P is 0.1, only tokens higher than 8% would be considered.&#13;Set to 0 to disable."></div>
</small>
<input class="neo-range-slider" type="range" id="min_p_textgenerationwebui" name="volume" min="0" max="1" step="0.01">
<input class="neo-range-input" type="number" min="0" max="1" step="0.05" data-for="min_p_textgenerationwebui" id="min_p_counter_textgenerationwebui">
</div>
<div data-newbie-hidden class="alignitemscenter flex-container flexFlowColumn flexBasis48p flexGrow flexShrink gap0">
<small data-i18n="Top A">Top A</small>
<input class="neo-range-slider" type="range" id="top_a_textgenerationwebui" name="volume" min="0" max="1" step="0.01">
<input class="neo-range-input" type="number" min="0" max="1" step="0.01" data-for="top_a_textgenerationwebui" id="top_a_counter_textgenerationwebui">
</div>
<div data-newbie-hidden class="alignitemscenter flex-container flexFlowColumn flexBasis48p flexGrow flexShrink gap0">
<small data-i18n="Tail Free Sampling">Tail Free Sampling</small>
<input class="neo-range-slider" type="range" id="tfs_textgenerationwebui" name="volume" min="0" max="1" step="0.01">
<input class="neo-range-input" type="number" min="0" max="1" step="0.01" data-for="tfs_textgenerationwebui" id="tfs_counter_textgenerationwebui">
</div>
<div data-newbie-hidden class="alignitemscenter flex-container flexFlowColumn flexBasis48p flexGrow flexShrink gap0">
<small data-i18n="Epsilon Cutoff">Epsilon Cutoff</small>
<input class="neo-range-slider" type="range" id="epsilon_cutoff_textgenerationwebui" name="volume" min="0" max="9" step="0.01">
<input class="neo-range-input" type="number" min="0" max="9" step="0.01" data-for="epsilon_cutoff_textgenerationwebui" id="epsilon_cutoff_counter_textgenerationwebui">
</div>
<div data-newbie-hidden class="alignitemscenter flex-container flexFlowColumn flexBasis48p flexGrow flexShrink gap0">
<small data-i18n="Eta Cutoff">Eta Cutoff</small>
<input class="neo-range-slider" type="range" id="eta_cutoff_textgenerationwebui" name="volume" min="0" max="20" step="0.01">
<input class="neo-range-input" type="number" min="0" max="20" step="0.01" data-for="eta_cutoff_textgenerationwebui" id="eta_cutoff_counter_textgenerationwebui">
</div>
<div class="alignitemscenter flex-container flexFlowColumn flexBasis48p flexGrow flexShrink gap0">
<small data-i18n="rep.pen">Repetition Penalty</small>
<input class="neo-range-slider" type="range" id="rep_pen_textgenerationwebui" name="volume" min="1" max="3" step="0.01">
<input class="neo-range-input" type="number" min="1" max="3" step="0.01" data-for="rep_pen_textgenerationwebui" id="rep_pen_counter_textgenerationwebui">
</div>
<div data-forAphro=False class="alignitemscenter flex-container flexFlowColumn flexBasis48p flexGrow flexShrink gap0">
<small data-i18n="rep.pen range">Repetition Penalty Range</small>
<input class="neo-range-slider" type="range" id="rep_pen_range_textgenerationwebui" name="volume" min="-1" max="8192" step="1">
<input class="neo-range-input" type="number" min="-1" max="8192" step="1" data-for="rep_pen_range_textgenerationwebui" id="rep_pen_range_counter_textgenerationwebui">
</div>
<div data-forAphro=False data-newbie-hidden class="alignitemscenter flex-container flexFlowColumn flexBasis48p flexGrow flexShrink gap0">
<small data-i18n="Encoder Rep. Pen.">Encoder Penalty</small>
<input class="neo-range-slider" type="range" id="encoder_rep_pen_textgenerationwebui" name="volume" min="0.8" max="1.5" step="0.01" />
<input class="neo-range-input" type="number" min="0.8" max="1.5" step="0.01" data-for="encoder_rep_pen_textgenerationwebui" id="encoder_rep_pen_counter_textgenerationwebui">
</div>
<div data-newbie-hidden class="alignitemscenter flex-container flexFlowColumn flexBasis48p flexGrow flexShrink gap0">
<small data-i18n="Frequency Penalty">Frequency Penalty</small>
<input class="neo-range-slider" type="range" id="freq_pen_textgenerationwebui" name="volume" min="-2" max="2" step="0.01" />
<input class="neo-range-input" type="number" data-for="freq_pen_textgenerationwebui" min="-2" max="2" step="0.01" id="freq_pen_counter_textgenerationwebui">
</div>
<div data-newbie-hidden class="alignitemscenter flex-container flexFlowColumn flexBasis48p flexGrow flexShrink gap0">
<small data-i18n="Presence Penalty">Presence Penalty</small>
<input class="neo-range-slider" type="range" id="presence_pen_textgenerationwebui" name="volume" min="-2" max="2" step="0.01" />
<input class="neo-range-input" type="number" min="-2" max="2" step="0.01" data-for="presence_pen_textgenerationwebui" id="presence_pen_counter_textgenerationwebui">
</div>
<div data-forAphro=False data-newbie-hidden class="alignitemscenter flex-container flexFlowColumn flexBasis48p flexGrow flexShrink gap0">
<small data-i18n="No Repeat Ngram Size">No Repeat Ngram Size</small>
<input class="neo-range-slider" type="range" id="no_repeat_ngram_size_textgenerationwebui" name="volume" min="0" max="20" step="1">
<input class="neo-range-input" type="number" min="0" max="20" step="1" data-for="no_repeat_ngram_size_textgenerationwebui" id="no_repeat_ngram_size_counter_textgenerationwebui">
</div>
<div data-newbie-hidden class="alignitemscenter flex-container flexFlowColumn flexBasis48p flexGrow flexShrink gap0">
<small data-i18n="Min Length">Min Length</small>
<input class="neo-range-slider" type="range" id="min_length_textgenerationwebui" name="volume" min="0" max="2000" step="1" />
<input class="neo-range-input" type="number" min="0" max="2000" step="1" data-for="min_length_textgenerationwebui" id="min_length_counter_textgenerationwebui">
</div>
<!--
<div data-tg-type="aphrodite" class="alignitemscenter flex-container flexFlowColumn flexBasis48p flexGrow flexShrink gap0" data-i18n="Responses">
<small>Responses</small>
<input class="neo-range-slider" type="range" id="n_aphrodite_textgenerationwebui" name="volume" min="1" max="5" step="1">
<input class="neo-range-input" type="number" min="1" max="5" step="1" data-for="n_aphrodite" id="n_aphrodite_counter_textgenerationwebui">
</div>
<div data-tg-type="aphrodite" class="alignitemscenter flex-container flexFlowColumn flexBasis48p flexGrow flexShrink gap0 displayNone" data-i18n="Keep # Best Responses">
<small>Keep # Best Responses</small>
<input class="neo-range-slider" type="range" id="best_of_aphrodite_textgenerationwebui" name="volume" min="1" max="5" step="1">
<input class="neo-range-input" type="number" min="1" max="5" step="1" data-for="best_of_aphrodite" id="best_of_aphrodite_counter_textgenerationwebui">
</div>
<div data-tg-type="aphrodite" class="alignitemscenter flex-container flexFlowColumn flexBasis48p flexGrow flexShrink gap0 displayNone" data-i18n="Logit Probabilities">
<small>Logit Probabilities</small>
<input class="neo-range-slider" type="range" id="log_probs_aphrodite_textgenerationwebui" name="volume" min="0" max="5" step="1">
<input class="neo-range-input" type="number" min="0" max="5" step="1" data-for="log_probs_aphrodite" id="log_probs_aphrodite_counter_textgenerationwebui">
</div>
<div data-tg-type="aphrodite" class="alignitemscenter flex-container flexFlowColumn flexBasis48p flexGrow flexShrink gap0 displayNone" data-i18n="Prompt Logit Probabilities">
<small>Prompt Logit Probabilities</small>
<input class="neo-range-slider" type="range" id="prompt_log_probs_aphrodite_textgenerationwebui" name="volume" min="0" max="5" step="1">
<input class="neo-range-input" type="number" min="0" max="5" step="1" data-for="prompt_log_probs_aphrodite" id="prompt_log_probs_aphrodite_counter_textgenerationwebui">
</div>
-->
<div data-newbie-hidden name="miroStatBlock" class="wide100p">
<h4 class="wide100p textAlignCenter" data-i18n="Mirostat (mode=1 is only for llama.cpp)">Mirostat
<div class=" fa-solid fa-circle-info opacity50p " title="Mode=1 is only for llama.cpp&#13;More helpful tips coming soon."></div>
</h4>
<div class="flex-container flexFlowRow gap10px flexShrink">
<div class="alignitemscenter flex-container marginBot5 flexFlowColumn flexGrow flexShrink gap0">
<small data-i18n="Mirostat Mode">Mode</small>
<input class="neo-range-slider" type="range" id="mirostat_mode_textgenerationwebui" name="volume" min="0" max="2" step="1" />
<input class="neo-range-input" type="number" min="0" max="2" step="1" data-for="mirostat_mode_textgenerationwebui" id="mirostat_mode_counter_textgenerationwebui">
</div>
<div class="alignitemscenter flex-container marginBot5 flexFlowColumn flexGrow flexShrink gap0">
<small data-i18n="Mirostat Tau">Tau</small>
<input class="neo-range-slider" type="range" id="mirostat_tau_textgenerationwebui" name="volume" min="0" max="20" step="0.01" />
<input class="neo-range-input" type="number" min="0" max="20" step="0.01" data-for="mirostat_tau_textgenerationwebui" id="mirostat_tau_counter_textgenerationwebui">
</div>
<div class="alignitemscenter flex-container marginBot5 flexFlowColumn flexGrow flexShrink gap0">
<small data-i18n="Mirostat Eta">Eta</small>
<input class="neo-range-slider" type="range" id="mirostat_eta_textgenerationwebui" name="volume" min="0" max="1" step="0.01" />
<input class="neo-range-input" type="number" min="0" max="1" step="0.01" data-for="mirostat_eta_textgenerationwebui" id="mirostat_eta_counter_textgenerationwebui">
</div>
</div>
</div>
<div data-newbie-hidden name="beamSearchBlock" class="wide100p">
<h4 class="wide100p textAlignCenter" span data-i18n="Beam search">Beam Search
<div class=" fa-solid fa-circle-info opacity50p " title="Helpful tip coming soon."></div>
</h4>
<div class="flex-container flexFlowRow alignitemscenter gap10px flexShrink">
<div class="alignitemscenter flex-container marginBot5 flexFlowColumn flexGrow flexShrink gap0">
<small data-i18n="Number of Beams"># of Beams</small>
<input class="neo-range-slider" type="range" id="num_beams_textgenerationwebui" name="volume" min="1" max="20" step="1" />
<input class="neo-range-input" type="number" min="1" max="20" step="1" data-for="num_beams_textgenerationwebui" id="num_beams_counter_textgenerationwebui">
</div>
<div class="alignitemscenter flex-container marginBot5 flexFlowColumn flexGrow flexShrink gap0">
<small data-i18n="Length Penalty">Length Penalty</small>
<input class="neo-range-slider" type="range" id="length_penalty_textgenerationwebui" name="volume" min="-5" max="5" step="0.1" />
<input class="neo-range-input" type="number" min="-5" max="5" step="0.1" data-for="length_penalty_textgenerationwebui" id="length_penalty_counter_textgenerationwebui">
</div>
<div class="">
<label class="checkbox_label" for="early_stopping_textgenerationwebui">
<input type="checkbox" id="early_stopping_textgenerationwebui" />
<small data-i18n="Early Stopping">Early Stopping</small>
</label>
</div>
</div>
</div>
<div data-forAphro=False data-newbie-hidden name="contrastiveSearchBlock" class="alignitemscenter flex-container flexFlowColumn flexBasis48p flexGrow flexShrink gap0">
<h4 class="textAlignCenter" data-i18n="Contrastive search">Contrast Search
<div class=" fa-solid fa-circle-info opacity50p " title="Helpful tip coming soon."></div>
</h4>
<div class="alignitemscenter flex-container flexFlowColumn wide100p gap0">
<small>Penalty Alpha</small>
<input class="neo-range-slider" type="range" id="penalty_alpha_textgenerationwebui" name="volume" min="0" max="5" step="0.05" />
<input class="neo-range-input" type="number" min="0" max="5" step="0.05" data-for="penalty_alpha_textgenerationwebui" id="penalty_alpha_counter_textgenerationwebui">
</div>
</div>
<div data-newbie-hidden name="checkboxes" class="flex-container flexBasis48p justifyCenter flexGrow flexShrink ">
<div class="flex-container flexFlowColumn marginTop5">
<label data-forAphro=False class="checkbox_label flexGrow flexShrink" for="do_sample_textgenerationwebui">
<input type="checkbox" id="do_sample_textgenerationwebui" />
<small data-i18n="Do Sample">Do Sample</small>
</label>
<label data-forAphro=False class="checkbox_label flexGrow flexShrink" for="add_bos_token_textgenerationwebui">
<input type="checkbox" id="add_bos_token_textgenerationwebui" />
<small data-i18n="Add BOS Token">Add BOS Token
<div class="fa-solid fa-circle-info opacity50p " data-i18n="Add the bos_token to the beginning of prompts. Disabling this can make the replies more creative." title="Add the bos_token to the beginning of prompts. Disabling this can make the replies more creative."></div>
</small>
</label>
<label data-forAphro=False class="checkbox_label flexGrow flexShrink" for="ban_eos_token_textgenerationwebui">
<input type="checkbox" id="ban_eos_token_textgenerationwebui" />
<small data-i18n="Ban EOS Token">Ban EOS Token
<div class="fa-solid fa-circle-info opacity50p " data-i18n="Ban the eos_token. This forces the model to never end the generation prematurely" title="Ban the eos_token. This forces the model to never end the generation prematurely."></div>
</small>
</label>
<label data-tg-type="aphrodite" class="checkbox_label" for="ignore_eos_token_aphrodite_textgenerationwebui">
<input type="checkbox" id="ignore_eos_token_aphrodite_textgenerationwebui" />
<small data-i18n="Ignore EOS Token">Ignore EOS Token
<div class="fa-solid fa-circle-info opacity50p " data-i18n="Ignore the EOS Token even if it generates." title="Ignore the EOS Token even if it generates."></div>
</small>
</label>
<label class="checkbox_label flexGrow flexShrink" for="skip_special_tokens_textgenerationwebui">
<input type="checkbox" id="skip_special_tokens_textgenerationwebui" />
<small data-i18n="Skip Special Tokens">Skip Special Tokens</small>
</label>
<label data-forAphro=False class="checkbox_label flexGrow flexShrink" for="temperature_last_textgenerationwebui">
<input type="checkbox" id="temperature_last_textgenerationwebui" />
<small data-i18n="Temperature Last">Temperature Last
<div class="fa-solid fa-circle-info opacity50p " data-i18n="Use the temperature sampler last." title="Use the temperature sampler last."></div>
</small>
</label>
<label data-tg-type="aphrodite" class="checkbox_label" for="spaces_between_special_tokens_aphrodite_textgenerationwebui">
<input type="checkbox" id="spaces_between_special_tokens_aphrodite_textgenerationwebui" />
<small data-i18n="Spaces Between Special Tokens">Spaces Between Special Tokens</small>
</label>
</div>
</div>
<div data-forAphro=False data-newbie-hidden class="flex-container flexFlowColumn alignitemscenter flexBasis48p flexGrow flexShrink gap0">
<small data-i18n="Seed" class="textAlignCenter">Seed</small>
<input type="number" id="seed_textgenerationwebui" class="text_pole textAlignCenter" min="-1" value="-1" maxlength="100" />
</div>
<div data-newbie-hidden class="wide100p">
<hr data-newbie-hidden class="width100p">
<h4 class="range-block-title justifyCenter">
<span data-i18n="Banned Tokens">Banned Tokens</span>
<div class="margin5 fa-solid fa-circle-info opacity50p " title="LLaMA / Mistral / Yi models only. Make sure to select an appropriate tokenizer first.&#13;Sequences you don't want to appear in the output.&#13;One per line. Text or [token ids].&#13;Most tokens have a leading space. Use token counter if unsure."></div>
</h4>
<div class="wide100p">
<textarea id="banned_tokens_textgenerationwebui" class="text_pole textarea_compact" name="banned_tokens_textgenerationwebui" rows="3" placeholder="Example:&#10;some text&#10;[42, 69, 1337]"></textarea>
</div>
</div>
<div data-newbie-hidden data-forAphro=False class="wide100p">
<hr class="width100p">
<h4 data-i18n="CFG" class="textAlignCenter">CFG
<div class="margin5 fa-solid fa-circle-info opacity50p " title="Helpful tip coming soon."></div>
</h4>
<div class="alignitemscenter flex-container flexFlowColumn flexShrink gap0">
<small>Scale</small>
<input class="neo-range-slider" type="range" id="guidance_scale_textgenerationwebui" name="volume" min="0.1" max="4" step="0.05">
<input class="neo-range-input" type="number" min="0.1" max="4" step="0.05" data-for="guidance_scale_textgenerationwebui" id="guidance_scale_counter_textgenerationwebui">
</div>
<div class="range-block">
<div class="range-block-title justifyLeft">
<span data-i18n="Negative Prompt">Negative Prompt</span>
<small>
<div class="fa-solid fa-circle-info opacity50p" data-i18n="Used if CFG Scale is unset globally, per chat or character" title="Used if CFG Scale is unset globally, per chat or character"></div>
</small>
</div>
<div class="wide100p">
<textarea id="negative_prompt_textgenerationwebui" class="text_pole textarea_compact" name="negative_prompt" rows="3" data-i18n="[placeholder]Add text here that would make the AI generate things you don't want in your outputs." placeholder="Add text here that would make the AI generate things you don't want in your outputs."></textarea>
</div>
</div>
</div>
<div data-newbie-hidden data-forAphro=False id="grammar_block_ooba" class="wide100p">
<hr class="wide100p">
<h4 class="wide100p textAlignCenter" data-i18n="GBNF Grammar">GBNF Grammar
<a href="https://github.com/ggerganov/llama.cpp/blob/master/grammars/README.md" target="_blank">
<small>
<div class="fa-solid fa-circle-question note-link-span"></div>
</small>
</a>
</h4>
<textarea id="grammar_string_textgenerationwebui" rows="4" class="text_pole textarea_compact monospace" placeholder="Type in the desired custom grammar"></textarea>
</div>
<div data-newbie-hidden data-tg-type="koboldcpp" class="range-block flexFlowColumn">
<hr class="wide100p">
<div class="range-block-title">
<span data-i18n="Samplers Order">Samplers Order</span>
</div>
<div class="toggle-description widthUnset" data-i18n="Samplers will be applied in a top-down order. Use with caution.">
Samplers will be applied in a top-down order.
Use with caution.
</div>
<div id="koboldcpp_order" class="prompt_order">
<div data-id="0">
<span data-i18n="Top K">Top K</span>
<small>0</small>
</div>
<div data-id="1">
<span data-i18n="Top A">Top A</span>
<small>1</small>
</div>
<div data-id="2">
<span data-i18n="Top P">Top P & Min P</span>
<small>2</small>
</div>
<div data-id="3">
<span data-i18n="Tail Free Sampling">Tail Free Sampling</span>
<small>3</small>
</div>
<div data-id="4">
<span data-i18n="Typical P">Typical P</span>
<small>4</small>
</div>
<div data-id="5">
<span data-i18n="Temperature">Temperature</span>
<small>5</small>
</div>
<div data-id="6">
<span data-i18n="Repetition Penalty">Repetition Penalty</span>
<small>6</small>
</div>
</div>
<div id="koboldcpp_default_order" class="menu_button menu_button_icon">
<span data-i18n="Load default order">Load default order</span>
</div>
</div>
</div>
</div><!-- end of textgen settings-->
<div id="openai_settings">
<div class="">
<div class="range-block">
<label for="wrap_in_quotes" title="Wrap user messages in quotes before sending" class="checkbox_label widthFreeExpand">
<input id="wrap_in_quotes" type="checkbox" /><span data-i18n="Wrap in Quotes">
Wrap in Quotes</span>
</label>
<div class="toggle-description justifyLeft">
<span data-i18n="Wrap entire user message in quotes before sending.">Wrap
entire user message in quotes before sending.</span><br>
<span data-i18n="Leave off if you use quotes manually for speech.">Leave off
if you use quotes manually for speech.</span>
</div>
</div>
<div class="range-block">
<label for="names_in_completion" title="Add character names" class="checkbox_label widthFreeExpand">
<input id="names_in_completion" type="checkbox" /><span data-i18n="Add character names">Add character names</span>
</label>
<div class="toggle-description justifyLeft">
<span data-i18n="Send names in the ChatML objects.">Send names in the ChatML objects. Helps the model to associate messages with characters.</span>
</div>
</div>
<div class="range-block">
<label for="squash_system_messages" title="Squash system messages" class="checkbox_label widthFreeExpand">
<input id="squash_system_messages" type="checkbox" />
<span data-i18n="Squash system messages">
Squash system messages
</span>
</label>
<div class="toggle-description justifyLeft">
<span data-i18n="Combines consecutive system messages into one.">
Combines consecutive system messages into one (excluding example dialogues).
May improve coherence for some models.
</span>
</div>
</div>
<div class="range-block" data-source="openai,openrouter">
<label for="openai_image_inlining" class="checkbox_label flexWrap widthFreeExpand">
<input id="openai_image_inlining" type="checkbox" />
<span data-i18n="Send inline images">Send inline images</span>
<div id="image_inlining_hint" class="flexBasis100p toggle-description justifyLeft">
Sends images in prompts if the model supports it (e.g. GPT-4V or Llava 13B).
Use the <code><i class="fa-solid fa-paperclip"></i></code> action on any message or the
<code><i class="fa-solid fa-wand-magic-sparkles"></i></code> menu to attach an image file to the chat.
</div>
</label>
</div>
<div class="range-block" data-source="ai21">
<label for="use_ai21_tokenizer" title="Use AI21 Tokenizer" class="checkbox_label widthFreeExpand">
<input id="use_ai21_tokenizer" type="checkbox" /><span data-i18n="Use AI21 Tokenizer">Use AI21 Tokenizer</span>
</label>
<div class="toggle-description justifyLeft">
<span data-i18n="Use the appropriate tokenizer for Jurassic models, which is more efficient than GPT's.">Use the appropriate tokenizer for Jurassic models, which is more efficient than GPT's.</span>
</div>
</div>
<div data-newbie-hidden class="range-block" data-source="claude">
<label for="exclude_assistant" title="Exclude Assistant suffix" class="checkbox_label widthFreeExpand">
<input id="exclude_assistant" type="checkbox" /><span data-i18n="Exclude Assistant suffix">Exclude Assistant suffix</span>
</label>
<div class="toggle-description justifyLeft">
<span data-i18n="Exclude the assistant suffix from being added to the end of prompt.">Exclude the assistant suffix from being added to the end of prompt (Requires jailbreak with 'Assistant:' in it).</span>
</div>
</div>
</div>
<div data-newbie-hidden class="range-block m-t-1" data-source="openai,openrouter,scale">
<div class="range-block-title openai_restorable" data-i18n="Logit Bias">
Logit Bias
</div>
<div class="toggle-description justifyLeft" data-i18n="Helps to ban or reenforce the usage of certain words">
Helps to ban or reinforce the usage of certain tokens. Confirm token parsing with <a target="_blank" href="https://platform.openai.com/tokenizer/">Tokenizer</a>.
</div>
<div class="openai_logit_bias_preset_form">
<select id="openai_logit_bias_preset">
</select>
<i title="New preset" id="openai_logit_bias_new_preset" class="menu_button fa-solid fa-plus" data-i18n="[title]New preset"></i>
<i title="Import preset" id="openai_logit_bias_import_preset" class="menu_button fa-solid fa-file-import" data-i18n="[title]Import preset"></i>
<i title="Export preset" id="openai_logit_bias_export_preset" class="menu_button fa-solid fa-file-export" data-i18n="[title]Export preset"></i>
<i title="Delete preset" id="openai_logit_bias_delete_preset" class="menu_button fa-solid fa-trash-can" data-i18n="[title]Delete preset"></i>
<input id="openai_logit_bias_import_file" type="file" accept=".json" hidden />
</div>
<div class="inline-drawer wide100p">
<div class="inline-drawer-toggle inline-drawer-header">
<b data-i18n="View / Edit bias preset">View / Edit bias preset</b>
<div class="fa-solid fa-circle-chevron-down inline-drawer-icon down"></div>
</div>
<div class="inline-drawer-content">
<div id="openai_logit_bias_new_entry" class="menu_button wide100p flex-container justifyCenter" data-i18n="Add bias entry">
Add bias entry
</div>
<div class="openai_logit_bias_list"></div>
<div class="m-t-1">
<small>
<i class="fa-solid fa-lightbulb"></i>
&nbsp;
<span data-i18n="Most tokens have a leading space.">
Most tokens have a leading space.
</span>
</small>
</div>
</div>
</div>
</div>
<div data-newbie-hidden class="range-block m-b-1">
<div id="completion_prompt_manager"></div>
</div>
</div><!-- end of OpenAI settings-->
</div>
</div>
</div>
</div>
</div>
<div id="sys-settings-button" class="drawer">
<div class="drawer-toggle drawer-header">
<div id="API-status-top" class="drawer-icon fa-solid fa-plug-circle-exclamation closedIcon" title="API Connections" data-i18n="[title]API Connections"></div>
</div>
<div id="rm_api_block" class="drawer-content closedDrawer">
<h3 class="margin0" id="title_api">API</h3>
<div class="flex-container flexFlowColumn">
<div id="main-API-selector-block">
<select id="main_api">
<option value="kobold"><span data-i18n="KoboldAI">KoboldAI Classic</span></option>
<option value="koboldhorde"><span data-i18n="KoboldAI Horde">KoboldAI Horde</span></option>
<option value="novel"><span data-i18n="NovelAI">NovelAI</span></option>
<option value="textgenerationwebui"><span data-i18n="Text Completion">Text Completion (ooba, Mancer, Aphrodite, TabbyAPI, KoboldCpp)</span></option>
<option value="openai"><span data-i18n="Chat Completion (OpenAI, Claude, Window/OpenRouter, Scale, AI21)">Chat Completion (OpenAI, Claude, Window, OpenRouter, Scale, AI21, PaLM)</span></option>
</select>
</div>
<div id="kobold_horde" style="position: relative;"> <!-- shows the kobold settings -->
<form action="javascript:void(null);" method="post" enctype="multipart/form-data">
<div id="kobold_horde_block">
<ul>
<li data-i18n="Avoid sending sensitive information to the Horde.">
Avoid sending sensitive information to the Horde.
<a target="_blank" href="https://docs.sillytavern.app/usage/api-connections/horde/" data-i18n="Review the Privacy statement">Review the Privacy statement</a>
</li>
<li>
<a target="_blank" href="https://horde.koboldai.net/register" data-i18n="Register a Horde account for faster queue times">Register a Horde
account for faster queue times</a>
</li>
<li>
<a target="_blank" href="https://github.com/db0/AI-Horde-Worker#readme" data-i18n="Learn how to contribute your idle GPU cycles to the Horde">Learn
how to contribute your idle GPU cycles to the Horde</a>
</li>
</ul>
<label for="horde_auto_adjust_context_length" class="checkbox_label">
<input id="horde_auto_adjust_context_length" type="checkbox" />
<span data-i18n="Adjust context size to worker capabilities">Adjust context size to worker capabilities</span>
</label>
<label for="horde_auto_adjust_response_length" class="checkbox_label">
<input id="horde_auto_adjust_response_length" type="checkbox" />
<span data-i18n="Adjust response length to worker capabilities">Adjust response length to worker capabilities</span>
</label>
<label for="horde_trusted_workers_only" class="checkbox_label" title="Can help with bad responses by queueing only the approved workers. May slowdown the response time." data-i18n="[title]Can help with bad responses by queueing only the approved workers. May slowdown the response time.">
<input id="horde_trusted_workers_only" type="checkbox" />
<span data-i18n="Trusted workers only">Trusted workers only</span>
</label>
<small id="adjustedHordeParams">Context: --, Response: --</small>
<h4 data-i18n="API key">API key</h4>
<small>
<span data-i18n="Get it here:">Get it here: </span> <a target="_blank" href="https://horde.koboldai.net/register" data-i18n="Register">Register</a> (<a id="horde_kudos" href="javascript:void(0);" data-i18n="View my Kudos">View my Kudos</a>)<br>
<span data-i18n="Enter">Enter </span> <span class="monospace">0000000000</span> <span data-i18n="to use anonymous mode.">to use anonymous mode. </span>
</small>
<!-- <div>
<a id="horde_kudos" href="javascript:void(0);">View my Kudos</a>
</div> -->
<div class="flex-container">
<input id="horde_api_key" name="horde_api_key" class="text_pole flex1" maxlength="500" type="text" placeholder="0000000000" autocomplete="off">
<div title="Clear your API key" data-i18n="[title]Clear your API key" class="menu_button fa-solid fa-circle-xmark clear-api-key" data-key="api_key_horde"></div>
</div>
<div data-for="horde_api_key" class="neutral_warning" data-i18n="For privacy reasons, your API key will be hidden after you reload the page.">
For privacy reasons, your API key will be hidden after you reload the page.
</div>
<h4 class="horde_model_title">
<span data-i18n="Models">Models </span>
<div id="horde_refresh" title="Refresh models" data-i18n="[title]Refresh models" class="right_menu_button">
<div class="fa-solid fa-repeat "></div>
</div>
</h4>
<select id="horde_model" multiple>
<option data-i18n="-- Horde models not loaded --">-- Horde models not loaded --</option>
</select>
</div>
<div class="online_status">
<div class="online_status_indicator"></div>
<div data-i18n="Not connected..." class="online_status_text">Not connected...</div>
</div>
</form>
</div>
<div id="kobold_api" style="position: relative;"> <!-- shows the kobold settings -->
<form action="javascript:void(null);" method="post" enctype="multipart/form-data">
<div id="kobold_api_block">
<h4 data-i18n="API url">API url</h4>
<small data-i18n="Example: http://127.0.0.1:5000/api ">Example: http://127.0.0.1:5000/api </small>
<input id="api_url_text" name="api_url" class="text_pole" placeholder="http://127.0.0.1:5000/api" maxlength="500" value="" autocomplete="off" data-server-history="kobold">
<div class="flex-container">
<div id="api_button" class="api_button menu_button" type="submit" data-i18n="Connect" data-server-connect="kobold">Connect</div>
<div class="api_loading menu_button" data-i18n="Cancel">Cancel</div>
</div>
</div>
<div class="online_status">
<div class="online_status_indicator"></div>
<div class="online_status_text" data-i18n="Not connected...">Not connected...</div>
</div>
</form>
</div>
<div id="novel_api" style="display: none;position: relative;"> <!-- shows the novel settings -->
<form action="javascript:void(null);" method="post" enctype="multipart/form-data">
<h4 data-i18n="Novel API key">Novel API key</h4>
<span>
<ol>
<li>
<a href="https://docs.sillytavern.app/usage/api-connections/novelai/" class="notes-link" target="_blank"> <span data-i18n="Get your NovelAI API Key">Get your NovelAI API key</span></a>
</li>
<li><span data-i18n="Enter it in the box below">Enter it in the box below:</span>
</li>
</ol>
</span>
<div class="flex-container">
<input id="api_key_novel" name="api_key_novel" class="text_pole flex1 wide100p" maxlength="500" size="35" type="text" autocomplete="off">
<div title="Clear your API key" data-i18n="[title]Clear your API key" class="menu_button fa-solid fa-circle-xmark clear-api-key" data-key="api_key_novel">
</div>
</div>
<div data-for="api_key_novel" class="neutral_warning" data-i18n="For privacy reasons, your API key will be hidden after you reload the page.">
For privacy reasons, your API key will be hidden after you reload the page.
</div>
<div class="flex-container">
<div id="api_button_novel" class="api_button menu_button" type="submit" data-i18n="Connect">Connect</div>
<div class="api_loading menu_button" data-i18n="Cancel">Cancel</div>
</div>
<h4><span data-i18n="Novel AI Model">Novel AI Model</span>
<a href="https://docs.sillytavern.app/usage/api-connections/novelai/#models" class="notes-link" target="_blank">
<span class="fa-solid fa-circle-question note-link-span"></span>
</a>
</h4>
<select id="model_novel_select">
<option value="clio-v1">Clio</option>
<option value="kayra-v1">Kayra</option>
</select>
</form>
<div class="online_status">
<div class="online_status_indicator"></div>
<div class="online_status_text" data-i18n="No connection...">No connection... </div>
</div>
</div>
<div id="textgenerationwebui_api" style="display: none;position: relative;">
<form action="javascript:void(null);" method="post" enctype="multipart/form-data">
<div>
<h4>API Type</h4>
<select id="textgen_type">
<option value="ooba">Default (oobabooga)</option>
<option value="mancer">Mancer</option>
<option value="aphrodite">Aphrodite</option>
<option value="tabby">TabbyAPI</option>
<option value="koboldcpp">KoboldCpp</option>
</select>
</div>
<div data-tg-type="mancer" class="flex-container flexFlowColumn">
<div class="flex-container flexFlowColumn">
</div>
<h4 data-i18n="Mancer API key">
Mancer API key
<a href="https://mancer.tech/" class="notes-link" target="_blank">
<span class="fa-solid fa-circle-question note-link-span"></span>
</a>
</h4>
<div class="flex-container">
<input id="api_key_mancer" name="api_key_mancer" class="text_pole flex1 wide100p" maxlength="500" size="35" type="text" autocomplete="off">
<div title="Clear your API key" data-i18n="[title]Clear your API key" class="menu_button fa-solid fa-circle-xmark clear-api-key" data-key="api_key_mancer">
</div>
</div>
<div data-for="api_key_mancer" class="neutral_warning" data-i18n="For privacy reasons, your API key will be hidden after you reload the page.">
For privacy reasons, your API key will be hidden after you reload the page.
</div>
<div class="flex1">
<h4>Mancer Model</h4>
<select id="mancer_model"></select>
</div>
</div>
<div data-tg-type="ooba" class="flex-container flexFlowColumn">
<div class="flex-container flexFlowColumn">
<a href="https://github.com/oobabooga/text-generation-webui" target="_blank">
oobabooga/text-generation-webui
</a>
<span data-i18n="Make sure you run it with">
Make sure you run it with <tt>--api</tt> flag
</span>
</div>
<div class="flex1">
<h4 data-i18n="Server url">Server URL</h4>
<small data-i18n="Example: http://127.0.0.1:5000 ">Example: http://127.0.0.1:5000</small>
<input id="textgenerationwebui_api_url_text" name="textgenerationwebui_api_url" class="text_pole wide100p" maxlength="500" value="" autocomplete="off" data-server-history="ooba_blocking">
</div>
</div>
<div data-tg-type="aphrodite">
<div class="flex-container flexFlowColumn">
<a href="https://github.com/PygmalionAI/aphrodite-engine" target="_blank">
PygmalionAI/aphrodite-engine (OpenAI API wrapper mode)
</a>
</div>
<h4 data-i18n="Aphrodite API key">Aphrodite API key</h4>
<div class="flex-container">
<input id="api_key_aphrodite" name="api_key_aphrodite" class="text_pole flex1 wide100p" maxlength="500" size="35" type="text" autocomplete="off">
<div title="Clear your API key" data-i18n="[title]Clear your API key" class="menu_button fa-solid fa-circle-xmark clear-api-key" data-key="api_key_aphrodite">
</div>
</div>
<div data-for="api_key_aphrodite" class="neutral_warning" data-i18n="For privacy reasons, your API key will be hidden after you reload the page.">
For privacy reasons, your API key will be hidden after you reload the page.
</div>
<div class="flex1">
<h4 data-i18n="API url">API URL</h4>
<small data-i18n="Example: http://127.0.0.1:5000">Example: http://127.0.0.1:5000</small>
<input id="aphrodite_api_url_text" class="text_pole wide100p" maxlength="500" value="" autocomplete="off" data-server-history="aphrodite">
</div>
</div>
<div data-tg-type="tabby">
<div class="flex-container flexFlowColumn">
<a href="https://github.com/theroyallab/tabbyAPI" target="_blank">
theroyallab/tabbyAPI
</a>
</div>
<h4 data-i18n="Tabby API key">Tabby API key</h4>
<div class="flex-container">
<input id="api_key_tabby" name="api_key_tabby" class="text_pole flex1 wide100p" maxlength="500" size="35" type="text" autocomplete="off">
<div title="Clear your API key" data-i18n="[title]Clear your API key" class="menu_button fa-solid fa-circle-xmark clear-api-key" data-key="api_key_tabby">
</div>
</div>
<div data-for="api_key_tabby" class="neutral_warning" data-i18n="For privacy reasons, your API key will be hidden after you reload the page.">
For privacy reasons, your API key will be hidden after you reload the page.
</div>
<div class="flex1">
<h4 data-i18n="API url">API URL</h4>
<small data-i18n="Example: http://127.0.0.1:5000">Example: http://127.0.0.1:5000</small>
<input id="tabby_api_url_text" class="text_pole wide100p" maxlength="500" value="" autocomplete="off" data-server-history="tabby">
</div>
</div>
<div data-tg-type="koboldcpp">
<div class="flex-container flexFlowColumn">
<a href="https://github.com/LostRuins/koboldcpp" target="_blank">
LostRuins/koboldcpp
</a>
</div>
<div class="flex1">
<h4 data-i18n="API url">API URL</h4>
<small data-i18n="Example: http://127.0.0.1:5001">Example: http://127.0.0.1:5001</small>
<input id="koboldcpp_api_url_text" class="text_pole wide100p" maxlength="500" value="" autocomplete="off" data-server-history="koboldcpp">
</div>
</div>
<div class="flex-container">
<div id="api_button_textgenerationwebui" class="api_button menu_button" type="submit" data-i18n="Connect" data-server-connect="ooba_blocking,aphrodite,tabby,koboldcpp">Connect</div>
<div class="api_loading menu_button" data-i18n="Cancel">Cancel</div>
</div>
<label class="checkbox_label margin-bot-10px" for="legacy_api_textgenerationwebui">
<input type="checkbox" id="legacy_api_textgenerationwebui" />
<span data-i18n="Legacy API (pre-OAI, no streaming)">Legacy API (pre-OAI, no streaming)</span>
</label>
</form>
<div class="online_status">
<div class="online_status_indicator"></div>
<div class="online_status_text" data-i18n="Not connected...">Not connected...</div>
</div>
</div>
<div id="openai_api" style="display: none;position: relative;">
<h4 class="margin0" data-i18n="Chat Completion Source">
Chat Completion Source
</h4>
<select id="chat_completion_source">
<option value="openai">OpenAI</option>
<option value="windowai">Window AI</option>
<option value="openrouter">OpenRouter</option>
<option value="claude">Claude</option>
<option value="scale">Scale</option>
<option value="ai21">AI21</option>
<option value="palm">Google PaLM 2</option>
</select>
<form id="openai_form" data-source="openai" action="javascript:void(null);" method="post" enctype="multipart/form-data">
<h4><span data-i18n="OpenAI API key">OpenAI API key</span></h4>
<div>
<a id="openai_api_usage" href="https://platform.openai.com/account/usage" target="_blank">
<span data-i18n="View API Usage Metrics">View API Usage Metrics</span>
</a>
</div>
<span>
<ol>
<li>
<span data-i18n="Follow">Follow</span>
<a href="https://docs.sillytavern.app/usage/api-connections/openai/" class="notes-link" target="_blank"><span data-i18n="these directions"> these directions </span></a>
<span data-i18n="to get your OpenAI API key.">to get your OpenAI API key.</span>
</li>
<li>
<span data-i18n="Enter it in the box below">Enter it in the box below:</span>
</li>
</ol>
</span>
<div class="flex-container">
<input id="api_key_openai" name="api_key_openai" class="text_pole flex1" maxlength="500" value="" type="text" autocomplete="off">
<div title="Clear your API key" data-i18n="[title]Clear your API key" class="menu_button fa-solid fa-circle-xmark clear-api-key" data-key="api_key_openai"></div>
</div>
<div id="ReverseProxyWarningMessage2" class="reverse_proxy_warning">
<b data-i18n="Use Proxy password field instead. This input will be ignored.">
Use "Proxy password" field instead. This input will be ignored.
</b>
</div>
<div data-for="api_key_openai" class="neutral_warning">
For privacy reasons, your API key will be hidden after you reload the page.
</div>
<div>
<h4 data-i18n="OpenAI Model">OpenAI Model</h4>
<select id="model_openai_select">
<optgroup label="GPT-3.5 Turbo">
<option value="gpt-3.5-turbo">gpt-3.5-turbo</option>
<option value="gpt-3.5-turbo-16k">gpt-3.5-turbo-16k</option>
<option value="gpt-3.5-turbo-16k-0613">gpt-3.5-turbo-16k-0613</option>
<option value="gpt-3.5-turbo-0613">gpt-3.5-turbo-0613</option>
<option value="gpt-3.5-turbo-0301">gpt-3.5-turbo-0301</option>
<option value="gpt-3.5-turbo-1106">gpt-3.5-turbo-1106</option>
</optgroup>
<optgroup label="GPT-3.5 Turbo Instruct">
<option value="gpt-3.5-turbo-instruct">gpt-3.5-turbo-instruct</option>
<option value="gpt-3.5-turbo-instruct-0914">gpt-3.5-turbo-instruct-0914</option>
</optgroup>
<optgroup label="GPT-4">
<option value="gpt-4">gpt-4</option>
<option value="gpt-4-vision-preview">gpt-4-vision-preview</option>
<option value="gpt-4-1106-preview">gpt-4-1106-preview</option>
<option value="gpt-4-0613">gpt-4-0613</option>
<option value="gpt-4-0314">gpt-4-0314</option>
<option value="gpt-4-32k">gpt-4-32k</option>
<option value="gpt-4-32k-0314">gpt-4-32k-0314</option>
<option value="gpt-4-32k-0613">gpt-4-32k-0613</option>
</optgroup>
<optgroup label="Other">
<option value="text-davinci-003">text-davinci-003</option>
<option value="text-davinci-002">text-davinci-002</option>
<option value="text-curie-001">text-curie-001</option>
<option value="text-babbage-001">text-babbage-001</option>
<option value="text-ada-001">text-ada-001</option>
<option value="code-davinci-002">code-davinci-002</option>
</optgroup>
<optgroup id="openai_external_category" label="External">
</optgroup>
</select>
<label for="openai_bypass_status_check" class="checkbox_label">
<input id="openai_bypass_status_check" type="checkbox" />
<span data-i18n="Bypass API status check">Bypass API status check</span>
</label>
<label for="openai_show_external_models" class="checkbox_label">
<input id="openai_show_external_models" type="checkbox" />
<span data-i18n="Show External models (provided by API)">Show "External" models (provided by API)</span>
</label>
</div>
</form>
<form id="claude_form" data-source="claude" action="javascript:void(null);" method="post" enctype="multipart/form-data">
<h4>Claude API Key</h4>
<div>
<span data-i18n="Get your key from">Get your key from </span> <a target="_blank" href="https://console.anthropic.com/account/keys" data-i18n="Anthropic's developer console">Anthropic's developer console</a>.
</div>
<div>
<b data-i18n="Slack and Poe cookies will not work here, do not bother trying.">
Slack and Poe cookies will not work here, do not bother trying.
</b>
</div>
<div class="flex-container">
<input id="api_key_claude" name="api_key_claude" class="text_pole flex1" maxlength="500" value="" type="text" autocomplete="off">
<div title="Clear your API key" data-i18n="[title]Clear your API key" class="menu_button fa-solid fa-circle-xmark clear-api-key" data-key="api_key_claude"></div>
</div>
<div data-for="api_key_claude" class="neutral_warning">
For privacy reasons, your API key will be hidden after you reload the page.
</div>
<div>
<h4 data-i18n="Claude Model">Claude Model</h4>
<select id="model_claude_select">
<optgroup label="Latest">
<option value="claude-2">claude-2</option>
<option value="claude-v1">claude-v1</option>
<option value="claude-v1-100k">claude-v1-100k</option>
<option value="claude-instant-v1">claude-instant-v1</option>
<option value="claude-instant-v1-100k">claude-instant-v1-100k</option>
</optgroup>
<optgroup label="Sub-versions">
<option value="claude-2.1">claude-2.1</option>
<option value="claude-2.0">claude-2.0</option>
<option value="claude-v1.3">claude-v1.3</option>
<option value="claude-v1.3-100k">claude-v1.3-100k</option>
<option value="claude-v1.2">claude-v1.2</option>
<option value="claude-v1.0">claude-v1.0</option>
<option value="claude-instant-1.2">claude-instant-1.2</option>
<option value="claude-instant-v1.1">claude-instant-v1.1</option>
<option value="claude-instant-v1.1-100k">claude-instant-v1.1-100k</option>
<option value="claude-instant-v1.0">claude-instant-v1.0</option>
</optgroup>
</select>
</div>
</form>
<form id="windowai_form" data-source="windowai" action="javascript:void(null);" method="post" enctype="multipart/form-data">
<div>
<h4 data-i18n="Window AI Model">Window AI Model</h4>
<select id="model_windowai_select">
<option value="">Use extension settings</option>
<option value="openai/gpt-3.5-turbo">openai/gpt-3.5-turbo</option>
<option value="openai/gpt-3.5-turbo-16k">openai/gpt-3.5-turbo-16k</option>
<option value="openai/gpt-4">openai/gpt-4</option>
<option value="openai/gpt-4-32k">openai/gpt-4-32k</option>
<option value="anthropic/claude-instant-v1">anthropic/claude-instant-v1</option>
<option value="anthropic/claude-instant-v1-100k">anthropic/claude-instant-v1-100k</option>
<option value="anthropic/claude-v1">anthropic/claude-v1</option>
<option value="anthropic/claude-v1-100k">anthropic/claude-v1-100k</option>
<option value="google/palm-2-chat-bison">google/palm-2-chat-bison</option>
<option value="google/palm-2-codechat-bison">google/palm-2-codechat-bison</option>
<option value="togethercomputer/GPT-NeoXT-Chat-Base-20B">togethercomputer/GPT-NeoXT-Chat-Base-20B</option>
<option value="cohere/command-nightly">cohere/command-nightly</option>
</select>
</div>
</form>
<form id="openrouter_form" data-source="openrouter" action="javascript:void(null);" method="post" enctype="multipart/form-data">
<div>
<h4 data-i18n="OpenRouter Model">OpenRouter Model</h4>
<select id="model_openrouter_select">
<option data-i18n="Connect to the API">-- Connect to the API --</option>
</select>
</div>
<div class="marginTopBot5">
<div class="inline-drawer wide100p">
<div class="inline-drawer-toggle inline-drawer-header">
<b data-i18n="Model Order">OpenRouter Model Sorting</b>
<div class="fa-solid fa-circle-chevron-down inline-drawer-icon down"></div>
</div>
<div class="inline-drawer-content m-b-1">
<div class="marginTopBot5">
<label for="openrouter_sort_models" class="checkbox_label">
<select id="openrouter_sort_models">
<option data-i18n="Alphabetically" value="alphabetically">Alphabetically</option>
<option data-i18n="Price" value="pricing.prompt">Price (cheapest)</option>
<option data-i18n="Context Size" value="context_length">Context Size</option>
</select>
</label>
</div>
<div class="marginTopBot5">
<label for="openrouter_group_models" class="checkbox_label">
<input id="openrouter_group_models" type="checkbox" />
<span data-i18n="Group by vendors">Group by vendors</span>
</label>
<div class="toggle-description justifyLeft wide100p">
<span data-i18n="Group by vendors Description">
Put OpenAI models in one group, Anthropic models in other group, etc. Can be combined with sorting.
</span>
</div>
</div>
</div>
</div>
</div>
<div class="marginTopBot5">
<label for="openrouter_use_fallback" class="checkbox_label">
<input id="openrouter_use_fallback" type="checkbox" />
<span data-i18n="Allow fallback routes">Allow fallback routes</span>
</label>
<div class="toggle-description justifyLeft wide100p">
<span data-i18n="Allow fallback routes Description">
Automatically chooses an alternative model if the chosen model can't serve your request.
</span>
</div>
</div>
<div class="marginTopBot5">
<label for="openrouter_force_instruct" class="checkbox_label">
<input id="openrouter_force_instruct" type="checkbox" />
<span data-i18n="Force Instruct Mode formatting">Force Instruct Mode formatting</span>
</label>
<div class="toggle-description justifyLeft wide100p">
<span data-i18n="Force Instruct Mode formatting Description">
If both Instruct Mode and this are enabled, the prompt will be formatted by SillyTavern using the current
advanced formatting settings (except instruct System Prompt). If disabled, the prompt will be formatted by OpenRouter.
</span>
</div>
</div>
<h4 data-i18n="OpenRouter API Key">OpenRouter API Key</h4>
<div>
<small data-i18n="Click Authorize below or get the key from">
Click "Authorize" below or get the key from </small> <a target="_blank" href="https://openrouter.ai/keys/">OpenRouter</a>.
<br>
<a href="https://openrouter.ai/account" target="_blank" data-i18n="View Remaining Credits">View Remaining Credits</a>
</div>
<div class="flex-container">
<input id="api_key_openrouter" name="api_key_openrouter" class="text_pole flex1" maxlength="500" value="" type="text" autocomplete="off">
<div title="Clear your API key" data-i18n="[title]Clear your API key" class="menu_button fa-solid fa-circle-xmark clear-api-key" data-key="api_key_openrouter"></div>
</div>
<div data-for="api_key_openrouter" class="neutral_warning">
For privacy reasons, your API key will be hidden after you reload the page.
</div>
</form>
<form id="scale_form" data-source="scale" action="javascript:void(null);" method="post" enctype="multipart/form-data">
<div id="normal_scale_form">
<h4 data-i18n="Scale API Key">Scale API Key</h4>
<div class="flex-container">
<input id="api_key_scale" name="api_key_scale" class="text_pole flex1" maxlength="500" value="" autocomplete="off">
<div title="Clear your API key" data-i18n="[title]Clear your API key" class="menu_button fa-solid fa-circle-xmark clear-api-key" data-key="api_key_scale"></div>
</div>
<div data-for="api_key_scale" class="neutral_warning">
For privacy reasons, your API key will be hidden after you reload the page.
</div>
<h4>Scale API URL</h4>
<input id="api_url_scale" name="api_url_scale" class="text_pole" maxlength="500" value="" autocomplete="off" placeholder="https://dashboard.scale.com/spellbook/api/v2/deploy/xxxxxxx">
</div>
<div id="alt_scale_form">
<h4>Scale Cookie (_jwt)</h4>
<div class="flex-container">
<input id="scale_cookie" name="scale_cookie" class="text_pole flex1" maxlength="500" value="" autocomplete="off">
<div title="Clear your cookie" data-i18n="[title]Clear your cookie" class="menu_button fa-solid fa-circle-xmark clear-api-key" data-key="scale_cookie"></div>
</div>
<div data-for="scale_cookie" class="neutral_warning">
For privacy reasons, your cookie will be hidden after you reload the page.
</div>
</div>
<!-- Its only purpose is to trigger max context size check -->
<select id="model_scale_select" class="displayNone"></select>
<label for="scale-alt" class="checkbox_label">
<input id="scale-alt" type="checkbox" checked>
<span data-i18n="Alt Method">Alt Method</span>
</label>
</form>
<form id="ai21_form" data-source="ai21" action="javascript:void(null);" method="post" enctype="multipart/form-data">
<h4 data-i18n="AI21 API Key">AI21 API Key</h4>
<div class="flex-container">
<input id="api_key_ai21" name="api_key_ai21" class="text_pole flex1" maxlength="500" value="" type="text" autocomplete="off">
<div title="Clear your API key" data-i18n="[title]Clear your API key" class="menu_button fa-solid fa-circle-xmark clear-api-key" data-key="api_key_ai21"></div>
</div>
<div data-for="api_key_ai21" class="neutral_warning">
For privacy reasons, your API key will be hidden after you reload the page.
</div>
<div>
<h4 data-i18n="AI21 Model">AI21 Model</h4>
<select id="model_ai21_select">
<optgroup label="Latest">
<option value="j2-ultra">j2-ultra</option>
<option value="j2-mid">j2-mid</option>
<option value="j2-light">j2-light</option>
</optgroup>
</select>
</div>
</form>
<form id="palm_form" data-source="palm" action="javascript:void(null);" method="post" enctype="multipart/form-data">
<h4 data-i18n="PaLM API Key">PaLM API Key</h4>
<div class="flex-container">
<input id="api_key_palm" name="api_key_palm" class="text_pole flex1" maxlength="500" value="" type="text" autocomplete="off">
<div title="Clear your API key" data-i18n="[title]Clear your API key" class="menu_button fa-solid fa-circle-xmark clear-api-key" data-key="api_key_palm"></div>
</div>
<div data-for="api_key_palm" class="neutral_warning">
For privacy reasons, your API key will be hidden after you reload the page.
</div>
<!-- Its only purpose is to trigger max context size check -->
<select id="model_palm_select" class="displayNone"></select>
</form>
<div class="flex-container flex">
<div id="api_button_openai" class="api_button menu_button menu_button_icon" type="submit" data-i18n="Connect">Connect</div>
<div class="api_loading menu_button" data-i18n="Cancel">Cancel</div>
<div data-source="openrouter" id="openrouter_authorize" class="menu_button menu_button_icon" title="Get your OpenRouter API token using OAuth flow. You will be redirected to openrouter.ai" data-i18n="[title]Get your OpenRouter API token using OAuth flow. You will be redirected to openrouter.ai">Authorize</div>
<div id="test_api_button" class="menu_button menu_button_icon" title="Verifies your API connection by sending a short test message. Be aware that you'll be credited for it!" data-i18n="[title]Verifies your API connection by sending a short test message. Be aware that you'll be credited for it!">Test Message</div>
</div>
<div class="online_status">
<div class="online_status_indicator"></div>
<div class="online_status_text" data-i18n="No connection...">No connection...</div>
</div>
</div>
</div>
<div class="flex-container alignitemscenter spaceBetween wide100p">
<label for="auto-connect-checkbox" class="checkbox_label"><input id="auto-connect-checkbox" type="checkbox" />
<span data-i18n="Auto-connect to Last Server">Auto-connect to Last Server</span>
</label>
<a id="viewSecrets" href="javascript:void(0);"><span data-i18n="View hidden API keys">View hidden API keys</span></a>
</div>
</div>
</div>
<div id="advanced-formatting-button" class="drawer">
<div class="drawer-toggle">
<div class="drawer-icon fa-solid fa-font closedIcon" title="AI Response Formatting" data-i18n="[title]AI Response Formatting"></div>
</div>
<div class="drawer-content">
<h3 class="margin0" data-i18n="Advanced Formatting">
Advanced Formatting
<a href="https://docs.sillytavern.app/usage/core-concepts/advancedformatting/" class="notes-link" target="_blank">
<span class="fa-solid fa-circle-question note-link-span"></span>
</a>
</h3>
<div class="flex-container">
<div id="PygOverrides">
<div>
<h4 data-i18n="Context Template">
Context Template
</h4>
<div class="flex-container">
<select id="context_presets" data-preset-manager-for="context" class="flex1 text_pole"></select>
<input type="file" hidden data-preset-manager-file="context" accept=".json, .settings">
<i id="context_set_default" class="menu_button fa-solid fa-heart" title="Auto-select this preset for Instruct Mode."></i>
<i data-newbie-hidden data-preset-manager-update="context" class="menu_button fa-solid fa-save" title="Update current preset" data-i18n="[title]Update current preset"></i>
<i data-newbie-hidden data-preset-manager-new="context" class="menu_button fa-solid fa-paste" title="Save preset as" data-i18n="[title]Save preset as"></i>
<i data-newbie-hidden data-preset-manager-import="context" class="menu_button fa-solid fa-file-import" title="Import preset" data-i18n="[title]Import preset"></i>
<i data-newbie-hidden data-preset-manager-export="context" class="menu_button fa-solid fa-file-export" title="Export preset" data-i18n="[title]Export preset"></i>
<i data-newbie-hidden id="context_delete_preset" data-preset-manager-delete="context" class="menu_button fa-solid fa-trash-can" title="Delete the preset" data-i18n="[title]Delete the preset"></i>
</div>
<div data-newbie-hidden>
<label for="context_story_string">
<small data-i18n="Story String">Story String</small>
</label>
<textarea id="context_story_string" class="text_pole textarea_compact autoSetHeight" rows="1"></textarea>
<div class="flex-container">
<div class="flex1">
<label for="context_example_separator">
<small data-i18n="Example Separator">Example Separator</small>
</label>
<div>
<textarea id="context_example_separator" class="text_pole textarea_compact autoSetHeight" maxlength="500" rows="1"></textarea>
</div>
</div>
<div class="flex1">
<label for="context_chat_start">
<small data-i18n="Chat Start">Chat Start</small>
</label>
<div>
<textarea id="context_chat_start" class="text_pole textarea_compact autoSetHeight" maxlength="500" rows="1"></textarea>
</div>
</div>
</div>
<label class="checkbox_label" title="Add Chat Start and Example Separator to a list of stopping strings.">
<input id="context_use_stop_strings" type="checkbox" />
<small data-i18n="Use as Stop Strings">Use as Stop Strings</small>
</label>
</div>
<div data-newbie-hidden class="inline-drawer wide100p flexFlowColumn margin-bot-10px" style="display:none;">
<div class="inline-drawer-toggle inline-drawer-header">
<b><span data-i18n="Context Order">Context Order</span></b>
<div class="fa-solid fa-circle-chevron-down inline-drawer-icon down"></div>
</div>
<div class="inline-drawer-content">
<div id="context_order" class="prompt_order">
<div data-id="0">
<span data-i18n="Story String">Story String</span>
<small>0</small>
</div>
<div data-id="1">
<span data-i18n="Summary">Summary</span>
<small>1</small>
</div>
<div data-id="2">
<span data-i18n="Author's Note">Author's Note</span>
<small>2</small>
</div>
<div data-id="3">
<span data-i18n="Example Dialogues">Example Dialogues</span>
<small>3</small>
</div>
<div data-id="4">
<span data-i18n="Chat Start">Chat History</span>
<small>4</small>
</div>
</div>
<small>
<b data-i18n="Hint">Hint:</b>
<span data-i18n="In-Chat Position not affected">
Summary and Author's Note orders are only affected when they don't have an In-Chat position set.
</span>
</small>
</div>
</div>
</div>
<div>
<h4 data-i18n="Instruct Mode">Instruct Mode
<a href="https://docs.sillytavern.app/usage/core-concepts/instructmode/" class="notes-link" target="_blank">
<span class="fa-solid fa-circle-question note-link-span"></span>
</a>
</h4>
<div>
<label for="instruct_enabled" class="checkbox_label">
<input id="instruct_enabled" type="checkbox" />
<span data-i18n="Enabled">Enabled</span>
</label>
</div>
<label for="instruct_presets">
<span data-i18n="Presets">Presets</span>
</label>
<div class="flex-container">
<select id="instruct_presets" data-preset-manager-for="instruct" class="flex1 text_pole"></select>
<input type="file" hidden data-preset-manager-file="instruct" accept=".json, .settings">
<i id="instruct_set_default" class="menu_button fa-solid fa-heart" title="Auto-select this preset on API connection."></i>
<i data-newbie-hidden data-preset-manager-update="instruct" class="menu_button fa-solid fa-save" title="Update current preset" data-i18n="[title]Update current preset"></i>
<i data-newbie-hidden data-preset-manager-new="instruct" class="menu_button fa-solid fa-paste" title="Save preset as" data-i18n="[title]Save preset as"></i>
<i data-newbie-hidden data-preset-manager-import="instruct" class="menu_button fa-solid fa-file-import" title="Import preset" data-i18n="[title]Import preset"></i>
<i data-newbie-hidden data-preset-manager-export="instruct" class="menu_button fa-solid fa-file-export" title="Export preset" data-i18n="[title]Export preset"></i>
<i data-newbie-hidden data-preset-manager-delete="instruct" class="menu_button fa-solid fa-trash-can" title="Delete the preset" data-i18n="[title]Delete the preset"></i>
</div>
<label data-newbie-hidden>
<small data-i18n="Activation Regex">
Activation Regex
</small>
</label>
<div data-newbie-hidden>
<textarea id="instruct_activation_regex" class="text_pole textarea_compact autoSetHeight" maxlength="5000" rows="1"></textarea>
</div>
<div data-newbie-hidden>
<label for="instruct_wrap" class="checkbox_label">
<input id="instruct_wrap" type="checkbox" />
<span data-i18n="Wrap Sequences with Newline">Wrap Sequences with Newline</span>
</label>
<label for="instruct_macro" class="checkbox_label">
<input id="instruct_macro" type="checkbox" />
<span data-i18n="Replace Macro in Sequences">Replace Macro in Sequences</span>
</label>
<label for="instruct_names" class="checkbox_label">
<input id="instruct_names" type="checkbox" />
<span data-i18n="Include Names">Include Names</span>
</label>
<label for="instruct_names_force_groups" class="checkbox_label indent20p">
<input id="instruct_names_force_groups" type="checkbox" />
<span data-i18n="Force for Groups and Personas">Force for Groups and Personas</span>
</label>
</div>
<div data-newbie-hidden>
<label>
<small data-i18n="System Prompt">System Prompt</small>
</label>
<textarea id="instruct_system_prompt" class="text_pole textarea_compact autoSetHeight" rows="1"></textarea>
</div>
<div data-newbie-hidden class="inline-drawer wide100p flexFlowColumn">
<div class="inline-drawer-toggle inline-drawer-header">
<b><span data-i18n="Instruct Mode Sequences">Instruct Mode Sequences</span></b>
<div class="fa-solid fa-circle-chevron-down inline-drawer-icon down"></div>
</div>
<div class="inline-drawer-content">
<div class="flex-container">
<div class="flex1">
<label for="instruct_input_sequence">
<small data-i18n="Input Sequence">Input Sequence</small>
</label>
<div>
<textarea id="instruct_input_sequence" class="text_pole textarea_compact autoSetHeight" maxlength="2000" placeholder="&mdash;" rows="1"></textarea>
</div>
</div>
<div class="flex1">
<label for="instruct_output_sequence">
<small data-i18n="Output Sequence">Output Sequence</small>
</label>
<div>
<textarea id="instruct_output_sequence" class="text_pole wide100p textarea_compact autoSetHeight" maxlength="2000" placeholder="&mdash;" rows="1"></textarea>
</div>
</div>
</div>
<div class="flex-container">
<div class="flex1">
<label for="instruct_first_output_sequence">
<small data-i18n="First Output Sequence">First Output Sequence</small>
</label>
<div>
<textarea id="instruct_first_output_sequence" class="text_pole textarea_compact autoSetHeight" maxlength="2000" placeholder="&mdash;" rows="1"></textarea>
</div>
</div>
<div class="flex1">
<label for="instruct_last_output_sequence">
<small data-i18n="Last Output Sequence">Last Output Sequence</small>
</label>
<div>
<textarea id="instruct_last_output_sequence" class="text_pole wide100p textarea_compact autoSetHeight" maxlength="2000" placeholder="&mdash;" rows="1"></textarea>
</div>
</div>
</div>
<div class="flex-container">
<div class="flex1">
<label for="instruct_system_sequence_prefix">
<small data-i18n="System Sequence Prefix">System Sequence Prefix</small>
</label>
<div>
<textarea id="instruct_system_sequence_prefix" class="text_pole textarea_compact autoSetHeight" maxlength="2000" placeholder="&mdash;" rows="1"></textarea>
</div>
</div>
<div class="flex1">
<label for="instruct_system_sequence_suffix">
<small data-i18n="System Sequence Suffix">System Sequence Suffix</small>
</label>
<div>
<textarea id="instruct_system_sequence_suffix" class="text_pole wide100p textarea_compact autoSetHeight" maxlength="2000" placeholder="&mdash;" rows="1"></textarea>
</div>
</div>
</div>
<div class="flex-container">
<div class="flex1">
<label for="instruct_stop_sequence">
<small data-i18n="Stop Sequence">Stop Sequence</small>
</label>
<div>
<textarea id="instruct_stop_sequence" class="text_pole textarea_compact autoSetHeight" maxlength="2000" placeholder="&mdash;" rows="1"></textarea>
</div>
</div>
<div class="flex1">
<label for="instruct_separator_sequence">
<small data-i18n="Separator">Separator</small>
</label>
<div>
<textarea id="instruct_separator_sequence" class="text_pole wide100p textarea_compact autoSetHeight" maxlength="2000" placeholder="&mdash;" rows="1"></textarea>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<div id="ContextFormatting">
<div>
<div class="flex-container alignItemsBaseline">
<h4 data-i18n="Context Formatting">
Context Formatting
</h4>
<small>
&nbsp;(Saved to Context Template)
</small>
</div>
<label class="checkbox_label" for="always-force-name2-checkbox">
<input id="always-force-name2-checkbox" type="checkbox" />
<span data-i18n="Always add character's name to prompt">
Always add character's name to prompt
</span>
</label>
<label class="checkbox_label" for="single_line">
<input id="single_line" type="checkbox" />
<span data-i18n="Generate only one line per request">
Generate only one line per request
</span>
</label>
<label class="checkbox_label" for="trim_sentences_checkbox">
<input id="trim_sentences_checkbox" type="checkbox" />
<span data-i18n="Trim Incomplete Sentences">
Trim Incomplete Sentences
</span>
</label>
<!-- Add margin since this is a child of above -->
<label data-newbie-hidden class="checkbox_label indent20p" for="include_newline_checkbox">
<input id="include_newline_checkbox" type="checkbox" />
<span data-i18n="Include Newline">Include Newline</span>
</label>
</div>
<h4>
Misc. Settings
</h4>
<label class="checkbox_label" for="collapse-newlines-checkbox">
<input id="collapse-newlines-checkbox" type="checkbox" />
<span data-i18n="Collapse Consecutive Newlines">
Collapse Consecutive Newlines
</span>
</label>
<label data-newbie-hidden class="checkbox_label" for="trim_spaces">
<input id="trim_spaces" type="checkbox" />
<span data-i18n="Trim spaces">Trim spaces</span>
</label>
<div data-newbie-hidden>
<h4><span data-i18n="Tokenizer">Tokenizer</span>
<a href="https://docs.sillytavern.app/usage/core-concepts/advancedformatting/#tokenizer" class="notes-link" target="_blank">
<span class="fa-solid fa-circle-question note-link-span"></span>
</a>
</h4>
<select id="tokenizer">
<option value="99">Best match (recommended)</option>
<option value="0">None / Estimated</option>
<option value="1">GPT-2</option>
<!-- Option #2 was a legacy GPT-2/3 tokenizer -->
<option value="3">LLaMA</option>
<option value="4">NerdStash (NovelAI Clio)</option>
<option value="5">NerdStash v2 (NovelAI Kayra)</option>
<option value="7">Mistral</option>
<option value="8">Yi</option>
<option value="6">API (WebUI / koboldcpp)</option>
</select>
</div>
<div class="range-block" data-newbie-hidden>
<div class="range-block-title justifyLeft">
<span data-i18n="Token Padding">Token Padding</span>
<a href="https://docs.sillytavern.app/usage/core-concepts/advancedformatting/#token-padding" class="notes-link" target="_blank">
<span class="fa-solid fa-circle-question note-link-span"></span>
</a>
</div>
<input id="token_padding" class="text_pole textarea_compact" type="number" min="-2048" max="2048" />
</div>
<div class="flex-container flexFlowColumn" data-newbie-hidden>
<div>
<h4 class="range-block-title justifyLeft">
<span data-i18n="Start Reply With">
Start Reply With
</span>
</h4>
<div>
<textarea id="start_reply_with" rows="2" class="text_pole textarea_compact" data-i18n="[placeholder]AI reply prefix" placeholder="AI reply prefix"></textarea>
</div>
<label class="checkbox_label" for="chat-show-reply-prefix-checkbox">
<input id="chat-show-reply-prefix-checkbox" type="checkbox" />
<span data-i18n="Show reply prefix in chat">
Show reply prefix in chat
</span>
</label>
</div>
<div>
<h4 class="range-block-title justifyLeft">
<span data-i18n="Non-markdown strings">
Non-markdown strings
</span>
</h4>
<div>
<input id="markdown_escape_strings" class="text_pole textarea_compact" type="text" data-i18n="[placeholder]separate with commas w/o space between" placeholder="separate with commas w/o space between" maxlength="100" />
</div>
</div>
<div>
<h4 class="range-block-title justifyLeft">
<span data-i18n="Custom Stopping Strings">
Custom Stopping Strings
</span>
<a href="https://docs.sillytavern.app/usage/core-concepts/advancedformatting/#custom-stopping-strings" class="notes-link" target="_blank">
<span class="fa-solid fa-circle-question note-link-span"></span>
</a>
</h4>
<div>
<small>
<span data-i18n="JSON serialized array of strings">JSON serialized array of strings</span>
</small>
</div>
<div>
<textarea id="custom_stopping_strings" rows="2" class="text_pole textarea_compact monospace" placeholder="[&quot;Ford&quot;, &quot;BMW&quot;, &quot;Fiat&quot;]"></textarea>
</div>
<label class="checkbox_label" for="custom_stopping_strings_macro">
<input id="custom_stopping_strings_macro" type="checkbox" checked>
<span data-i18n="Replace Macro in Custom Stopping Strings">
Replace Macro in Custom Stopping Strings
</span>
</label>
</div>
</div>
<div data-newbie-hidden>
<h4>
<span data-i18n="Auto-Continue">Auto-Continue</span>
</h4>
<div class="flex-container">
<label class="checkbox_label" for="auto_continue_enabled">
<input id="auto_continue_enabled" type="checkbox" />
<span data-i18n="Enabled">
Enabled
</span>
</label>
<label class="checkbox_label" for="auto_continue_allow_chat_completions">
<input id="auto_continue_allow_chat_completions" type="checkbox" />
<span data-i18n="Allow for Chat Completion APIs">
Allow for Chat Completion APIs
</span>
</label>
</div>
<div class="auto_continue_settings_block">
<label for="auto_continue_target_length">
<span data-i18n="Target length (tokens)">Target length (tokens)</span>
<input id="auto_continue_target_length" type="number" class="text_pole textarea_compact" min="0" max="1024" />
</label>
</div>
</div>
</div>
</div>
</div>
</div>
<div id="WI-SP-button" class="drawer">
<div class="drawer-toggle drawer-header">
<div id="WIDrawerIcon" class="drawer-icon fa-solid fa-book-atlas closedIcon " title="World Info" data-i18n="[title]World Info"></div>
</div>
<div id="WorldInfo" class="drawer-content closedDrawer">
<div id="WorldInfoheader" class="fa-solid fa-grip drag-grabber"></div>
<div id="WI_panel_pin_div" class="flex-container alignitemscenter gap10px" title="Locked = World Editor will stay open" data-i18n="[title]Locked = World Editor will stay open">
<input type="checkbox" id="WI_panel_pin">
<label for="WI_panel_pin">
<div class="unchecked fa-solid fa-unlock "></div>
<div class="checked fa-solid fa-lock "></div>
</label>
<h3 class="margin0">
<span data-i18n="Worlds/Lorebooks">Worlds/Lorebooks</span>
<a href="https://docs.sillytavern.app/usage/core-concepts/worldinfo/" class="notes-link" target="_blank">
<span class="fa-solid fa-circle-question note-link-span"></span>
</a>
</h3>
</div>
<div id="wi-holder" class="margin5">
<div id="WIMultiSelector" class="flex2 flex alignSelfStart range-block">
<div class="range-block-title justifyLeft">
<span data-i18n="Active World(s) for all chats"><small>Active World(s) for all chats</small></span>
</div>
<div class="range-block-range">
<select id="world_info" multiple>
<option value="">
<span data-i18n="-- World Info not found --">-- World Info not found --</span>
</option>
</select>
</div>
</div>
<div data-newbie-hidden class="inline-drawer wide100p flexFlowColumn">
<div class="inline-drawer-toggle inline-drawer-header">
<b><span data-i18n="Activation Settings">Activation Settings</span></b>
<div class="fa-solid fa-circle-chevron-down inline-drawer-icon down"></div>
</div>
<div class="inline-drawer-content">
<div class="justifyContentSpaceAround wi-settings flex-container gap10px alignitemscenter">
<div class="flex2 flex-container flexFlowColumn">
<div data-newbie-hidden class="flex range-block">
<div class="range-block-title justifyLeft">
<label for="world_info_character_strategy">
<span data-i18n="Character Lore Insertion Strategy"><small>Character Lore Insertion Strategy</small></span>
</label>
</div>
<div class="range-block-range">
<select id="world_info_character_strategy" class="flexGrow margin0">
<option value="0" data-i18n="Sorted Evenly">Sorted Evenly</option>
<option value="1" data-i18n="Character Lore First">Character Lore First</option>
<option value="2" data-i18n="Global Lore First">Global Lore First</option>
</select>
</div>
</div>
<div name="WIScanAndTokens" class="flex1 flex-container flexFlowColumn">
<div data-newbie-hidden class="flex1 gap5px range-block">
<div class="wide10pMinFit">
<small data-i18n="Scan Depth">Scan Depth</small>
</div>
<div class="range-block-range-and-counter">
<div class="range-block-range paddingLeftRight5">
<input type="range" id="world_info_depth" name="volume" min="0" max="100" step="1">
</div>
<div class="range-block-counter margin0">
<input type="number" data-for="world_info_depth" id="world_info_depth_counter">
</div>
</div>
</div>
<div class="flex1 gap5px range-block">
<div class="wide10pMinFit">
<small data-i18n="Context %">Context %</small>
</div>
<div class="range-block-range-and-counter ">
<div class="range-block-range paddingLeftRight5">
<input type="range" id="world_info_budget" name="volume" min="1" max="100" step="1">
</div>
<div class="range-block-counter margin0">
<input type="number" min="1" max="100" step="1" data-for="world_info_budget" id="world_info_budget_counter">
</div>
</div>
</div>
<div data-newbie-hidden class="flex1 gap5px range-block">
<div class="wide10pMinFit">
<small data-i18n="Budget Cap">Budget Cap</small>
</div>
<div class="range-block-range-and-counter ">
<div class="range-block-range paddingLeftRight5">
<input type="range" id="world_info_budget_cap" name="volume" min="0" max="8192" step="1">
</div>
<div class="range-block-counter margin0">
<input type="number" min="0" max="8192" step="1" data-for="world_info_budget_cap" id="world_info_budget_cap_counter">
</div>
</div>
<div class="budget_cap_note">
<small data-i18n="(0 = disabled)">(0 = disabled)</small>
</div>
</div>
<div data-newbie-hidden class="flex1 gap5px range-block" title="Scan chronologically until reached min entries or token budget." data-i18n="[title]Scan chronologically until reached min entries or token budget.">
<div class="wide10pMinFit">
<small data-i18n="Min Activations">Min Activations</small>
</div>
<div class="range-block-range-and-counter">
<div class="range-block-range paddingLeftRight5">
<input type="range" id="world_info_min_activations" name="volume" min="0" max="100" step="1">
</div>
<div class="range-block-counter margin0">
<input type="number" data-for="world_info_min_activations" id="world_info_min_activations_counter">
</div>
</div>
</div>
<div data-newbie-hidden class="flex1 gap5px range-block">
<div class="wide10pMinFit">
<small data-i18n="Max Depth">Max Depth</small>
</div>
<div class="range-block-range-and-counter">
<div class="range-block-range paddingLeftRight5">
<input type="range" id="world_info_min_activations_depth_max" name="volume" min="0" max="100" step="1">
</div>
<div class="range-block-counter margin0">
<input type="number" data-for="world_info_min_activations_depth_max" id="world_info_min_activations_depth_max_counter">
</div>
</div>
<div class="budget_cap_note">
<small data-i18n="(0 = unlimited, use budget)">(0 = unlimited, use budget)</small>
</div>
</div>
</div>
</div>
<div id="worldInfoScanningCheckboxes" data-newbie-hidden class="alignitemsflexstart flex1 flex-container flexFlowColumn">
<label title="Entries can activate other entries by mentioning their keywords" data-i18n="[title]Entries can activate other entries by mentioning their keywords" class="checkbox_label flex1">
<input id="world_info_recursive" type="checkbox" />
<small data-i18n="Recursive Scan" class="whitespacenowrap flex1">
Recursive Scan
</small>
</label>
<label title="Lookup for the entry keys in the context will respect the case" data-i18n="[title]Lookup for the entry keys in the context will respect the case" class="checkbox_label flex1">
<input id="world_info_case_sensitive" type="checkbox" />
<small data-i18n="Case Sensitive" class="whitespacenowrap flex1">
Case-sensitive
</small>
</label>
<label title="If the entry key consists of only one word, it would not be matched as part of other words" data-i18n="[title]If the entry key consists of only one word, it would not be matched as part of other words" class="checkbox_label flex1">
<input id="world_info_match_whole_words" type="checkbox" />
<small data-i18n="Match whole words" class="whitespacenowrap flex1">
Match whole words
</small>
</label>
<label title="Alert if your world info is greater than the allocated budget." data-i18n="[title]Alert if your world info is greater than the allocated budget." class="checkbox_label flex1">
<input id="world_info_overflow_alert" type="checkbox" />
<small data-i18n="Alert On Overflow" class="whitespacenowrap flex1">
Alert On Overflow
</small>
</label>
</div>
</div>
</div>
</div>
<div id="world_popup">
<hr>
<div class="flex-container alignitemscenter gap3px">
<input type="file" id="world_import_file" accept=".json,.lorebook,.png" name="avatar" hidden>
<div id="world_create_button" class="menu_button menu_button_icon">
<i class="fa-solid fa-globe"></i>
<span data-i18n="New">New</span>
</div>
<small data-i18n="or">or</small>
<select id="world_editor_select" class="margin0">
<option value="" data-i18n="--- Pick to Edit ---">--- Pick to Edit ---</option>
</select>
<div id="world_popup_name_button" class="menu_button fa-pencil fa-solid" title="Rename World Info" data-i18n="[title]Rename World Info"></div>
<div id="OpenAllWIEntries" class="menu_button fa-solid fa-expand" title="Open all Entries" data-i18n="[title]Open all Entries"></div>
<div id="CloseAllWIEntries" class="menu_button fa-solid fa-compress" title="Close all Entries" data-i18n="[title]Close all Entries"></div>
<div id="world_popup_new" class="menu_button fa-solid fa-plus" title="New Entry" data-i18n="[title]New Entry"></div>
<div id="world_backfill_memos" class="menu_button fa-solid fa-notes-medical" title="Fill empty Memo/Titles with Keywords" data-i18n="[title]Fill empty Memo/Titles with Keywords"></div>
<div id="world_import_button" class="menu_button fa-solid fa-file-import" title="Import World Info" data-i18n="[title]Import World Info"></div>
<div id="world_popup_export" class="menu_button fa-solid fa-file-export" title="Export World Info" data-i18n="[title]Export World Info"></div>
<div id="world_popup_delete" class="menu_button fa-solid fa-trash-can redWarningBG" title="Delete World Info" data-i18n="[title]Delete World Info"></div>
<input type="search" class="text_pole textarea_compact" data-i18n="[placeholder]Search..." id="world_info_search" placeholder="Search...">
<select id="world_info_sort_order" class="margin0">
<option data-rule="priority" value="0">Priority</option>
<option data-rule="custom" value="13">Custom</option>
<option data-order="asc" data-field="comment" value="1">Title A-Z</option>
<option data-order="desc" data-field="comment" value="2">Title Z-A</option>
<option data-order="asc" data-field="content" data-rule="length" value="3">Tokens ↗</option>
<option data-order="desc" data-field="content" data-rule="length" value="4">Tokens ↘</option>
<option data-order="asc" data-field="depth" value="5">Depth ↗</option>
<option data-order="desc" data-field="depth" value="6">Depth ↘</option>
<option data-order="asc" data-field="order" value="7">Order ↗</option>
<option data-order="desc" data-field="order" value="8">Order ↘</option>
<option data-order="asc" data-field="uid" value="9">UID ↗</option>
<option data-order="desc" data-field="uid" value="10">UID ↘</option>
<option data-order="asc" data-field="probability" value="11">Trigger% ↗</option>
<option data-order="desc" data-field="probability" value="12">Trigger% ↘</option>
</select>
<div id="world_refresh" class="menu_button fa-solid fa-arrows-rotate" title="Refresh" data-i18n="[title]Refresh"></div>
<div id="world_info_pagination"></div>
</div>
<div id="world_popup_entries_list">
</div>
</div>
</div>
</div>
</div>
<div id="user-settings-button" class="drawer">
<div class="drawer-toggle">
<div class="drawer-icon fa-solid fa-user-cog closedIcon" title="User Settings" data-i18n="[title]User Settings"></div>
</div>
<div id="user-settings-block" class="drawer-content closedDrawer">
<div class="flex-container flexFlowColumn">
<div name="userSettingsRowOne" class="flex-container flexFlowRow alignitemscenter spaceBetween">
<div class="flex-container">
<div class="flex-container flexnowrap alignitemscenter">
<h3 class="margin0"><span data-i18n="User Settings">User Settings</span></h3>
<select id="ui_mode_select" class="margin0 widthNatural">
<option value="0" data-i18n="Simple">Simple</option>
<option value="1" data-i18n="Advanced">Advanced</option>
</select>
</div>
</div>
<div id="UI-language-block" class="flex-container alignitemscenter">
<span data-i18n="UI Language">Language:</span>
<select id="ui_language_select" class="widthNatural flex1 margin0">
<option value="" data-i18n="Default">Default</option>
<option value="en">en</option>
</select>
</div>
<small id="version_display"></small>
</div>
<div name="UserSettingsRowTwo" class="flex-container flexFlowRow">
<textarea id="settingsSearch" class="textarea_compact wide100p" rows="1" placeholder="Search Settings"></textarea>
</div>
</div>
<div id="user-settings-block-content" class="flex-container spaceEvenly">
<div name="UserSettingsFirstColumn" id="UI-Theme-Block" class="flex-container flexFlowColumn wide100p">
<div id="UI-presets-block" class="flex-container flexFlowColumn">
<h4>
<span data-i18n="UI Theme Preset">Theme Preset</span>
</h4>
<div class="flex-container flexnowrap alignitemscenter">
<select id="themes" class="margin0">
</select>
<div id="ui-preset-save-button" title="Save changes to a new theme file" data-i18n="[title]Save changes to a new theme file" class="menu_button margin0">
<i class="fa-solid fa-save"></i>
</div>
</div>
</div>
<div name="themeElements" data-newbie-hidden class="flex-container flexFlowColumn flexNoGap">
<h4><span data-i18n="UI Colors">Theme Settings</span></h4>
<div name="AvatarAndChatDisplay" class="flex-container flexFlowColumn">
<div class="flex-container">
<span data-i18n="Avatar Style">Avatars:</span>
<select id="avatar_style" class="widthNatural flex1 margin0">
<option value="0" data-i18n="Circle">Circle</option>
<option value="2" data-i18n="Square">Square</option>
<option value="1" data-i18n="Rectangle">Rectangle</option>
</select>
</div>
<div class="flex-container">
<span data-i18n="Chat Style:">Chat Style:</span><br>
<select id="chat_display" class="widthNatural flex1 margin0">
<option value="0" data-i18n="Default">Flat</span>
<option value="1" data-i18n="Bubbles">Bubbles</option>
<option value="2" data-i18n="Document">Document</option>
</select>
</div>
</div>
<div id="color-picker-block" class="flex-container flexFlowColumn flexNoGap">
<div class="flex-container">
<toolcool-color-picker id="main-text-color-picker"></toolcool-color-picker>
<span data-i18n="Main Text">Main Text</span>
</div>
<div class="flex-container">
<toolcool-color-picker id="italics-color-picker"></toolcool-color-picker>
<span data-i18n="Italics Text">Italics Text</span>
</div>
<div class="flex-container">
<toolcool-color-picker id="quote-color-picker"></toolcool-color-picker>
<span data-i18n="Quote Text">Quote Text</span>
</div>
<div class="flex-container">
<toolcool-color-picker id="shadow-color-picker"></toolcool-color-picker>
<span data-i18n="Shadow Color">Text Shadow</span>
</div>
<div class="flex-container">
<toolcool-color-picker id="chat-tint-color-picker"></toolcool-color-picker>
<span data-i18n="Chat Background">Chat Background</span>
</div>
<div class="flex-container">
<toolcool-color-picker id="blur-tint-color-picker"></toolcool-color-picker>
<span data-i18n="UI Background">UI Background</span>
</div>
<div class="flex-container">
<toolcool-color-picker id="border-color-picker"></toolcool-color-picker>
<span data-i18n="UI Border">UI Border</span>
</div>
<div class="flex-container">
<toolcool-color-picker id="user-mes-blur-tint-color-picker"></toolcool-color-picker>
<span data-i18n="User Message Blur Tint">User Message</span>
</div>
<div class="flex-container">
<toolcool-color-picker id="bot-mes-blur-tint-color-picker"></toolcool-color-picker>
<span data-i18n="AI Message Blur Tint">AI Message</span>
</div>
</div>
<div data-newbie-hidden name="FontBlurChatWidthBlock" class="flex-container flexFlowColumn flexNoGap">
<div data-newbie-hidden class="range-block">
<div class="range-block-title" data-i18n="Chat Width (PC)">
Chat Width (PC)
</div>
<div class="range-block-range-and-counter">
<div class="range-block-range">
<input id="chat_width_slider" class="wide100p" type="range" min="25" max="100" step="1" value="50">
</div>
<div class="range-block-counter">
<input type="number" min="25" max="100" step="1" value="50" data-for="chat_width_slider" id="chat_width_slider_counter">
</div>
</div>
</div>
<div id="font-scale-block" class="range-block">
<div class="range-block-title" data-i18n="Font Scale">
Font Scale
</div>
<div class="range-block-range-and-counter">
<div class="range-block-range">
<input type="range" id="font_scale" name="font_scale" min="0.8" max="1.2" step="0.01">
</div>
<div class="range-block-counter">
<input type="number" min="0.8" max="1.2" step="0.01" data-for="font_scale" id="font_scale_counter">
</div>
</div>
</div>
<div id="blur-strength-block" class="range-block">
<div class="range-block-title" data-i18n="Blur Strength">
Blur Strength
</div>
<div class="range-block-range-and-counter">
<div class="range-block-range">
<input type="range" id="blur_strength" name="blur_strength" min="0" max="30" step="1">
</div>
<div class="range-block-counter">
<input type="number" min="0" max="30" step="1" data-for="blur_strength" id="blur_strength_counter">
</div>
</div>
</div>
<div id="shadow-width-block" class="range-block">
<div class="range-block-title" data-i18n="Text Shadow Width">
Text Shadow Width
</div>
<div class="range-block-range-and-counter">
<div class="range-block-range">
<input type="range" id="shadow_width" name="shadow_width" min="0" max="5" step="1">
</div>
<div class="range-block-counter">
<input type="number" min="0" max="5" step="1" data-for="shadow_width" id="shadow_width_counter">
</div>
</div>
</div>
<div id="chat-truncation-block" class="range-block">
<div class="range-block-title" data-i18n="Chat Truncation">
Chat Truncation <small>(0 = unlimited)</small>
</div>
<div class="range-block-range-and-counter">
<div class="range-block-range">
<input type="range" id="chat_truncation" name="chat_truncation" min="0" max="1000" step="25">
</div>
<div class="range-block-counter">
<input type="number" min="0" max="1000" step="1" data-for="chat_truncation" id="chat_truncation_counter">
</div>
</div>
</div>
<div id="streaming-fps" class="range-block">
<div class="range-block-title" data-i18n="Streaming FPS">
Streaming FPS
</div>
<div class="range-block-range-and-counter">
<div class="range-block-range">
<input type="range" id="streaming_fps" name="streaming_fps" min="5" max="100" step="5">
</div>
<div class="range-block-counter">
<input type="number" min="5" max="100" step="1" data-for="streaming_fps" id="streaming_fps_counter">
</div>
</div>
</div>
</div>
</div>
</div>
<div name="UserSettingsSecondColumn" id="UI-Customization" class="flex-container flexFlowColumn wide100p flexNoGap">
<div name="themeToggles">
<h4 data-i18n="Theme Toggles">Theme Toggles</h4>
<label for="reduced_motion" class="checkbox_label" title="Disables animations and transitions" data-i18n="[title]Disables animations and transitions">
<input id="reduced_motion" type="checkbox" />
<span data-i18n="Reduced Motion">Reduced Motion</span>
</label>
<label data-newbie-hidden for="fast_ui_mode" class="checkbox_label" title="removes blur from window backgrounds" data-i18n="[title]removes blur from window backgrounds">
<input id="fast_ui_mode" type="checkbox" />
<span data-i18n="No Blur Effect">No Blur Effect</span>
</label>
<label data-newbie-hidden for="noShadowsmode" class="checkbox_label">
<input id="noShadowsmode" type="checkbox" />
<span data-i18n="No Text Shadows">No Text Shadows</span>
</label>
<label for="waifuMode" class="checkbox_label">
<input id="waifuMode" type="checkbox" />
<span data-i18n="Waifu Mode">Visual Novel Mode</span>
</label>
<label data-newbie-hidden for="expandMessageActions" class="checkbox_label">
<input id="expandMessageActions" type="checkbox" />
<span data-i18n="Auto-Expand Message Actions">Expand Message Actions</span>
</label>
<label data-newbie-hidden for="enableZenSliders" class="checkbox_label">
<input id="enableZenSliders" type="checkbox" />
<span data-i18n="Zen Sliders">Zen Sliders</span>
</label>
<label data-newbie-hidden for="enableLabMode" class="checkbox_label">
<input id="enableLabMode" type="checkbox" />
<span data-i18n="Mad Lab Mode">Mad Lab Mode</span>
</label>
<label data-newbie-hidden for="messageTimerEnabled" class="checkbox_label">
<input id="messageTimerEnabled" type="checkbox" />
<span data-i18n="Message Timer">Message Timer</span>
</label>
<label data-newbie-hidden for="messageTimestampsEnabled" class="checkbox_label">
<input id="messageTimestampsEnabled" type="checkbox" />
<span data-i18n="Chat Timestamps">Chat Timestamps</span>
</label>
<label data-newbie-hidden for="messageModelIconEnabled" class="checkbox_label">
<input id="messageModelIconEnabled" type="checkbox" />
<span data-i18n="Model Icon">Model Icons</span>
</label>
<label data-newbie-hidden for="mesIDDisplayEnabled" class="checkbox_label">
<input id="mesIDDisplayEnabled" type="checkbox" />
<span data-i18n="Message IDs">Message IDs</span>
</label>
<label data-newbie-hidden for="messageTokensEnabled" class="checkbox_label">
<input id="messageTokensEnabled" type="checkbox" />
<span data-i18n="Show Message Token Count">Message Token Count</span>
</label>
<label data-newbie-hidden for="hotswapEnabled" class="checkbox_label">
<input id="hotswapEnabled" type="checkbox" />
<span data-i18n="Characters Hotswap">Characters Hotswap</span>
</label>
<label for="bogus_folders" class="checkbox_label">
<input id="bogus_folders" type="checkbox" />
<span data-i18n="Tags as Folders">Tags as Folders</span>
</label>
</div>
<h4><span data-i18n="Miscellaneous">Miscellaneous</span></h4>
<div title="If set in the advanced character definitions, this field will be displayed in the characters list.">
<label for="aux_field" data-i18n="Aux List Field">Aux List Field</label>
<select id="aux_field">
<option data-i18n="Character Version" value="character_version">Character Version</option>
<option data-i18n="Created by" value="creator">Created by</option>
</select>
</div>
<div>
<label for="play_message_sound" class="checkbox_label">
<input id="play_message_sound" type="checkbox" />
<audio id="audio_message_sound" src="sounds/message.mp3" hidden></audio>
<span>
<span data-i18n="Message Sound">Message Sound</span>
<a href="https://docs.sillytavern.app/usage/core-concepts/uicustomization/#message-sound" class="notes-link" target="_blank">
<span class="fa-solid fa-circle-question note-link-span"></span>
</a>
</span>
</label>
<label for="play_sound_unfocused" class="checkbox_label">
<input id="play_sound_unfocused" type="checkbox" />
<span data-i18n="Background Sound Only">Background Sound Only</span>
</label>
<label data-newbie-hidden class="checkbox_label" for="relaxed_api_urls" title="Reduce the formatting requirements on API URLS">
<input id="relaxed_api_urls" type="checkbox" />
<span data-i18n="Relaxed API URLS">Relaxed API URLs</span>
</label>
<label data-newbie-hidden class="checkbox_label" for="world_import_dialog" title="Ask to import the World Info/Lorebook for every new character with embedded lorebook. If unchecked, a brief message will be shown instead.">
<input id="world_import_dialog" type="checkbox" />
<span data-i18n="Lorebook Import Dialog">Lorebook Import Dialog</span>
</label>
<label class="checkbox_label" for="restore_user_input" title="Restore unsaved user input on page refresh">
<input id="restore_user_input" type="checkbox" />
<span data-i18n="Restore User Input">Restore User Input</span>
</label>
<label data-newbie-hidden id="movingUIModeCheckBlock" for="movingUImode" class="checkbox_label">
<input id="movingUImode" type="checkbox" />
<span data-i18n="Movable UI Panels">MovingUI</span>
</label>
<div data-newbie-hidden id="MovingUI-presets-block" class="flex-container alignitemscenter">
<div class="flex-container alignitemscenter">
<span>MUI Preset:</span>
<div class="flex-container flexnowrap">
<select id="movingUIPresets" class="widthNatural flex1 margin0">
</select>
<div id="movingui-preset-save-button" title="Save changes to a new MovingUI preset file" data-i18n="[title]Save movingUI changes to a new file" class="menu_button margin0">
<i class="fa-solid fa-save"></i>
</div>
</div>
</div>
</div>
<div id="movingUIreset" class="menu_button whitespacenowrap" data-i18n="Reset Panels">
Reset MovingUI
</div>
<div data-newbie-hidden id="CustomCSS-block" class="flex-container flexFlowColumn">
<h4>
<span data-i18n="Custom CSS">Custom CSS</span>
</h4>
<div class="flex-container flexnowrap alignitemscenter">
<textarea id="customCSS" class="text_pole margin0 margin-r5 textarea_compact monospace"></textarea>
</div>
</div>
</div>
</div>
<div name="UserSettingsThirdColumn" id="power-user-options-block" class="flex-container wide100p">
<div id="power-user-option-checkboxes">
<div data-newbie-hidden name="CharacterHandlingToggles">
<h4 data-i18n="Character Handling">
Character Handling
</h4>
<div data-newbie-hidden id="examples-behavior-block">
<label data-i18n="Example Messages Behavior">
Example Messages Behavior:
</label>
<select id="example_messages_behavior">
<option value="normal">Gradual push-out</option>
<option value="keep">Always include examples</option>
<option value="strip">Never include examples</option>
</select>
</div>
<label data-newbie-hidden class="checkbox_label" for="fuzzy_search_checkbox">
<input id="fuzzy_search_checkbox" type="checkbox" />
<span data-i18n="Advanced Character Search">Advanced Character Search</span>
</label>
<label data-newbie-hidden for="prefer_character_prompt" title="If checked and the character card contains a prompt override (System Prompt), use that instead." data-i18n="[title]If checked and the character card contains a prompt override (System Prompt), use that instead." class="checkbox_label">
<input id="prefer_character_prompt" type="checkbox" />
<span data-i18n="Prefer Character Card Prompt">Prefer Char. Prompt</span>
</label>
<label data-newbie-hidden for="prefer_character_jailbreak" title="If checked and the character card contains a jailbreak override (Post History Instruction), use that instead." data-i18n="[title]If checked and the character card contains a jailbreak override (Post History Instruction), use that instead." class="checkbox_label">
<input id="prefer_character_jailbreak" type="checkbox" />
<span data-i18n="Prefer Character Card Jailbreak">Prefer Char. Jailbreak</span>
</label>
<label data-newbie-hidden class="checkbox_label" for="never_resize_avatars">
<input id="never_resize_avatars" type="checkbox" />
<span data-i18n="Never resize avatars">Never resize avatars</span>
</label>
<label data-newbie-hidden class="checkbox_label" for="show_card_avatar_urls">
<input id="show_card_avatar_urls" type="checkbox" />
<span data-i18n="Show avatar filenames">Show avatar filenames</span>
</label>
<label data-newbie-hidden class="checkbox_label" for="import_card_tags">
<input id="import_card_tags" type="checkbox" />
<span data-i18n="Import Card Tags">Import Card Tags</span>
</label>
<label data-newbie-hidden class="checkbox_label" for="spoiler_free_mode">
<input id="spoiler_free_mode" type="checkbox" />
<span data-i18n="Spoiler Free Mode">Spoiler Free Mode</span>
</label>
</div>
<div name="ChatMessageHandlingToggles">
<h4>Chat/Message Handling</h4>
<div data-newbie-hidden class="flex-container alignitemscenter">
<span data-i18n="Send on Enter">
Enter to Send:
</span>
<select id="send_on_enter" class="widthNatural flex1 margin0">
<option value="-1" data-i18n="Disabled">Disabled</option>
<option value="0" data-i18n="Automatic (PC)">Automatic (PC)</option>
<option value="1" data-i18n="Enabled">Enabled</option>
</select>
</div>
<label data-newbie-hidden class="checkbox_label" for="continue_on_send">
<input id="continue_on_send" type="checkbox" />
<span data-i18n="Press Send to continue">
"Send" to Continue
</span>
</label>
<label class="checkbox_label" for="quick_continue">
<input id="quick_continue" type="checkbox" />
<span data-i18n="Press Send to continue">
Quick "Continue" button
</span>
</label>
<div class="checkbox-container flex-container">
<label data-newbie-hidden class="checkbox_label" for="swipes-checkbox">
<input id="swipes-checkbox" type="checkbox" />
<span data-i18n="Swipes">Swipes</span>
</label>
<label data-newbie-hidden class="checkbox_label" for="gestures-checkbox">
<input id="gestures-checkbox" type="checkbox" />
<span data-i18n="Gestures">Gestures</span>
</label>
</div>
<label class="checkbox_label" for="auto-load-chat-checkbox">
<input id="auto-load-chat-checkbox" type="checkbox" />
<span data-i18n="Auto-load Last Chat">Auto-load Last Chat</span>
</label>
<label data-newbie-hidden for="auto_scroll_chat_to_bottom" class="checkbox_label">
<input id="auto_scroll_chat_to_bottom" type="checkbox" />
<span data-i18n="Auto-scroll Chat">Auto-scroll Chat</span>
</label>
<label data-newbie-hidden class="checkbox_label" for="auto_save_msg_edits">
<input id="auto_save_msg_edits" type="checkbox" />
<span data-i18n="Auto-save Message Edits">Auto-save Message Edits</span>
</label>
<label data-newbie-hidden class="checkbox_label" for="confirm_message_delete">
<input id="confirm_message_delete" type="checkbox" />
<span data-i18n="Confirm message deletion">Confirm message deletion</span>
</label>
<label class="checkbox_label" for="auto_fix_generated_markdown">
<input id="auto_fix_generated_markdown" type="checkbox" />
<span data-i18n="Auto-fix Markdown">Auto-fix Markdown</span>
</label>
<label data-newbie-hidden class="checkbox_label" for="render_formulas">
<input id="render_formulas" type="checkbox" />
<span data-i18n="Render Formulas">Render Formulas</span>
<a href="https://docs.sillytavern.app/usage/core-concepts/uicustomization/#formulas-rendering" class="notes-link" target="_blank">
<span class="fa-solid fa-circle-question note-link-span"></span>
</a>
</label>
<label data-newbie-hidden class="checkbox_label" for="allow_name2_display">
<input id="allow_name2_display" type="checkbox" />
<span data-i18n="Allow {{char}}: in bot messages">Show {{char}}: in responses</span>
</label>
<label data-newbie-hidden class="checkbox_label" for="allow_name1_display">
<input id="allow_name1_display" type="checkbox" />
<span data-i18n="Allow {{user}}: in bot messages">Show {{user}}: in responses</span>
</label>
<label class="checkbox_label" for="encode_tags">
<input id="encode_tags" type="checkbox" />
<span data-i18n="Show tags in responses">Show &lt;tags&gt; in responses</span>
</label>
<label data-newbie-hidden class="checkbox_label" for="disable_group_trimming" title="Allow AI messages in groups to contain lines spoken by other group members.">
<input id="disable_group_trimming" type="checkbox" />
<span data-i18n="Relax message trim in Groups">Relax message trim in Groups</span>
</label>
<label data-newbie-hidden class="checkbox_label" for="console_log_prompts">
<input id="console_log_prompts" type="checkbox" />
<span data-i18n="Log prompts to console">Log prompts to console</span>
</label>
<div data-newbie-hidden class="inline-drawer wide100p flexFlowColumn">
<div class="inline-drawer-toggle inline-drawer-header">
<b><span data-i18n="Auto-swipe">Auto-swipe</span></b>
<div class="fa-solid fa-circle-chevron-down inline-drawer-icon down"></div>
</div>
<div class="inline-drawer-content">
<label class="checkbox_label" for="auto_swipe">
<input id="auto_swipe" type="checkbox" />
<span data-i18n="Enabled">Enabled</span>
</label>
<div data-i18n="Minimum generated message length">Minimum generated message length</div>
<input id="auto_swipe_minimum_length" name="auto_swipe_minimum_length" type="number" min="0" step="1" value="0" class="text_pole">
<div data-i18n="Blacklisted words">Blacklisted words</div>
<div class="auto_swipe">
<textarea id="auto_swipe_blacklist" name="auto_swipe_blacklist" data-i18n="[placeholder]words you dont want generated separated by comma ','" placeholder="words you dont want generated separated by comma ','" class="text_pole textarea_compact" maxlength="5000" value="" autocomplete="off" rows="3"></textarea>
<div data-i18n="Blacklisted word count to swipe">Blacklisted word count to swipe</div>
<input id="auto_swipe_blacklist_threshold" name="auto_swipe_blacklist_threshold" type="number" min="0" step="1" value="1" class="text_pole">
</div>
</div>
</div>
</div>
<div data-newbie-hidden class="flex-container">
<div id="reload_chat" class="menu_button whitespacenowrap" data-i18n="Reload Chat">
Reload Chat
</div>
<div id="debug_menu" class="menu_button whitespacenowrap" data-i18n="Debug Menu">
Debug Menu
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<div id="logo_block" class="drawer">
<div id="site_logo" class="drawer-toggle drawer-header" title="Change Background Image" data-i18n="[title]Change Background Image">
<div class="drawer-icon fa-solid fa-panorama closedIcon"></div>
</div>
<div id="Backgrounds" class="drawer-content closedDrawer">
<div class="flex-container">
<div class="flex-container wide100p">
<input id="bg-filter" placeholder="Filter" class="text_pole flex1" type="search" />
<div id="auto_background" class="menu_button menu_button_icon" title="Automatically select a background based on the chat context.">
<i class="fa-solid fa-wand-magic"></i>
Auto-select
</div>
</div>
<h3 data-i18n="System Backgrounds" class="wide100p textAlignCenter">
System Backgrounds
</h3>
<div id="bg_menu_content" class="bg_list">
<form id="form_bg_download" class="bg_example no-border no-shadow" action="javascript:void(null);" method="post" enctype="multipart/form-data">
<label class="input-file">
<input type="file" id="add_bg_button" name="avatar" accept="image/png, image/jpeg, image/jpg, image/gif, image/bmp">
<div class="bg_example no-border no-shadow add_bg_but" style="background-image: url('/img/addbg3.png');"></div>
</label>
</form>
</div>
<h3 data-i18n="Chat Backgrounds" class="wide100p textAlignCenter">
Chat Backgrounds
</h3>
<div id="bg_chat_hint" class="wide100p textAlignCenter">
Chat backgrounds generated with the <code><i class="fa-solid fa-paintbrush"></i>&nbsp;Image Generation</code> extension will appear here.
</div>
<div id="bg_custom_content" class="bg_list">
</div>
</div>
</div>
</div>
<div id="extensions-settings-button" class="drawer">
<div class="drawer-toggle">
<div class="drawer-icon fa-solid fa-cubes closedIcon" title="Extensions" data-i18n="[title]Extensions"></div>
</div>
<div id="rm_extensions_block" class="drawer-content closedDrawer">
<div class="extensions_block flex-container">
<div class="alignitemscenter flex-container wide100p">
<h3 class="margin0 flex1" data-i18n="Extensions">
Extensions
</h3>
<label for="extensions_notify_updates" class="checkbox_label flexNoGap">
<input id="extensions_notify_updates" type="checkbox">
<span data-i18n="Notify on extension updates">Notify on extension updates</span>
</label>
<div id="extensions_details" class="menu_button_icon menu_button">
<i class="fa-solid fa-cubes"></i>
Manage extensions
</div>
<div id="third_party_extension_button" title="Import Extension From Git Repo" class="menu_button menu_button_icon">
<i class="fa-solid fa-cloud-arrow-down"></i>
Install extension
</div>
</div>
<div id="extensions_settings" class="flex1 wide50p">
</div>
<div id="extensions_settings2" class="flex1 wide50p">
</div>
<hr class="wide100p margin0">
<div class="alignitemscenter flex-container justifyCenter wide100p" style="justify-content: space-between;">
<h4 class="margin0" data-i18n="Extras API:">Extras API:
<a target="_blank" href="https://github.com/SillyTavern/SillyTavern-Extras">
SillyTavern-Extras
</a>
</h4>
<div class="flex-container">
<div id="extensions_status" data-i18n="Not connected...">Not connected...</div>
<label for="extensions_autoconnect" class="checkbox_label flexNoGap">
<input id="extensions_autoconnect" type="checkbox">
<span data-i18n="Auto-connect">Auto-connect</span>
</label>
</div>
</div>
<div class="alignitemsflexstart flex-container wide100p">
<input id="extensions_url" type="text" class="flex1 heightFitContent text_pole widthNatural" maxlength="250" data-i18n="[placeholder]Extras API URL" placeholder="Extras API URL">
<input id="extensions_api_key" type="text" class="flex1 heightFitContent text_pole widthNatural" maxlength="250" data-i18n="[placeholder]Extras API key (optional)" placeholder="Extras API key (optional)">
<div class="extensions_url_block">
<div id="extensions_connect" class="menu_button" data-i18n="Connect">Connect</div>
</div>
</div>
</div>
</div>
</div>
<div id="persona-management-button" class="drawer">
<div class="drawer-toggle">
<div class="drawer-icon fa-solid fa-face-smile closedIcon" title="Persona Management" data-i18n="[title]Persona Management"></div>
</div>
<div class="drawer-content closedDrawer">
<div class="flex-container wide100p alignitemscenter spaceBetween">
<div class="flex-container alignItemsBaseline wide100p">
<div class="flex1 flex-container alignItemsBaseline">
<h3 class="margin0" data-i18n="Persona Management">Persona Management</h3>
<a href="https://docs.sillytavern.app/usage/core-concepts/personas/" target="_blank" data-i18n="How do I use this?">
<span class="fa-solid fa-circle-question note-link-span"></span>
</a>
</div>
<div class="flex-container">
<div class="menu_button menu_button_icon user_stats_button" title="Click for stats!">
<i class="fa-solid fa-ranking-star"></i>
<span data-i18n="Usage Stats">Usage Stats</span>
</div>
<div id="personas_backup" class="menu_button menu_button_icon" title="Backup your personas to a file">
<i class="fa-solid fa-file-export"></i>
<span data-i18n="Backup">Backup</span>
</div>
<div id="personas_restore" class="menu_button menu_button_icon" title="Restore your personas from a file">
<i class="fa-solid fa-file-import"></i>
<span data-i18n="Restore">Restore</span>
</div>
<div id="create_dummy_persona" class="menu_button menu_button_icon" title="Create a dummy persona" data-i18n="[title]Create a dummy persona">
<i class="fa-solid fa-person-circle-question fa-fw"></i>
<span data-i18n="Create">Create</span>
</div>
<input id="personas_restore_input" type="file" accept=".json" hidden>
</div>
</div>
<div id="persona-management-block" class="flex-container wide100p">
<div class="flex1">
<h4 data-i18n="Name">Name</h4>
<div class="change_name">
<input id="your_name" name="your_name" data-i18n="[placeholder]Enter your name" placeholder="Enter your name" class="text_pole wide100p" maxlength="100" value="" autocomplete="off">
<div id="your_name_button" class="menu_button fa-solid fa-check" title="Click to set a new User Name" data-i18n="[title]Click to set a new User Name">
</div>
<div id="lock_user_name" class="menu_button fa-solid fa-unlock" title="Click to lock your selected persona to the current chat. Click again to remove the lock." data-i18n="[title]Click to lock your selected persona to the current chat. Click again to remove the lock.">
</div>
<div id="sync_name_button" class="menu_button fa-solid fa-sync" title="Click to set user name for all messages" data-i18n="[title]Click to set user name for all messages">
</div>
</div>
<div>
<h4 data-i18n="Persona Description">Persona Description</h4>
<textarea id="persona_description" name="persona_description" placeholder="Example:&#10;[{{user}} is a 28-year-old Romanian cat girl.]" class="text_pole textarea_compact" maxlength="50000" value="" autocomplete="off" rows="8"></textarea>
<div class="extension_token_counter">
Tokens: <span id="persona_description_token_count">0</span>
</div>
<div data-newbie-hidden>
<label for="persona_description_position" data-i18n="Position:">Position:</label>
<select id="persona_description_position">
<option value="0" data-i18n="In Story String / Prompt Manager">In Story String / Prompt Manager</option>
<option value="2" data-i18n="Top of Author's Note">Top of Author's Note</option>
<option value="3" data-i18n="Bottom of Author's Note">Bottom of Author's Note</option>
</select>
</div>
</div>
<div class="range-block">
<label for="persona_show_notifications" class="checkbox_label">
<input id="persona_show_notifications" type="checkbox" />
<span data-i18n="Show notifications on switching personas">
Show notifications on switching personas
</span>
</label>
</div>
</div>
<div class="flex1">
<h4 class="title_restorable">
<span data-i18n="Your Persona">Your Persona</span>
</h4>
<div id="user_avatar_block">
<div class="avatar_upload">+</div>
</div>
<form id="form_upload_avatar" action="javascript:void(null);" method="post" enctype="multipart/form-data">
<input type="file" id="avatar_upload_file" accept="image/*" name="avatar">
<input type="hidden" id="avatar_upload_overwrite" name="overwrite_name" value="">
</form>
</div>
</div>
</div>
</div>
</div>
<div id="rightNavHolder" class="drawer">
<div id="unimportantYes" class="drawer-toggle drawer-header">
<div id="rightNavDrawerIcon" class="drawer-icon fa-solid fa-address-card closedIcon" title="Character Management" data-i18n="[title]Character Management">
</div>
</div>
<nav id="right-nav-panel" class="drawer-content closedDrawer fillRight">
<div id="right-nav-panelheader" class="fa-solid fa-grip drag-grabber">
</div>
<div id="CharListButtonAndHotSwaps" class="flex-container flexnowrap">
<div class="flexFlowColumn flex-container">
<div id="rm_button_panel_pin_div" class="alignitemsflexstart" title="Locked = Character Management panel will stay open" data-i18n="[title]Locked = Character Management panel will stay open">
<input type="checkbox" id="rm_button_panel_pin">
<label for="rm_button_panel_pin">
<div class="fa-solid unchecked fa-unlock" alt=""></div>
<div class="fa-solid checked fa-lock" alt=""></div>
</label>
</div>
<div class="right_menu_button fa-solid fa-list-ul" id="rm_button_characters" title="Select/Create Characters" data-i18n="[title]Select/Create Characters"></div>
</div>
<div id="HotSwapWrapper" class="alignitemscenter flex-container margin0auto width100p">
<div class="hotswap flex-container flex1"></div>
</div>
</div>
<hr>
<!-- this div structure must be preserved until group peeking can adjust -->
<div id="rm_PinAndTabs">
<div id="right-nav-panel-tabs" class="">
<div id="rm_button_selected_ch">
<h2></h2>
</div>
<div id="result_info" class="flex-container" style="display: none;">
<div id="result_info_text" title="Token counts may be inaccurate and provided just for reference." data-i18n="[title]Token counts may be inaccurate and provided just for reference.">
<div>
<strong id="result_info_total_tokens" title="Total tokens">Calculating...</strong>&nbsp;<span data-i18n="Tokens">Tokens</span>
</div>
<div>
<small title="Permanent tokens">
(<span id="result_info_permanent_tokens"></span>&nbsp;<span data-i18n="Permanent">Permanent</span>)
</small>
</div>
</div>
<a id="chartokenwarning" class="right_menu_button fa-solid fa-triangle-exclamation" href="https://docs.sillytavern.app/usage/core-concepts/characterdesign/#character-tokens" target="_blank" title="About Token 'Limits'"></a>
<i title="Click for stats!" class="fa-solid fa-ranking-star right_menu_button rm_stats_button"></i>
<i title="Toggle character info panel" id="hideCharPanelAvatarButton" class="fa-solid fa-eye right_menu_button"></i>
</div>
</div>
</div>
<!-- end group peeking cope structure-->
<div name="Solo Char Create/Edit Panel" id="rm_ch_create_block" class="right_menu flex-container flexFlowColumn" style="display: none;">
<form id="form_create" action="javascript:void(null);" method="post" enctype="multipart/form-data">
<div id="avatar-and-name-block">
<div id="name_div">
<input id="character_name_pole" name="ch_name" class="text_pole" data-i18n="[placeholder]Name this character" placeholder="Name this character" maxlength="100" value="" autocomplete="off">
<div class="extension_token_counter">
Tokens: <span data-token-counter="character_name_pole" data-token-permanent="true">counting...</span>
</div>
</div>
<div id="avatar_div" class="avatar_div alignitemsflexstart justifySpaceBetween flexnowrap flexGap5">
<label id="avatar_div_div" class="add_avatar avatar" for="add_avatar_button" title="Click to select a new avatar for this character" data-i18n="[title]Click to select a new avatar for this character">
<img id="avatar_load_preview" src="img/ai4.png" alt="avatar">
<input hidden type="file" id="add_avatar_button" name="avatar" accept="image/png, image/jpeg, image/jpg, image/gif, image/bmp">
</label>
<div class="flex-container flexFlowColumn">
<div class="flex-container flexFlowColumn">
<div class="flex-container justifyContentFlexEnd flexFlowColumn">
<div class="form_create_bottom_buttons_block">
<div id="rm_button_back" class="menu_button fa-solid fa-left-long "></div>
<!-- <div id="renameCharButton" class="menu_button fa-solid fa-user-pen" title="Rename Character"></div> -->
<div id="favorite_button" class="menu_button fa-solid fa-star" title="Add to Favorites" data-i18n="[title]Add to Favorites"></div>
<input type="hidden" id="fav_checkbox" name="fav" />
<div id="advanced_div" class="menu_button fa-solid fa-book " title="Advanced Definitions" data-i18n="[title]Advanced Definition"></div>
<div id="world_button" class="menu_button fa-solid fa-globe" title="Character Lore" data-i18n="[title]Character Lore"></div>
<div class="chat_lorebook_button menu_button fa-solid fa-passport" title="Chat Lore" data-i18n="[title]Chat Lore"></div>
<div id="export_button" class="menu_button fa-solid fa-file-export " title="Export and Download" data-i18n="[title]Export and Download"></div>
<!-- <div id="set_chat_scenario" class="menu_button fa-solid fa-scroll" title="Set a chat scenario override"></div> -->
<!-- <div id="set_character_world" class="menu_button fa-solid fa-globe" title="Set a character World Info / Lorebook"></div> -->
<div id="dupe_button" class="menu_button fa-solid fa-clone " title="Duplicate Character" data-i18n="[title]Duplicate Character"></div>
<label for="create_button" id="create_button_label" class="menu_button fa-solid fa-user-check" title="Create Character" data-i18n="[title]Create Character">
<input type="submit" id="create_button" name="create_button">
</label>
<div id="delete_button" class="menu_button fa-solid fa-skull " title="Delete Character" data-i18n="[title]Delete Character"></div>
</div>
<label class="flex1" for="char-management-dropdown">
<select id="char-management-dropdown">
<option value="default" disabled selected data-i18n="More...">More...</option>
<option id="set_character_world" data-i18n="Link to World Info">
Link to World Info
</option>
<option id="import_character_info" data-i18n="Import Card Lore">
Import Card Lore
</option>
<option id="set_chat_scenario" data-i18n="Scenario Override">
Scenario Override
</option>
<option id="convert_to_persona" data-i18n="Convert to Persona">
Convert to Persona
</option>
<option id="renameCharButton" data-i18n="Rename">
Rename
</option>
<!--<option id="dupe_button">
Duplicate
</option>
<option id="export_button">
Export
</option>
<option id="delete_button">
Delete
</option>-->
</select>
</label>
</div>
<div id="tags_div" class="marginBot5">
<div class="tag_controls">
<input id="tagInput" class="text_pole tag_input wide100p margin0" data-i18n="[placeholder]Search / Create Tags" placeholder="Search / Create tags" maxlength="50" />
<div class="tags_view menu_button fa-solid fa-tags" title="View all tags" data-i18n="[title]View all tags"></div>
</div>
<div id="tagList" class="tags"></div>
</div>
</div>
</div>
</div>
</div>
<hr>
<div id="description_div" class="marginBot5 flex-container alignitemscenter">
<span data-i18n="Character Description">Description</span>
<i class="editor_maximize fa-solid fa-maximize right_menu_button" data-for="description_textarea" title="Expand the editor"></i>
<a href="https://docs.sillytavern.app/usage/core-concepts/characterdesign/#character-description" class="notes-link" target="_blank">
<span class="fa-solid fa-circle-question note-link-span"></span>
</a>
</div>
<textarea id="description_textarea" data-i18n="[placeholder]Describe your character's physical and mental traits here." placeholder="Describe your character's physical and mental traits here." class="marginBot5" name="description" placeholder=""></textarea>
<div class="extension_token_counter">
Tokens: <span data-token-counter="description_textarea" data-token-permanent="true">counting...</span>
</div>
<div id="first_message_div" class="marginBot5 title_restorable">
<div class="flex-container alignitemscenter">
<span data-i18n="First message">First message</span>
<i class="editor_maximize fa-solid fa-maximize right_menu_button" data-for="firstmessage_textarea" title="Expand the editor"></i>
<a href="https://docs.sillytavern.app/usage/core-concepts/characterdesign/#first-message" class="notes-link" target="_blank">
<span class="fa-solid fa-circle-question note-link-span"></span>
</a>
</div>
<div class="menu_button menu_button_icon open_alternate_greetings margin0" title="Click to set additional greeting messages" data-i18n="[title]Click to set additional greeting messages">
<span data-i18n="Alt. Greetings">
Alt. Greetings
</span>
</div>
</div>
<textarea id="firstmessage_textarea" data-i18n="[placeholder]This will be the first message from the character that starts every chat." placeholder="This will be the first message from the character that starts every chat." class="marginBot5" name="first_mes" placeholder=""></textarea>
<div class="extension_token_counter">
Tokens: <span data-token-counter="firstmessage_textarea">counting...</span>
</div>
<div id="spoiler_free_desc">
<div id="creators_notes_div" class="marginBot5 title_restorable">
<span data-i18n="Creator's Notes">Creator's Notes</span>
<div id="spoiler_free_desc_button" class="menu_button fa-solid fa-eye" title="Show / Hide Description and First Message" data-i18n="[title]Show / Hide Description and First Message"></div>
</a>
</div>
<hr>
<div id="creator_notes_spoiler" data-i18n="[placeholder]Creator's Notes" placeholder="Creator's Notes" class="marginBot5" name="creator_notes_spoiler"></div>
<!-- A button to show / hide description_div and description_textarea and first_message_div and firstmessage_textarea-->
</div>
<!-- these divs are invisible and used for server communication purposes -->
<div id="hidden-divs">
<input id="character_json_data" name="json_data" type="hidden">
<input id="avatar_url_pole" name="avatar_url" type="hidden">
<input id="selected_chat_pole" name="chat" type="hidden">
<input id="create_date_pole" name="create_date" type="hidden">
<input id="last_mes_pole" name="last_mes" type="hidden">
<input id="character_world" name="world" type="hidden">
</div>
<!-- now back to normal divs for display purposes-->
</form>
</div>
<div name="Group Chat Edit Panel" id="rm_group_chats_block" class="right_menu flex-container flexNoGap">
<div class="inline-drawer wide100p flexFlowColumn">
<div id="groupControlsToggle" class="inline-drawer-toggle inline-drawer-header">
<span>
<span data-i18n="Group Controls">Group Controls</span>
<a href="https://docs.sillytavern.app/usage/core-concepts/groupchats/" class="notes-link" target="_blank">
<span class="fa-solid fa-circle-question note-link-span"></span>
</a>
</span>
<div class="fa-solid fa-circle-chevron-down inline-drawer-icon down"></div>
</div>
<div class="inline-drawer-content">
<div id="group-metadata-controls" class="marginTopBot5">
<div class="flex-container wide100p">
<input id="rm_group_chat_name" class="text_pole flex1" type="text" name="chat_name" data-i18n="[placeholder]Chat Name (Optional)" placeholder="Chat Name (Optional)" maxlength="200" />
<div class="chat_lorebook_button menu_button fa-solid fa-passport" title="Chat Lore" data-i18n="[title]Chat Lore"></div>
</div>
<div id="group_tags_div" class="wide100p">
<div class="tag_controls">
<input id="groupTagInput" class="text_pole tag_input flex1 margin0" data-i18n="[placeholder]Search / Create Tags" placeholder="Search / Create tags" maxlength="50" />
<div class="tags_view menu_button fa-solid fa-tags margin0" title="View all tags" data-i18n="[title]View all tags"></div>
</div>
<div id="groupTagList" class="tags paddingTopBot5"></div>
</div>
<div id="rm_group_top_bar" class="flex-container alignitemscenter spaceBetween width100p fontsize80p">
<div>
<label class="add_avatar avatar flex-container justifyCenter" for="group_avatar_button" title="Click to select a new avatar for this group" data-i18n="[title]Click to select a new avatar for this group">
<div id="group_avatar_preview">
<div class="avatar">
<img src="img/ai4.png" alt="avatar">
</div>
</div>
<input hidden type="file" id="group_avatar_button" name="avatar" accept="image/png, image/jpeg, image/jpg, image/gif, image/bmp">
</label>
</div>
<div name="GroupStragegyAndOrder" id="rm_group_buttons" class="flex-container paddingLeftRight5 flex2">
<div class="flex1 flexGap5">
<div class="flex-container flexnowrap width100p whitespacenowrap">
<span data-i18n="Group reply strategy">Group reply strategy</span>
</div>
<select id="rm_group_activation_strategy">
<option value="0" data-i18n="Natural order">Natural order</option>
<option value="1" data-i18n="List order">List order</option>
</select>
</div>
<div class="flex1 flexGap5">
<div class="flex-container flexnowrap width100p whitespacenowrap">
<span data-i18n="Group generation handling mode">Group generation handling mode</span>
</div>
<select id="rm_group_generation_mode">
<option value="0" data-i18n="Swap character cards">Swap character cards</option>
<option value="1" data-i18n="Join character cards">Join character cards</option>
</select>
</div>
</div>
<div id="GroupFavDelOkBack" class="flex-container flexGap5 spaceEvenly flex1">
<div id="rm_button_back_from_group" class="heightFitContent margin0 menu_button fa-solid fa-left-long"></div>
<div id="rm_group_scenario" class="heightFitContent margin0 menu_button fa-solid fa-scroll" title="Set a group chat scenario" data-i18n="[title]Set a group chat scenario"></div>
<div id="group_favorite_button" class="heightFitContent margin0 menu_button fa-solid fa-star" title="Add to Favorites" data-i18n="[title]Add to Favorites"></div>
<input id="rm_group_fav" type="hidden" />
<div id="rm_group_submit" class="heightFitContent margin0 menu_button fa-solid fa-check" title="Create" data-i18n="[title]Create"></div>
<div id="rm_group_restore_avatar" class="heightFitContent margin0 menu_button fa-solid fa-images" title="Restore collage avatar" data-i18n="[title]Restore collage avatar"></div>
<div id="rm_group_delete" class="heightFitContent margin0 menu_button fa-solid fa-trash-can" title="Delete" data-i18n="[title]Delete"></div>
<div class="flex1">
<label class="checkbox_label whitespacenowrap">
<input id="rm_group_allow_self_responses" type="checkbox" />
<span data-i18n="Allow self responses">Allow self responses</span>
</label>
<label id="rm_group_automode_label" class="checkbox_label whitespacenowrap">
<input id="rm_group_automode" type="checkbox" />
<span data-i18n="Auto Mode">Auto Mode</span>
</label>
<label id="rm_group_hidemutedsprites_label" class="checkbox_label whitespacenowrap">
<input id="rm_group_hidemutedsprites" type="checkbox" />
<span data-i18n="Hide Muted Member Sprites">Hide Muted Member Sprites</span>
</label>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="inline-drawer wide100p flexFlowColumn">
<div id="groupCurrentMemberListToggle" class="inline-drawer-toggle inline-drawer-header">
<span data-i18n="Current Members">Current Members </span><i id="groupCurrentMemberPopoutButton" class="fa-solid fa-window-restore menu_button"></i>
<div class="fa-solid fa-circle-chevron-down inline-drawer-icon down"></div>
</div>
<div class="inline-drawer-content">
<div id="currentGroupMembers" name="Current Group Members" class="flex-container flexFlowColumn overflowYAuto flex1">
<div id="rm_group_members_pagination" class="rm_group_members_pagination group_pagination"></div>
<div id="rm_group_members" class="rm_group_members overflowYAuto flex-container"></div>
</div>
</div>
</div>
<div class="inline-drawer wide100p flexFlowColumn">
<div id="groupAddMemberListToggle" class="inline-drawer-toggle inline-drawer-header">
<span data-i18n="Add Members">Add Members</span>
<div class="fa-solid fa-circle-chevron-down inline-drawer-icon down"></div>
</div>
<div class="inline-drawer-content">
<div name="Unadded Char List" class="flex-container flexFlowColumn overflowYAuto flex1">
<div id="rm_group_add_members_header">
<input id="rm_group_filter" class="text_pole margin0" type="search" data-i18n="[placeholder]Search..." placeholder="Search..." maxlength="200" />
</div>
<div class="rm_tag_controls">
<div class="tags rm_tag_filter"></div>
</div>
<div id="rm_group_add_members_pagination" class="group_pagination"></div>
<div id="rm_group_add_members" class="overflowYAuto flex-container"></div>
</div>
</div>
</div>
</div>
<div id="rm_character_import" class="right_menu" style="display: none;">
<form id="form_import" action="javascript:void(null);" method="post" enctype="multipart/form-data">
<input multiple type="file" id="character_import_file" accept=".json, image/png" name="avatar">
<input id="character_import_file_type" name="file_type" class="text_pole" maxlength="999" size="2" value="" autocomplete="off">
</form>
</div>
<div name="Character List Panel" id="rm_characters_block" class="right_menu">
<div id="charListFixedTop">
<form id="form_character_search_form" action="javascript:void(null);">
<div id="rm_button_create" title="Create New Character" data-i18n="[title]Create New Character" class="menu_button fa-solid fa-user-plus "></div>
<div id="character_import_button" title="Import Character from File" data-i18n="[title]Import Character from File" class="menu_button fa-solid fa-file-import faSmallFontSquareFix"></div>
<div id="external_import_button" title="Import content from external URL" data-i18n="[title]Import content from external URL" class="menu_button fa-solid fa-cloud-arrow-down faSmallFontSquareFix"></div>
<div id="rm_button_group_chats" title="Create New Chat Group" data-i18n="[title]Create New Chat Group" class="menu_button fa-solid fa-users-gear "></div>
<input id="character_search_bar" class="text_pole width100p" type="search" data-i18n="[placeholder]Search..." placeholder="Search..." maxlength="100" />
<select id="character_sort_order" title="Characters sorting order" data-i18n="[title]Characters sorting order">
<option data-field="name" data-order="asc" data-i18n="A-Z">A-Z</option>
<option data-field="name" data-order="desc" data-i18n="Z-A">Z-A</option>
<option data-field="create_date" data-order="desc" data-i18n="Newest">Newest</option>
<option data-field="create_date" data-order="asc" data-i18n="Oldest">Oldest</option>
<option data-field="fav" data-order="desc" data-rule="boolean" data-i18n="Favorites">Favorites</option>
<option data-field="date_last_chat" data-order="desc" data-i18n="Recent">Recent</option>
<option data-field="chat_size" data-order="desc" data-i18n="Most chats">Most chats</option>
<option data-field="chat_size" data-order="asc" data-i18n="Least chats">Least chats</option>
<option data-field="data_size" data-order="desc" data-i18n="Most tokens">Most tokens</option>
<option data-field="data_size" data-order="asc" data-i18n="Least tokens">Least tokens</option>
<option data-field="name" data-order="random" data-i18n="Random">Random</option>
</select>
</form>
<div class="rm_tag_controls">
<div class="tags rm_tag_filter"></div>
</div>
<hr>
</div>
<div id="rm_print_characters_pagination">
<i id="charListGridToggle" class="fa-solid fa-table-cells-large menu_button" title="Toggle character grid view"></i>
<i id="bulkEditButton" class="fa-solid fa-edit menu_button bulkEditButton" title="Bulk edit characters"></i>
<i id="bulkDeleteButton" class="fa-solid fa-trash menu_button bulkDeleteButton" title="Bulk delete characters" style="display: none;"></i>
</div>
<div id="rm_print_characters_block" class="flexFlowColumn"></div>
</div>
</nav>
</div>
</div>
<!-- various fullscreen popups -->
<div id="shadow_popup">
<div id="dialogue_popup">
<div id="dialogue_popup_holder">
<div id="dialogue_popup_text">
<h3 class="margin0">text</h3>
</div>
<textarea id="dialogue_popup_input" class="text_pole" rows="1"></textarea>
<div id="dialogue_popup_controls">
<div id="dialogue_popup_ok" class="menu_button" data-i18n="Delete">Delete</div>
<div id="dialogue_popup_cancel" class="menu_button" data-i18n="Cancel">Cancel</div>
</div>
</div>
</div>
</div>
<div id="character_popup" class="flex-container flexFlowColumn flexNoGap">
<div id="character_popup_text">
<h3 id="character_popup_text_h3" class="margin0"></h3> <span data-i18n="Advanced Defininitions">- Advanced
Definitions</span>
</div>
<hr class="margin-bot-10px">
<div id="character_cross" class="fa-solid fa-circle-xmark"></div>
<div class="inline-drawer">
<div class="inline-drawer-toggle inline-drawer-header">
<h4 data-i18n="Prompt Overrides (For OpenAI/Claude/Scale APIs, Window/OpenRouter, and Instruct Mode)">
Prompt Overrides <small>(For OpenAI/Claude/Scale APIs, Window/OpenRouter, and Instruct Mode)</small>
</h4>
<div class="inline-drawer-icon fa-solid fa-circle-chevron-down down"></div>
</div>
<div class="inline-drawer-content">
<small data-i18n="Insert {{original}} into either box to include the respective default prompt from system settings.">Insert {{original}} into either box to include the respective default prompt from system settings.</small>
<div>
<h4 data-i18n="Main Prompt">Main Prompt</h4>
<textarea id="system_prompt_textarea" name="system_prompt" data-i18n="[placeholder]Any contents here will replace the default Main Prompt used for this character. (v2 spec: system_prompt)" placeholder="Any contents here will replace the default Main Prompt used for this character.&#10;(v2 spec: system_prompt)" form="form_create" class="text_pole" autocomplete="off" rows="3" maxlength="50000"></textarea>
<div class="extension_token_counter">
Tokens: <span data-token-counter="system_prompt_textarea">counting...</span>
</div>
</div>
<div>
<h4 data-i18n="Jailbreak">Jailbreak</h4>
<textarea id="post_history_instructions_textarea" name="post_history_instructions" data-i18n="[placeholder]Any contents here will replace the default Jailbreak Prompt used for this character. (v2 spec: post_history_instructions)" placeholder="Any contents here will replace the default Jailbreak Prompt used for this character.&#10;(v2 spec: post_history_instructions)" form="form_create" class="text_pole" autocomplete="off" rows="3" maxlength="50000"></textarea>
<div class="extension_token_counter">
Tokens: <span data-token-counter="post_history_instructions_textarea">counting...</span>
</div>
</div>
</div>
</div>
<hr>
<div class="inline-drawer">
<div class="inline-drawer-toggle inline-drawer-header">
<h4 data-i18n="Creator's Metadata (Not sent with the AI prompt)">
Creator's Metadata
<small>(Not sent with the AI Prompt)</small>
</h4>
<div class="inline-drawer-icon fa-solid fa-circle-chevron-down down"></div>
</div>
<div class="inline-drawer-content">
<small data-i18n="Everything here is optional">Everything here is optional</small>
<div class="flex-container flexnowrap">
<div class="flex1">
<h4 data-i18n="Created by">Created by</h4>
<textarea id="creator_textarea" name="creator" data-i18n="[placeholder](Botmaker's name / Contact Info)" placeholder="(Botmaker's name / Contact info)" form="form_create" class="text_pole" autocomplete="off" rows="2" maxlength="5000"></textarea>
</div>
<div class="flex1">
<h4 data-i18n="Character Version">Character Version</h4>
<textarea id="character_version_textarea" name="character_version" data-i18n="[placeholder](If you want to track character versions)" placeholder="(If you want to track character versions)" form="form_create" class="text_pole" autocomplete="off" rows="2" maxlength="500"></textarea>
</div>
</div>
<div class="flex-container flexnowrap">
<div class="flex1">
<h4 data-i18n="Creator's Notes">Creator's Notes</h4>
<textarea id="creator_notes_textarea" name="creator_notes" data-i18n="[placeholder](Describe the bot, give use tips, or list the chat models it has been tested on. This will be displayed in the character list.)" placeholder="(Describe the bot, give use tips, or list the chat models it has been tested on. This will be displayed in the character list.)" form="form_create" class="text_pole" autocomplete="off" rows="4" maxlength="20000"></textarea>
</div>
<div class="flex1">
<h4 data-i18n="Tags to Embed">Tags to Embed</h4>
<textarea id="tags_textarea" name="tags" data-i18n="[placeholder](Write a comma-separated list of tags)" placeholder="(Write a comma-separated list of tags)" form="form_create" class="text_pole" autocomplete="off" rows="4" maxlength="5000"></textarea>
</div>
</div>
</div>
</div>
<hr>
<div id="personality_div">
<h4>
<span data-i18n="Personality summary">Personality summary</span>
<a href="https://docs.sillytavern.app/usage/core-concepts/characterdesign/#personality-summary" class="notes-link" target="_blank"><span class="fa-solid fa-circle-question note-link-span"></span></a>
</h4>
<textarea id="personality_textarea" name="personality" data-i18n="[placeholder](A brief description of the personality)" placeholder="(A brief description of the personality)" form="form_create" class="text_pole" autocomplete="off" rows="4" maxlength="50000"></textarea>
<div class="extension_token_counter">
Tokens: <span data-token-counter="personality_textarea" data-token-permanent="true">counting...</span>
</div>
</div>
<div id="scenario_div">
<h4>
<span data-i18n="Scenario">Scenario</span>
<a href="https://docs.sillytavern.app/usage/core-concepts/characterdesign/#scenario" class="notes-link" target="_blank">
<span class="fa-solid fa-circle-question note-link-span"></span>
</a>
</h4>
<textarea id="scenario_pole" name="scenario" data-i18n="[placeholder](Circumstances and context of the interaction)" placeholder="(Circumstances and context of the interaction)" class="text_pole" maxlength="50000" value="" autocomplete="off" form="form_create" rows="4"></textarea>
<div class="extension_token_counter">
Tokens: <span data-token-counter="scenario_pole" data-token-permanent="true">counting...</span>
</div>
</div>
<div id="depth_prompt_div" class="flex-container">
<div class="flex1">
<h4>
<span data-i18n="Character's Note">
Character's Note
</span>
</h4>
<textarea id="depth_prompt_prompt" name="depth_prompt_prompt" class="text_pole" rows="2" maxlength="50000" autocomplete="off" form="form_create" placeholder="(Text to be inserted in-chat @ designated depth)"></textarea>
</div>
<div>
<h4>
<span data-i18n="@ Depth">
@ Depth
</span>
</h4>
<input id="depth_prompt_depth" name="depth_prompt_depth" class="text_pole widthUnset m-t-0" type="number" min="0" max="999" value="4" form="form_create" />
<div class="extension_token_counter">
Tokens: <span data-token-counter="depth_prompt_prompt" data-token-permanent="true">counting...</span>
</div>
</div>
</div>
<div id="talkativeness_div">
<h4><span data-i18n="Talkativeness">Talkativeness</span></h4>
<h5 data-i18n="How often the character speaks in group chats!">How often the character speaks in &nbsp;<span class="warning">group chats!</span>
</h5>
<input id="talkativeness_slider" name="talkativeness" type="range" min="0" max="1" step="0.05" value="0.5" form="form_create">
<div class="slider_hint">
<span data-i18n="Shy">Shy</span>
<span data-i18n="Normal">Normal</span>
<span data-i18n="Chatty">Chatty</span>
</div>
</div>
<hr>
<div id="mes_example_div" class="flex-container flexFlowColumn">
<div>
<h4><span data-i18n="Examples of dialogue">Examples of dialogue</span></h4>
<h5 data-i18n="Important to set the character's writing style.">Important to set the character's writing style. <a href="https://docs.sillytavern.app/usage/core-concepts/characterdesign/#examples-of-dialogue" class="notes-link" target="_blank"><span class="fa-solid fa-circle-question note-link-span"></span></a></h5>
</div>
<textarea id="mes_example_textarea" class="flexGrow" name="mes_example" data-i18n="[placeholder](Examples of chat dialog. Begin each example with START on a new line.)" placeholder="(Examples of chat dialog. Begin each example with &lt;START&gt; on a new line.)" form="form_create" maxlength="50000" rows="6"></textarea>
<div class="extension_token_counter">
Tokens: <span data-token-counter="mes_example_textarea">counting...</span>
</div>
<!-- PLACEHOLDER CODE FOR NEW EXAMPLE CHAT HANDLING
<div name="exampleChatsBlockTemplate" class="flex-container flexFlowColumn">
<div class="flex-container alignitemscenter">
<textarea class="flexShrink flexGrow wideMinContent" rows="1" placeholder="Name for this example chat"></textarea>
<div class="fa-solid fa-plus menu_button" title="Add a new message to this example chat block"></div>
</div>
<div class="flex-container whitespacenowrap">
<div class="flex-container flexFlowColumn">
<select>
<option>{{user}}</option>
<option>{{char}}</option>
<option>Custom</option>
</select>
<textarea rows="1" placeholder="Custom Entity"></textarea>
</div>
<textarea class="flexShrink flexGrow wideMinContent" placeholder="Content of the example chat."></textarea>
</div>
<div class="flex-container whitespacenowrap">
<div class="flex-container flexFlowColumn">
<select>
<option>{{user}}</option>
<option>{{char}}</option>
<option>Custom</option>
</select>
<textarea rows="1" placeholder="Custom Entity"></textarea>
</div>
<textarea class="flexShrink flexGrow wideMinContent" placeholder="Content of the example chat."></textarea>
</div>
</div>
-->
</div>
<div id="character_popup_ok" class="menu_button" data-i18n="Save">Save</div>
</div>
<div id="shadow_select_chat_popup">
<div id="select_chat_popup">
<div name="selectChatPopupHeader" class="flex-container alignitemscenter justifySpaceBetween">
<div id="select_chat_import"> <!-- import chat popup header -->
<div id="chat_import_button" class="fa-solid fa-file-import opacity50p hoverglow fontsize120p"></div>
<form id="form_import_chat" action="javascript:void(null);" method="post" enctype="multipart/form-data" style="display: none;">
<input type="file" id="chat_import_file" accept=".json, .jsonl" name="avatar">
<input id="chat_import_file_type" name="file_type" class="text_pole" maxlength="999" size="2" value="" autocomplete="off" style="display: none;">
<input id="chat_import_avatar_url" name="avatar_url" class="text_pole" maxlength="999" size="2" value="" autocomplete="off" style="display: none;">
<input id="chat_import_character_name" name="character_name" class="text_pole" maxlength="999" size="2" value="" autocomplete="off" style="display: none;">
</form>
</div>
<div id="selectChatPopupHeaderText" class="TxtLrgBoldCenter">
<span id="ChatHistoryCharName"></span><span data-i18n="Chat History">Chat History</span>
<a href="https://docs.sillytavern.app/usage/core-concepts/chatfilemanagement/#chat-import" class="notes-link" target="_blank"><span class="fa-solid fa-circle-question note-link-span"></span></a>
</div>
<div class="fa-solid fa-plus menu_button" title="New Chat" id="newChatFromManageScreenButton"></div>
<input type="text" id="select_chat_search" class="menu_button" placeholder="Search..." autocomplete="off">
<div id="select_chat_cross" class="opacity50p hoverglow fa-solid fa-circle-xmark fontsize120p" alt="Close Past Chat Popup"></div>
</div>
<div id="select_chat_div"></div>
<div id="load_select_chat_div">
<div class="fa-solid fa-hourglass fa-spin"></div>
</div>
</div>
</div>
<div id="background_template" class="template_element">
<div class="bg_example flex-container" bgfile="" class="bg_example_img" title="">
<div title="Copy to system backgrounds" class="bg_button bg_example_copy fa-solid fa-file-arrow-up"></div>
<div title="Rename background" class="bg_button bg_example_edit fa-solid fa-pencil"></div>
<div title="Lock" class="bg_button bg_example_lock fa-solid fa-lock"></div>
<div title="Unlock" class="bg_button bg_example_unlock fa-solid fa-lock-open"></div>
<div title="Delete background" class="bg_button bg_example_cross fa-solid fa-circle-xmark"></div>
<div class="BGSampleTitle">
</div>
</div>
</div>
<!-- templates for JS to reuse when needed -->
<div id="scenario_override_template" class="template_element">
<div class="scenario_override range-block flexFlowColumn flex-container">
<div class="range-block-title title_restorable">
<h3><span data-i18n="Chat Scenario Override" class="margin0">Chat Scenario Override</span></h3>
<div title="Remove" data-i18n="[title]Remove" class="menu_button fa-solid fa-trash-can remove_scenario_override"></div>
</div>
<div class="range-block-counter justifyLeft flex-container flexFlowColumn">
<strong>Unique to this chat.</strong>
<span data-group="true">All group members will use the following scenario text instead of what is specified in their character cards.</span>
<span data-character="true">The following scenario text will be used instead of the value set in the character card.</span>
Checkpoints inherit the scenario override from their parent, and can be changed individually after that.
</div>
<div class="range-block-range wide100p">
<textarea class="wide100p chat_scenario" class="text_pole" rows="15" data-i18n="[placeholder]Type here..." placeholder="Type here..."></textarea>
</div>
</div>
</div>
<div id="chat_world_template" class="template_element">
<div class="chat_world range-block flexFlowColumn flex-container">
<div class="range-block-title">
<h4 data-i18n="Chat Lorebook">Chat Lorebook for <span class="chat_name"></span></h4>
</div>
<div class="range-block-counter justifyLeft flex-container flexFlowColumn margin-bot-10px">
<span data-i18n="A selected World Info will be bound to this chat.">
A selected World Info will be bound to this chat. When generating an AI reply,
it will be combined with the entries from global and character lorebooks.
</span>
</div>
<div class="range-block-range wide100p">
<select class="chat_world_info_selector wide100p">
<option value="">--- None ---</option>
</select>
</div>
</div>
</div>
<div id="character_world_template" class="template_element">
<div class="character_world range-block flexFlowColumn flex-container">
<div class="range-block-title">
<h3>
<span data-i18n="Select a World Info file for"> Select a World Info file for <span class="character_name"></span></span>:
</h3>
</div>
<h4 data-i18n="Primary Lorebook">Primary Lorebook</h4>
<div class="range-block-counter justifyLeft flex-container flexFlowColumn margin-bot-10px">
<span data-i18n="A selected World Info will be bound to this character as its own Lorebook.">A selected World Info will be bound to this character as its own Lorebook.</span>
<span data-i18n="When generating an AI reply, it will be combined with the entries from a global World Info selector.">When generating an AI reply, it will be combined with the entries from a global World Info selector.</span>
<span data-i18n="Exporting a character would also export the selected Lorebook file embedded in the JSON data.">Exporting a character would also export the selected Lorebook file embedded in the JSON data.</span>
</div>
<div class="range-block-range wide100p">
<select class="character_world_info_selector wide100p">
<option value="">--- None ---</option>
</select>
</div>
<div class="range-block-title">
<h4>
<span data-i18n="Additional Lorebooks">Additional Lorebooks</span>
</h4>
</div>
<div class="range-block-counter justifyLeft flex-container flexFlowColumn margin-bot-10px">
<span data-i18n="Associate one or more auxillary Lorebooks with this character.">Associate one or more auxillary Lorebooks with this character.</span><br>
<span data-i18n="NOTE: These choices are optional and won't be preserved on character export!">NOTE: These choices are optional and won't be preserved on character export!</span>
</div>
<div class="range-block-range wide100p">
<select class="character_extra_world_info_selector wide100p" multiple>
<option value="" data-i18n="-- World Info not found --">-- World Info not found --</option>
</select>
</div>
</div>
</div>
<div id="past_chat_template" class="template_element">
<div class="select_chat_block_wrapper flex-container">
<div class="select_chat_block wide100p flex-container" file_name="">
<div id="select_chat_name_wrapper" class="flex-container alignitemscenter justifySpaceBetween wide100p">
<div>
<small class="select_chat_block_filename select_chat_block_filename_item"></small>
<div title="Rename chat file" class="renameChatButton hoverglow opacity50p fa-solid fa-pencil" data-i18n="[title]Rename chat file"></div>
</div>
<div class="flex-container gap10px">
<div class="select_chat_info flex-container">
<small class="chat_messages_date select_chat_block_filename_item"></small>
<small class="chat_file_size select_chat_block_filename_item"></small>
<small class="chat_messages_num select_chat_block_filename_item"></small>
</div>
<div class="flex-container gap10px">
<div title="Export JSONL chat file" data-format="jsonl" class="exportRawChatButton opacity50p hoverglow fa-solid fa-file-export" data-i18n="[title]Export JSONL chat file"></div>
<div title="Download chat as plain text document" data-format="txt" class="exportChatButton opacity50p hoverglow fa-solid fa-file-lines" data-i18n="[title]Download chat as plain text document"></div>
<div title="Delete chat file" file_name="" class="PastChat_cross opacity50p hoverglow fa-solid fa-skull" data-i18n="[title]Delete chat file"></div>
</div>
</div>
</div>
<div class="select_chat_block_mes"></div>
</div>
</div>
</div>
<div id="tag_view_template" class="template_element">
<div class="tag_view_item">
<div class="tagColorPickerHolder"></div>
<div class="tagColorPicker2Holder"></div>
<div class="tag_view_name" contenteditable="true"></div>
<div class="tag_view_counter"><span class="tag_view_counter_value"></span>&nbsp;entries</div>
<div title="Delete tag" class="tag_delete fa-solid fa-trash-can right_menu_button" data-i18n="[title]Delete tag"></div>
</div>
</div>
<div id="entry_edit_template" class="template_element">
<div class="world_entry">
<form class="world_entry_form wi-card-entry">
<div class="inline-drawer wide100p">
<div class="inline-drawer-toggle inline-drawer-header gap5px padding0">
<span class="drag-handle">&#9776;</span>
<div class="gap5px world_entry_thin_controls wide100p alignitemscenter">
<div class="fa-fw fa-solid fa-circle-chevron-down inline-drawer-icon down"></div>
<span class="flex-container alignitemscenter wide100p">
<div class="WIEntryTitleAndStatus flex-container flex1 alignitemscenter">
<div class="flex-container flex1">
<textarea class="text_pole autoSetHeight" name="comment" maxlength="5000" data-i18n="[placeholder]Entry Title/Memo" placeholder="Entry Title/Memo"></textarea>
</div>
<!-- <span class="world_entry_form_position_value"></span> -->
<select title="WI Entry Status:&#13;🔵 Constant&#13;🟢 Normal&#13;❌ Disabled" name="entryStateSelector" class="widthNatural margin0">
<option title="WI Entry Status:&#13;🔵 Constant&#13;🟢 Normal&#13;❌ Disabled" value="constant">🔵</option>
<option title="WI Entry Status:&#13;🔵 Constant&#13;🟢 Normal&#13;❌ Disabled" value="normal">🟢</option>
<option title="WI Entry Status:&#13;🔵 Constant&#13;🟢 Normal&#13;❌ Disabled" value="disabled">❌</option>
</select>
</div>
<div class="WIEnteryHeaderControls flex-container">
<div name="PositionBlock" class="world_entry_form_control world_entry_form_radios wi-enter-footer-text">
<label for="position" class="WIEntryHeaderTitleMobile" data-i18n="Position:">Position:</label>
<select name="position" class="widthNatural margin0" title="↑Char: Before Character Definitions&#13;↓Char: After Character Definitions&#13;↑AN: Before Author's Note&#13;↓AN: After Author's Note&#13;@D: at Depth&#13;">
<option value="0" data-i18n="Before Char Defs" title="↑Char: Before Character Definitions&#13;↓Char: After Character Definitions&#13;↑AN: Before Author's Note&#13;↓AN: After Author's Note&#13;@D: at Depth&#13;">↑Char</option>
<option value="1" data-i18n="After Char Defs" title="↑Char: Before Character Definitions&#13;↓Char: After Character Definitions&#13;↑AN: Before Author's Note&#13;↓AN: After Author's Note&#13;@D: at Depth&#13;">↓Char</option>
<option value="2" data-i18n="Before AN" title="↑Char: Before Character Definitions&#13;↓Char: After Character Definitions&#13;↑AN: Before Author's Note&#13;↓AN: After Author's Note&#13;@D: at Depth&#13;">↑AN</option>
<option value="3" data-i18n="After AN" title="↑Char: Before Character Definitions&#13;↓Char: After Character Definitions&#13;↑AN: Before Author's Note&#13;↓AN: After Author's Note&#13;@D: at Depth&#13;">↓AN</option>
<option value="4" data-i18n="at Depth" title="↑Char: Before Character Definitions&#13;↓Char: After Character Definitions&#13;↑AN: Before Author's Note&#13;↓AN: After Author's Note&#13;@D: at Depth&#13;">@D</option>
</select>
</div>
<div class="world_entry_form_control wi-enter-footer-text flex-container flexNoGap">
<label for="depth" class="WIEntryHeaderTitleMobile" data-i18n="Depth:">Depth:</label>
<input title="Depth" class="text_pole wideMax100px margin0" type="number" name="depth" placeholder="" min="0" max="999" />
</div>
<div class="world_entry_form_control wi-enter-footer-text flex-container flexNoGap">
<label for="order" class="WIEntryHeaderTitleMobile" data-i18n="Order:">Order:</label>
<input title="Order" class="text_pole wideMax100px margin0" type="number" name="order" placeholder="" min="0" max="999" />
</div>
<div class="world_entry_form_control wi-enter-footer-text flex-container flexNoGap probabilityContainer">
<label for="order" class="WIEntryHeaderTitleMobile" data-i18n="Order:">Trigger %:</label>
<input title="Probability" class="text_pole wideMax100px margin0" type="number" name="probability" placeholder="" min="0" max="100" />
</div>
</div>
</span>
</div>
<i class="menu_button delete_entry_button fa-solid fa-trash-can" type="submit" data-i18n="" value="" /></i>
</div>
<div class="inline-drawer-content flex-container paddingBottom5px wide100p">
<div class="flex-container wide100p alignitemscenter">
<div name="keywordsAndLogicBlock" class="flex-container wide100p alignitemscenter">
<div class="world_entry_form_control flex1">
<small class="displayNone">
<span data-i18n="Comma separated (required)">
Comma separated (required)
</span>
</small>
<small class="textAlignCenter">Primary Keywords</small>
<textarea class="text_pole keyprimarytextpole" name="key" rows="1" data-i18n="[placeholder]Comma separated (required)" placeholder="Comma separated (required)" maxlength="2000"></textarea>
</div>
<div class="world_entry_form_control">
<small class="textAlignCenter">Logic</small>
<select name="entryLogicType" class="widthFitContent margin0">
<option value="0">AND ANY</option>
<option value="1">NOT ALL</option>
<option value="2">NOT ANY</option>
</select>
</div>
<div class="world_entry_form_control keysecondary flex1">
<small class="displayNone">
<span data-i18n="(ignored if empty)">
(ignored if empty)
</span>
</small>
<small class="textAlignCenter">Optional Filter</small>
<div class="flex-container flexFlowRow alignitemscenter">
<textarea class="text_pole keysecondarytextpole" name="keysecondary" rows="1" data-i18n="[placeholder]Comma separated (ignored if empty)" placeholder="Comma separated list" maxlength="2000"></textarea>
</div>
</div>
</div>
<div name="contentAndCharFilterBlock" class="world_entry_thin_controls flex2">
<div class="world_entry_form_control flex1">
<label for="content ">
<small>
<span data-i18n="Content" class="alignitemscenter flex-container flexnowrap wide100p justifySpaceBetween">
<span class="alignitemscenter flex-container flexNoGap">
Content
</span>
<span>
(Tokens:&nbsp; <span class="world_entry_form_token_counter" data-first-run="true">counting...</span>)&nbsp;
<span class="world_entry_form_uid_value" data-first-run="true"></span>
</span>
<div>
<label class="checkbox flex-container alignitemscenter flexNoGap">
<input type="checkbox" name="exclude_recursion" />
<span data-i18n="Exclude from recursion">
Non-recursable
</span>
</label>
</div>
</span>
</small>
<small class="displayNone">
<span data-i18n="What this keyword should mean to the AI">
What this keyword should mean to the AI, sent verbatim
</span>
</small>
</label>
<textarea class="text_pole" name="content" rows="8" data-i18n="[placeholder]What this keyword should mean to the AI, sent verbatim" placeholder="What this keyword should mean to the AI, sent verbatim"></textarea>
</div>
</div>
<div class="world_entry_thin_controls commentContainer">
</div>
</div>
<div class="flex-container wide100p flexGap10">
<div class="flex1 flex-container flexFlowColumn flexNoGap">
<div class="flex-container justifySpaceBetween">
<label for="characterFilter" class="">
<small data-i18n="Filter to Character(s)">Filter to Character(s)</small>
</label>
<label class="checkbox flex-container alignitemscenter">
<input type="checkbox" name="character_exclusion" />
<span data-i18n="Character Exclusion">
<small>Character Exclusion</small>
</span>
</label>
</div>
<div class="range-block-range">
<select name="characterFilter" multiple>
<option value="">
<span data-i18n="-- Characters not found --">-- Characters not found --</span>
</option>
</select>
</div>
</div>
<div class="flex1 flex-container flexFlowColumn flexNoGap">
<label for="group">
<small data-i18n="">Inclusion Group</small>
</label>
<input type="text" class="text_pole" name="group" rows="1" data-i18n="[placeholder]Only one entry with the same label will be activated" placeholder="Only one entry with the same label will be activated">
</div>
</div>
<div name="WIEntryBottomControls" class="flex-container flex1 justifySpaceBetween world_entry_form_horizontal">
<div class="flex-container flexFlowColumn flexNoGap wi-enter-footer-text ">
<label class="checkbox flex-container">
<input type="checkbox" name="selective" />
<span data-i18n="Selective">Selective</span>
</label>
<label class="checkbox flex-container">
<input type="checkbox" name="useProbability" />
<span data-i18n="Use Probability">Use Probability</span>
</label>
<label class="checkbox flex-container">
<input type="checkbox" name="addMemo">
<span data-i18n="Add Memo">Add Memo</span>
</label>
</div>
</div>
</div>
</div>
</form>
</div>
</div>
<div id="character_template" class="template_element">
<div class="character_select flex-container wide100p alignitemsflexstart" chid="" id="">
<div class="avatar" title="">
<img src="">
</div>
<div class="flex-container wide100pLess70px character_select_container">
<div class="wide100p character_name_block">
<span class="ch_name"></span>
<small class="character_version"></small>
<small class="ch_avatar_url"></small>
</div>
<i class="ch_fav_icon fa-solid fa-star"></i>
<input class="ch_fav" value="" hidden />
<div class="ch_description"></div>
<div class="tags tags_inline"></div>
</div>
</div>
</div>
<div id="tag_template" class="template_element">
<span id="" class="tag">
<span class="tag_name"></span>
<i class="fa-solid fa-circle-xmark tag_remove"></i>
</span>
</div>
<div id="openai_logit_bias_template" class="template_element">
<div class="openai_logit_bias_form">
<input class="openai_logit_bias_text text_pole" data-i18n="[placeholder]Text or token ids" placeholder="Text or [token ids]" />
<input class="openai_logit_bias_value text_pole" type="number" min="-100" value="0" max="100" />
<i class="menu_button fa-solid fa-xmark openai_logit_bias_remove"></i>
</form>
</div>
</div>
</div>
<div id="novelai_logit_bias_template" class="template_element">
<div class="novelai_logit_bias_form">
<input class="novelai_logit_bias_text text_pole" data-i18n="[placeholder]Type here..." placeholder="type here..." />
<input class="novelai_logit_bias_value text_pole" type="number" min="-2" value="0" max="2" step="0.01" />
<i class="menu_button fa-solid fa-xmark novelai_logit_bias_remove"></i>
</div>
</div>
<div id="completion_prompt_manager_popup" class="drawer-content" style="display:none;">
<div id="completion_prompt_manager_popup_inspect">
<h3>Inspect</h3>
<div class="completion_prompt_manager_popup_entry">
<form class="completion_prompt_manager_popup_entry_form">
<div class="completion_prompt_manager_popup_entry_form_control">
<div class="completion_prompt_manager_popup_header">
<label for="completion_prompt_manager_popup_entry_form_prompt">
<span>Prompt List</span>
</label>
<a id="completion_prompt_manager_popup_close_button" title="close" class="fa-solid fa-close menu_button"></a>
</div>
<div class="text_muted">The list of prompts associated with this marker.</div>
<div id="completion_prompt_manager_popup_entry_form_inspect_list"></div>
</div>
</form>
</div>
</div>
<div id="completion_prompt_manager_popup_edit">
<h3>Edit</h3>
<div class="completion_prompt_manager_popup_entry">
<form class="completion_prompt_manager_popup_entry_form">
<div class="flex-container gap10px">
<div class="completion_prompt_manager_popup_entry_form_control flex1">
<label for="completion_prompt_manager_popup_entry_form_name">
<span>Name</span>
</label>
<div class="text_muted">A name for this prompt.</div>
<input id="completion_prompt_manager_popup_entry_form_name" class="text_pole" type="text" name="name" />
</div>
<div class="completion_prompt_manager_popup_entry_form_control flex1">
<label for="completion_prompt_manager_popup_entry_form_role">
<span>Role</span>
</label>
<div class="text_muted">To whom this message will be attributed.</div>
<select id="completion_prompt_manager_popup_entry_form_role" class="text_pole" name="role">
<option value="system">System</option>
<option value="user">User</option>
<option value="assistant">AI Assistant</option>
</select>
</div>
</div>
<div class="flex-container gap10px">
<div class="completion_prompt_manager_popup_entry_form_control flex1">
<label for="completion_prompt_manager_popup_entry_form_injection_position">
<span>Position</span>
</label>
<div class="text_muted">Injection position. Next to other prompts (relative) or in-chat (absolute).</div>
<select id="completion_prompt_manager_popup_entry_form_injection_position" class="text_pole" name="injection_position">
<option value="0">Relative</option>
<option value="1">Absolute</option>
</select>
</div>
<div id="completion_prompt_manager_depth_block" class="completion_prompt_manager_popup_entry_form_control flex1">
<label for="completion_prompt_manager_popup_entry_form_injection_depth">
<span>Depth</span>
</label>
<div class="text_muted">Injection depth. 0 = after the last message, 1 = before the last message, etc.</div>
<input id="completion_prompt_manager_popup_entry_form_injection_depth" class="text_pole" type="number" name="injection_depth" min="0" max="999" value="4" />
</div>
</div>
<div class="completion_prompt_manager_popup_entry_form_control">
<label for="completion_prompt_manager_popup_entry_form_prompt">
<span>Prompt</span>
</label>
<div class="text_muted">The prompt to be sent.</div>
<textarea id="completion_prompt_manager_popup_entry_form_prompt" class="text_pole" name="prompt">
</textarea>
</div>
<div class="completion_prompt_manager_popup_entry_form_footer">
<a id="completion_prompt_manager_popup_entry_form_close" title="close" class="fa-solid fa-close menu_button"></a>
<a id="completion_prompt_manager_popup_entry_form_reset" title="reset" class="fa-solid fa-undo menu_button"></a>
<a id="completion_prompt_manager_popup_entry_form_save" title="save" class="fa-solid fa-save menu_button" data-pm-prompt=""></a>
</div>
</form>
</div>
</div>
</div>
<div id="message_template" class="template_element">
<div class="mes" mesid="" ch_name="" is_user="" is_system="" bookmark_link="">
<div class="for_checkbox"></div><input type="checkbox" class="del_checkbox">
<div class="mesAvatarWrapper">
<div class="avatar">
<img src="">
</div>
<div class="mesIDDisplay"></div>
<div class="mes_timer"></div>
<div class="tokenCounterDisplay"></div>
</div>
<div class="swipe_left fa-solid fa-chevron-left"></div>
<div class="mes_block">
<div class="ch_name flex-container justifySpaceBetween">
<div class="flex-container flex1 alignitemscenter">
<div class="flex-container alignItemsBaseline">
<span class="name_text">${characterName}</span>
<i class="mes_ghost fa-solid fa-ghost" title="This message is invisible for the AI" data-i18n="[title]This message is invisible for the AI"></i>
<small class="timestamp"></small>
</div>
</div>
<div class="mes_buttons">
<div class="extraMesButtonsHint fa-solid fa-ellipsis"></div>
<div class="extraMesButtons">
<div title="Translate message" class="mes_translate fa-solid fa-language" data-i18n="[title]Translate message"></div>
<div title="Generate Image" class="sd_message_gen fa-solid fa-paintbrush" data-i18n="[title]Generate Image"></div>
<div title="Narrate" class="mes_narrate fa-solid fa-bullhorn" data-i18n="[title]Narrate"></div>
<div title="Prompt" class="mes_prompt fa-solid fa-square-poll-horizontal " data-i18n="[title]Prompt"></div>
<div title="Exclude message from prompts" class="mes_hide fa-solid fa-eye" data-i18n="[title]Exclude message from prompts"></div>
<div title="Include message in prompts" class="mes_unhide fa-solid fa-eye-slash" data-i18n="[title]Include message in prompts"></div>
<div title="Embed file or image" class="mes_embed fa-solid fa-paperclip" data-i18n="[title]Embed file or image"></div>
<div title="Create checkpoint" class="mes_create_bookmark fa-regular fa-solid fa-flag-checkered" data-i18n="[title]Create checkpoint"></div>
<div title="Create branch" class="mes_create_branch fa-regular fa-code-branch" data-i18n="[title]Create Branch"></div>
<div title="Copy" class="mes_copy fa-solid fa-copy " data-i18n="[title]Copy"></div>
</div>
<div title="Open checkpoint chat" class="mes_bookmark fa-solid fa-flag" data-i18n="[title]Open checkpoint chat"></div>
<div title="Edit" class="mes_edit fa-solid fa-pencil " data-i18n="[title]Edit"></div>
</div>
<div class="mes_edit_buttons">
<div class="mes_edit_done menu_button fa-solid fa-check" title="Confirm" data-i18n="[title]Confirm"></div>
<div class="mes_edit_copy menu_button fa-solid fa-copy" title="Copy this message" data-i18n="[title]Copy this message"></div>
<div class="mes_edit_delete menu_button fa-solid fa-trash-can" title="Delete this message" data-i18n="[title]Delete this message">
</div>
<div class="mes_edit_up menu_button fa-solid fa-chevron-up " title="Move message up" data-i18n="[title]Move message up"></div>
<div class="mes_edit_down menu_button fa-solid fa-chevron-down" title="Move message down" data-i18n="[title]Move message down">
</div>
<div class="mes_edit_cancel menu_button fa-solid fa-xmark" title="Cancel" data-i18n="[title]Cancel"></div>
</div>
</div>
<div class=mes_text></div>
<div class="mes_img_container">
<div class="mes_img_controls">
<div title="Enlarge" class="right_menu_button fa-lg fa-solid fa-magnifying-glass mes_img_enlarge" data-i18n="[title]Enlarge"></div>
<div title="Delete" class="right_menu_button fa-lg fa-solid fa-trash-can mes_img_delete" data-i18n="[title]Delete"></div>
</div>
<img class="mes_img" src="" />
</div>
<div class="mes_bias"></div>
</div>
<div class="swipe_right fa-solid fa-chevron-right">
<div class="swipes-counter"></div>
</div>
</div>
</div>
<div id="group_avatars_template" class="template_element">
<div class="avatar avatar_collage collage_1">
<img alt="img1" class="img_1" src="">
</div>
<div class="avatar avatar_collage collage_2">
<img alt="img1" class="img_1" src="">
<img alt="img2" class="img_2" src="">
</div>
<div class="avatar avatar_collage collage_3">
<img alt="img1" class="img_1" src="">
<img alt="img2" class="img_2" src="">
<img alt="img3" class="img_3" src="">
</div>
<div class="avatar avatar_collage collage_4">
<img alt="img1" class="img_1" src="">
<img alt="img2" class="img_2" src="">
<img alt="img3" class="img_3" src="">
<img alt="img4" class="img_4" src="">
</div>
</div>
<div id="onboarding_template" class="template_element">
<div class="onboarding">
<h3 data-i18n="Welcome to SillyTavern!">Welcome to SillyTavern!</h3>
<ul class="justifyLeft margin-bot-10px">
<li>Read the <a href="https://docs.sillytavern.app/" target="_blank">Official Documentation</a>.</li>
<li>Type <code>/help</code> in chat for commands and macros.</li>
<li>Join the <a href="https://discord.gg/RZdyAEUPvj" target="_blank">Discord server</a> for info and announcements.</li>
</ul>
<b>SillyTavern is aimed at advanced users.</b>
<div>
If you're new to this, enable the simplified UI mode below.
</div>
<label class="checkbox_label">
<input type="checkbox" name="enable_simple_mode" />
<span data-i18n="Enable simple UI mode">Enable simple UI mode</span>
</label>
<div class="justifyLeft margin-bot-10px">
Before you get started, you must select a user name.
This can be changed at any time via the <code><i class="fa-solid fa-face-smile"></i></code> icon.
</div>
<h4>User Name:</h4>
</div>
</div>
<div id="group_member_template" class="template_element">
<div class="group_member">
<div class="avatar">
<img alt="Avatar" src="" />
</div>
<div class="group_member_name">
<div class="ch_name"></div>
<div class="tags tags_inline"></div>
</div>
<input class="ch_fav" value="" hidden />
<div class="group_member_icon">
<div title="Temporarily disable automatic replies from this character" data-action="disable" class="right_menu_button fa-solid fa-lg fa-comment-slash" data-i18n="[title]Temporarily disable automatic replies from this character"></div>
<div title="Enable automatic replies from this character" data-action="enable" class="right_menu_button fa-solid fa-lg fa-comment-slash" data-i18n="[title]Enable automatic replies from this character"></div>
<div title="Trigger a message from this character" data-action="speak" class="right_menu_button fa-solid fa-lg fa-comment" data-i18n="[title]Trigger a message from this character"></div>
<div class="flexFlowColumn flex-container">
<div title="Move up" data-action="up" class="right_menu_button fa-solid fa-chevron-up" data-i18n="[title]Move up"></div>
<div title="Move down" data-action="down" class="right_menu_button fa-solid fa-chevron-down" data-i18n="[title]Move down"></div>
</div>
<div title="View character card" data-action="view" class="right_menu_button fa-solid fa-xl fa-image-portrait" data-i18n="[title]View character card"></div>
<div title="Remove from group" data-action="remove" class="right_menu_button fa-solid fa-2xl fa-xmark" data-i18n="[title]Remove from group">
</div>
<div title="Add to group" data-action="add" class="right_menu_button fa-solid fa-2xl fa-plus" data-i18n="[title]Add to group"></div>
</div>
</div>
</div>
<div id="group_list_template" class="template_element">
<div class="group_select flex-container wide100p alignitemsflexstart">
<div class="avatar">
<img src="">
</div>
<div class="flex-container wide100pLess70px gap5px group_name_block">
<div class="ch_name"></div>
<i class='group_fav_icon fa-solid fa-star'></i>
<input class="ch_fav" value="" hidden />
<div class="tags tags_inline"></div>
</div>
</div>
</div>
<div id="bogus_folder_template" class="template_element">
<div class="bogus_folder_select flex-container wide100p alignitemsflexstart">
<div class="avatar flex alignitemscenter textAlignCenter">
<i class="bogus_folder_icon fa-solid fa-folder-open fa-xl"></i>
</div>
<div class="flex-container wide100pLess70px character_select_container">
<div class="wide100p character_name_block">
<span class="ch_name"></span>
</div>
<div class="bogus_folder_counter_block">
<span class="bogus_folder_counter"></span>
<span data="character card(s)">character card(s)</span>
</div>
</div>
</div>
</div>
<div id="bogus_folder_back_template" class="template_element">
<div class="bogus_folder_select flex-container wide100p alignitemsflexstart" id="BogusFolderBack" tagid="back">
<div class="avatar flex alignitemscenter textAlignCenter">
<i class="bogus_folder_icon fa-solid fa-xl fa-right-from-bracket fa-flip-horizontal"></i>
</div>
<div class="flex-container wide100pLess70px character_select_container height100p alignitemscenter">
<div class="wide100p character_name_block">
<span class="ch_name">Go back</span>
</div>
</div>
</div>
</div>
<div id="hotswap_template" class="template_element">
<div class="hotswapAvatar" title="Add a character/group to favorites to display it here!">
<img src="/img/ai4.png">
</div>
</div>
<div id="alternate_greetings_template" class="template_element">
<div class="alternate_grettings flexFlowColumn flex-container">
<div class="title_restorable">
<h3><span data-i18n="Alternate Greetings">Alternate Greetings</span></h3>
<div title="Add" class="menu_button fa-solid fa-plus add_alternate_greeting" data-i18n="[title]Add"></div>
</div>
<div class="justifyLeft" data-i18n="Alternate Greetings Subtitle">
These will be displayed as swipes on the first message when starting a new chat.
Group members can select one of them to initiate the conversation.
</div>
<hr>
<div class="alternate_greetings_list flexFlowColumn flex-container wide100p">
<strong class="alternate_grettings_hint margin-bot-10px" data-i18n="Alternate Greetings Hint">
Click the <i class="fa-solid fa-plus"></i> button to get started!
</strong>
</div>
</div>
</div>
<div id="alternate_greeting_form_template" class="template_element">
<div class="alternate_greeting">
<div class="title_restorable">
<strong>Alternate Greeting #<span class="greeting_index"></span></strong>
<div class="menu_button fa-solid fa-trash-alt delete_alternate_greeting"></div>
</div>
<textarea name="alternate_greetings" data-i18n="[placeholder](This will be the first message from the character that starts every chat)" placeholder="(This will be the first message from the character that starts every chat)" class="text_pole textarea_compact alternate_greeting_text" maxlength="50000" value="" autocomplete="off" rows="12"></textarea>
</div>
</div>
<!-- chat and input bar -->
<div id="typing_indicator_template" class="template_element">
<div class="typing_indicator"><span class="typing_indicator_name">CHAR</span> is typing</div>
</div>
<div id="message_file_template" class="template_element">
<div class="mes_file_container">
<div class="fa-lg fa-solid fa-file-alt mes_file_icon"></div>
<div class="mes_file_name"></div>
<div class="mes_file_size"></div>
<div class="right_menu_button mes_file_open fa-solid fa-magnifying-glass" title="View contents" data-i18n="[title]View contents"></div>
<div class="right_menu_button mes_file_delete fa-solid fa-trash-can" title="Remove the file" data-i18n="[title]Remove the file"></div>
</div>
</div>
<div id="movingDivs">
<div id="floatingPrompt" class="drawer-content flexGap5">
<div class="panelControlBar flex-container">
<div id="floatingPromptheader" class="fa-solid fa-grip drag-grabber"></div>
<div id="ANClose" class="fa-solid fa-circle-xmark"></div>
</div>
<div name="floatingPromptHolder" class="scrollY">
<div class="inline-drawer">
<div id="ANBlockToggle" class="inline-drawer-toggle inline-drawer-header">
<b>Author's Note</b>
<div class="inline-drawer-icon fa-solid fa-circle-chevron-down down"></div>
</div>
<div class="inline-drawer-content">
<small>
<b>Unique to this chat</b>.<br>
Checkpoints inherit the Note from their parent, and can be changed individually after that.<br>
</small>
<textarea id="extension_floating_prompt" class="text_pole" rows="8" maxlength="50000"></textarea>
<div class="extension_token_counter">
Tokens: <span id="extension_floating_prompt_token_counter">0</span>
</div>
<label class="checkbox_label" for="extension_floating_allow_wi_scan">
<input id="extension_floating_allow_wi_scan" type="checkbox" />
<span data-i18n="Include in World Info Scanning">Include in World Info Scanning</span>
</label>
<div class="floating_prompt_radio_group">
<label>
<input type="radio" name="extension_floating_position" value="2" />
Before Main Prompt / Story String
</label>
<label>
<input type="radio" name="extension_floating_position" value="0" />
After Main Prompt / Story String
</label>
<label>
<input type="radio" name="extension_floating_position" value="1" />
In-chat @ Depth <input id="extension_floating_depth" class="text_pole widthUnset" type="number" min="0" max="999" />
</label>
</div>
<!--<label for="extension_floating_interval">In-Chat Insertion Depth</label>-->
<label for="extension_floating_interval">Insertion Frequency</label>
<input id="extension_floating_interval" class="text_pole widthUnset" type="number" min="0" max="999" /><small> (0 = Disable, 1 = Always)</small>
<br>
<span>User inputs until next insertion: <span id="extension_floating_counter">(disabled)</span></span>
</div>
</div>
<hr class="sysHR">
<div class="inline-drawer">
<div id="charaANBlockToggle" class="inline-drawer-toggle inline-drawer-header">
<div class="flex-container flexFlowColumn">
<b data-i18n="Character Author's Note (Private)">
Character Author's Note (Private)
</b>
<small data-i18n="Won't be shared with the character card on export.">
Won't be shared with the character card on export.
</small>
</div>
<div class="inline-drawer-icon fa-solid fa-circle-chevron-down down"></div>
</div>
<div class="inline-drawer-content">
<small>Will be automatically added as the author's note for this character. Will be used in groups, but
can't be modified when a group chat is open.</small>
<textarea id="extension_floating_chara" class="text_pole" rows="8" maxlength="50000" placeholder="Example:&#10;[Scenario: wacky adventures; Genre: romantic comedy; Style: verbose, creative]"></textarea>
<div class="extension_token_counter">
Tokens: <span id="extension_floating_chara_token_counter">0</span>
</div>
<label class="checkbox_label" for="extension_use_floating_chara">
<input id="extension_use_floating_chara" type="checkbox" />
<span data-i18n="Use character author's note">Use character author's note</span>
</label>
<div class="floating_prompt_radio_group">
<label>
<input type="radio" name="extension_floating_char_position" value="0" />
Replace Author's Note
</label>
<label>
<input type="radio" name="extension_floating_char_position" value="1" />
Top of Author's Note
</label>
<label>
<input type="radio" name="extension_floating_char_position" value="2" />
Bottom of Author's Note
</label>
</div>
</div>
</div>
<hr class="sysHR">
<div class="inline-drawer">
<div id="defaultANBlockToggle" class="inline-drawer-toggle inline-drawer-header">
<b>Default Author's Note</b>
<div class="inline-drawer-icon fa-solid fa-circle-chevron-down down"></div>
</div>
<div class="inline-drawer-content">
<small>Will be automatically added as the Author's Note for all new chats.</small>
<textarea id="extension_floating_default" class="text_pole" rows="8" maxlength="50000" placeholder="Example:&#10;[Scenario: wacky adventures; Genre: romantic comedy; Style: verbose, creative]"></textarea>
<div class="extension_token_counter">
Tokens: <span id="extension_floating_default_token_counter">0</span>
</div>
<div class="floating_prompt_radio_group">
<label>
<input type="radio" name="extension_default_position" value="0" />
After Main Prompt / Story String
</label>
<label>
<input type="radio" name="extension_default_position" value="1" />
In-chat @ Depth <input id="extension_default_depth" class="text_pole widthUnset" type="number" min="0" max="999" />
</label>
</div>
<label for="extension_default_interval">Insertion Frequency</label>
<input id="extension_default_interval" class="text_pole widthUnset" type="number" min="0" max="999" /><small> (0 = Disable, 1 = Always)</small>
</div>
</div>
</div>
</div>
<div id="cfgConfig" class="drawer-content flexGap5">
<div class="panelControlBar flex-container">
<div id="cfgConfigHeader" class="fa-solid fa-grip drag-grabber"></div>
<div id="CFGClose" class="fa-solid fa-circle-xmark"></div>
</div>
<div name="cfgConfigHolder" class="scrollY">
<div id="chat_cfg_container">
<div class="inline-drawer">
<div id="CFGBlockToggle" class="inline-drawer-toggle inline-drawer-header">
<b>Chat CFG</b>
<div class="inline-drawer-icon fa-solid fa-circle-chevron-down down"></div>
</div>
<div class="inline-drawer-content">
<small>
<b>Unique to this chat.</b><br>
</small>
<label for="chat_cfg_guidance_scale">
<span data-i18n="Scale">Scale</span>
<small data-i18n="1 = disabled">1 = disabled</small>
</label>
<div class="range-block-range-and-counter">
<div class="range-block-range">
<input type="range" id="chat_cfg_guidance_scale" name="volume" min="0.10" max="4.00" step="0.05">
</div>
<div class="range-block-counter">
<input type="number" min="0.10" max="4.00" step="0.05" data-for="chat_cfg_guidance_scale" id="chat_cfg_guidance_scale_counter">
</div>
</div>
<div>
<label for="chat_cfg_negative_prompt">
<span data-i18n="Negative Prompt">Negative Prompt</span>
</label>
<textarea id="chat_cfg_negative_prompt" rows="2" class="text_pole textarea_compact" data-i18n="[placeholder]write short replies, write replies using past tense" placeholder="write short replies, write replies using past tense"></textarea>
<label for="chat_cfg_positive_prompt">
<span data-i18n="Positive Prompt">Positive Prompt</span>
</label>
<textarea id="chat_cfg_positive_prompt" rows="2" class="text_pole textarea_compact" data-i18n="[placeholder]write short replies, write replies using past tense" placeholder="write short replies, write replies using past tense"></textarea>
</div>
<div id="groupchat_cfg_use_chara_container">
<label class="checkbox_label" for="groupchat_cfg_use_chara">
<input type="checkbox" id="groupchat_cfg_use_chara" />
<span data-i18n="Use character CFG scales">Use character CFG scales</span>
</label>
</div>
</div>
</div>
</div>
<div id="chara_cfg_container" style="display: none;">
<hr class="sysHR">
<div class="inline-drawer">
<div id="charaANBlockToggle" class="inline-drawer-toggle inline-drawer-header">
<b>Character CFG</b>
<div class="inline-drawer-icon fa-solid fa-circle-chevron-down down"></div>
</div>
<div class="inline-drawer-content">
<small><b>Will be automatically added as the CFG for this character.</b></small>
<br />
<label for="chara_cfg_guidance_scale">
<span data-i18n="Scale">Scale</span>
<small data-i18n="1 = disabled">1 = disabled</small>
</label>
<div class="range-block-range-and-counter">
<div class="range-block-range">
<input type="range" id="chara_cfg_guidance_scale" name="volume" min="0.10" max="4.00" step="0.05">
</div>
<div class="range-block-counter">
<input type="number" min="0.10" max="4.00" step="0.05" data-for="chara_cfg_guidance_scale" id="chara_cfg_guidance_scale_counter">
</div>
</div>
<div>
<label for="chara_cfg_negative_prompt">
<span data-i18n="Negative Prompt">Negative Prompt</span>
</label>
<textarea id="chara_cfg_negative_prompt" rows="2" class="text_pole textarea_compact" data-i18n="[placeholder]write short replies, write replies using past tense" placeholder="write short replies, write replies using past tense"></textarea>
<label for="chara_cfg_positive_prompt">
<span data-i18n="Positive Prompt">Positive Prompt</span>
</label>
<textarea id="chara_cfg_positive_prompt" rows="2" class="text_pole textarea_compact" data-i18n="[placeholder]write short replies, write replies using past tense" placeholder="write short replies, write replies using past tense"></textarea>
</div>
</div>
</div>
</div>
<div id="global_cfg_container">
<hr class="sysHR">
<div class="inline-drawer">
<div id="defaultANBlockToggle" class="inline-drawer-toggle inline-drawer-header">
<b>Global CFG</b>
<div class="inline-drawer-icon fa-solid fa-circle-chevron-down down"></div>
</div>
<div class="inline-drawer-content">
<small><b>Will be used as the default CFG options for every chat unless overridden.</b></small>
<br />
<label for="global_cfg_guidance_scale">
<span data-i18n="Scale">Scale</span>
<small data-i18n="1 = disabled">1 = disabled</small>
</label>
<div class="range-block-range-and-counter">
<div class="range-block-range">
<input type="range" id="global_cfg_guidance_scale" name="volume" min="0.10" max="4.00" step="0.05">
</div>
<div class="range-block-counter">
<input type="number" min="0.10" max="4.00" step="0.05" data-for="global_cfg_guidance_scale" id="global_cfg_guidance_scale_counter">
</div>
</div>
<div>
<label for="global_cfg_negative_prompt">
<span data-i18n="Negative Prompt">Negative Prompt</span>
</label>
<textarea id="global_cfg_negative_prompt" rows="2" class="text_pole textarea_compact" data-i18n="[placeholder]write short replies, write replies using past tense" placeholder="write short replies, write replies using past tense"></textarea>
<label for="global_cfg_positive_prompt">
<span data-i18n="Positive Prompt">Positive Prompt</span>
</label>
<textarea id="global_cfg_positive_prompt" rows="2" class="text_pole textarea_compact" data-i18n="[placeholder]write short replies, write replies using past tense" placeholder="write short replies, write replies using past tense"></textarea>
</div>
</div>
</div>
</div>
<div id="cfg_prompt_combine_container">
<hr class="sysHR">
<div class="inline-drawer">
<div id="defaultANBlockToggle" class="inline-drawer-toggle inline-drawer-header">
<b>CFG Prompt Cascading</b>
<div class="inline-drawer-icon fa-solid fa-circle-chevron-down down"></div>
</div>
<div class="inline-drawer-content">
<div class="flex-container flexFlowColumn">
<small>
<b>Combine positive/negative prompts from other boxes.</b>
<br />
For example, ticking the chat, global, and character boxes combine all negative prompts into a comma-separated string.
</small>
</div>
<br />
<div class="flex-container flexFlowColumn">
<label for="cfg_prompt_combine">
<span data-i18n="Scale">Always Include</span>
</label>
<label class="checkbox_label">
<input type="checkbox" name="cfg_prompt_combine" value="0" />
<span data-i18n="Chat Negatives">Chat Negatives</span>
</label>
<label class="checkbox_label">
<input type="checkbox" name="cfg_prompt_combine" value="1" />
<span data-i18n="Character Negatives">Character Negatives</span>
</label>
<label class="checkbox_label">
<input type="checkbox" name="cfg_prompt_combine" value="2" />
<span data-i18n="Global Negatives">Global Negatives</span>
</label>
</div>
<div class="flex-container flexFlowColumn">
<label>
Custom Separator: <input id="cfg_prompt_separator" class="text_pole textarea_compact widthUnset" placeholder="&quot;\n&quot;" type="text" />
</label>
<label>
Insertion Depth: <input id="cfg_prompt_insertion_depth" class="text_pole widthUnset" type="number" min="0" max="99" />
</label>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<div id="sheld">
<div id="sheldheader" class="fa-solid fa-grip drag-grabber"></div>
<div id="chat">
</div>
<div id="form_sheld">
<div id="dialogue_del_mes">
<div id="dialogue_del_mes_ok" class="menu_button">Delete</div>
<div id="dialogue_del_mes_cancel" class="menu_button">Cancel</div>
</div>
<div id="send_form" class="no-connection">
<form id="file_form" class="wide100p displayNone">
<div class="file_attached">
<input id="file_form_input" type="file" hidden>
<input id="embed_file_input" type="file" hidden>
<i class="fa-solid fa-file-alt"></i>
<span class="file_name">File Name</span>
<span class="file_size">File Size</span>
<button id="file_form_reset" type="reset" class="menu_button" title="Remove the file" data-i18n="[title]Remove the file">
<i class="fa fa-times"></i>
</button>
</div>
</form>
<div id="nonQRFormItems">
<div id="leftSendForm" class="alignContentCenter">
<div id="options_button" class="fa-solid fa-bars"></div>
</div>
<textarea id="send_textarea" data-i18n="[placeholder]Not connected to API!" placeholder="Not connected to API!" name="text"></textarea>
<div id="rightSendForm" class="alignContentCenter">
<div id="mes_stop" title="Abort request" class="mes_stop" data-i18n="[title]Abort request">
<i class="fa-solid fa-circle-stop"></i>
</div>
<div id="mes_continue" class="fa-fw fa-solid fa-arrow-right displayNone" title="Continue the last message" data-i18n="[title]Continue the last message"></div>
<div id="send_but" class="fa-solid fa-paper-plane displayNone" title="Send a message" data-i18n="[title]Send a message"></div>
</div>
</div>
</div>
</div>
</div>
<!-- popups live outside sheld to avoid blur conflicts -->
<div id="options" class="font-family-reset" style="display: none;">
<div class="options-content">
<a id="option_close_chat" class="displayNone">
<i class="fa-lg fa-solid fa-times"></i>
<span data-i18n="Close chat">Close chat</span>
</a>
<a id="option_settings" class="displayNone">
<i class="fa-lg fa-solid fa-cog"></i>
<span data-i18n="Toggle Panels">Toggle Panels</span>
</a>
<a id="option_toggle_AN">
<i class="fa-lg fa-solid fa-note-sticky"></i>
<span data-i18n="Author's Note">Author's Note</span>
</a>
<a data-newbie-hidden id="option_toggle_CFG">
<i class="fa-lg fa-solid fa-scale-balanced"></i>
<span data-i18n="CFG Scale">CFG Scale</span>
</a>
<a id="option_back_to_main">
<i class="fa-lg fa-solid fa-left-long"></i>
<span data-i18n="Back to parent chat">Back to parent chat</span>
</a>
<a id="option_new_bookmark">
<i class="fa-lg fa-solid fa-flag"></i>
<span data-i18n="Save checkpoint">Save checkpoint</span>
</a>
<a id="option_convert_to_group">
<i class="fa-lg fa-solid fa-people-arrows"></i>
<span data-i18n="Convert to group">Convert to group</span>
</a>
<hr>
<a id="option_start_new_chat">
<i class="fa-lg fa-solid fa-comments"></i>
<span data-i18n="Start new chat">Start new chat</span>
</a>
<a id="option_close_chat">
<i class="fa-lg fa-solid fa-times"></i>
<span data-i18n="Close chat">Close chat</span>
</a>
<a id="option_select_chat">
<i class="fa-lg fa-solid fa-address-book"></i>
<span data-i18n="Manage chat files">Manage chat files</span>
</a>
<hr>
<a id="option_delete_mes">
<i class="fa-lg fa-solid fa-trash-can"></i>
<span data-i18n="Delete messages">Delete messages</span>
</a>
<a id="option_regenerate">
<i class="fa-lg fa-solid fa-repeat"></i>
<span data-i18n="Regenerate">Regenerate</span>
</a>
<a id="option_impersonate" title="Ask AI to write your message for you" data-i18n="[title]Ask AI to write your message for you">
<i class="fa-lg fa-solid fa-user-secret"></i>
<span data-i18n="Impersonate">Impersonate</span>
</a>
<a id="option_continue" title="Continue the last message" data-i18n="[title]Continue the last message">
<i class="fa-lg fa-solid fa-arrow-right"></i>
<span data-i18n="Continue">Continue</span>
</a>
</div>
</div>
<div id="export_format_popup" class="list-group">
<div class="export_format list-group-item" data-format="png">PNG</div>
<div class="export_format list-group-item" data-format="json">JSON</div>
</div>
<div id="zoomed_avatar_template" class="template_element">
<div class="zoomed_avatar">
<div id="" class="fa-solid fa-grip drag-grabber"></div>
<img class="zoomed_avatar_img" src="">
</div>
</div>
<template id="generic_draggable_template">
<div class="draggable">
<div class="dragTitle"></div>
<div class="panelControlBar flex-container">
<div class="fa-solid fa-grip drag-grabber"></div>
<div class="fa-solid fa-circle-xmark dragClose"></div>
</div>
</div>
</template>
<div id="rawPromptPopup" class="list-group">
<div id="rawPromptWrapper" class="tokenItemizingSubclass"></div>
</div>
<div id="user_avatar_template" class="template_element">
<div class="avatar-container">
<div imgfile="" class="avatar">
<img src="" alt="User Avatar">
</div>
<div class="avatar-buttons avatar-buttons-top">
<button class="menu_button bind_user_name" title="Bind user name to that avatar" data-i18n="[title]Bind user name to that avatar">
<i class="fa-solid fa-user-edit"></i>
</button>
<button class="menu_button set_default_persona" title="Select this as default persona for the new chats." data-i18n="[title]Select this as default persona for the new chats.">
<i class="fa-solid fa-crown"></i>
</button>
</div>
<div class="avatar-buttons avatar-buttons-bottom">
<button class="menu_button set_persona_image" title="Change persona image" data-i18n="[title]Change persona image">
<i class="fa-solid fa-image"></i>
</button>
<button class="menu_button delete_avatar" title="Delete persona" data-i18n="[title]Delete persona">
<i class="fa-solid fa-trash-alt"></i>
</button>
</div>
</div>
</div>
<script>
// Configure toast library:
toastr.options.escapeHtml = true; // Prevent raw HTML inserts
toastr.options.timeOut = 4000; // How long the toast will display without user interaction
toastr.options.extendedTimeOut = 10000; // How long the toast will display after a user hovers over it
toastr.options.progressBar = true; // Visually indicate how long before a toast expires.
toastr.options.closeButton = true; // enable a close button
toastr.options.positionClass = "toast-top-center"; // Where to position the toast container
</script>
<script>
const documentHeight = () => {
const doc = document.documentElement
doc.style.setProperty('--doc-height', `${window.innerHeight}px`)
}
window.addEventListener('resize', documentHeight)
documentHeight()
</script>
</body>
</html>
Reference in New Issue View Git Blame Copy Permalink