rixty/SillyTavern
1
0
Fork 0
mirror of https://github.com/SillyTavern/SillyTavern.git synced 2025-06-05 21:59:27 +02:00
Code Issues Packages Projects Releases Wiki Activity

Merge branch 'main' into dev

Browse Source
This commit is contained in:
SillyLossy
2023-03-03 01:14:04 +02:00
parent 6c3984d4f4 402d88c354
commit 6199fcb5da
22 changed files with 419 additions and 183 deletions
Download Patch File Download Diff File Expand all files Collapse all files

BIN
public/characters/Aqua.png
View File

Binary file not shown.
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 396 KiB

After

Width:  |  Height:  |  Size: 396 KiB

52
public/css/notes.css
View File

@@ -1,12 +1,46 @@
body {
#main{ margin: 0;
width: 100%; padding:0;
height: 100%; width: 100%;
background-color: rgb(36, 37, 37);
background-repeat: no-repeat;
background-attachment: fixed;
background-size: cover;
font-family: "Noto Sans", "Noto Color Emoji", sans-serif;
font-size:16px; /*1rem*/
color: #999;
box-sizing: border-box;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
/*z-index:0;*/
} }
#content{
margin-left: 6px;
max-width: 700px;
} #main {
padding-top: 20px;
/*z-index:1;*/
}
#content{
margin: 0 auto;
max-width: 700px;
border: 1px solid #333;
padding: 20px;
border-radius: 20px;
background-color: rgba(0,0,0,0.5);
line-height: 1.5rem;
box-shadow: 0 0 5px black;
/*z-index: 2;*/
}
code {
border: 1px solid #999;
background-color: rgba(0,0,0,0.5);
padding: 5px;
border-radius:5px;
display: block;
}
a {color: orange; text-decoration:none; border-bottom: 1px dotted orange; }
h2, h3 {margin: 0; color:#ccc;}
hr {border: 1px solid #999;}

87
public/index.html
View File

@@ -58,6 +58,25 @@
}]; }];
var chat_create_date = 0; var chat_create_date = 0;
//RossAscends: Added function to format dates used in files and chat timestamps to a humanized format.
//Mostly I wanted this to be for file names, but couldn't figure out exactly where the filename save code was as everything seemed to be connected.
//During testing, this performs the same as previous date.now() structure.
//It also does not break old characters/chats, as the code just uses whatever timestamp exists in the chat.
//New chats made with characters will use this new formatting.
//Useable variable is (( humanizedISO8601Datetime ))
var baseDate = new Date(Date.now());
var humanYear = baseDate.getFullYear();
var humanMonth = (baseDate.getMonth()+1);
var humanDate = baseDate.getDate();
var humanHour = (baseDate.getHours() < 10? '0' : '') + baseDate.getHours();
var humanMinute = (baseDate.getMinutes() < 10? '0' : '') + baseDate.getMinutes();
var humanSecond = (baseDate.getSeconds() < 10? '0' : '') + baseDate.getSeconds();
var humanMillisecond = (baseDate.getMilliseconds() < 10? '0' : '') + baseDate.getMilliseconds();
var humanizedISO8601DateTime = (humanYear+"-"+humanMonth+"-"+humanDate+" @"+humanHour+"h "+humanMinute+"m "+humanSecond+"s "+humanMillisecond+"ms");
var default_ch_mes = "Hello"; var default_ch_mes = "Hello";
var count_view_mes = 0; var count_view_mes = 0;
var mesStr = ''; var mesStr = '';
@@ -1538,7 +1557,6 @@
} }
}); });
var save_chat = [{user_name:default_user_name, character_name:name2,create_date: chat_create_date}, ...chat]; var save_chat = [{user_name:default_user_name, character_name:name2,create_date: chat_create_date}, ...chat];
jQuery.ajax({ jQuery.ajax({
type: 'POST', type: 'POST',
url: '/savechat', url: '/savechat',
@@ -2177,7 +2195,7 @@
}else{ }else{
$("#mes_example_textarea").val(create_save_mes_example); $("#mes_example_textarea").val(create_save_mes_example);
} }
$("#avatar_div").css("display", "flex"); $("#avatar_div").css("display", "grid");
$("#avatar_load_preview").attr('src',default_avatar); $("#avatar_load_preview").attr('src',default_avatar);
$("#name_div").css("display", "block"); $("#name_div").css("display", "block");
@@ -2476,7 +2494,8 @@
if(popup_type == 'new_chat' && this_chid != undefined && menu_type != "create"){//Fix it; New chat doesn't create while open create character menu if(popup_type == 'new_chat' && this_chid != undefined && menu_type != "create"){//Fix it; New chat doesn't create while open create character menu
clearChat(); clearChat();
chat.length = 0; chat.length = 0;
characters[this_chid].chat = Date.now(); characters[this_chid].chat = Date.now(); //RossAscends: added character name to new chat filenames and replaced Date.now() with humanizedISO8601DateTime;
//characters[this_chid].chat = (name2 +' - '+ humanizedISO8601DateTime); //RossAscends: added character name to new chat filenames and replaced Date.now() with humanizedISO8601DateTime;
$("#selected_chat_pole").val(characters[this_chid].chat); $("#selected_chat_pole").val(characters[this_chid].chat);
timerSaveEdit = setTimeout(() => {$("#create_button").click();},durationSaveEdit); timerSaveEdit = setTimeout(() => {$("#create_button").click();},durationSaveEdit);
getChat(); getChat();
@@ -2577,15 +2596,17 @@
}); });
function read_avatar_load(input) { function read_avatar_load(input) {
if (input.files && input.files[0]) { if (input.files && input.files[0]) {
var reader = new FileReader(); var reader = new FileReader();
if(selected_button == 'create'){ if(selected_button == 'create'){
create_save_avatar = input.files; create_save_avatar = input.files;
} }
reader.onload = function (e) { reader.onload = function (e) {
if(selected_button == 'character_edit'){ if(selected_button == 'character_edit'){
timerSaveEdit = setTimeout(() => {$("#create_button").click();},durationSaveEdit); timerSaveEdit = setTimeout(() => {$("#create_button").click();},durationSaveEdit);
} }
$('#avatar_load_preview') $('#avatar_load_preview')
@@ -2600,15 +2621,18 @@
} }
} }
$("#add_avatar_button").change(function(){ $("#add_avatar_button").change(function(){
is_mes_reload_avatar = Date.now(); is_mes_reload_avatar = Date.now();
read_avatar_load(this); read_avatar_load(this);
}); });
$( "#form_create" ).submit(function(e) { $( "#form_create" ).submit(function(e) {
$('#rm_info_avatar').html(''); $('#rm_info_avatar').html('');
var formData = new FormData($("#form_create").get(0)); var formData = new FormData($("#form_create").get(0));
if($("#form_create").attr("actiontype") == "createcharacter"){ if($("#form_create").attr("actiontype") == "createcharacter"){
if($("#character_name_pole").val().length > 0){ if($("#character_name_pole").val().length > 0){
jQuery.ajax({ jQuery.ajax({
type: 'POST', type: 'POST',
url: '/createcharacter', url: '/createcharacter',
@@ -2644,6 +2668,7 @@
$('#create_button').removeAttr("disabled"); $('#create_button').removeAttr("disabled");
$("#add_avatar_button").replaceWith($("#add_avatar_button").val('').clone(true)); $("#add_avatar_button").replaceWith($("#add_avatar_button").val('').clone(true));
$('#create_button').attr('value','Create'); $('#create_button').attr('value','Create');
if(true){ if(true){
$('#rm_info_block').transition({ opacity: 0 ,duration: 0}); $('#rm_info_block').transition({ opacity: 0 ,duration: 0});
@@ -2652,6 +2677,7 @@
select_rm_info("Character created"); select_rm_info("Character created");
$('#rm_info_block').transition({ opacity: 1.0 ,duration: 2000}); $('#rm_info_block').transition({ opacity: 1.0 ,duration: 2000});
getCharacters(); getCharacters();
}else{ }else{
$('#result_info').html(html); $('#result_info').html(html);
@@ -2665,7 +2691,8 @@
$('#result_info').html("Name not entered"); $('#result_info').html("Name not entered");
} }
}else{ }else{
//console.log($("#add_avatar_button").val()); console.log($("#add_avatar_button").val());
jQuery.ajax({ jQuery.ajax({
type: 'POST', type: 'POST',
url: '/editcharacter', url: '/editcharacter',
@@ -2703,12 +2730,13 @@
} }
} }
$('#create_button').removeAttr("disabled"); $('#create_button').removeAttr("disabled");
getCharacters(); getCharacters();
$("#add_avatar_button").replaceWith($("#add_avatar_button").val('').clone(true)); $("#add_avatar_button").replaceWith($("#add_avatar_button").val('').clone(true));
$('#create_button').attr('value','Save'); $('#create_button').attr('value','Save');
var count_tokens = encode(JSON.stringify(characters[this_chid].description+characters[this_chid].personality+characters[this_chid].scenario+characters[this_chid].mes_example)).length; var count_tokens = encode(JSON.stringify(characters[this_chid].description+characters[this_chid].personality+characters[this_chid].scenario+characters[this_chid].mes_example)).length;
if(count_tokens < 1024){ if(count_tokens < 1024){
$('#result_info').html(count_tokens+" Tokens"); $('#result_info').html(count_tokens+" Tokens");
@@ -3609,7 +3637,7 @@
//console.log(characters[this_chid].chat); //console.log(characters[this_chid].chat);
jQuery.ajax({ jQuery.ajax({
type: 'POST', type: 'POST',
url: '/getallchatsofchatacter', url: '/getallchatsofcharacter',
data: JSON.stringify({avatar_url: characters[this_chid].avatar}), data: JSON.stringify({avatar_url: characters[this_chid].avatar}),
beforeSend: function(){ beforeSend: function(){
//$('#create_button').attr('value','Creating...'); //$('#create_button').attr('value','Creating...');
@@ -3628,7 +3656,7 @@
if(mes.length > strlen){ if(mes.length > strlen){
mes = '...'+mes.substring(mes.length - strlen); mes = '...'+mes.substring(mes.length - strlen);
} }
$('#select_chat_div').append('<div class="select_chat_block" file_name="'+data[key]['file_name']+'"><div class=avatar><img src="characters/'+characters[this_chid]['avatar']+'" style="width: 33px;"></div><div class="select_chat_block_filename">'+data[key]['file_name']+'</div><div class="select_chat_block_mes">'+mes+'</div></div>'); $('#select_chat_div').append('<div class="select_chat_block" file_name="'+data[key]['file_name']+'"><div class=avatar><img src="characters/'+characters[this_chid]['avatar']+'""></div><div class="select_chat_block_filename">'+data[key]['file_name']+'</div><div class="select_chat_block_mes">'+mes+'</div></div>');
if(characters[this_chid]['chat'] == data[key]['file_name'].replace('.jsonl', '')){ if(characters[this_chid]['chat'] == data[key]['file_name'].replace('.jsonl', '')){
//children().last() //children().last()
$('#select_chat_div').children(':nth-last-child(1)').attr('highlight', true); $('#select_chat_div').children(':nth-last-child(1)').attr('highlight', true);
@@ -3785,7 +3813,7 @@
$("#character_import_file_type").val(format); $("#character_import_file_type").val(format);
//console.log(format); //console.log(format);
var formData = new FormData($("#form_import").get(0)); var formData = new FormData($("#form_import").get(0));
jQuery.ajax({ jQuery.ajax({
type: 'POST', type: 'POST',
url: '/importcharacter', url: '/importcharacter',
@@ -4386,7 +4414,7 @@
</div> </div>
<!--<div id="shadow_character_popup"> <!--<div id="shadow_character_popup">
</div>--> </div>-->
<div id="character_popup"> <div id="character_popup">
<div id="character_popup_text"> <div id="character_popup_text">
<img id="character_cross" src="img/cross.png" style="position: absolute; right: 15px; top: 15px; width: 20px; height: 20px; cursor: pointer; opacity: 0.6"> <img id="character_cross" src="img/cross.png" style="position: absolute; right: 15px; top: 15px; width: 20px; height: 20px; cursor: pointer; opacity: 0.6">
@@ -4601,10 +4629,10 @@
<nav id="right-nav-panel"> <nav id="right-nav-panel">
<div id="right-nav-panel-tabs"> <div id="right-nav-panel-tabs">
<div class="right_menu_button" id="rm_button_characters">&#x1F464;</div> <div class="right_menu_button" id="rm_button_characters" title="Select/Create Characters">&#x1F464;</div>
<div class="right_menu_button" id="rm_button_settings">⚙️</div> <div class="right_menu_button" id="rm_button_settings" title="API and AI Settings">⚙️</div>
<div class="right_menu_button" id="rm_button_selected_ch"><h2></h2></div> <div class="right_menu_button" id="rm_button_selected_ch"><h2></h2></div>
<div class="right_menu_button" id="rm_button_panel_pin_div"><input type="checkbox" id="rm_button_panel_pin"></div> <div class="right_menu_button" id="rm_button_panel_pin_div"><input type="checkbox" id="rm_button_panel_pin" title="Locked = Settings panel stays open"></div>
</div> </div>
<div id="rm_ch_create_block" class="right_menu" style="display: none;"> <div id="rm_ch_create_block" class="right_menu" style="display: none;">
@@ -4616,18 +4644,23 @@
<h4>Name</h4><h5>Character name</h5> <h4>Name</h4><h5>Character name</h5>
<input id="character_name_pole" name="ch_name" class="text_pole" maxlength="120" value="" autocomplete="off"> <input id="character_name_pole" name="ch_name" class="text_pole" maxlength="120" value="" autocomplete="off">
</div> </div>
<!--<div id="avatar_div" class="avatar_div" style="display: block;">
<div id="avatar_div_div" class="avatar">
<img id="avatar_load_preview" src="img/fluffy.png" alt="avatar">
</div>
<input type="file" id="add_avatar_button" name="avatar" accept="image/png, image/jpeg, image/jpg, image/gif, image/bmp">
</div>-->
<div id="avatar_div" class="avatar_div"> <div id="avatar_div" class="avatar_div">
<div id="avatar_div_div" class="avatar"> <div id="avatar_div_div" class="avatar">
<img id="avatar_load_preview" src="img/fluffy.png" alt="avatar"> <img id="avatar_load_preview" src="img/fluffy.png" alt="avatar">
</div> </div>
<label id="add_avatar_button"> <label for="add_avatar_button" class="add_avatar_button_label" title="Click to select a new avatar for this character">
<input type="file" name="avatar" accept="image/png, image/jpeg, image/jpg, image/gif, image/bmp"> <input type="file" id="add_avatar_button" name="avatar" accept="image/png, image/jpeg, image/jpg, image/gif, image/bmp">
Change Avatar Change Avatar
</label> </label>
</div> </div>
<div id="description_div"> <div id="description_div">
@@ -4726,7 +4759,11 @@
<option value="novel">NovelAI</option> <option value="novel">NovelAI</option>
</select> </select>
<div id="kobold_api" style="position: relative;"> <div id="kobold_api" style="position: relative;">
<div style="display:none; position: absolute; right:188px; top:-34px; opacity:0.20;"><a href="https://github.com/KoboldAI/KoboldAI-Client" target="_blank"><img src="img/kobold.png" style="width:40px;height:40px;"></a></div> <div style="position: absolute; right:188px; top:-34px; opacity:0.20;">
<a href="https://github.com/KoboldAI/KoboldAI-Client" target="_blank">
<img src="img/kobold.png" style="width:40px;height:40px;">
</a>
</div>
<form action="javascript:void(null);" method="post" enctype="multipart/form-data"> <form action="javascript:void(null);" method="post" enctype="multipart/form-data">
<h4>API url</h4><h5>Example: http://127.0.0.1:5000/api </h5> <h4>API url</h4><h5>Example: http://127.0.0.1:5000/api </h5>
@@ -4806,7 +4843,7 @@
<h4>Name</h4> <h4>Name</h4>
<input id="your_name" name="your_name" class="text_pole" maxlength="35" value="" autocomplete="off"> <input id="your_name" name="your_name" class="text_pole" maxlength="35" value="" autocomplete="off">
<br> <br>
<input id="your_name_button" type="submit" value="Change"> <input id="your_name_button" type="submit" title="Click to set a new User Name (reloads page)" value="Change Name">
</form> </form>
<hr> <hr>
@@ -4871,15 +4908,15 @@
</div> </div>
<div id="rm_characters_block" class="right_menu"> <div id="rm_characters_block" class="right_menu">
<div id="rm_button_create" class="right_menu_button"><h2>+New Character</h2></div> <div id="rm_button_create" class="right_menu_button"><h2>+New Character</h2></div>
<div id="character_import_button" class="right_menu_button"><h2>+Import</h2></div> <div id="character_import_button" class="right_menu_button"><h2>+Import Character</h2></div>
<div id="rm_button_group_chats" class="right_menu_button"><h2>+New Group</h2></div> <div id="rm_button_group_chats" class="right_menu_button"><h2>+New Group</h2></div>
<div id="characloud_url" title="Find more characters on CharaCloud (coming soon)">
<img src="img/cloud_logo.png">
</div>
<form id="form_character_search_form" action="javascript:void(null);"> <form id="form_character_search_form" action="javascript:void(null);">
<input id="character_search_bar" class="text_pole" type="search" placeholder="Search here..." /> <input id="character_search_bar" class="text_pole" type="search" placeholder="Search here..." />
<div id="characloud_url" title="Find more characters on CharaCloud (coming soon)">
<img src="img/cloud_logo.png">
</div>
</form> </form>
<div id="rm_print_characters_block"></div> <div id="rm_print_characters_block"></div>

45
public/notes/1.html
View File

@@ -1,27 +1,44 @@
<html> <html>
<head> <head>
<title>Description character</title> <title>TavernAI - Note - Character Derscriptions</title>
<link rel="stylesheet" href="/css/notes.css"> <link rel="stylesheet" href="/css/notes.css">
<meta charset="UTF-8"> <meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin="">
<link href="https://fonts.googleapis.com/css2?family=Noto+Sans:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&amp;display=swap" rel="stylesheet">
</head> </head>
<body> <body>
<div id="main"> <div id="main">
<div id="content"> <div id="content">
<h2>Character description</h2> <h2>Character description</h2>
<p>Used to add the character description and the rest that the AI should <p>
know. For example, you can add information about the world in which the action takes place and describe Used to add the character description and the rest that the AI should know.<br><br>
the characteristics for the character you are playing for. Usually it all takes 200-350 tokens.</p> For example, you can add information about the world in which the action takes place and describe
the characteristics for the character you are playing for.<br><br>
Usually it all takes 200-350 tokens.
</p>
<h3>Methods and format</h3> <h3>Methods and format</h3>
<p>For most Kobold's models the easiest way is to use a free form for description, and in each sentence it is desirable to specify the name of the character. <p>
The entire description should be in one line without hyphenation. For examle:<br><br> For most Kobold's models the easiest way is to use a free form for description, and in each sentence it is desirable to specify the name of the character.<br><br>
<i>Chloe is a female elf. Chloe wears black-white maid dress with green collar and red glasses. Chloe has medium length black hair. The entire description should be in one line without hyphenation.<br><br>
Chloe's personality is...</i> etc.</p> For examle:<br><br>
<code>
Chloe is a female elf. Chloe wears black-white maid dress with green collar and red glasses. Chloe has medium length black hair. Chloe's personality is...
</code>
</p>
<p>But that the AI would be less confused the best way is to use the W++ format. Details here: <a target="_blank" href="https://github.com/KoboldAI/KoboldAI-Client/wiki/Pro-Tips">Pro-Tips</a></p> <p>
<hr><br>A list of tags that are replaced when sending to generate:<br><br> But that the AI would be less confused the best way is to use the W++ format.<Br><br>
{{user}} and &lt;USER&gt; are replaced by User Name<br> Details here: <a target="_blank" href="https://github.com/KoboldAI/KoboldAI-Client/wiki/Pro-Tips">Pro-Tips</a>
{{char}} and &lt;BOT&gt; are replaced by Character Name </p>
<hr>
<br>
<p>
<u>A list of tags that are replaced when sending to generate:</u><br><br>
{{user}} and &lt;USER&gt; : replaced by the User's Name<br>
{{char}} and &lt;BOT&gt; : replaced by the Character's Name
</p>
</div> </div>
</div> </div>
</body> </body>

9
public/notes/10.html
View File

@@ -1,9 +1,12 @@
<html> <html>
<head> <head>
<title>Chat import</title> <title>TavernAI - Note - Import Chat</title>
<link rel="stylesheet" href="/css/notes.css"> <link rel="stylesheet" href="/css/notes.css">
<meta charset="UTF-8"> <meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin="">
<link href="https://fonts.googleapis.com/css2?family=Noto+Sans:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&amp;display=swap" rel="stylesheet">
</head> </head>
<body> <body>
<div id="main"> <div id="main">

9
public/notes/11.html
View File

@@ -1,9 +1,12 @@
<html> <html>
<head> <head>
<title>Examples of dialogue</title> <title>TavernAI - Note - Example Dialogues</title>
<link rel="stylesheet" href="/css/notes.css"> <link rel="stylesheet" href="/css/notes.css">
<meta charset="UTF-8"> <meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin="">
<link href="https://fonts.googleapis.com/css2?family=Noto+Sans:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&amp;display=swap" rel="stylesheet">
</head> </head>
<body> <body>
<div id="main"> <div id="main">

22
public/notes/12.html
View File

@@ -1,18 +1,26 @@
<html> <html>
<head> <head>
<title>Scenario</title> <title>TavernAI - Note - Scenario</title>
<link rel="stylesheet" href="/css/notes.css"> <link rel="stylesheet" href="/css/notes.css">
<meta charset="UTF-8"> <meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin="">
<link href="https://fonts.googleapis.com/css2?family=Noto+Sans:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&amp;display=swap" rel="stylesheet">
</head> </head>
<body> <body>
<div id="main"> <div id="main">
<div id="content"> <div id="content">
<h2>Scenario</h2> <h2>Scenario</h2>
<p>Circumstances and context of the dialogue.</p> <p>
<hr><br>A list of tags that are replaced when sending to generate:<br><br> Circumstances and context of the dialogue.
{{user}} and &lt;USER&gt; are replaced by User Name<br> </p>
{{char}} and &lt;BOT&gt; are replaced by Character Name<br><br> <hr>
<p>
<u>A list of tags that are replaced when sending to generate:</u><br><br>
{{user}} and &lt;USER&gt; : replaced by User Name<br>
{{char}} and &lt;BOT&gt; : replaced by Character Name<br><br>
</p>
</div> </div>
</div> </div>
</body> </body>

3
public/notes/13.html
View File

@@ -4,6 +4,9 @@
<link rel="stylesheet" href="/css/notes.css"> <link rel="stylesheet" href="/css/notes.css">
<meta charset="UTF-8"> <meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin="">
<link href="https://fonts.googleapis.com/css2?family=Noto+Sans:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&amp;display=swap" rel="stylesheet">
</head> </head>
<body> <body>
<div id="main"> <div id="main">

5
public/notes/13_1.html
View File

@@ -4,7 +4,10 @@
<title>Scan Depth</title> <title>Scan Depth</title>
<link rel="stylesheet" href="/css/notes.css"> <link rel="stylesheet" href="/css/notes.css">
<meta charset="UTF-8"> <meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin="">
<link href="https://fonts.googleapis.com/css2?family=Noto+Sans:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&amp;display=swap" rel="stylesheet">
</head> </head>
<body> <body>

3
public/notes/13_2.html
View File

@@ -5,6 +5,9 @@
<link rel="stylesheet" href="/css/notes.css"> <link rel="stylesheet" href="/css/notes.css">
<meta charset="UTF-8"> <meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin="">
<link href="https://fonts.googleapis.com/css2?family=Noto+Sans:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&amp;display=swap" rel="stylesheet">
</head> </head>
<body> <body>

7
public/notes/13_3.html
View File

@@ -5,6 +5,9 @@
<link rel="stylesheet" href="/css/notes.css"> <link rel="stylesheet" href="/css/notes.css">
<meta charset="UTF-8"> <meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin="">
<link href="https://fonts.googleapis.com/css2?family=Noto+Sans:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&amp;display=swap" rel="stylesheet">
</head> </head>
<body> <body>
@@ -13,6 +16,7 @@
<h2> <h2>
World Info Entry World Info Entry
</h2> </h2>
<p></p>
<h3> <h3>
Key Key
</h3> </h3>
@@ -74,7 +78,8 @@
<p> <p>
If enabled, the entry would only be inserted when both a Key <b>AND</b> a Secondary Key have been If enabled, the entry would only be inserted when both a Key <b>AND</b> a Secondary Key have been
activated. activated.
<br> </p>
<p>
If no secondary keys provided, this flag is ignored. If no secondary keys provided, this flag is ignored.
</p> </p>
</div> </div>

3
public/notes/14.html
View File

@@ -4,6 +4,9 @@
<link rel="stylesheet" href="/css/notes.css"> <link rel="stylesheet" href="/css/notes.css">
<meta charset="UTF-8"> <meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin="">
<link href="https://fonts.googleapis.com/css2?family=Noto+Sans:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&amp;display=swap" rel="stylesheet">
</head> </head>
<body> <body>
<div id="main"> <div id="main">

36
public/notes/2.html
View File

@@ -1,23 +1,37 @@
<html> <html>
<head> <head>
<title>Personality</title> <title>TavernAI - Note - Personality Summary</title>
<link rel="stylesheet" href="/css/notes.css"> <link rel="stylesheet" href="/css/notes.css">
<meta charset="UTF-8"> <meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin="">
<link href="https://fonts.googleapis.com/css2?family=Noto+Sans:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&amp;display=swap" rel="stylesheet">
</head> </head>
<body> <body>
<div id="main"> <div id="main">
<div id="content"> <div id="content">
<h2>Personality summary</h2> <h2>Personality summary</h2>
<p>A brief description of the personality. It is added to the chat to a depth of 8-15 messages, so it has a significant impact on the character. Example:<br><br> <p>
<i>Cheerful, cunning, provocative</i><br><br> A brief description of the personality. It is added to the chat to a depth of 8-15 messages, so it has a significant impact on the character.
Another example:<br><br> </p>
<i>Aqua likes to do nothing and also likes to get drunk</i>
</p> Example:
<br><br>
<code>Cheerful, cunning, provocative</code>
<Br>
Another example:
<br><br>
<code>Aqua likes to do nothing and also likes to get drunk</code>
<p>*In Pygmalion model, it is used as a "Personality:" graph</p> <p>*In Pygmalion model, it is used as a "Personality:" graph</p>
<hr><br>A list of tags that are replaced when sending to generate:<br><br> <hr>
{{user}} and &lt;USER&gt; are replaced by User Name<br>
{{char}} and &lt;BOT&gt; are replaced by Character Name<br><br> <p>
<u>List of tags that are replaced when sending to generate:</u><br><br>
{{user}} and &lt;USER&gt; : replaced by the User's Name<br>
{{char}} and &lt;BOT&gt; : replaced by the Character's Name<br><br>
</p>
</div> </div>
</div> </div>

36
public/notes/3.html
View File

@@ -1,22 +1,36 @@
<html> <html>
<head> <head>
<title>First message</title> <title>TavernAI - Note - First Message</title>
<link rel="stylesheet" href="/css/notes.css"> <link rel="stylesheet" href="/css/notes.css">
<meta charset="UTF-8"> <meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin="">
<link href="https://fonts.googleapis.com/css2?family=Noto+Sans:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&amp;display=swap" rel="stylesheet">
</head> </head>
<body> <body>
<div id="main"> <div id="main">
<div id="content"> <div id="content">
<h2>First message</h2> <h2>First message</h2>
<p>An important thing that sets exactly how and in what style the character will communicate. <p>
It is desirable that the character's first message be long, so that later it would be less The First Message is an important thing that sets exactly how and in what style the character will communicate.<Br><br>
likely that the character would respond in monosyllables. You can also use asterisks ** to describe the character's actions. For example:<br><br> It is desirable that the character's first message be long, so that later it would be less likely that the character would respond in with very short messages. <br><br>
<i>*I noticed you came inside, I walked up and stood right in front of you* Wellcome. I'm glad to see you here. *i said with toothy smug sunny smile looking you straight in the eye* What brings you...</i> etc You can also use asterisks ** to describe the character's actions.
</p> </P>
<hr><br>A list of tags that are replaced when sending to generate:<br><br>
{{user}} and &lt;USER&gt; are replaced by User Name<br> For example:
{{char}} and &lt;BOT&gt; are replaced by Character Name<br><br> <br><br>
<code>
*I noticed you came inside, I walked up and stood right in front of you* Wellcome. I'm glad to see you here.
*i said with toothy smug sunny smile looking you straight in the eye* What brings you...
</code>
<Br>
<hr>
<p>
A list of tags that are replaced when sending to generate:<br><br>
{{user}} and &lt;USER&gt; are replaced by User Name<br>
{{char}} and &lt;BOT&gt; are replaced by Character Name<br><br>
</p>
</div> </div>
</div> </div>
</body> </body>

9
public/notes/4.html
View File

@@ -1,9 +1,12 @@
<html> <html>
<head> <head>
<title>KoboldAI Settings</title> <title>TavernAI - Note - KobolAI Settings</title>
<link rel="stylesheet" href="/css/notes.css"> <link rel="stylesheet" href="/css/notes.css">
<meta charset="UTF-8"> <meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin="">
<link href="https://fonts.googleapis.com/css2?family=Noto+Sans:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&amp;display=swap" rel="stylesheet">
</head> </head>
<body> <body>
<div id="main"> <div id="main">

15
public/notes/5.html
View File

@@ -1,15 +1,22 @@
<html> <html>
<head> <head>
<title>Temperature</title> <title>TavernAI - Note - Temperature</title>
<link rel="stylesheet" href="/css/notes.css"> <link rel="stylesheet" href="/css/notes.css">
<meta charset="UTF-8"> <meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin="">
<link href="https://fonts.googleapis.com/css2?family=Noto+Sans:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&amp;display=swap" rel="stylesheet">
</head> </head>
<body> <body>
<div id="main"> <div id="main">
<div id="content"> <div id="content">
<h2>Temperature</h2> <h2>Temperature</h2>
<p>Value from 0.1 to 2.0. Less value - the answers are more logical, but less creative. More value - the answers are more creative, but less logical.</p> <p>
Value from 0.1 to 2.0.<br><br>
Less value - the answers are more logical, but less creative.<Br><br>
More value - the answers are more creative, but less logical.
</p>
</div> </div>
</div> </div>
</body> </body>

29
public/notes/6.html
View File

@@ -1,27 +1,32 @@
<html> <html>
<head> <head>
<title>NovelAI api key</title> <title>TavernAI - Note - Novel AI API Key</title>
<link rel="stylesheet" href="/css/notes.css"> <link rel="stylesheet" href="/css/notes.css">
<meta charset="UTF-8"> <meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin="">
<link href="https://fonts.googleapis.com/css2?family=Noto+Sans:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&amp;display=swap" rel="stylesheet">
</head> </head>
<body> <body>
<div id="main"> <div id="main">
<div id="content"> <div id="content">
<h2>Finding your NAI API key</h2> <h2>Finding your NAI API key</h2>
<h4>To get a NovelAI API key, follow these instructions:</h4> <h4>To get a NovelAI API key, follow these instructions:</h4>
<p>
1. Go to the NovelAI website and Login.<br><br>
1. Login to NovelAI through the website.<br><br> 2. Create a new story, or open an existing story.<br><br>
2. Create a new story, or open an existing story.<br><br> 3. Open the Network Tools on your web browser. (For Chrome or Firefox, you do this by pressing Ctrl+Shift+I, then switching to the Network tab.)<br><br>
3. Open the Network Tools on your web browser. (For Chrome or Firefox, you do this by pressing Ctrl+Shift+I, then switching to the Network tab.)<br><br> 4. Generate something. You should see two requests to api.novelai.net/ai/generate-stream, which might look something like this:<br><br>
<img src="1.png"><br><br>
4. Generate something. You should see two requests to api.novelai.net/ai/generate-stream, which might look something like this:</p> 5. Select the second request, then in the Headers tab of the inspection panel, scroll down to the very bottom. Look for a header called Authorization:<br><br>
<img src="1.png"><br><br> <img src="2.png"><br><br>
5. Select the second request, then in the Headers tab of the inspection panel, scroll down to the very bottom. Look for a header called Authorization:<br><br> The long string (after "Bearer", not including it) is your API key.<br><br>
<img src="2.png"><br><br> * Proxies and Cloudflare-type services may interfere with connection.
The long string (after "Bearer", not including it) is your API key.<br><br>*Proxies and Cloudflare-type services may interfere with connection </p>
</div> </div>
</div> </div>
</body> </body>

33
public/notes/7.html
View File

@@ -1,22 +1,39 @@
<html> <html>
<head> <head>
<title>NovelAI settings</title> <title>TavernAI - Note - NovelAI Settings</title>
<link rel="stylesheet" href="/css/notes.css"> <link rel="stylesheet" href="/css/notes.css">
<meta charset="UTF-8"> <meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin="">
<link href="https://fonts.googleapis.com/css2?family=Noto+Sans:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&amp;display=swap" rel="stylesheet">
</head> </head>
<body> <body>
<div id="main"> <div id="main">
<div id="content"> <div id="content">
<h2>NovelAI settings</h2> <h2>NovelAI settings</h2>
<p>The files with the settings are here (TavernAI\public\NovelAI Settings) You also can add own settings files. <p>
The files with the settings are here (TavernAI\public\NovelAI Settings).<br>
You can also manually add your own settings files.
</p> </p>
<h3>Temperature</h3> <h3>Temperature</h3>
<p>Value from 0.1 to 2.0. Lower value - the answers are more logical, but less creative. Higher value - the answers are more creative, but less logical.</p> <p>
<h3>Repetition penalty</h3> Value from 0.1 to 2.0. <br>
<p>Repetition penalty is responsible for the penalty of repeated words. If the character is fixated on something or repeats the same phrase, then increasing this parameter will fix it. It is not recommended to increase this parameter too much for the chat format, as it may break this format. The standard value for chat is approximately 1.0 - 1.05</p> Lower value - the answers are more logical, but less creative. <br>
Higher value - the answers are more creative, but less logical.
</p>
<h3>Repetition penalty</h3>
<p>
Repetition penalty is responsible for the penalty of repeated words. <br>
If the character is fixated on something or repeats the same phrase, then increasing this parameter will fix it. <br>
It is not recommended to increase this parameter too much for the chat format, as it may break this format. <br>
<b>The standard value for chat is approximately 1.0 - 1.05</b>
</p>
<h3>Repetition penalty range</h3> <h3>Repetition penalty range</h3>
<p>The range of influence of Repetition penalty in tokens.</p> <p>
The range of influence of Repetition penalty in tokens.
</p>
</div> </div>
</div> </div>
</body> </body>

11
public/notes/8.html
View File

@@ -1,15 +1,18 @@
<html> <html>
<head> <head>
<title>NovelAI Models</title> <title>TavernAI - Note - NovelAI Models</title>
<link rel="stylesheet" href="/css/notes.css"> <link rel="stylesheet" href="/css/notes.css">
<meta charset="UTF-8"> <meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin="">
<link href="https://fonts.googleapis.com/css2?family=Noto+Sans:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&amp;display=swap" rel="stylesheet">
</head> </head>
<body> <body>
<div id="main"> <div id="main">
<div id="content"> <div id="content">
<h2>NovelAI Models</h2> <h2>NovelAI Models</h2>
<h4>If your subscribe tier is Paper, Tablet or Scroll use only Euterpe model otherwise you can not get an answer from NovelAI api.</h4> <p>If your subscribe tier is Paper, Tablet or Scroll use only Euterpe model otherwise you can not get an answer from NovelAI api.</p>
</div> </div>
</div> </div>
</body> </body>

44
public/notes/9.html
View File

@@ -1,21 +1,45 @@
<html> <html>
<head> <head>
<title>Anchors</title> <title>TavernAI - Note - Anchors</title>
<link rel="stylesheet" href="/css/notes.css"> <link rel="stylesheet" href="/css/notes.css">
<meta charset="UTF-8"> <meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin="">
<link href="https://fonts.googleapis.com/css2?family=Noto+Sans:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&amp;display=swap" rel="stylesheet">
</head> </head>
<body> <body>
<div id="main"> <div id="main">
<div id="content"> <div id="content">
<h2>Anchors</h2> <h2>Anchors</h2>
<h4>Anchors are used to increase the length of messages. There are two types of anchors: Character Anchor and Style Anchor</h4> <p>
<p><u>Character Anchor</u> - affects the character played by the AI by motivating him to write longer messages. Looks like [Alexa talks a lot with descriptions]</p> Anchors are used to increase the length of messages.<br>
<p><u>Style Anchor</u> - affects all AI model, motivating AI to write longer messages. Looks like [Writing style: very long messages]</p> There are two types of anchors: <u>Character Anchor</u> and <u>Style Anchor</u>
<hr style="opacity: 0.6;"><p>Anchors Order sets the location of anchors in the promt, the first anchor in the order is much higher and has less influence than second.</p> </p>
<p>The second in order anchor is turned on after 8-12 messages, because the first anchor is enough when there are few messages.</p> <p>
<p>Sometimes some AI models may not perceive anchors correctly or the AI model already generates sufficiently long messages, so for these cases, to disable anchors, you just need to uncheck the boxes.</p> <u>Character Anchor</u> - affects the character played by the AI by motivating him to write longer messages.<br><br>
<br><p>*It is automatically disabled in Pygmalion, since Pygmalion already generates long enough messages</p> Looks like:
<code>[(Bot's name) talks a lot with descriptions]</code>
</p>
<p>
<u>Style Anchor</u> - affects the entire AI model, motivating the AI to write longer messages even when it is not acting as the character.<Br><br>
Looks like:
<code>[Writing style: very long messages]</code>
</p>
<hr>
<p>
Anchors Order sets the location of anchors in the promt, the first anchor in the order is much further back in the context and thus has less influence than second.
</p>
<p>
The second anchor is only turned on after 8-12 messages, because when the chat still only has a few message the first anchor creates enough effect ob its own.
</p>
<p>
Sometimes an AI model may not perceive anchors correctly or the AI model already generates sufficiently long messages.<br>
For these cases, you can disable the anchors by unchecking their respective boxes.
</p>
<p>
<u>When using Pygmalion models these anchors are automatically disabled, since Pygmalion already generates long enough messages.</u>
</p>
</div> </div>
</div> </div>
</body> </body>

76
public/style.css
View File

@@ -493,9 +493,9 @@ input::file-selector-button {
font-weight: bold; font-weight: bold;
color: #fff; color: #fff;
padding: 0.5em; padding: 0.5em;
border: 1px solid yellow; /*#666;*/ border: 1px solid #666;
border-radius: 3px; border-radius: 3px;
background-color: red; /*rgba(0,0,0,0.3);*/ background-color: rgba(0,0,0,0.3);
cursor: pointer; cursor: pointer;
} }
@@ -608,34 +608,34 @@ input[type=button] {
#character_import_button h2{ #character_import_button h2{
margin-top: auto; margin-top: auto;
margin-bottom: auto; margin-bottom: auto;
font-size: 17px; font-size: 15px;
color: rgba(188, 193, 200, 1); color: rgba(188, 193, 200, 1);
border: 1px solid #333; border: 1px solid #333;
background-color: rgba(0,0,0,0.3); background-color: rgba(0,0,0,0.3);
padding:6px; padding:5px;
border-radius: 10px; border-radius: 10px;
} }
#rm_button_create h2{ #rm_button_create h2{
margin-top: auto; margin-top: auto;
margin-bottom: auto; margin-bottom: auto;
font-size: 17px; font-size: 15px;
color: rgba(188, 193, 200, 1); color: rgba(188, 193, 200, 1);
border: 1px solid #333; border: 1px solid #333;
background-color: rgba(0,0,0,0.3); background-color: rgba(0,0,0,0.3);
padding:6px; padding:5px;
border-radius: 10px; border-radius: 10px;
} }
#characloud_url{ #characloud_url{
margin-right: 10px; margin-right: 0px;
margin-top:0; margin-top: 0;
float: right; float: right;
cursor: pointer; cursor: pointer;
border: 1px solid rgba(255,255,255,0.3); border: 1px solid rgba(255,255,255,0.3);
background-color: rgba(0,0,0,0.3); background-color: rgba(0,0,0,0.3);
border-radius: 10px; border-radius: 10px;
padding: 6px; padding: 5px;
opacity: 0.5; opacity: 0.5;
} }
@@ -746,14 +746,18 @@ display: none;
} }
#form_character_search_form { #form_character_search_form {
display: flex;
flex-direction: row;
align-items: center;
margin-bottom: 1rem; margin-bottom: 1rem;
margin-top: 1rem; margin-top: 1rem;
} }
#character_search_bar { #character_search_bar {
width: 90%; flex: 1;
font-size: 1.2em;
padding-left: 0.75em; padding-left: 0.75em;
margin-right: 0.5rem;
margin-bottom: 0;
} }
input[type=search]::-webkit-search-cancel-button { input[type=search]::-webkit-search-cancel-button {
@@ -937,9 +941,11 @@ width: 103px;
} }
.avatar_div{ .avatar_div{
margin-top: 16px; margin-top: 16px;
vertical-align: middle; vertical-align: middle;
align-items: center; display: grid;
grid-template-columns: min-content min-content;
align-items:center;
} }
.avatar_div .avatar{ .avatar_div .avatar{
margin-left: 4px; margin-left: 4px;
@@ -947,15 +953,16 @@ width: 103px;
display: inline-block; display: inline-block;
} }
#add_avatar_button{ .add_avatar_button_label{
display: inline-block; display: inline-block;
margin-left: 15px; margin-left: 15px;
font-size: 0.75rem; color: #666;
color: #666; background-color: rgba(0,0,0,0.3);
background-color: rgba(0,0,0,0.3); border: 1px solid rgba(255,255,255,0.5);
border: 1px solid rgba(0,0,0,0.7); padding: 5px;
border-radius: 5px; border-radius: 5px;
cursor:pointer; cursor: pointer;
height: min-content;
} }
#description_div{ #description_div{
margin-top: 6px; margin-top: 6px;
@@ -1924,7 +1931,7 @@ label.checkbox :checked + span:after {
#select_chat_popup{ #select_chat_popup{
display: block; display: block;
grid-template-rows: 50px 100px 100px auto 45px; grid-template-rows: 50px 100px 100px auto 45px;
max-width:450px; max-width:800px;
height: 440px; height: 440px;
position: absolute; position: absolute;
z-index: 2066; z-index: 2066;
@@ -1967,7 +1974,7 @@ label.checkbox :checked + span:after {
margin-top: 30px; margin-top: 30px;
overflow-x: hidden; overflow-x: hidden;
overflow-y: scroll; overflow-y: scroll;
max-width:430px;
height: 350px; height: 350px;
} }
#select_chat_div hr{ #select_chat_div hr{
@@ -1980,18 +1987,21 @@ label.checkbox :checked + span:after {
} }
.select_chat_block{ .select_chat_block{
border-radius: 5px; border-radius: 5px;
margin-right: 10px; margin-right: 10px;
cursor:pointer; margin-bottom: 10px;
border: 1px solid rgba(255,255,255,0.2);
padding: 5px;
display: grid; display: grid;
grid-template-columns: 60px auto; grid-template-columns: min-content auto;
grid-template-rows: 26px auto; grid-template-rows: auto auto;
grid-gap: 10px;
} }
.select_chat_block:hover { .select_chat_block:hover {
background-color: #ffffff07; background-color: rgba(255,255,255,0.2);
} }
.select_chat_block[highlight]{ .select_chat_block[highlight]{
background-color: #ffffff09;/* #c2b07a12; */ background-color: rgba(100,100,255,0.3);
} }
.select_chat_block .avatar{ .select_chat_block .avatar{
@@ -2008,8 +2018,8 @@ label.checkbox :checked + span:after {
} }
.select_chat_block .avatar { .select_chat_block .avatar {
height:30px; /*height:30px;
width:30px; width:30px;*/
} }
#advanced_div{ #advanced_div{
@@ -2412,7 +2422,7 @@ h2 {
.right_menu_button h2 { .right_menu_button h2 {
margin-top: 0; margin-top: 0;
margin-bottom: 0; margin-bottom: 0;
font-size: 1.5rem; font-size: 1.25rem;
} }
a { a {

68
server.js
View File

@@ -51,6 +51,24 @@ var response_getstatus_novel;
var response_getlastversion; var response_getlastversion;
var api_key_novel; var api_key_novel;
//RossAscends: Added function to format dates used in files and chat timestamps to a humanized format.
//Mostly I wanted this to be for file names, but couldn't figure out exactly where the filename save code was as everything seemed to be connected.
//During testing, this performs the same as previous date.now() structure.
//It also does not break old characters/chats, as the code just uses whatever timestamp exists in the chat.
//New chats made with characters will use this new formatting.
//Useable variable is (( humanizedISO8601Datetime ))
var baseDate = new Date(Date.now());
var humanYear = baseDate.getFullYear();
var humanMonth = (baseDate.getMonth()+1);
var humanDate = baseDate.getDate();
var humanHour = (baseDate.getHours() < 10? '0' : '') + baseDate.getHours();
var humanMinute = (baseDate.getMinutes() < 10? '0' : '') + baseDate.getMinutes();
var humanSecond = (baseDate.getSeconds() < 10? '0' : '') + baseDate.getSeconds();
var humanMillisecond = (baseDate.getMilliseconds() < 10? '0' : '') + baseDate.getMilliseconds();
var humanizedISO8601DateTime = (humanYear+"-"+humanMonth+"-"+humanDate+" @"+humanHour+"h "+humanMinute+"m "+humanSecond+"s "+humanMillisecond+"ms");
var is_colab = false; var is_colab = false;
var charactersPath = 'public/characters/'; var charactersPath = 'public/characters/';
var chatsPath = 'public/chats/'; var chatsPath = 'public/chats/';
@@ -270,6 +288,7 @@ app.post("/generate", jsonParser, function(request, response_generate = response
}); });
}); });
app.post("/savechat", jsonParser, function(request, response){ app.post("/savechat", jsonParser, function(request, response){
//console.log('/savechat/ entered');
//console.log(request.data); //console.log(request.data);
//console.log(request.body.bg); //console.log(request.body.bg);
//const data = request.body; //const data = request.body;
@@ -298,22 +317,23 @@ app.post("/getchat", jsonParser, function(request, response){
//console.log(request); //console.log(request);
//console.log(request.body.chat); //console.log(request.body.chat);
//var bg = "body {background-image: linear-gradient(rgba(19,21,44,0.75), rgba(19,21,44,0.75)), url(../backgrounds/"+request.body.bg+");}"; //var bg = "body {background-image: linear-gradient(rgba(19,21,44,0.75), rgba(19,21,44,0.75)), url(../backgrounds/"+request.body.bg+");}";
//console.log('/getchat entered');
var dir_name = String(request.body.avatar_url).replace('.png',''); var dir_name = String(request.body.avatar_url).replace('.png','');
fs.stat(chatsPath+dir_name, function(err, stat) { fs.stat(chatsPath+dir_name, function(err, stat) {
if(stat === undefined){ if(stat === undefined){ //if no chat dir for the character is found, make one with the character name
fs.mkdirSync(chatsPath+dir_name); fs.mkdirSync(chatsPath+dir_name);
response.send({}); response.send({});
return; return;
}else{ }else{
if(err === null){ if(err === null){ //if there is a dir, then read the requested file from the JSON call
fs.stat(chatsPath+dir_name+"/"+request.body.file_name+".jsonl", function(err, stat) { fs.stat(chatsPath+dir_name+"/"+request.body.file_name+".jsonl", function(err, stat) {
if (err === null) { if (err === null) { //if no error (the file exists), read the file
if(stat !== undefined){ if(stat !== undefined){
fs.readFile(chatsPath+dir_name+"/"+request.body.file_name+".jsonl", 'utf8', (err, data) => { fs.readFile(chatsPath+dir_name+"/"+request.body.file_name+".jsonl", 'utf8', (err, data) => {
@@ -328,7 +348,7 @@ app.post("/getchat", jsonParser, function(request, response){
// Iterate through the array of strings and parse each line as JSON // Iterate through the array of strings and parse each line as JSON
const jsonData = lines.map(JSON.parse); const jsonData = lines.map(JSON.parse);
response.send(jsonData); response.send(jsonData);
//console.log('read the requested file')
}); });
} }
@@ -342,6 +362,7 @@ app.post("/getchat", jsonParser, function(request, response){
console.error(err); console.error(err);
response.send({}); response.send({});
return; return;
} }
} }
@@ -635,7 +656,7 @@ app.post("/getcharacters", jsonParser, function(request, response){
//console.log(directories[0]); //console.log(directories[0]);
//characters = {}; //characters = {};
//character_i = 0; //character_i = 0;
//getCharaterFile(directories, response,0); //getCharacterFile(directories, response,0);
}); });
app.post("/getbackgrounds", jsonParser, function(request, response){ app.post("/getbackgrounds", jsonParser, function(request, response){
@@ -854,7 +875,7 @@ function readWorldInfoFile(worldInfoName) {
return worldInfo; return worldInfo;
} }
function getCharaterFile(directories,response,i){ //old need del function getCharacterFile(directories,response,i){ //old need del
if(directories.length > i){ if(directories.length > i){
fs.stat(charactersPath+directories[i]+'/'+directories[i]+".json", function(err, stat) { fs.stat(charactersPath+directories[i]+'/'+directories[i]+".json", function(err, stat) {
@@ -870,11 +891,11 @@ function getCharaterFile(directories,response,i){ //old need del
characters[character_i] = data; characters[character_i] = data;
i++; i++;
character_i++; character_i++;
getCharaterFile(directories,response,i); getCharacterFile(directories,response,i);
}); });
}else{ }else{
i++; i++;
getCharaterFile(directories,response,i); getCharacterFile(directories,response,i);
} }
}); });
@@ -993,7 +1014,7 @@ app.post("/generate_novelai", jsonParser, function(request, response_generate_no
}); });
}); });
app.post("/getallchatsofchatacter", jsonParser, function(request, response){ app.post("/getallchatsofcharacter", jsonParser, function(request, response){
if(!request.body) return response.sendStatus(400); if(!request.body) return response.sendStatus(400);
var char_dir = (request.body.avatar_url).replace('.png','') var char_dir = (request.body.avatar_url).replace('.png','')
@@ -1009,10 +1030,10 @@ app.post("/getallchatsofchatacter", jsonParser, function(request, response){
// sort the files by name // sort the files by name
//jsonFiles.sort().reverse(); //jsonFiles.sort().reverse();
// print the sorted file names // print the sorted file names
var chatData = {}; var chatData = {};
let ii = jsonFiles.length; let ii = jsonFiles.length; //this is the number of files belonging to the character
for(let i = jsonFiles.length-1; i >= 0; i--){ for(let i = jsonFiles.length-1; i >= 0; i--){
const file = jsonFiles[i]; const file = jsonFiles[i];
@@ -1023,11 +1044,9 @@ app.post("/getallchatsofchatacter", jsonParser, function(request, response){
}); });
let lastLine; let lastLine;
rl.on('line', (line) => { rl.on('line', (line) => {
lastLine = line; lastLine = line;
}); });
rl.on('close', () => { rl.on('close', () => {
if(lastLine){ if(lastLine){
let jsonData = JSON.parse(lastLine); let jsonData = JSON.parse(lastLine);
@@ -1161,7 +1180,7 @@ app.post("/importchat", urlencodedParser, function(request, response){
new_chat[i] = {}; new_chat[i] = {};
new_chat[0]['user_name'] = 'You'; new_chat[0]['user_name'] = 'You';
new_chat[0]['character_name'] = ch_name; new_chat[0]['character_name'] = ch_name;
new_chat[0]['create_date'] = Date.now(); new_chat[0]['create_date'] = Date.now() //Date.now();
i++; i++;
jsonData.histories.histories[0].msgs.forEach(function(item) { jsonData.histories.histories[0].msgs.forEach(function(item) {
new_chat[i] = {}; new_chat[i] = {};
@@ -1172,12 +1191,13 @@ app.post("/importchat", urlencodedParser, function(request, response){
} }
new_chat[i]['is_user'] = item.src.is_human; new_chat[i]['is_user'] = item.src.is_human;
new_chat[i]['is_name'] = true; new_chat[i]['is_name'] = true;
new_chat[i]['send_date'] = Date.now(); new_chat[i]['send_date'] = Date.now() //Date.now();
new_chat[i]['mes'] = item.text; new_chat[i]['mes'] = item.text;
i++; i++;
}); });
const chatJsonlData = new_chat.map(JSON.stringify).join('\n'); const chatJsonlData = new_chat.map(JSON.stringify).join('\n');
fs.writeFile(chatsPath+avatar_url+'/'+Date.now()+'.jsonl', chatJsonlData, 'utf8', function(err) { fs.writeFile(chatsPath+avatar_url+'/'+ch_name+' - '+humanizedISO8601DateTime+' imported.jsonl', chatJsonlData, 'utf8', function(err) { //added ch_name and replaced Date.now() with humanizedISO8601DateTime
if(err) { if(err) {
response.send(err); response.send(err);
return console.log(err); return console.log(err);
@@ -1206,7 +1226,7 @@ app.post("/importchat", urlencodedParser, function(request, response){
let jsonData = JSON.parse(line); let jsonData = JSON.parse(line);
if(jsonData.user_name !== undefined){ if(jsonData.user_name !== undefined){
fs.copyFile('./uploads/'+filedata.filename, chatsPath+avatar_url+'/'+Date.now()+'.jsonl', (err) => { fs.copyFile('./uploads/'+filedata.filename, chatsPath+avatar_url+'/'+ch_name+' - '+humanizedISO8601DateTime+'.jsonl', (err) => { //added character name and replaced Date.now() with humanizedISO8601DateTime
if(err) { if(err) {
response.send({error:true}); response.send({error:true});
return console.log(err); return console.log(err);
@@ -1486,7 +1506,7 @@ function convertStage1(){
charactersB = {}; charactersB = {};
character_ib = 0; character_ib = 0;
var folderForDel = {}; var folderForDel = {};
getCharaterFile2(directories, 0); getCharacterFile2(directories, 0);
} }
function convertStage2(){ function convertStage2(){
//directoriesB = JSON.parse(directoriesB); //directoriesB = JSON.parse(directoriesB);
@@ -1550,14 +1570,14 @@ function convertStage2(){
new_chat_data[ii]['name'] = char.name; new_chat_data[ii]['name'] = char.name;
new_chat_data[ii]['is_user'] = false; new_chat_data[ii]['is_user'] = false;
new_chat_data[ii]['is_name'] = is_name; new_chat_data[ii]['is_name'] = is_name;
new_chat_data[ii]['send_date'] = Date.now(); new_chat_data[ii]['send_date'] = Date.now(); //Date.now();
}else{ }else{
mes = mes.replace(this_chat_user_name+':',''); mes = mes.replace(this_chat_user_name+':','');
new_chat_data[ii]['name'] = 'You'; new_chat_data[ii]['name'] = 'You';
new_chat_data[ii]['is_user'] = true; new_chat_data[ii]['is_user'] = true;
new_chat_data[ii]['is_name'] = true; new_chat_data[ii]['is_name'] = true;
new_chat_data[ii]['send_date'] = Date.now(); new_chat_data[ii]['send_date'] = Date.now() //Date.now();
} }
new_chat_data[ii]['mes'] = mes.trim(); new_chat_data[ii]['mes'] = mes.trim();
@@ -1623,7 +1643,7 @@ function getDirectories2(path) {
}) })
.reverse(); .reverse();
} }
function getCharaterFile2(directories,i){ function getCharacterFile2(directories,i){
if(directories.length > i){ if(directories.length > i){
fs.stat('public/characters/'+directories[i]+'/'+directories[i]+".json", function(err, stat) { fs.stat('public/characters/'+directories[i]+'/'+directories[i]+".json", function(err, stat) {
if (err == null) { if (err == null) {
@@ -1640,11 +1660,11 @@ function getCharaterFile2(directories,i){
character_ib++; character_ib++;
} }
i++; i++;
getCharaterFile2(directories,i); getCharacterFile2(directories,i);
}); });
}else{ }else{
i++; i++;
getCharaterFile2(directories,i); getCharacterFile2(directories,i);
} }
}); });
}else{ }else{