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

Upload sprites as ZIP archive

Browse Source
This commit is contained in:
SillyLossy
2023-05-29 02:28:09 +03:00
parent 3b72be402e
commit 584394ded0
5 changed files with 222 additions and 36 deletions
Download Patch File Download Diff File Expand all files Collapse all files

80
public/scripts/extensions/expressions/index.js
View File

@ -348,6 +348,29 @@ function onClickExpressionImage() {
setExpression(name, expression, true);
}
}
async function handleFileUpload(url, formData) {
try {
const data = await jQuery.ajax({
type: "POST",
url: url,
data: formData,
beforeSend: function () { },
cache: false,
contentType: false,
processData: false,
});
// Refresh sprites list
const name = formData.get('name');
delete spriteCache[name];
await validateImages(name);
return data;
} catch (error) {
toastr.error('Failed to upload image');
}
}
async function onClickExpressionUpload(event) {
// Prevents the expression from being set
event.stopPropagation();
@ -367,23 +390,7 @@ async function onClickExpressionUpload(event) {
formData.append('label', id);
formData.append('avatar', file);
try {
await jQuery.ajax({
type: "POST",
url: "/upload_sprite",
data: formData,
beforeSend: function () { },
cache: false,
contentType: false,
processData: false,
});
// Refresh sprites list
delete spriteCache[name];
await validateImages(name);
} catch (error) {
toastr.error('Failed to upload image');
}
await handleFileUpload('/upload_sprite', formData);
// Reset the input
e.target.form.reset();
@ -395,6 +402,33 @@ async function onClickExpressionUpload(event) {
.trigger('click');
}
async function onClickExpressionUploadPackButton() {
const name = $('#image_list').data('name');
const handleFileUploadChange = async (e) => {
const file = e.target.files[0];
if (!file) {
return;
}
const formData = new FormData();
formData.append('name', name);
formData.append('avatar', file);
const { count } = await handleFileUpload('/upload_sprite_pack', formData);
toastr.success(`Uploaded ${count} image(s) for ${name}`);
// Reset the input
e.target.form.reset();
};
$('#expression_upload_pack')
.off('change')
.on('change', handleFileUploadChange)
.trigger('click');
}
async function onClickExpressionDelete(event) {
// Prevents the expression from being set
event.stopPropagation();
@ -446,16 +480,26 @@ async function onClickExpressionDelete(event) {
<div class="inline-drawer-content">
<p class="offline_mode">You are in offline mode. Click on the image below to set the expression.</p>
<div id="image_list"></div>
<div class="expression_buttons">
<div id="expression_upload_pack_button" class="menu_button">
<i class="fa-solid fa-file-zipper"></i>
<span>Upload sprite pack (ZIP)</span>
</div>
</div>
<p class="hint"><b>Hint:</b> <i>Create new folder in the <b>public/characters/</b> folder and name it as the name of the character.
Put images with expressions there. File names should follow the pattern: <tt>[expression_label].[image_format]</tt></i></p>
<label for="expressions_show_default"><input id="expressions_show_default" type="checkbox">Show default images (emojis) if missing</label>
</div>
</div>
<form><input type="file" id="expression_upload" name="expression_upload" accept="image/*" hidden></form>
<form>
<input type="file" id="expression_upload_pack" name="expression_upload_pack" accept="application/zip" hidden>
<input type="file" id="expression_upload" name="expression_upload" accept="image/*" hidden>
</form>
</div>
`;
$('#extensions_settings').append(html);
$('#expressions_show_default').on('input', onExpressionsShowDefaultInput);
$('#expression_upload_pack_button').on('click', onClickExpressionUploadPackButton);
$('#expressions_show_default').prop('checked', extension_settings.expressions.showDefault).trigger('input');
$(document).on('click', '.expression_list_item', onClickExpressionImage);
$(document).on('click', '.expression_list_upload', onClickExpressionUpload);