mirror of
https://github.com/SillyTavern/SillyTavern.git
synced 2025-01-05 13:36:47 +01:00
live2d addition
This commit is contained in:
parent
6b85f10818
commit
0eef05908d
@ -9,6 +9,7 @@ const MODULE_NAME = 'expressions';
|
||||
const UPDATE_INTERVAL = 2000;
|
||||
const FALLBACK_EXPRESSION = 'joy';
|
||||
const DEFAULT_EXPRESSIONS = [
|
||||
"live2d",
|
||||
"admiration",
|
||||
"amusement",
|
||||
"anger",
|
||||
@ -44,6 +45,9 @@ let lastCharacter = undefined;
|
||||
let lastMessage = null;
|
||||
let spriteCache = {};
|
||||
let inApiCall = false;
|
||||
let live2d_var = false;
|
||||
let previousSrc = null;
|
||||
|
||||
|
||||
function isVisualNovelMode() {
|
||||
return Boolean(!isMobile() && power_user.waifuMode && getContext().groupId);
|
||||
@ -392,6 +396,68 @@ function onExpressionsShowDefaultInput() {
|
||||
}
|
||||
}
|
||||
|
||||
function loadLiveChar(value_name) {
|
||||
const extensionsUrlInput = document.getElementById("extensions_url");
|
||||
|
||||
// Extract the value of the input element
|
||||
const baseUrl = extensionsUrlInput.value;
|
||||
|
||||
// Construct the full URL with the loadchar parameter
|
||||
let url = `${baseUrl}/api/live2d/load?loadchar=http://localhost:8000/characters/${value_name}`;
|
||||
console.log(url);
|
||||
|
||||
fetch(url, {
|
||||
method: 'GET',
|
||||
headers: {
|
||||
'Content-Type': 'application/x-www-form-urlencoded',
|
||||
},
|
||||
})
|
||||
.then(response => response.text())
|
||||
.then(data => console.log(data))
|
||||
.catch((error) => console.error('Error:', error));
|
||||
}
|
||||
|
||||
|
||||
function handleImageChange(isChecked) {
|
||||
const imgElement = document.querySelector('img#expression-image.expression');
|
||||
|
||||
if (!imgElement) {
|
||||
console.log("Cannot find addExpressionImage()");
|
||||
return;
|
||||
}
|
||||
|
||||
if (isChecked) {
|
||||
// Method get IP of endpoint
|
||||
const extensionsUrlInput = document.getElementById("extensions_url");
|
||||
const value = extensionsUrlInput.value;
|
||||
//const newValue = value.replace(/:\d+$/, ":5555");
|
||||
console.log(value);
|
||||
|
||||
if (imgElement.src !== value + '/api/live2d/result_feed') {
|
||||
const expressionListItemElement = document.querySelector('#live2d');
|
||||
const expressionImageElement = expressionListItemElement.querySelector('.expression_list_image');
|
||||
const newSrc = expressionImageElement.src;
|
||||
|
||||
fetch(newSrc, {
|
||||
method: 'HEAD'
|
||||
})
|
||||
.then(response => {
|
||||
if (response.ok) {
|
||||
imgElement.src = value + '/api/live2d/result_feed';
|
||||
}
|
||||
})
|
||||
.catch(error => {
|
||||
console.error(error); // Log the error if necessary
|
||||
});
|
||||
} else if (previousSrc) {
|
||||
imgElement.src = previousSrc; // Revert the src to its previous value
|
||||
}
|
||||
} else if (previousSrc !== null) {
|
||||
imgElement.src = previousSrc; // Revert the src to its previous value
|
||||
}
|
||||
live2d_var = isChecked;
|
||||
}
|
||||
|
||||
async function moduleWorker() {
|
||||
const context = getContext();
|
||||
|
||||
@ -405,6 +471,24 @@ async function moduleWorker() {
|
||||
if (context.groupId !== lastCharacter && context.characterId !== lastCharacter) {
|
||||
removeExpression();
|
||||
spriteCache = {};
|
||||
|
||||
previousSrc = null;
|
||||
|
||||
//uncheck live image
|
||||
let checkbox = document.getElementById('image_type_toggle');
|
||||
if (checkbox.checked) {
|
||||
checkbox.click();
|
||||
}
|
||||
|
||||
//clear expression
|
||||
let imgElement = document.getElementById('expression-image');
|
||||
imgElement.src = "";
|
||||
|
||||
//change live character
|
||||
let inputElement = document.querySelector('input[name="avatar_url"]'); // get char name
|
||||
let value_name = inputElement.value;
|
||||
loadLiveChar(value_name);
|
||||
|
||||
}
|
||||
|
||||
const vnMode = isVisualNovelMode();
|
||||
@ -654,7 +738,6 @@ async function getSpritesList(name) {
|
||||
|
||||
try {
|
||||
const result = await fetch(`/get_sprites?name=${encodeURIComponent(name)}`);
|
||||
|
||||
let sprites = result.ok ? (await result.json()) : [];
|
||||
return sprites;
|
||||
}
|
||||
@ -697,6 +780,8 @@ async function getExpressionsList() {
|
||||
}
|
||||
|
||||
async function setExpression(character, expression, force) {
|
||||
if (live2d_var == false) {
|
||||
|
||||
console.debug('entered setExpressions');
|
||||
await validateImages(character);
|
||||
const img = $('img.expression');
|
||||
@ -725,8 +810,8 @@ async function setExpression(character, expression, force) {
|
||||
}
|
||||
}
|
||||
}
|
||||
//only swap expressions when necessary
|
||||
if (prevExpressionSrc !== sprite.path
|
||||
//only swap expressions when necessary
|
||||
if (prevExpressionSrc !== sprite.path
|
||||
&& !img.hasClass('expression-animating')) {
|
||||
//clone expression
|
||||
expressionClone.addClass('expression-clone')
|
||||
@ -789,23 +874,32 @@ async function setExpression(character, expression, force) {
|
||||
setDefault();
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
} else {
|
||||
if (extension_settings.expressions.showDefault) {
|
||||
setDefault();
|
||||
} else {
|
||||
if (extension_settings.expressions.showDefault) {
|
||||
setDefault();
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
function setDefault() {
|
||||
console.debug('setting default');
|
||||
const defImgUrl = `/img/default-expressions/${expression}.png`;
|
||||
console.log(defImgUrl);
|
||||
//console.log(defImgUrl);
|
||||
img.attr('src', defImgUrl);
|
||||
img.addClass('default');
|
||||
}
|
||||
document.getElementById("expression-holder").style.display = '';
|
||||
}
|
||||
|
||||
if (live2d_var == true) {
|
||||
// Find the <img> element with id="expression-image" and class="expression"
|
||||
const imgElement = document.querySelector('img#expression-image.expression');
|
||||
//console.log("searching");
|
||||
if (imgElement) {
|
||||
console.log("setting value");
|
||||
imgElement.src = 'http://127.0.0.1:5555/result_feed';
|
||||
}}
|
||||
}
|
||||
}
|
||||
|
||||
function onClickExpressionImage() {
|
||||
// online mode doesn't need force set
|
||||
@ -1052,7 +1146,6 @@ function setExpressionOverrideHtml(forceClear = false) {
|
||||
$('body').append(element);
|
||||
}
|
||||
function addSettings() {
|
||||
|
||||
const html = `
|
||||
<div class="expression_settings">
|
||||
<div class="inline-drawer">
|
||||
@ -1060,8 +1153,16 @@ function setExpressionOverrideHtml(forceClear = false) {
|
||||
<b>Character Expressions</b>
|
||||
<div class="inline-drawer-icon fa-solid fa-circle-chevron-down down"></div>
|
||||
</div>
|
||||
|
||||
<div class="inline-drawer-content">
|
||||
<div class="offline_mode">
|
||||
<!-- Toggle button for aituber/static images -->
|
||||
<div class="toggle_button">
|
||||
<label class="switch">
|
||||
<input id="image_type_toggle" type="checkbox">
|
||||
<span class="slider round"></span>
|
||||
<label for="image_type_toggle">Image Type - Live2d (extras)</label>
|
||||
</div>
|
||||
<div class="offline_mode">
|
||||
<small>You are in offline mode. Click on the image below to set the expression.</small>
|
||||
</div>
|
||||
<div class="flex-container flexnowrap">
|
||||
@ -1090,6 +1191,7 @@ function setExpressionOverrideHtml(forceClear = false) {
|
||||
</form>
|
||||
</div>
|
||||
`;
|
||||
|
||||
$('#extensions_settings').append(html);
|
||||
$('#expression_override_button').on('click', onClickExpressionOverrideButton);
|
||||
$('#expressions_show_default').on('input', onExpressionsShowDefaultInput);
|
||||
@ -1105,7 +1207,19 @@ function setExpressionOverrideHtml(forceClear = false) {
|
||||
$(document).on('click', '.expression_list_delete', onClickExpressionDelete);
|
||||
$(window).on("resize", updateVisualNovelModeDebounced);
|
||||
$('.expression_settings').hide();
|
||||
|
||||
|
||||
$('#image_type_toggle').on('change', function() {
|
||||
const isChecked = this.checked;
|
||||
const inputElement = document.querySelector('input[name="avatar_url"]');
|
||||
const value_name = inputElement ? inputElement.value : '';
|
||||
if (isChecked) {
|
||||
loadLiveChar(value_name);
|
||||
}
|
||||
handleImageChange(isChecked);
|
||||
});
|
||||
}
|
||||
|
||||
|
||||
addExpressionImage();
|
||||
addVisualNovelMode();
|
||||
@ -1116,6 +1230,7 @@ function setExpressionOverrideHtml(forceClear = false) {
|
||||
moduleWorker();
|
||||
dragElement($("#expression-holder"))
|
||||
eventSource.on(event_types.CHAT_CHANGED, () => {
|
||||
console.log("checked: " + live2d_var);
|
||||
setExpressionOverrideHtml();
|
||||
|
||||
if (isVisualNovelMode()) {
|
||||
|
Loading…
Reference in New Issue
Block a user