Refactored `mes_edit_up` and `mes_edit_down` into `messageEditMove`. (#4704) * Refactored `mes_edit_up` and `mes_edit_down` into `messageEditMove`. * Fixed: https://github.com/SillyTavern/SillyTavern/pull/4704#pullrequestreview-3385227819 * Fixed https://github.com/SillyTavern/SillyTavern/pull/4704#pullrequestreview-3385647876 and refactored `updateEditArrowClasses`. * Update this_edit_mes_id in messageEditMove * Don't set this_edit_mes_id if unset --------- Co-authored-by: user <user@exmaple.com> Co-authored-by: Cohee <18619528+Cohee1207@users.noreply.github.com>
Signed| @@ -7389,6 +7389,55 @@ async function messageEditCancel(messageId = this_edit_mes_id) { | |||
| 7389 | showSwipeButtons(); | 7389 | showSwipeButtons(); |
| 7390 | } | 7390 | } |
| 7391 | 7391 | ||
| 7392 | /** | ||
| 7393 | * Swaps chat[sourceId] with chat[targetId]. They must be adjacent. | ||
| 7394 | * @param {number} sourceId Index of the message to move | ||
| 7395 | * @param {number} targetId Index of the target message | ||
| 7396 | * @returns {Promise<boolean>} True if the messages were moved, false otherwise | ||
| 7397 | */ | ||
| 7398 | async function messageEditMove(sourceId, targetId) { | ||
| 7399 | if (is_send_press) { | ||
| 7400 | console.warn(`The message #${sourceId} was not moved to #${targetId} because a generation is in progress.`); | ||
| 7401 | return false; | ||
| 7402 | } | ||
| 7403 | |||
| 7404 | if (Math.abs(sourceId - targetId) !== 1) { | ||
| 7405 | console.error(`Message #${sourceId} and #${targetId} are not adjacent.`); | ||
| 7406 | return false; | ||
| 7407 | } | ||
| 7408 | |||
| 7409 | const targetMessageDiv = chatElement.find(`.mes[mesid="${targetId}"]`); | ||
| 7410 | const sourceMessageDiv = chatElement.find(`.mes[mesid="${sourceId}"]`); | ||
| 7411 | |||
| 7412 | if (sourceMessageDiv.length === 0 || targetMessageDiv.length === 0) { | ||
| 7413 | console.error(`Message #${sourceId} or #${targetId} were not found.`); | ||
| 7414 | return false; | ||
| 7415 | } | ||
| 7416 | |||
| 7417 | if (sourceId <= targetId) { | ||
| 7418 | sourceMessageDiv.insertAfter(targetMessageDiv); | ||
| 7419 | } | ||
| 7420 | else { | ||
| 7421 | sourceMessageDiv.insertBefore(targetMessageDiv); | ||
| 7422 | } | ||
| 7423 | |||
| 7424 | //Swap Ids. | ||
| 7425 | targetMessageDiv.attr('mesid', sourceId); | ||
| 7426 | sourceMessageDiv.attr('mesid', targetId); | ||
| 7427 | |||
| 7428 | // Swap chat array entries. | ||
| 7429 | [chat[sourceId], chat[targetId]] = [chat[targetId], chat[sourceId]]; | ||
| 7430 | |||
| 7431 | // Update edited message id | ||
| 7432 | if (this_edit_mes_id === sourceId) { | ||
| 7433 | this_edit_mes_id = targetId; | ||
| 7434 | } | ||
| 7435 | |||
| 7436 | updateViewMessageIds(); | ||
| 7437 | await saveChatConditional(); | ||
| 7438 | return true; | ||
| 7439 | } | ||
| 7440 | |||
| 7392 | async function messageEditDone(div) { | 7441 | async function messageEditDone(div) { |
| 7393 | let { mesBlock, text, mes, bias } = updateMessage(div); | 7442 | let { mesBlock, text, mes, bias } = updateMessage(div); |
| 7394 | if (this_edit_mes_id == 0) { | 7443 | if (this_edit_mes_id == 0) { |
| @@ -8294,7 +8343,7 @@ async function importCharacterChat(formData, { refresh = true } = {}) { | |||
| 8294 | return []; | 8343 | return []; |
| 8295 | } | 8344 | } |
| 8296 | 8345 | ||
| 8297 | function updateViewMessageIds(startIndex = null) { | 8346 | export function updateViewMessageIds(startIndex = null) { |
| 8298 | const minId = startIndex ?? getFirstDisplayedMessageId(); | 8347 | const minId = startIndex ?? getFirstDisplayedMessageId(); |
| 8299 | 8348 | ||
| 8300 | chatElement.find('.mes').each(function (index, element) { | 8349 | chatElement.find('.mes').each(function (index, element) { |
| @@ -8314,24 +8363,27 @@ export function getFirstDisplayedMessageId() { | |||
| 8314 | return minId; | 8363 | return minId; |
| 8315 | } | 8364 | } |
| 8316 | 8365 | ||
| 8317 | function updateEditArrowClasses() { | 8366 | export function updateEditArrowClasses() { |
| 8318 | chatElement.find('.mes .mes_edit_up').removeClass('disabled'); | 8367 | if (!(this_edit_mes_id >= 0)) { |
| 8319 | chatElement.find('.mes .mes_edit_down').removeClass('disabled'); | 8368 | return; |
| 8369 | } | ||
| 8320 | 8370 | ||
| 8321 | if (this_edit_mes_id >= 0) { | 8371 | const message = chatElement.find(`.mes[mesid="${this_edit_mes_id}"]`); |
| 8322 | const down = chatElement.find(`.mes[mesid="${this_edit_mes_id}"] .mes_edit_down`); | 8372 | |
| 8323 | const up = chatElement.find(`.mes[mesid="${this_edit_mes_id}"] .mes_edit_up`); | 8373 | const downButton = message.find('.mes_edit_down'); |
| 8374 | const upButton = message.find('.mes_edit_up'); | ||
| 8375 | const copyButton = message.find('.mes_edit_copy'); | ||
| 8376 | const deleteButton = message.find('.mes_edit_delete'); | ||
| 8324 | const lastId = Number(chatElement.find('.mes').last().attr('mesid')); | 8377 | const lastId = Number(chatElement.find('.mes').last().attr('mesid')); |
| 8325 | const firstId = Number(chatElement.find('.mes').first().attr('mesid')); | 8378 | const firstId = Number(chatElement.find('.mes').first().attr('mesid')); |
| 8326 | 8379 | ||
| 8327 | if (lastId == Number(this_edit_mes_id)) { | 8380 | copyButton.removeClass('disabled'); |
| 8328 | down.addClass('disabled'); | 8381 | deleteButton.removeClass('disabled'); |
| 8329 | } | ||
| 8330 | 8382 | ||
| 8331 | if (firstId == Number(this_edit_mes_id)) { | 8383 | // The last message cannot be moved down. |
| 8332 | up.addClass('disabled'); | 8384 | downButton.toggleClass('disabled', lastId === Number(this_edit_mes_id)); |
| 8333 | } | 8385 | // The first message cannot be moved up. |
| 8334 | } | 8386 | upButton.toggleClass('disabled', firstId === Number(this_edit_mes_id)); |
| 8335 | } | 8387 | } |
| 8336 | 8388 | ||
| 8337 | /** | 8389 | /** |
| @@ -10618,57 +10670,20 @@ jQuery(async function () { | |||
| 10618 | }); | 10670 | }); |
| 10619 | 10671 | ||
| 10620 | $(document).on('click', '.mes_edit_up', async function () { | 10672 | $(document).on('click', '.mes_edit_up', async function () { |
| 10621 | if (is_send_press || this_edit_mes_id <= 0) { | 10673 | if (this_edit_mes_id <= 0) { |
| 10622 | return; | 10674 | return; |
| 10623 | } | 10675 | } |
| 10624 | |||
| 10625 | const targetId = Number(this_edit_mes_id) - 1; | 10676 | const targetId = Number(this_edit_mes_id) - 1; |
| 10626 | const target = chatElement.find(`.mes[mesid="${targetId}"]`); | 10677 | await messageEditMove(this_edit_mes_id, targetId); |
| 10627 | const root = $(this).closest('.mes'); | ||
| 10628 | |||
| 10629 | if (root.length === 0 || target.length === 0) { | ||
| 10630 | return; | ||
| 10631 | } | ||
| 10632 | |||
| 10633 | root.insertBefore(target); | ||
| 10634 | |||
| 10635 | target.attr('mesid', this_edit_mes_id); | ||
| 10636 | root.attr('mesid', targetId); | ||
| 10637 | |||
| 10638 | const temp = chat[targetId]; | ||
| 10639 | chat[targetId] = chat[this_edit_mes_id]; | ||
| 10640 | chat[this_edit_mes_id] = temp; | ||
| 10641 | |||
| 10642 | this_edit_mes_id = targetId; | ||
| 10643 | updateViewMessageIds(); | ||
| 10644 | await saveChatConditional(); | ||
| 10645 | }); | 10678 | }); |
| 10646 | 10679 | ||
| 10647 | $(document).on('click', '.mes_edit_down', async function () { | 10680 | $(document).on('click', '.mes_edit_down', async function () { |
| 10648 | if (is_send_press || this_edit_mes_id >= chat.length - 1) { | 10681 | if (this_edit_mes_id >= chat.length - 1) { |
| 10649 | return; | 10682 | return; |
| 10650 | } | 10683 | } |
| 10651 | 10684 | ||
| 10652 | const targetId = Number(this_edit_mes_id) + 1; | 10685 | const targetId = Number(this_edit_mes_id) + 1; |
| 10653 | const target = chatElement.find(`.mes[mesid="${targetId}"]`); | 10686 | await messageEditMove(this_edit_mes_id, targetId); |
| 10654 | const root = $(this).closest('.mes'); | ||
| 10655 | |||
| 10656 | if (root.length === 0 || target.length === 0) { | ||
| 10657 | return; | ||
| 10658 | } | ||
| 10659 | |||
| 10660 | root.insertAfter(target); | ||
| 10661 | |||
| 10662 | target.attr('mesid', this_edit_mes_id); | ||
| 10663 | root.attr('mesid', targetId); | ||
| 10664 | |||
| 10665 | const temp = chat[targetId]; | ||
| 10666 | chat[targetId] = chat[this_edit_mes_id]; | ||
| 10667 | chat[this_edit_mes_id] = temp; | ||
| 10668 | |||
| 10669 | this_edit_mes_id = targetId; | ||
| 10670 | updateViewMessageIds(); | ||
| 10671 | await saveChatConditional(); | ||
| 10672 | }); | 10687 | }); |
| 10673 | 10688 | ||
| 10674 | $(document).on('click', '.mes_edit_copy', async function () { | 10689 | $(document).on('click', '.mes_edit_copy', async function () { |