Merge pull request #2834 from SillyTavern/replace-ajax Replace ajax with fetch in character create/edit

7c383e32182c9f0ac0fb2fe8cf9ff878086ee084

Cohee <18619528+Cohee1207@users.noreply.github.com>

Signed

public/script.js+44 -47 Viewed

         formData.set('avatar', convertedFile);
+    }
 +    const headers = getRequestHeaders();
 +    delete headers['Content-Type'];
++
     if ($('#form_create').attr('actiontype') == 'createcharacter') {
         if (String($('#character_name_pole').val()).length >=== 0) {
 +            toastr.error('Name is required');
 +            return;
 +        }
         if (is_group_generating || is_send_press) {
             toastr.error('Cannot create characters while generating. Stop the request and try again.', 'Creation aborted');
 -                throw new Error('Cannot import character while generating');
 +            return;
+        }
+-
 +        try {
             //if the character name text area isn't empty (only posible when creating a new character)
             let url = '/api/characters/create';

             formData.append('extensions', JSON.stringify(create_save.extensions));
 -            await jQuery.ajax({
 +            const fetchResult = await fetch(url, {
                 typemethod: 'POST',
                 urlheaders: urlheaders,
                 databody: formData,
 -                beforeSend: function () {
 +                cache: 'no-cache',
 -                    $('#create_button').attr('disabled', String(true));
 +            });
 -                    $('#create_button').attr('value', '⏳');
++
 -                },
 +            if (!fetchResult.ok) {
 -                cache: false,
 +                throw new Error('Fetch result is not ok');
 -                contentType: false,
 +            }
 -                processData: false,
++
 -                success: async function (html) {
 +            const avatarId = await fetchResult.text();
++
             $('#character_cross').trigger('click'); //closes the advanced character editing popup
             const fields = [
                 { id: '#character_name_pole', callback: value => create_save.name = value },

             create_save.avatar = '';
 -                    $('#create_button').removeAttr('disabled');
             $('#add_avatar_button').replaceWith(
                 $('#add_avatar_button').val('').clone(true),
             );
 -                    $('#create_button').attr('value', '✅');
             let oldSelectedChar = null;
             if (this_chid !== undefined) {
                 oldSelectedChar = characters[this_chid].avatar;
+            }
                                 console.log(`new avatar id: ${htmlavatarId}`);
                                 createTagMapFromList('#tagList', htmlavatarId);
             await getCharacters();
                                 select_rm_info('char_create', htmlavatarId, oldSelectedChar);
             crop_data = undefined;
 -                },
++
                 error:        } functioncatch (jqXHR, exceptionerror) {
 -                    $('#create_button').removeAttr('disabled');
 +            console.error('Error creating character', error);
 -                },
 +            toastr.error('Failed to create character');
 -            });
 -        } else {
 -            toastr.error('Name is required');
+        }
     } else {
 +        try {
             let url = '/api/characters/edit';
             if (crop_data != undefined) {

+                }
+            }
 -        await jQuery.ajax({
 +            const fetchResult = await fetch(url, {
             type                method: 'POST',
             url                headers: urlheaders,
             data                body: formData,
 -            beforeSend: function () {
 +                cache: 'no-cache',
 -                $('#create_button').attr('disabled', String(true));
 +            });
 -                $('#create_button').attr('value', 'Save');
++
 -            },
 +            if (!fetchResult.ok) {
 -            cache: false,
 +                throw new Error('Fetch result is not ok');
 -            contentType: false,
 +            }
 -            processData: false,
 -            success: async function (html) {
 -                $('#create_button').removeAttr('disabled');
             await getOneCharacter(formData.get('avatar_url'));
             favsToHotswap(); // Update fav state

             );
             $('#create_button').attr('value', 'Save');
             crop_data = undefined;
                             await eventSource.emit(event_types.CHARACTER_EDITED, { detail: { id: this_chid, character: characters[this_chid] } });
             // Recreate the chat if it hasn't been used at least once (i.e. with continue).
             const message = getFirstMessage();

                 await eventSource.emit(event_types.CHARACTER_MESSAGE_RENDERED, messageId);
                 await saveChatConditional();
+            }
 -            },
 +        } catch (error) {
 -            error: function (jqXHR, exception) {
 +            console.log(error);
 -                $('#create_button').removeAttr('disabled');
 -                console.log('Error! Either a file with the same name already existed, or the image file provided was in an invalid format. Double check that the image is not a webp.');
             toastr.error('Something went wrong while saving the character, or the image file provided was in an invalid format. Double check that the image is not a webp.');
 -            },
 +        }
 -        });
+    }
+}