From 885a278973253ecfb530f95fb92dd3dcfd94b24a Mon Sep 17 00:00:00 2001
From: RossAscends <124905043+RossAscends@users.noreply.github.com>
Date: Mon, 30 Sep 2024 19:51:13 +0900
Subject: [PATCH] split counter from chevron, smarter toggling
---
public/index.html | 3 ++-
public/script.js | 28 ++++++++++++++--------------
public/scripts/power-user.js | 25 +------------------------
public/style.css | 18 +++++++++++++++---
4 files changed, 32 insertions(+), 42 deletions(-)
diff --git a/public/index.html b/public/index.html
index e6f70355a..70d6079e2 100644
--- a/public/index.html
+++ b/public/index.html
@@ -5943,7 +5943,8 @@
-
diff --git a/public/script.js b/public/script.js
index cf3061708..cf5c29d61 100644
--- a/public/script.js
+++ b/public/script.js
@@ -83,7 +83,6 @@ import {
resetMovableStyles,
forceCharacterEditorTokenize,
applyPowerUserSettings,
- switchSwipeNumAllMessages,
} from './scripts/power-user.js';
import {
@@ -2381,8 +2380,8 @@ export function addOneMessage(mes, { type = 'normal', insertAfter = null, scroll
if (showSwipes) {
$('#chat .mes').last().addClass('last_mes');
- $('#chat .mes').eq(-2).removeClass('last_mes')
- .find('.swipe_right').removeClass('fa-chevron-right'); //otherwise it stays looking like it did when it was last_mes
+ $('#chat .mes').eq(-2).removeClass('last_mes');
+ //.find('.swipe_right').hide(); //otherwise it stays looking like it did when it was last_mes
hideSwipeButtons();
showSwipeButtons();
}
@@ -7495,16 +7494,17 @@ export function showSwipeButtons() {
}
//only show right when generate is off, or when next right swipe would not make a generate happen
if (is_send_press === false || chat[chat.length - 1].swipes.length >= swipeId) {
- currentMessage.children('.swipe_right').css('display', 'flex');
- currentMessage.children('.swipe_right').css('opacity', '0.3');
+ console.error('showingSwipeButtons: showing.');
+ currentMessage.find('.swipe_right').css('display', 'flex');
+ currentMessage.find('.swipe_right').css('opacity', '0.3');
}
//console.log((chat[chat.length - 1]));
if ((chat[chat.length - 1].swipes.length - swipeId) === 1) {
- //console.log('highlighting R swipe');
+ console.error('highlighting R swipe');
//chevron was moved out of hardcode in HTML to class toggle dependent on last_mes or not
//necessary for 'swipe_right' div in past messages to have no chevron if 'show swipes for all messages' is turned on
- currentMessage.children('.swipe_right').addClass('fa-chevron-right').css('opacity', '0.7');
+ currentMessage.find('.swipe_right').css('opacity', '0.7');
}
//console.log(swipesCounterHTML);
@@ -7514,13 +7514,13 @@ export function showSwipeButtons() {
//console.log(swipeId);
//console.log(chat[chat.length - 1].swipes.length);
- switchSwipeNumAllMessages();
+ //switchSwipeNumAllMessages();
}
export function hideSwipeButtons() {
- //console.log('hideswipebuttons entered');
- $('#chat').find('.last_mes .swipe_right').css('display', 'none');
- $('#chat').find('.swipe_left').css('display', 'none');
+ console.error('hideswipebuttons entered');
+ $('#chat').find('.swipe_right').hide();
+ $('#chat').find('.swipe_left').hide();
}
/**
@@ -8355,8 +8355,8 @@ const swipe_right = () => {
}
const currentMessage = $('#chat').children().filter(`[mesid="${chat.length - 1}"]`);
- let this_div = currentMessage.children('.swipe_right');
- let this_mes_div = this_div.parent();
+ let this_div = currentMessage.find('.swipe_right');
+ let this_mes_div = this_div.parent().parent();
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)
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 = () => {
}
// handles animated transitions when swipe right, specifically height transitions between messages
if (run_generate || run_swipe_right) {
- let this_mes_block = this_mes_div.children('.mes_block').children('.mes_text');
+ let this_mes_block = this_mes_div.find('.mes_block .mes_text');
const this_mes_div_height = this_mes_div[0].scrollHeight;
const this_mes_block_height = this_mes_block[0].scrollHeight;
diff --git a/public/scripts/power-user.js b/public/scripts/power-user.js
index e42981ded..79c5eb724 100644
--- a/public/scripts/power-user.js
+++ b/public/scripts/power-user.js
@@ -472,30 +472,7 @@ function switchCompactInputArea() {
export function switchSwipeNumAllMessages() {
$('#show_swipe_num_all_messages').prop('checked', power_user.show_swipe_num_all_messages);
-
- if (power_user.show_swipe_num_all_messages) {
-
- $('.mes').each(function () {
- //if the div also has the .lst_mes class, skip the loop for that item
- if ($(this).hasClass('last_mes')) {
- return;
- }
- //add the cloned button to every .mes .swipe_right EXCLUDING .mes.last_mes
- $(this).find('.swipe_right').css('display', 'flex');
- });
-
- } else if (!power_user.show_swipe_num_all_messages) {
- $('.mes:not(.last_mes)').each(function () {
- if ($(this).hasClass('last_mes')) {
- return;
- }
- //add the cloned button back to its original spot
- $(this).find('.swipe_right').css('display', 'none');
- });
-
- }
-
-
+ $('.mes:not(.last_mes) .swipes-counter').toggle(power_user.show_swipe_num_all_messages);
}
var originalSliderValues = [];
diff --git a/public/style.css b/public/style.css
index 1c8096d86..6420e4b35 100644
--- a/public/style.css
+++ b/public/style.css
@@ -978,13 +978,21 @@ body .panelControlBar {
justify-content: center;
z-index: 9999;
grid-row-start: 2;
- grid-column-start: 4;
- flex-flow: column;
font-size: 30px;
cursor: pointer;
align-self: center;
+
+}
+.swipe_left{
+position: absolute;
+bottom: 15px;
+flex-flow: column;
+}
+
+.swipeRightBlock {
position: absolute;
- bottom: 15px;
+ right: 0;
+ bottom: 0;
}
.swipes-counter {
@@ -994,6 +1002,9 @@ body .panelControlBar {
font-family: var(--mainFontFamily);
font-weight: 400;
align-self: center;
+ min-width: 40px;
+ display: flex;
+ justify-content: center;
}
.swipe_left {
@@ -1003,6 +1014,7 @@ body .panelControlBar {
.swipe_right {
right: 5px;
+ align-self:end;
}
.ui-settings {