mirror of
https://github.com/SillyTavern/SillyTavern.git
synced 2025-06-05 21:59:27 +02:00
Advanced edit (partial)
This commit is contained in:
SillyLossy
1
public/img/check-solid.svg
Normal file
1
public/img/check-solid.svg
Normal file
@ -0,0 +1 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 448 512"><!--! Font Awesome Pro 6.4.0 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license (Commercial License) Copyright 2023 Fonticons, Inc. --><path d="M438.6 105.4c12.5 12.5 12.5 32.8 0 45.3l-256 256c-12.5 12.5-32.8 12.5-45.3 0l-128-128c-12.5-12.5-12.5-32.8 0-45.3s32.8-12.5 45.3 0L160 338.7 393.4 105.4c12.5-12.5 32.8-12.5 45.3 0z"/></svg>
|
||||
|
After Width: | Height: | Size: 428 B |
1
public/img/chevron-down-solid.svg
Normal file
1
public/img/chevron-down-solid.svg
Normal file
@ -0,0 +1 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512"><!--! Font Awesome Pro 6.4.0 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license (Commercial License) Copyright 2023 Fonticons, Inc. --><path d="M233.4 406.6c12.5 12.5 32.8 12.5 45.3 0l192-192c12.5-12.5 12.5-32.8 0-45.3s-32.8-12.5-45.3 0L256 338.7 86.6 169.4c-12.5-12.5-32.8-12.5-45.3 0s-12.5 32.8 0 45.3l192 192z"/></svg>
|
||||
|
After Width: | Height: | Size: 416 B |
1
public/img/chevron-up-solid.svg
Normal file
1
public/img/chevron-up-solid.svg
Normal file
@ -0,0 +1 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512"><!--! Font Awesome Pro 6.4.0 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license (Commercial License) Copyright 2023 Fonticons, Inc. --><path d="M233.4 105.4c12.5-12.5 32.8-12.5 45.3 0l192 192c12.5 12.5 12.5 32.8 0 45.3s-32.8 12.5-45.3 0L256 173.3 86.6 342.6c-12.5 12.5-32.8 12.5-45.3 0s-12.5-32.8 0-45.3l192-192z"/></svg>
|
||||
|
After Width: | Height: | Size: 416 B |
1
public/img/copy-solid.svg
Normal file
1
public/img/copy-solid.svg
Normal file
@ -0,0 +1 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512"><!--! Font Awesome Pro 6.4.0 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license (Commercial License) Copyright 2023 Fonticons, Inc. --><path d="M272 0H396.1c12.7 0 24.9 5.1 33.9 14.1l67.9 67.9c9 9 14.1 21.2 14.1 33.9V336c0 26.5-21.5 48-48 48H272c-26.5 0-48-21.5-48-48V48c0-26.5 21.5-48 48-48zM48 128H192v64H64V448H256V416h64v48c0 26.5-21.5 48-48 48H48c-26.5 0-48-21.5-48-48V176c0-26.5 21.5-48 48-48z"/></svg>
|
||||
|
After Width: | Height: | Size: 503 B |
1
public/img/scissors-solid.svg
Normal file
1
public/img/scissors-solid.svg
Normal file
@ -0,0 +1 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512"><!--! Font Awesome Pro 6.4.0 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license (Commercial License) Copyright 2023 Fonticons, Inc. --><path d="M256 192l-39.5-39.5c4.9-12.6 7.5-26.2 7.5-40.5C224 50.1 173.9 0 112 0S0 50.1 0 112s50.1 112 112 112c14.3 0 27.9-2.7 40.5-7.5L192 256l-39.5 39.5c-12.6-4.9-26.2-7.5-40.5-7.5C50.1 288 0 338.1 0 400s50.1 112 112 112s112-50.1 112-112c0-14.3-2.7-27.9-7.5-40.5L499.2 76.8c7.1-7.1 7.1-18.5 0-25.6c-28.3-28.3-74.1-28.3-102.4 0L256 192zm22.6 150.6L396.8 460.8c28.3 28.3 74.1 28.3 102.4 0c7.1-7.1 7.1-18.5 0-25.6L342.6 278.6l-64 64zM64 112a48 48 0 1 1 96 0 48 48 0 1 1 -96 0zm48 240a48 48 0 1 1 0 96 48 48 0 1 1 0-96z"/></svg>
|
||||
|
After Width: | Height: | Size: 754 B |
1
public/img/xmark-solid.svg
Normal file
1
public/img/xmark-solid.svg
Normal file
@ -0,0 +1 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 384 512"><!--! Font Awesome Pro 6.4.0 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license (Commercial License) Copyright 2023 Fonticons, Inc. --><path d="M342.6 150.6c12.5-12.5 12.5-32.8 0-45.3s-32.8-12.5-45.3 0L192 210.7 86.6 105.4c-12.5-12.5-32.8-12.5-45.3 0s-12.5 32.8 0 45.3L146.7 256 41.4 361.4c-12.5 12.5-12.5 32.8 0 45.3s32.8 12.5 45.3 0L192 301.3 297.4 406.6c12.5 12.5 32.8 12.5 45.3 0s12.5-32.8 0-45.3L237.3 256 342.6 150.6z"/></svg>
|
||||
|
After Width: | Height: | Size: 527 B |
@ -1271,8 +1271,26 @@
|
||||
<span class="name_text">${characterName}</span>
|
||||
|
||||
<div title="Edit" class="mes_edit"></div>
|
||||
<div class="mes_edit_cancel menu_button">CANCEL</div><!-- <img src=img/cancel.png></div> -->
|
||||
<div class="mes_edit_done menu_button">CONFIRM</div><!-- <img src=img/done.png></div> -->
|
||||
<div class="mes_edit_buttons">
|
||||
<div class="mes_edit_done menu_button" title="Confirm">
|
||||
<img alt="" class="svg_icon" src="img/check-solid.svg">
|
||||
</div>
|
||||
<div class="mes_edit_copy menu_button" title="Copy this message">
|
||||
<img alt="" class="svg_icon" src="img/copy-solid.svg">
|
||||
</div>
|
||||
<div class="mes_edit_delete menu_button" title="Delete this message">
|
||||
<img alt="" class="svg_icon" src="img/scissors-solid.svg">
|
||||
</div>
|
||||
<div class="mes_edit_up menu_button" title="Move message up">
|
||||
<img alt="" class="svg_icon" src="img/chevron-up-solid.svg">
|
||||
</div>
|
||||
<div class="mes_edit_down menu_button" title="Move message down">
|
||||
<img alt="" class="svg_icon" src="img/chevron-down-solid.svg">
|
||||
</div>
|
||||
<div class="mes_edit_cancel menu_button" title="Cancel">
|
||||
<img alt="" class="svg_icon" src="img/xmark-solid.svg">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class=mes_text></div>
|
||||
<div class="mes_bias"></div>
|
||||
|
||||
153
public/script.js
153
public/script.js
@ -811,7 +811,7 @@ function appendImageToMessage(mes, messageElement) {
|
||||
}
|
||||
}
|
||||
|
||||
function addOneMessage(mes, type = "normal") {
|
||||
function addOneMessage(mes, type = "normal", insertAfter = null) {
|
||||
|
||||
var messageText = mes["mes"];
|
||||
var characterName = name1;
|
||||
@ -851,7 +851,15 @@ function addOneMessage(mes, type = "normal") {
|
||||
var HTMLForEachMes = getMessageFromTemplate(count_view_mes, characterName, mes.is_user, avatarImg, bias, isSystem);
|
||||
|
||||
if (type !== 'swipe') {
|
||||
$("#chat").append(HTMLForEachMes);
|
||||
if (!insertAfter) {
|
||||
$("#chat").append(HTMLForEachMes);
|
||||
}
|
||||
else {
|
||||
const target = $("#chat").find(`.mes[mesid="${insertAfter}"]`);
|
||||
$(HTMLForEachMes).insertAfter(target);
|
||||
$(HTMLForEachMes).find('.swipe_left').css('display', 'none');
|
||||
$(HTMLForEachMes).find('.swipe_right').css('display', 'none');
|
||||
}
|
||||
}
|
||||
|
||||
const newMessage = $(`#chat [mesid="${count_view_mes}"]`);
|
||||
@ -878,16 +886,18 @@ function addOneMessage(mes, type = "normal") {
|
||||
count_view_mes++;
|
||||
|
||||
}
|
||||
$('#chat .mes').last().addClass('last_mes');
|
||||
$('#chat .mes').eq(-2).removeClass('last_mes');
|
||||
|
||||
hideSwipeButtons();
|
||||
showSwipeButtons();
|
||||
// Don't scroll if not inserting last
|
||||
if (!insertAfter) {
|
||||
$('#chat .mes').last().addClass('last_mes');
|
||||
$('#chat .mes').eq(-2).removeClass('last_mes');
|
||||
|
||||
// TODO: figure out smooth scrolling that wouldn't hit performance much.
|
||||
var $textchat = $("#chat");
|
||||
$textchat.scrollTop(($textchat[0].scrollHeight));
|
||||
//$('#chat .mes').last().get(0).scrollIntoView({ behavior: "smooth" });
|
||||
hideSwipeButtons();
|
||||
showSwipeButtons();
|
||||
|
||||
var $textchat = $("#chat");
|
||||
$textchat.scrollTop(($textchat[0].scrollHeight));
|
||||
}
|
||||
}
|
||||
|
||||
function substituteParams(content) {
|
||||
@ -2344,14 +2354,8 @@ function isInt(value) {
|
||||
}
|
||||
|
||||
function messageEditDone(div) {
|
||||
var text = div
|
||||
.parent()
|
||||
.parent()
|
||||
.children(".mes_text")
|
||||
.children(".edit_textarea")
|
||||
.val();
|
||||
//var text = chat[this_edit_mes_id];
|
||||
text = text.trim();
|
||||
let mesBlock = div.closest(".mes_block");
|
||||
var text = mesBlock.find(".edit_textarea").val().trim();
|
||||
const bias = extractMessageBias(text);
|
||||
chat[this_edit_mes_id]["mes"] = text;
|
||||
|
||||
@ -2362,17 +2366,12 @@ function messageEditDone(div) {
|
||||
|
||||
chat[this_edit_mes_id]["extra"]["bias"] = bias ?? null;
|
||||
|
||||
div.parent().parent().children(".mes_text").empty();
|
||||
div.css("display", "none");
|
||||
div.parent().children(".mes_edit_cancel").css("display", "none");
|
||||
div.parent().children(".mes_edit").css("display", "inline-block");
|
||||
div
|
||||
.parent()
|
||||
.parent()
|
||||
.children(".mes_text")
|
||||
.append(messageFormating(text, this_edit_mes_chname));
|
||||
div.parent().parent().children(".mes_bias").empty();
|
||||
div.parent().parent().children(".mes_bias").append(messageFormating(bias));
|
||||
mesBlock.find(".mes_text").empty();
|
||||
mesBlock.find(".mes_edit_buttons").css("display", "none");
|
||||
mesBlock.find(".mes_edit").css("display", "inline-block");
|
||||
mesBlock.find(".mes_text").append(messageFormating(text, this_edit_mes_chname));
|
||||
mesBlock.find(".mes_bias").empty();
|
||||
mesBlock.find(".mes_bias").append(messageFormating(bias));
|
||||
appendImageToMessage(chat[this_edit_mes_id], div.closest(".mes"));
|
||||
this_edit_mes_id = undefined;
|
||||
if (selected_group) {
|
||||
@ -3968,9 +3967,8 @@ $(document).ready(function () {
|
||||
let mes_edited = $("#chat")
|
||||
.children()
|
||||
.filter('[mesid="' + this_edit_mes_id + '"]')
|
||||
.children(".mes_block")
|
||||
.children(".ch_name")
|
||||
.children(".mes_edit_done");
|
||||
.find(".mes_block")
|
||||
.find(".mes_edit_done");
|
||||
if (edit_mes_id == count_view_mes - 1) { //if the generating swipe (...)
|
||||
if (chat[edit_mes_id]['swipe_id'] !== undefined) {
|
||||
if (chat[edit_mes_id]['swipes'].length === chat[edit_mes_id]['swipe_id']) {
|
||||
@ -3983,11 +3981,10 @@ $(document).ready(function () {
|
||||
}
|
||||
messageEditDone(mes_edited);
|
||||
}
|
||||
$(this).parent().parent().children(".mes_text").empty();
|
||||
$(this).closest(".mes_block").find(".mes_text").empty();
|
||||
$(this).css("display", "none");
|
||||
$(this).parent().children(".mes_edit_done").css("display", "inline-block");
|
||||
$(this).parent().children(".mes_edit_cancel").css("display", "inline-block");
|
||||
var edit_mes_id = $(this).parent().parent().parent().attr("mesid");
|
||||
$(this).closest(".mes_block").find(".mes_edit_buttons").css("display", "inline-flex");
|
||||
var edit_mes_id = $(this).closest(".mes").attr("mesid");
|
||||
this_edit_mes_id = edit_mes_id;
|
||||
|
||||
var text = chat[edit_mes_id]["mes"];
|
||||
@ -4000,19 +3997,16 @@ $(document).ready(function () {
|
||||
}
|
||||
text = text.trim();
|
||||
$(this)
|
||||
.parent()
|
||||
.parent()
|
||||
.children(".mes_text")
|
||||
.closest(".mes_block")
|
||||
.find(".mes_text")
|
||||
.append(
|
||||
'<textarea class=edit_textarea style="max-width:auto; ">' +
|
||||
text +
|
||||
"</textarea>"
|
||||
);
|
||||
let edit_textarea = $(this)
|
||||
.parent()
|
||||
.parent()
|
||||
.children(".mes_text")
|
||||
.children(".edit_textarea");
|
||||
.closest(".mes_block")
|
||||
.find(".edit_textarea");
|
||||
edit_textarea.height(0);
|
||||
edit_textarea.height(edit_textarea[0].scrollHeight);
|
||||
edit_textarea.focus();
|
||||
@ -4028,18 +4022,60 @@ $(document).ready(function () {
|
||||
$(document).on("click", ".mes_edit_cancel", function () {
|
||||
let text = chat[this_edit_mes_id]["mes"];
|
||||
|
||||
$(this).parent().parent().children(".mes_text").empty();
|
||||
$(this).css("display", "none");
|
||||
$(this).parent().children(".mes_edit_done").css("display", "none");
|
||||
$(this).parent().children(".mes_edit").css("display", "inline-block");
|
||||
$(this).closest(".mes_block").find(".mes_text").empty();
|
||||
$(this).closest(".mes_edit_buttons").css("display", "none");
|
||||
$(this).closest(".mes_block").find(".mes_edit").css("display", "inline-block");
|
||||
$(this)
|
||||
.parent()
|
||||
.parent()
|
||||
.children(".mes_text")
|
||||
.closest(".mes_block")
|
||||
.find(".mes_text")
|
||||
.append(messageFormating(text, this_edit_mes_chname));
|
||||
appendImageToMessage(chat[this_edit_mes_id], $(this).closest(".mes"));
|
||||
this_edit_mes_id = undefined;
|
||||
});
|
||||
|
||||
$(document).on("click", ".mes_edit_copy", function () {
|
||||
if (!confirm('Create a copy of this message?')) {
|
||||
return;
|
||||
}
|
||||
|
||||
hideSwipeButtons();
|
||||
let oldScroll = $('#chat')[0].scrollTop;
|
||||
const clone = JSON.parse(JSON.stringify(chat[this_edit_mes_id])); // quick and dirty clone
|
||||
clone.send_date = Date.now();
|
||||
clone.mes = $(this).closest(".mes").find('.edit_textarea').val().trim();
|
||||
|
||||
chat.splice(Number(this_edit_mes_id) + 1, 0, clone);
|
||||
addOneMessage(clone, 'normal', this_edit_mes_id);
|
||||
|
||||
updateViewMessageIds();
|
||||
saveChatConditional();
|
||||
$('#chat')[0].scrollTop = oldScroll;
|
||||
showSwipeButtons();
|
||||
});
|
||||
|
||||
$(document).on("click", ".mes_edit_delete", function () {
|
||||
if (!confirm("Are you sure you want to delete this message?")) {
|
||||
return;
|
||||
}
|
||||
|
||||
const mes = $(this).closest(".mes");
|
||||
|
||||
if (!mes) {
|
||||
return;
|
||||
}
|
||||
|
||||
chat.splice(this_edit_mes_id, 1);
|
||||
this_edit_mes_id = undefined;
|
||||
mes.remove();
|
||||
count_view_mes--;
|
||||
|
||||
updateViewMessageIds();
|
||||
saveChatConditional();
|
||||
|
||||
hideSwipeButtons();
|
||||
showSwipeButtons();
|
||||
});
|
||||
|
||||
$(document).on("click", ".mes_edit_done", function () {
|
||||
messageEditDone($(this));
|
||||
});
|
||||
@ -4264,3 +4300,20 @@ $(document).ready(function () {
|
||||
$(this).closest('.inline-drawer').find('.inline-drawer-content').slideToggle();
|
||||
});
|
||||
})
|
||||
function saveChatConditional() {
|
||||
if (selected_group) {
|
||||
saveGroupChat();
|
||||
}
|
||||
else {
|
||||
saveChat();
|
||||
}
|
||||
}
|
||||
|
||||
function updateViewMessageIds() {
|
||||
$('#chat').find(".mes").each(function (index, element) {
|
||||
$(element).attr("mesid", index);
|
||||
});
|
||||
|
||||
$('#chat .mes').removeClass('last_mes');
|
||||
$('#chat .mes').last().addClass('last_mes');
|
||||
}
|
||||
|
||||
@ -1741,26 +1741,32 @@ input[type="range"]{
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
.last_mes .mes_edit, .last_mes .mes_edit_done, .last_mes .mes_edit_cancel {
|
||||
grid-row-start: 1;
|
||||
position: relative;
|
||||
right: -30px;
|
||||
.last_mes .mes_edit, .last_mes .mes_edit_buttons {
|
||||
grid-row-start: 1;
|
||||
position: relative;
|
||||
right: -30px;
|
||||
}
|
||||
|
||||
.mes_edit_done, .mes_edit_cancel {
|
||||
.mes_edit_buttons {
|
||||
display: none;
|
||||
flex-direction: row;
|
||||
column-gap: 10px;
|
||||
float: right;
|
||||
cursor: pointer;
|
||||
margin-right: 10px;
|
||||
padding-bottom: 5px;
|
||||
filter: drop-shadow(0px 0px 2px black);
|
||||
transition: 0.3s ease-in-out;
|
||||
}
|
||||
|
||||
.mes_edit_cancel {
|
||||
margin-right: 0px;
|
||||
.mes_edit_buttons .menu_button .svg_icon {
|
||||
height: 18px;
|
||||
width: 18px;
|
||||
margin: 2px;
|
||||
filter: invert(1);
|
||||
}
|
||||
|
||||
.mes_edit_cancel.menu_button, .mes_edit_done.menu_button{
|
||||
|
||||
.mes_edit_buttons .menu_button {
|
||||
opacity: 0.5;
|
||||
padding: 5px;
|
||||
margin-top: 0;
|
||||
@ -1770,7 +1776,7 @@ right: -30px;
|
||||
.mes_edit_cancel.menu_button{background-color: var(--crimson70a);}
|
||||
.mes_edit_done.menu_button{background-color: var(--okGreen70a);}
|
||||
|
||||
.mes_edit_cancel.menu_button:hover, .mes_edit_done.menu_button:hover{
|
||||
.mes_edit_buttons .menu_button:hover {
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
|
||||
Reference in New Issue
Block a user