split counter from chevron, smarter toggling

885a278973253ecfb530f95fb92dd3dcfd94b24a

RossAscends <124905043+RossAscends@users.noreply.github.com>

4 files changed, +32 -42Ignore whitespace
public/index.html+2 -1
@@ -5943,7 +5943,8 @@
59435943 </div>
59445944 <div class="mes_bias"></div>
59455945 </div>
59465946 <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>
59475948 <div class="swipes-counter"></div>
59485949 </div>
59495950 </div>
public/script.js+14 -14
@@ -83,7 +83,6 @@ import {
8383 resetMovableStyles,
8484 forceCharacterEditorTokenize,
8585 applyPowerUserSettings,
86- switchSwipeNumAllMessages,
8786} from './scripts/power-user.js';
8887
8988import {
@@ -2381,8 +2380,8 @@ export function addOneMessage(mes, { type = 'normal', insertAfter = null, scroll
23812380
23822381 if (showSwipes) {
23832382 $('#chat .mes').last().addClass('last_mes');
23842383 $('#chat .mes').eq(-2).removeClass('last_mes');
23852384 //.find('.swipe_right').removeClasshide('fa-chevron-right'); //otherwise it stays looking like it did when it was last_mes
23862385 hideSwipeButtons();
23872386 showSwipeButtons();
23882387 }
@@ -7495,16 +7494,17 @@ export function showSwipeButtons() {
74957494 }
74967495 //only show right when generate is off, or when next right swipe would not make a generate happen
74977496 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.');
74997498 currentMessage.childrenfind('.swipe_right').css('opacitydisplay', '0.3flex');
7499+ currentMessage.find('.swipe_right').css('opacity', '0.3');
75007500 }
75017501 //console.log((chat[chat.length - 1]));
75027502 if ((chat[chat.length - 1].swipes.length - swipeId) === 1) {
75037503 //console.logerror('highlighting R swipe');
75047504
75057505 //chevron was moved out of hardcode in HTML to class toggle dependent on last_mes or not
75067506 //necessary for 'swipe_right' div in past messages to have no chevron if 'show swipes for all messages' is turned on
75077507 currentMessage.childrenfind('.swipe_right').addClass('fa-chevron-right').css('opacity', '0.7');
75087508 }
75097509 //console.log(swipesCounterHTML);
75107510
@@ -7514,13 +7514,13 @@ export function showSwipeButtons() {
75147514 //console.log(swipeId);
75157515 //console.log(chat[chat.length - 1].swipes.length);
75167516
75177517 //switchSwipeNumAllMessages();
75187518}
75197519
75207520export function hideSwipeButtons() {
75217521 //console.logerror('hideswipebuttons entered');
75227522 $('#chat').find('.last_mes .swipe_right').csshide('display', 'none');
75237523 $('#chat').find('.swipe_left').csshide('display', 'none');
75247524}
75257525
75267526/**
@@ -8355,8 +8355,8 @@ const swipe_right = () => {
83558355 }
83568356
83578357 const currentMessage = $('#chat').children().filter(`[mesid="${chat.length - 1}"]`);
83588358 let this_div = currentMessage.childrenfind('.swipe_right');
83598359 let this_mes_div = this_div.parent().parent();
83608360
83618361 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)
83628362 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 = () => {
83668366 }
83678367 // handles animated transitions when swipe right, specifically height transitions between messages
83688368 if (run_generate || run_swipe_right) {
83698369 let this_mes_block = this_mes_div.childrenfind('.mes_block').children(' .mes_text');
83708370 const this_mes_div_height = this_mes_div[0].scrollHeight;
83718371 const this_mes_block_height = this_mes_block[0].scrollHeight;
83728372
public/scripts/power-user.js+1 -24
@@ -472,30 +472,7 @@ function switchCompactInputArea() {
472472
473473export function switchSwipeNumAllMessages() {
474474 $('#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-
499476}
500477
501478var originalSliderValues = [];
public/style.css+15 -3
@@ -978,13 +978,21 @@ body .panelControlBar {
978978 justify-content: center;
979979 z-index: 9999;
980980 grid-row-start: 2;
981- grid-column-start: 4;
982- flex-flow: column;
983981 font-size: 30px;
984982 cursor: pointer;
985983 align-self: center;
984+
985+}
986+.swipe_left{
987+position: absolute;
988+bottom: 15px;
989+flex-flow: column;
990+}
991+
992+.swipeRightBlock {
986993 position: absolute;
987994 bottomright: 15px0;
995+ bottom: 0;
988996}
989997
990998.swipes-counter {
@@ -994,6 +1002,9 @@ body .panelControlBar {
9941002 font-family: var(--mainFontFamily);
9951003 font-weight: 400;
9961004 align-self: center;
1005+ min-width: 40px;
1006+ display: flex;
1007+ justify-content: center;
9971008}
9981009
9991010.swipe_left {
@@ -1003,6 +1014,7 @@ body .panelControlBar {
10031014
10041015.swipe_right {
10051016 right: 5px;
1017+ align-self:end;
10061018}
10071019
10081020.ui-settings {