split counter from chevron, smarter toggling
| @@ -5943,7 +5943,8 @@ | ||
| 5943 | 5943 | </div> |
| 5944 | 5944 | <div class="mes_bias"></div> |
| 5945 | 5945 | </div> |
| 5946 | 5946 | <div class="swipe_right faflex-solid"container style="display:swipeRightBlock none;flexFlowColumn flexNoGap"> |
| 5947 | + <div class="swipe_right fa-solid fa-chevron-right" style="display: none;"></div> | |
| 5947 | 5948 | <div class="swipes-counter"></div> |
| 5948 | 5949 | </div> |
| 5949 | 5950 | </div> |
| @@ -83,7 +83,6 @@ import { | ||
| 83 | 83 | resetMovableStyles, |
| 84 | 84 | forceCharacterEditorTokenize, |
| 85 | 85 | applyPowerUserSettings, |
| 86 | - switchSwipeNumAllMessages, | |
| 87 | 86 | } from './scripts/power-user.js'; |
| 88 | 87 | |
| 89 | 88 | import { |
| @@ -2381,8 +2380,8 @@ export function addOneMessage(mes, { type = 'normal', insertAfter = null, scroll | ||
| 2381 | 2380 | |
| 2382 | 2381 | if (showSwipes) { |
| 2383 | 2382 | $('#chat .mes').last().addClass('last_mes'); |
| 2384 | 2383 | $('#chat .mes').eq(-2).removeClass('last_mes'); |
| 2385 | 2384 | //.find('.swipe_right').removeClasshide('fa-chevron-right'); //otherwise it stays looking like it did when it was last_mes |
| 2386 | 2385 | hideSwipeButtons(); |
| 2387 | 2386 | showSwipeButtons(); |
| 2388 | 2387 | } |
| @@ -7495,16 +7494,17 @@ export function showSwipeButtons() { | ||
| 7495 | 7494 | } |
| 7496 | 7495 | //only show right when generate is off, or when next right swipe would not make a generate happen |
| 7497 | 7496 | if (is_send_press === false || chat[chat.length - 1].swipes.length >= swipeId) { |
| 7498 | - currentMessage.children('.swipe_right').css('display', 'flex'); | |
| 7497 | + console.error('showingSwipeButtons: showing.'); | |
| 7499 | 7498 | currentMessage.childrenfind('.swipe_right').css('opacitydisplay', '0.3flex'); |
| 7499 | + currentMessage.find('.swipe_right').css('opacity', '0.3'); | |
| 7500 | 7500 | } |
| 7501 | 7501 | //console.log((chat[chat.length - 1])); |
| 7502 | 7502 | if ((chat[chat.length - 1].swipes.length - swipeId) === 1) { |
| 7503 | 7503 | //console.logerror('highlighting R swipe'); |
| 7504 | 7504 | |
| 7505 | 7505 | //chevron was moved out of hardcode in HTML to class toggle dependent on last_mes or not |
| 7506 | 7506 | //necessary for 'swipe_right' div in past messages to have no chevron if 'show swipes for all messages' is turned on |
| 7507 | 7507 | currentMessage.childrenfind('.swipe_right').addClass('fa-chevron-right').css('opacity', '0.7'); |
| 7508 | 7508 | } |
| 7509 | 7509 | //console.log(swipesCounterHTML); |
| 7510 | 7510 | |
| @@ -7514,13 +7514,13 @@ export function showSwipeButtons() { | ||
| 7514 | 7514 | //console.log(swipeId); |
| 7515 | 7515 | //console.log(chat[chat.length - 1].swipes.length); |
| 7516 | 7516 | |
| 7517 | 7517 | //switchSwipeNumAllMessages(); |
| 7518 | 7518 | } |
| 7519 | 7519 | |
| 7520 | 7520 | export function hideSwipeButtons() { |
| 7521 | 7521 | //console.logerror('hideswipebuttons entered'); |
| 7522 | 7522 | $('#chat').find('.last_mes .swipe_right').csshide('display', 'none'); |
| 7523 | 7523 | $('#chat').find('.swipe_left').csshide('display', 'none'); |
| 7524 | 7524 | } |
| 7525 | 7525 | |
| 7526 | 7526 | /** |
| @@ -8355,8 +8355,8 @@ const swipe_right = () => { | ||
| 8355 | 8355 | } |
| 8356 | 8356 | |
| 8357 | 8357 | const currentMessage = $('#chat').children().filter(`[mesid="${chat.length - 1}"]`); |
| 8358 | 8358 | let this_div = currentMessage.childrenfind('.swipe_right'); |
| 8359 | 8359 | let this_mes_div = this_div.parent().parent(); |
| 8360 | 8360 | |
| 8361 | 8361 | if (chat[chat.length - 1]['swipe_id'] > chat[chat.length - 1]['swipes'].length) { //if we swipe right while generating (the swipe ID is greater than what we are viewing now) |
| 8362 | 8362 | chat[chat.length - 1]['swipe_id'] = chat[chat.length - 1]['swipes'].length; //show that message slot (will be '...' while generating) |
| @@ -8366,7 +8366,7 @@ const swipe_right = () => { | ||
| 8366 | 8366 | } |
| 8367 | 8367 | // handles animated transitions when swipe right, specifically height transitions between messages |
| 8368 | 8368 | if (run_generate || run_swipe_right) { |
| 8369 | 8369 | let this_mes_block = this_mes_div.childrenfind('.mes_block').children(' .mes_text'); |
| 8370 | 8370 | const this_mes_div_height = this_mes_div[0].scrollHeight; |
| 8371 | 8371 | const this_mes_block_height = this_mes_block[0].scrollHeight; |
| 8372 | 8372 | |
| @@ -472,30 +472,7 @@ function switchCompactInputArea() { | ||
| 472 | 472 | |
| 473 | 473 | export function switchSwipeNumAllMessages() { |
| 474 | 474 | $('#show_swipe_num_all_messages').prop('checked', power_user.show_swipe_num_all_messages); |
| 475 | - | |
| 475 | + $('.mes:not(.last_mes) .swipes-counter').toggle(power_user.show_swipe_num_all_messages); | |
| 476 | - if (power_user.show_swipe_num_all_messages) { | |
| 477 | - | |
| 478 | - $('.mes').each(function () { | |
| 479 | - //if the div also has the .lst_mes class, skip the loop for that item | |
| 480 | - if ($(this).hasClass('last_mes')) { | |
| 481 | - return; | |
| 482 | - } | |
| 483 | - //add the cloned button to every .mes .swipe_right EXCLUDING .mes.last_mes | |
| 484 | - $(this).find('.swipe_right').css('display', 'flex'); | |
| 485 | - }); | |
| 486 | - | |
| 487 | - } else if (!power_user.show_swipe_num_all_messages) { | |
| 488 | - $('.mes:not(.last_mes)').each(function () { | |
| 489 | - if ($(this).hasClass('last_mes')) { | |
| 490 | - return; | |
| 491 | - } | |
| 492 | - //add the cloned button back to its original spot | |
| 493 | - $(this).find('.swipe_right').css('display', 'none'); | |
| 494 | - }); | |
| 495 | - | |
| 496 | - } | |
| 497 | - | |
| 498 | - | |
| 499 | 476 | } |
| 500 | 477 | |
| 501 | 478 | var originalSliderValues = []; |
| @@ -978,13 +978,21 @@ body .panelControlBar { | ||
| 978 | 978 | justify-content: center; |
| 979 | 979 | z-index: 9999; |
| 980 | 980 | grid-row-start: 2; |
| 981 | - grid-column-start: 4; | |
| 982 | - flex-flow: column; | |
| 983 | 981 | font-size: 30px; |
| 984 | 982 | cursor: pointer; |
| 985 | 983 | align-self: center; |
| 984 | + | |
| 985 | +} | |
| 986 | +.swipe_left{ | |
| 986 | 987 | position: absolute; |
| 987 | 988 | bottom: 15px; |
| 989 | +flex-flow: column; | |
| 990 | +} | |
| 991 | + | |
| 992 | +.swipeRightBlock { | |
| 993 | + position: absolute; | |
| 994 | + right: 0; | |
| 995 | + bottom: 0; | |
| 988 | 996 | } |
| 989 | 997 | |
| 990 | 998 | .swipes-counter { |
| @@ -994,6 +1002,9 @@ body .panelControlBar { | ||
| 994 | 1002 | font-family: var(--mainFontFamily); |
| 995 | 1003 | font-weight: 400; |
| 996 | 1004 | align-self: center; |
| 1005 | + min-width: 40px; | |
| 1006 | + display: flex; | |
| 1007 | + justify-content: center; | |
| 997 | 1008 | } |
| 998 | 1009 | |
| 999 | 1010 | .swipe_left { |
| @@ -1003,6 +1014,7 @@ body .panelControlBar { | ||
| 1003 | 1014 | |
| 1004 | 1015 | .swipe_right { |
| 1005 | 1016 | right: 5px; |
| 1017 | + align-self:end; | |
| 1006 | 1018 | } |
| 1007 | 1019 | |
| 1008 | 1020 | .ui-settings { |