This commit is contained in:
Wolfsblvt 2024-05-06 14:28:17 +00:00 committed by GitHub
commit 4b9a61036c
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
12 changed files with 1934 additions and 705 deletions

112
public/css/stats.css Normal file
View File

@ -0,0 +1,112 @@
.rm_stat_popup_header {
margin-bottom: 0px;
}
.rm_stats_button {
cursor: pointer;
}
.rm_stat_block {
display: flex;
}
.rm_stat_block_data_row:hover {
background-color: var(--grey5020a);
filter: drop-shadow(0px 0px 5px var(--SmartThemeShadowColor));
}
.rm_stat_name {
flex: 1;
}
.rm_stat_values {
flex: 2;
display: flex;
align-items: center;
}
.rm_stat_block.rm_stat_right_spacing .rm_stat_values {
flex: 1;
}
.rm_stat_name .rm_stat_header {
height: calc(var(--mainFontSize) * 1.33333333333 + 3px);
padding-bottom: 3px;
border-bottom: 2px solid;
}
.rm_stat_name .rm_stat_field {
text-align: left;
}
.rm_stat_field.rm_stat_field_lefty {
text-align: left;
padding-left: 6px;
}
.rm_stat_field {
flex: 1;
height: calc(var(--mainFontSize) * 1.33333333333);
text-align: right;
overflow: hidden;
padding-left: 2px;
padding-right: 2px;
}
.rm_stat_field_smaller {
color: var(--grey70);
font-size: smaller;
}
.rm_stat_header {
margin-bottom: 3px;
font-weight: bold;
}
.rm_stat_spacer {
height: 12px;
}
.rm_stat_bar {
width: 100%;
height: calc(var(--mainFontSize) * 1.33333333333 - 4px);
display: flex;
margin-top: 2px;
margin-bottom: 2px;
padding-left: 6px;
}
.rm_stat_bar_user {
background-color: rgba(130, 178, 140, 0.9);
}
.rm_stat_bar_char {
background-color: rgba(178, 140, 130, 0.9);
}
.rm_stat_block.rm_stat_right_spacing {
margin-right: 33.33333333333%;
}
.rm_stat_avatar_block {
position: absolute;
top: calc(10px + 1.17em + 12.5px + 2* 7px);
right: 0px;
height: calc(8px + calc(calc(var(--mainFontSize) * 1.33333333333) * 7) + calc(12px * 3));
width: calc(33.33333333333% - 10px);
display: flex;
justify-content: center;
align-items: center;
}
.rm_stat_avatar_block .avatar {
scale: 2;
flex: unset;
}
.rm_stat_footer {
justify-content: right;
color: var(--grey70);
font-size: smaller;
font-style: italic;
}

View File

@ -146,7 +146,6 @@ body.big-avatars .bogus_folder_select .avatar {
body.big-avatars .avatar {
width: calc(var(--avatar-base-width) * var(--big-avatar-width-factor));
height: calc(var(--avatar-base-height) * var(--big-avatar-height-factor));
/* width: unset; */
border-style: none;
display: flex;
justify-content: center;

View File

@ -41,6 +41,7 @@
<link rel="stylesheet" type="text/css" href="css/select2-overrides.css">
<link rel="stylesheet" type="text/css" href="css/mobile-styles.css">
<link rel="stylesheet" type="text/css" href="css/user.css">
<link rel="stylesheet" type="text/css" href="css/stats.css">
<link rel="icon" type="image/x-icon" href="favicon.ico">
<!-- Scripts are loaded at the end of the body to improve page load speed -->
</head>
@ -4211,7 +4212,7 @@
</a>
</div>
<div class="flex-container">
<div class="menu_button menu_button_icon user_stats_button" data-i18n="[title]Click for stats!" title="Click for stats!">
<div class="menu_button menu_button_icon user_stats_button" data-i18n="[title]Show your usage stats" title="Show your usage stats">
<i class="fa-solid fa-ranking-star"></i>
<span data-i18n="Usage Stats">Usage Stats</span>
</div>
@ -4331,7 +4332,8 @@
</div>
</div>
<a id="chartokenwarning" class="right_menu_button fa-solid fa-triangle-exclamation" href="https://docs.sillytavern.app/usage/core-concepts/characterdesign/#character-tokens" target="_blank" title="About Token 'Limits'"></a>
<i title="Click for stats!" class="fa-solid fa-ranking-star right_menu_button rm_stats_button"></i>
<i title="Show your stats for this character" class="rm_char_stats_button fa-solid fa-ranking-star right_menu_button"></i>
<i title="Show your stats for this chat" class="rm_chat_stats_button fa-solid fa-ranking-star right_menu_button" style="color:darkred;"></i>
<i title="Toggle character info panel" id="hideCharPanelAvatarButton" class="fa-solid fa-eye right_menu_button"></i>
</div>
</div>

View File

@ -1,5 +1,5 @@
import { humanizedDateTime, favsToHotswap, getMessageTimeStamp, dragElement, isMobile, initRossMods, shouldSendOnEnter } from './scripts/RossAscends-mods.js';
import { userStatsHandler, statMesProcess, initStats } from './scripts/stats.js';
import { initStats } from './scripts/stats.js';
import {
generateKoboldWithStreaming,
kai_settings,
@ -1348,14 +1348,16 @@ function verifyCharactersSearchSortRule() {
}
}
/** @typedef {object} Character - A character */
/** @typedef {object} Group - A group */
/** @typedef {{name: string, avatar: string, fav: boolean}} Character - A character */
/** @typedef {{id: string, name: string, avatar: string, fav: boolean}} Group - A group */
/** @typedef {import('./scripts/tags.js').Tag} Tag */
/** @typedef {import('./scripts/personas.js').Persona} Persona - A persona */
/**
* @typedef {object} Entity - Object representing a display entity
* @property {Character|Group|import('./scripts/tags.js').Tag|*} item - The item
* @property {Character|Group|Tag|Persona} item - The item
* @property {string|number} id - The id
* @property {string} type - The type of this entity (character, group, tag)
* @property {'character'|'group'|'tag'|'persona'} type - The type of this entity (character, group, tag, persona)
* @property {Entity[]} [entities] - An optional list of entities relevant for this item
* @property {number} [hidden] - An optional number representing how many hidden entities this entity contains
*/
@ -1384,13 +1386,23 @@ export function groupToEntity(group) {
/**
* Converts the given tag to its entity representation
*
* @param {import('./scripts/tags.js').Tag} tag - The tag
* @param {Tag} tag - The tag
* @returns {Entity} The entity for this tag
*/
export function tagToEntity(tag) {
return { item: structuredClone(tag), id: tag.id, type: 'tag', entities: [] };
}
/**
* Converts the given persona based to its entity representation
*
* @param {Persona} persona - The avatar id for the persona
* @returns {Entity} The entity for this persona
*/
export function personaToEntity(persona) {
return { item: persona, id: persona.avatar, type: 'persona' };
}
/**
* Builds the full list of all entities available
*
@ -1449,6 +1461,23 @@ export function getEntitiesList({ doFilter = false, doSort = true } = {}) {
return entities;
}
/**
* Get one character from the character list via its character key
*
* To retrieve/refresh it from the API, use `getOneCharacter` to update it first.
*
* @param {string} characterKey - The character key / avatar url
* @returns {object}
*/
export function getCharacter(characterKey) {
return characters.find(x => x.avatar === characterKey);
}
/**
* Gets one character from via API
*
* @param {string} avatarUrl - The avatar url / character key
*/
export async function getOneCharacter(avatarUrl) {
const response = await fetch('/api/characters/get', {
method: 'POST',
@ -4445,7 +4474,7 @@ export async function sendMessageAsUser(messageText, messageBias, insertAt = nul
}
await populateFileAttachment(message);
statMesProcess(message, 'user', characters, this_chid, '');
// statMesProcess(message, 'user', characters, this_chid, '');
if (typeof insertAt === 'number' && insertAt >= 0 && insertAt <= chat.length) {
chat.splice(insertAt, 0, message);
@ -5595,6 +5624,17 @@ export function getThumbnailUrl(type, file) {
return `/thumbnail?type=${type}&file=${encodeURIComponent(file)}`;
}
/**
* Build an avatar list for entities inside a given html block element
*
* @param {JQuery<HTMLElement>} block - The block to build the avatar list in
* @param {Entity[]} entities - A list of entities for which to build the avatar for
* @param {object} options - Optional options
* @param {string} [options.templateId='inline_avatar_template'] - The template from which the inline avatars are built off
* @param {boolean} [options.empty=true] - Whether the block will be emptied before drawing the avatars
* @param {boolean} [options.selectable=false] - Whether the avatars should be selectable/clickable. If set, the click handler has to be implemented externally on the classes/items
* @param {boolean} [options.highlightFavs=true] - Whether favorites should be highlighted
*/
export function buildAvatarList(block, entities, { templateId = 'inline_avatar_template', empty = true, selectable = false, highlightFavs = true } = {}) {
if (empty) {
block.empty();
@ -5602,34 +5642,39 @@ export function buildAvatarList(block, entities, { templateId = 'inline_avatar_t
for (const entity of entities) {
const id = entity.id;
const item = entity.item;
// Populate the template
const avatarTemplate = $(`#${templateId} .avatar`).clone();
let this_avatar = default_avatar;
if (entity.item.avatar !== undefined && entity.item.avatar != 'none') {
this_avatar = getThumbnailUrl('avatar', entity.item.avatar);
}
avatarTemplate.attr('data-type', entity.type);
avatarTemplate.attr({ 'chid': id, 'id': `CharID${id}` });
avatarTemplate.find('img').attr('src', this_avatar).attr('alt', entity.item.name);
avatarTemplate.attr('title', `[Character] ${entity.item.name}\nFile: ${entity.item.avatar}`);
if (highlightFavs) {
avatarTemplate.toggleClass('is_fav', entity.item.fav || entity.item.fav == 'true');
avatarTemplate.find('.ch_fav').val(entity.item.fav);
switch (entity.type) {
case 'character':
avatarTemplate.attr({ 'chid': id, 'id': `CharID${id}` });
const charAvatar = item.avatar && item.avatar != 'none' ? getThumbnailUrl('avatar', item.avatar) : default_avatar;
avatarTemplate.find('img').attr('src', charAvatar).attr('alt', item.name);
avatarTemplate.attr('title', `[Character] ${item.name}\nFile: ${item.avatar}`);
break;
case 'group':
const grpTemplate = getGroupAvatar(item);
avatarTemplate.attr({ 'gid': id, 'id': `GroupID${id}` });
avatarTemplate.addClass(grpTemplate.attr('class'));
avatarTemplate.empty();
avatarTemplate.append(grpTemplate.children());
avatarTemplate.attr('title', `[Group] ${item.name}`);
break;
case 'persona':
avatarTemplate.attr({ 'pid': id, 'id': `PersonaID${id}` });
const personaAvatar = getUserAvatar(item.avatar)
avatarTemplate.find('img').attr('src', personaAvatar).attr('alt', item.name);
avatarTemplate.attr('title', `[Persona] ${item.name}`);
break;
}
// If this is a group, we need to hack slightly. We still want to keep most of the css classes and layout, but use a group avatar instead.
if (entity.type === 'group') {
const grpTemplate = getGroupAvatar(entity.item);
avatarTemplate.addClass(grpTemplate.attr('class'));
avatarTemplate.empty();
avatarTemplate.append(grpTemplate.children());
avatarTemplate.attr('title', `[Group] ${entity.item.name}`);
if (highlightFavs && 'fav' in item) {
avatarTemplate.toggleClass('is_fav', item.fav);
avatarTemplate.find('.ch_fav').val(item.fav ? 'true' : 'false');
}
if (selectable) {
avatarTemplate.addClass('selectable');
avatarTemplate.toggleClass('character_select', entity.type === 'character');
@ -6880,10 +6925,10 @@ function onScenarioOverrideRemoveClick() {
* @param {string} type
* @param {string} inputValue - Value to set the input to.
* @param {PopupOptions} options - Options for the popup.
* @typedef {{okButton?: string, rows?: number, wide?: boolean, large?: boolean, allowHorizontalScrolling?: boolean, allowVerticalScrolling?: boolean, cropAspect?: number }} PopupOptions - Options for the popup.
* @typedef {{okButton?: string, rows?: number, wide?: boolean, wider?: boolean, large?: boolean, allowHorizontalScrolling?: boolean, allowVerticalScrolling?: boolean, cropAspect?: number }} PopupOptions - Options for the popup.
* @returns
*/
export function callPopup(text, type, inputValue = '', { okButton, rows, wide, large, allowHorizontalScrolling, allowVerticalScrolling, cropAspect } = {}) {
export function callPopup(text, type, inputValue = '', { okButton, rows, wide, wider, large, allowHorizontalScrolling, allowVerticalScrolling, cropAspect } = {}) {
function getOkButtonText() {
if (['avatarToCrop'].includes(popup_type)) {
return okButton ?? 'Accept';
@ -6913,6 +6958,7 @@ export function callPopup(text, type, inputValue = '', { okButton, rows, wide, l
const $shadowPopup = $('#shadow_popup');
$dialoguePopup.toggleClass('wide_dialogue_popup', !!wide)
.toggleClass('wider_dialogue_popup', !!wider)
.toggleClass('large_dialogue_popup', !!large)
.toggleClass('horizontal_scrolling_dialogue_popup', !!allowHorizontalScrolling)
.toggleClass('vertical_scrolling_dialogue_popup', !!allowVerticalScrolling);
@ -10202,10 +10248,6 @@ jQuery(async function () {
isManualInput = false;
});
$('.user_stats_button').on('click', function () {
userStatsHandler();
});
$('#external_import_button').on('click', async () => {
const html = `<h3>Enter the URL of the content to import</h3>
Supported sources:<br>

View File

@ -81,19 +81,21 @@ observer.observe(document.documentElement, observerConfig);
/**
* Converts generation time from milliseconds to a human-readable format.
* Converts a timespan from milliseconds to a human-readable format.
*
* The function takes total generation time as an input, then converts it to a format
* The function takes a total timespan as an input, then converts it to a format
* of "_ Days, _ Hours, _ Minutes, _ Seconds". If the generation time does not exceed a
* particular measure (like days or hours), that measure will not be included in the output.
*
* @param {number} total_gen_time - The total generation time in milliseconds.
* @returns {string} - A human-readable string that represents the time spent generating characters.
* @param {number} timespan - The total timespan in milliseconds.
* @param {object} [options] - Optional parameters
* @param {boolean} [options.short=false] - Flag indicating whether short form should be used. ('2h' instead of '2 Hours')
* @param {number} [options.onlyHighest] - Number of maximum blocks to be returned. (If, and daya is the highest matching unit, only returns days and hours, cutting of minutes and seconds)
* @returns {string} - A human-readable string that represents the timespan.
*/
export function humanizeGenTime(total_gen_time) {
export function humanizeTimespan(timespan, { short = false, onlyHighest = 2 } = {}) {
//convert time_spent to humanized format of "_ Hours, _ Minutes, _ Seconds" from milliseconds
let time_spent = total_gen_time || 0;
let time_spent = timespan || 0;
time_spent = Math.floor(time_spent / 1000);
let seconds = time_spent % 60;
time_spent = Math.floor(time_spent / 60);
@ -102,12 +104,36 @@ export function humanizeGenTime(total_gen_time) {
let hours = time_spent % 24;
time_spent = Math.floor(time_spent / 24);
let days = time_spent;
time_spent = '';
if (days > 0) { time_spent += `${days} Days, `; }
if (hours > 0) { time_spent += `${hours} Hours, `; }
if (minutes > 0) { time_spent += `${minutes} Minutes, `; }
time_spent += `${seconds} Seconds`;
return time_spent;
let parts = [
{ singular: 'Day', plural: 'Days', short: 'd', value: days },
{ singular: 'Hour', plural: 'Hours', short: 'h', value: hours },
{ singular: 'Minute', plural: 'Minutes', short: 'm', value: minutes },
{ singular: 'Second', plural: 'Seconds', short: 's', value: seconds },
];
// Build the final string based on the highest significant units and respecting zeros
let resultParts = [];
let count = 0;
for (let part of parts) {
if (part.value > 0) {
resultParts.push(part);
}
// If we got a match, we count from there. Take a maximum of X elements
if (resultParts.length) count++;
if (count >= onlyHighest) {
break;
}
}
if (!resultParts.length) {
return short ? '&lt;1s' : 'Instant';
}
return resultParts.map(part => {
return short ? `${part.value}${part.short}` : `${part.value} ${part.value === 1 ? part.singular : part.plural}`;
}).join(short ? ' ' : ', ');
}
/**

View File

@ -35,6 +35,31 @@ function switchPersonaGridView() {
$('#user_avatar_block').toggleClass('gridView', state);
}
/**
* @typedef {object} Persona - A persona
* @property {string} id - The id of the persona - currently same as avatar
* @property {string} name - The name of the persona
* @property {string} avatar - the avatar / avatar id representing the persona
* @property {boolean} fav - Whether this persona is favorited
* @property {{description: string, position: number}} description - The persona description, containing its text and the position where its placed
* */
/**
* Builds an object represting the given persona
* @param {string} avatar - The avatar id
* @returns {Persona} The persona object, wit all its data
*/
export function getPersona(avatar) {
const persona = {
id: avatar,
name: power_user.personas[avatar],
avatar: avatar,
fav: false,
description: power_user.persona_descriptions[avatar]
};
return persona;
}
/**
* Returns the URL of the avatar for the given user avatar Id.
* @param {string} avatarImg User avatar Id

View File

@ -1,181 +1,522 @@
// statsHelper.js
import { getRequestHeaders, callPopup, characters, this_chid } from '../script.js';
import { humanizeGenTime } from './RossAscends-mods.js';
import { getRequestHeaders, callPopup, characters, this_chid, buildAvatarList, characterToEntity, getOneCharacter, getCharacter, user_avatar, personaToEntity, getCurrentChatId } from '../script.js';
import { humanizeTimespan } from './RossAscends-mods.js';
import { getPersona } from './personas.js';
import { registerDebugFunction } from './power-user.js';
import { humanFileSize, humanizedDuration, parseJson, sensibleRound, smartTruncate } from './utils.js';
let charStats = {};
/** @typedef {import('../script.js').Character} Character */
/** @typedef {import('../../src/endpoints/stats.js').UserStatsCollection} UserStatsCollection */
/** @typedef {import('../../src/endpoints/stats.js').CharacterStats} CharacterStats */
/** @typedef {import('../../src/endpoints/stats.js').ChatStats} ChatStats */
/** @typedef {import('../../src/endpoints/stats.js').MessageStats} MessageStats */
/** @typedef {import('../../src/endpoints/stats.js').StatsRequestBody} StatsRequestBody */
/**
* Creates an HTML stat block.
*
* @param {string} statName - The name of the stat to be displayed.
* @param {number|string} statValue - The value of the stat to be displayed.
* @returns {string} - An HTML string representing the stat block.
* @typedef {object} AggregateStat
* @property {number} count - The number of stats used for this aggregation - used for recalculating avg
* @property {number} total - Total / Sum
* @property {number} min - Minimum value
* @property {number} max - Maximum value
* @property {number} avg - Average value
* @property {number[]} values - All values listed and saved, so the aggregate stats can be updated if needed when elements get removed
* @property {number?} subCount - The number of stats used when this is aggregated over the totals of aggregated stats, meaning based on any amount of sub/inner values
*/
function createStatBlock(statName, statValue) {
return `<div class="rm_stat_block">
<div class="rm_stat_name">${statName}:</div>
<div class="rm_stat_value">${statValue}</div>
/**
* @typedef {object} StatField A stat block value to print
* @property {any} value - The value to print
* @property {boolean} [isHeader=false] - Flag indicating whether this is a header
* @property {string|null} [info=null] - Optional text that will be shown as an info icon
* @property {string|'info'|null} [title=null] - Optional title for the value - if set to 'info', info will be used as title too
* @property {string[]|null} [classes=null] - Optional list of classes for the stat field
*/
/**
* @typedef {object} AggBuildOptions Blah
* @property {string | {singular: string, plural: string}} [options.basedOn='chat'] -
* @property {string | {singular: string, plural: string}} [options.basedOnSub='message'] -
* @property {boolean} [options.excludeTotal=false] - Exclude
* @property {((value: *) => string)} [options.transform=null] -
*/
/** @type {AggBuildOptions} */
const DEFAULT_AGG_BUILD_OPTIONS = { basedOn: 'chat', basedOnSub: 'message', excludeTotal: false, transform: null };
/**
* Gets the fields for an aggregated value
* @param {AggregateStat} agg -
* @param {AggBuildOptions} [options=DEFAULT_AGG_BUILD_OPTIONS] -
* @returns {StatField[]}
*/
function aggregateFields(agg, options = DEFAULT_AGG_BUILD_OPTIONS) {
options = { ...DEFAULT_AGG_BUILD_OPTIONS, ...options };
const basedOn = (typeof options.basedOn !== 'object' || options.basedOn === null) ? { singular: `${options.basedOn}`, plural: `${options.basedOn}s` } : options.basedOn;
const basedOnSub = (typeof options.basedOnSub !== 'object' || options.basedOnSub === null) ? { singular: `${options.basedOnSub}`, plural: `${options.basedOnSub}s` } : options.basedOnSub;
/** @param {*|number} val @param {string} name @returns {StatField} */
const build = (val, name) => {
// Apply transform and rounding
let value = options.transform ? options.transform(val) : val;
value = typeof value === 'number' ? sensibleRound(value) : value;
// Build title tooltip
let title = `${name}, based on ${agg.count} ${agg.count !== 1 ? basedOn.plural : basedOn.singular}`
if (agg.subCount) title += ` and ${agg.subCount} ${agg.subCount !== 1 ? basedOnSub.plural : basedOnSub.singular}`;
return { value: value, title: title };
};
return [options.excludeTotal ? null : build(agg.total, 'Total'), build(agg.min, 'Minimum'), build(agg.avg, 'Average'), build(agg.max, 'Maximum')];
}
/** Gets the stat field object for any value @param {StatField|any} x @returns {StatField} */
function statField(x) { return (typeof x === 'object' && x !== null && Object.hasOwn(x, 'value')) ? x : { value: x }; }
/**
* Creates an HTML stat block
*
* @param {StatField|any} name - The name content of the stat to be displayed
* @param {StatField[]|any[]} values - Value or values to be listed for the stat block
* @returns {string} - An HTML string representing the stat block
*/
function createStatBlock(name, ...values) {
/** @param {StatField} stat @returns {string} */
function buildField(stat) {
const classes = ['rm_stat_field', stat.isHeader ? 'rm_stat_header' : '', ...(stat.classes ?? [])].filter(x => x?.length);
return `<div class="${classes.join(' ')}" ${stat.title ? `title="${stat.title === 'info' ? stat.info : stat.title}"` : ''}>
${stat.value === null || stat.value === '' ? '&zwnj;' : stat.value}
${stat.info ? `<small><div class="fa-solid fa-circle-info opacity50p" data-i18n="[title]${stat.info}" title="${stat.info}"></div></small>` : ''}
</div>`;
}
const statName = statField(name);
const statValues = values.flat(Infinity).map(statField);
const isDataRow = !statName.isHeader && !statValues.some(x => x.isHeader);
const isRightSpacing = statValues.slice(-1)[0]?.classes?.includes('rm_stat_right_spacing');
// Hack right spacing, which is added via a value just having the class
if (isRightSpacing) {
statValues.pop();
}
const classes = ['rm_stat_block', isDataRow ? 'rm_stat_block_data_row' : null, isRightSpacing ? 'rm_stat_right_spacing' : null].filter(x => x?.length);
return `<div class="${classes.join(' ')}">
<div class="rm_stat_name">${buildField(statName)}</div>
<div class="rm_stat_values">${statValues.map(x => buildField(x)).join('')}</div>
</div>`;
}
/**
* Verifies and returns a numerical stat value. If the provided stat is not a number, returns 0.
*
* @param {number|string} stat - The stat value to be checked and returned.
* @returns {number} - The stat value if it is a number, otherwise 0.
* Show the stats popup for a given stats report
* @param {string} html - The html report that should be shown in the popup
*/
function verifyStatValue(stat) {
return isNaN(Number(stat)) ? 0 : Number(stat);
function showStatsPopup(html) {
callPopup(html, 'text', '', { wider: true, allowVerticalScrolling: true });
}
/**
* Calculates total stats from character statistics.
*
* @returns {Object} - Object containing total statistics.
*/
function calculateTotalStats() {
let totalStats = {
total_gen_time: 0,
user_msg_count: 0,
non_user_msg_count: 0,
user_word_count: 0,
non_user_word_count: 0,
total_swipe_count: 0,
date_last_chat: 0,
date_first_chat: new Date('9999-12-31T23:59:59.999Z').getTime(),
};
for (let stats of Object.values(charStats)) {
totalStats.total_gen_time += verifyStatValue(stats.total_gen_time);
totalStats.user_msg_count += verifyStatValue(stats.user_msg_count);
totalStats.non_user_msg_count += verifyStatValue(
stats.non_user_msg_count,
);
totalStats.user_word_count += verifyStatValue(stats.user_word_count);
totalStats.non_user_word_count += verifyStatValue(
stats.non_user_word_count,
);
totalStats.total_swipe_count += verifyStatValue(
stats.total_swipe_count,
);
if (verifyStatValue(stats.date_last_chat) != 0) {
totalStats.date_last_chat = Math.max(
totalStats.date_last_chat,
stats.date_last_chat,
);
}
if (verifyStatValue(stats.date_first_chat) != 0) {
totalStats.date_first_chat = Math.min(
totalStats.date_first_chat,
stats.date_first_chat,
);
}
}
return totalStats;
}
const HMTL_STAT_SPACER = '<div class="rm_stat_spacer"></div>';
const VAL_RIGHT_SPACING = { value: null, classes: ['rm_stat_right_spacing'] };
const BASED_ON_MES_PLUS_SWIPE = { singular: 'message and its swipes', plural: 'messages and their swipes' };
const HOVER_TOOLTIP_SUFFIX = '\n\nHover over any value to see what it is based on.';
const GEN_TOKEN_WARNING = '(Token count is only correct, if setting \'Message Token Count\' was turned on during generation)';
/**
* Generates an HTML report of stats.
* Generates an HTML report of character stats ("User" or "Character")
*
* This function creates an HTML report from the provided stats, including chat age,
* chat time, number of user messages and character messages, word count, and swipe count.
* The stat blocks are tailored depending on the stats type ("User" or "Character").
*
* @param {string} statsType - The type of stats (e.g., "User", "Character").
* @param {Object} stats - The stats data. Expected keys in this object include:
* total_gen_time - total generation time
* date_first_chat - timestamp of the first chat
* date_last_chat - timestamp of the most recent chat
* user_msg_count - count of user messages
* non_user_msg_count - count of non-user messages
* user_word_count - count of words used by the user
* non_user_word_count - count of words used by the non-user
* total_swipe_count - total swipe count
* @param {'user'|'character'} statsType - The type of stats (e.g., "User", "Character")
* @param {CharacterStats} stats - The stats data
* @returns {string} The html
*/
function createHtml(statsType, stats) {
// Get time string
let timeStirng = humanizeGenTime(stats.total_gen_time);
let chatAge = 'Never';
if (stats.date_first_chat < Date.now()) {
chatAge = moment
.duration(stats.date_last_chat - stats.date_first_chat)
.humanize();
}
function createCharacterStatsHtml(statsType, stats) {
const NOW = Date.now();
const isChar = statsType === 'character';
// some pre calculations
const mostUsedModel = findHighestModel(stats.genModels);
const charactersCount = !isChar ? (new Set(stats.chatsStats.map(x => x.charName))).size : null;
let subHeader = (() => {
switch (statsType) {
case 'character': return `Overall character stats based on all chats for ${stats.charName}`;
case 'user': return `Global stats based on all chats of ${charactersCount} characters`;
default: return '';
};
})();
// Create popup HTML with stats
let html = `<h3>${statsType} Stats</h3>`;
if (statsType === 'User') {
html += createStatBlock('Chatting Since', `${chatAge} ago`);
} else {
html += createStatBlock('First Interaction', `${chatAge} ago`);
}
html += createStatBlock('Chat Time', timeStirng);
html += createStatBlock('User Messages', stats.user_msg_count);
html += createStatBlock(
'Character Messages',
stats.non_user_msg_count - stats.total_swipe_count,
);
html += createStatBlock('User Words', stats.user_word_count);
html += createStatBlock('Character Words', stats.non_user_word_count);
html += createStatBlock('Swipes', stats.total_swipe_count);
let html = `<h3 class="rm_stat_popup_header">${isChar ? 'Character' : 'User'} Stats - ${isChar ? stats.charName : stats.userName}</h3>`;
html += `<small>${subHeader}</small>`;
callPopup(html, 'text');
// Overview
html += HMTL_STAT_SPACER;
html += createStatBlock({ value: isChar ? 'Character Overview' : 'Overview', isHeader: true });
html += createStatBlock({ value: 'Chats', info: `Number of existing chats with ${stats.charName}\nFor the sake of statistics, Branches count as chats and all their messages will be included.` },
stats.chats, VAL_RIGHT_SPACING);
html += createStatBlock({ value: 'File Size', info: 'Chat file sizes on disk calculated and summed\nThis value might not represent the exact same value your operating system uses.' },
humanFileSize(stats.chatSize), VAL_RIGHT_SPACING);
html += createStatBlock({ value: 'Most Used Model', info: 'Most used model for generations, both messages and swipes\n(Does not include internal generation commands like /gen or /impersonate)\n\nHover over the value to see the numbers behind.' },
{ value: smartTruncate(mostUsedModel.model, 32), title: 'info', info: `${mostUsedModel.model}\nUsed ${mostUsedModel.count} times to generate ${mostUsedModel.tokens} tokens\n\n${GEN_TOKEN_WARNING}` }, VAL_RIGHT_SPACING);
html += HMTL_STAT_SPACER;
html += createStatBlock('',
{ value: 'First', isHeader: true, info: `Data corresponding to the first chat with ${stats.charName}`, title: 'info' },
{ value: 'Last', isHeader: true, info: `Data corresponding to the last chat with ${stats.charName}`, title: 'info' },
VAL_RIGHT_SPACING,
);
html += createStatBlock({ value: 'New Chat', info: 'First/Last time when a new chat was started' },
{ value: humanizedDuration(stats.firstCreateDate, NOW, { wrapper: x => `${x} ago` }), title: stats.firstCreateDate },
{ value: humanizedDuration(stats.lastCreateDate, NOW, { wrapper: x => `${x} ago` }), title: stats.lastCreateDate },
VAL_RIGHT_SPACING,
);
html += createStatBlock({ value: 'Chat Ended', info: 'First/Last time when the interaction was done in a chat' },
{ value: humanizedDuration(stats.firstlastInteractionDate, NOW, { wrapper: x => `${x} ago` }), title: stats.firstlastInteractionDate },
{ value: humanizedDuration(stats.lastLastInteractionDate, NOW, { wrapper: x => `${x} ago` }), title: stats.lastLastInteractionDate },
VAL_RIGHT_SPACING,
);
// Aggregated Stats
html += HMTL_STAT_SPACER;
html += HMTL_STAT_SPACER;
html += createStatBlock({ value: 'Aggregated Stats', isHeader: true, info: 'Values per chat, aggregated over all chats\n\n • Total: Total summed value over all chats\n • Min: Minium value for any chat\n • Avg: Average value over all chats\n • Max: Maximum value for any chat' });
html += createStatBlock(null,
{ value: 'Total', isHeader: true, info: 'Total summed value over all chats', title: 'info' },
{ value: 'Min', isHeader: true, info: 'Minium value for any chat', title: 'info' },
{ value: 'Avg', isHeader: true, info: 'Average value over all chats', title: 'info' },
{ value: 'Max', isHeader: true, info: 'Maximum value for any chat', title: 'info' }
);
html += createStatBlock({ value: 'Chatting Time', info: 'Chatting time per chat\nCalculated based on chat creation and the last interaction in that chat.' + HOVER_TOOLTIP_SUFFIX },
...aggregateFields(stats.chattingTime, { transform: time => humanizeTimespan(time, { short: true }) }));
html += createStatBlock({ value: 'Generation Time', info: 'Generation time per chat\nSummed generation times of all messages and swipes.' + HOVER_TOOLTIP_SUFFIX },
...aggregateFields(stats.genTime, { basedOnSub: BASED_ON_MES_PLUS_SWIPE, transform: time => humanizeTimespan(time, { short: true }) }));
html += createStatBlock({ value: 'Generated Tokens', info: `Generated tokens per chat\nSummed token counts of all messages and swipes.\n${GEN_TOKEN_WARNING}` + HOVER_TOOLTIP_SUFFIX },
...aggregateFields(stats.genTokenCount, { basedOnSub: BASED_ON_MES_PLUS_SWIPE }));
html += HMTL_STAT_SPACER;
html += createStatBlock({ value: 'Swiping Time', info: 'Swiping time per chat\nSummed time spend on generation alternative swipes. Excludes the final message that was chosen to continue the chat.' + HOVER_TOOLTIP_SUFFIX },
...aggregateFields(stats.swipeGenTime, { basedOnSub: BASED_ON_MES_PLUS_SWIPE, transform: time => humanizeTimespan(time, { short: true }) }));
html += createStatBlock({ value: 'Swipes', info: 'Swipes per chat\nCounts all generated messages/swipes that were not chosen to continue the chat.' + HOVER_TOOLTIP_SUFFIX },
...aggregateFields(stats.swipes, { basedOnSub: BASED_ON_MES_PLUS_SWIPE }));
html += HMTL_STAT_SPACER;
html += createStatBlock({ value: 'User Response Time', info: 'User response time per chat\nCalculated based on the time between the last action of the message before and the next user message.\nAs \'action\' counts both the message send time and when the last generation of it ended, even if that swipe wasn\'t chosen.' + HOVER_TOOLTIP_SUFFIX },
...aggregateFields(stats.userResponseTime, { transform: time => humanizeTimespan(time, { short: true }) }));
html += HMTL_STAT_SPACER;
html += createStatBlock({ value: 'Messages', info: 'Messages per chat (excluding swipes)' + HOVER_TOOLTIP_SUFFIX },
...aggregateFields(stats.messages));
html += createStatBlock({ value: 'System Messages', info: 'Sytem messages per chat' + HOVER_TOOLTIP_SUFFIX },
...aggregateFields(stats.systemMessages));
html += createStatBlock({ value: 'Messages (User / Char)', classes: ['rm_stat_field_smaller'], info: 'Messages per chat (excluding swipes)\nSplit into user and character, and showing a bar graph with percentages.' + HOVER_TOOLTIP_SUFFIX },
...buildBarDescsFromAggregates(stats.userMessages, stats.charMessages));
html += createStatBlock({ value: '', info: '' },
...buildBarsFromAggregates(stats.userName, stats.userMessages, stats.charName, stats.charMessages));
html += HMTL_STAT_SPACER;
html += createStatBlock({ value: 'Words', info: 'Word count per chat (excluding swipes)' + HOVER_TOOLTIP_SUFFIX },
...aggregateFields(stats.words));
html += createStatBlock({ value: 'Words (User / Char)', classes: ['rm_stat_field_smaller'], info: 'Word count per chat (excluding swipes)\nSplit into user and character, and showing a bar graph with percentages.' + HOVER_TOOLTIP_SUFFIX },
...buildBarDescsFromAggregates(stats.userWords, stats.charWords));
html += createStatBlock({ value: '', info: '' },
...buildBarsFromAggregates(stats.userName, stats.userWords, stats.charName, stats.charWords));
// Per Message Stats
html += HMTL_STAT_SPACER;
html += HMTL_STAT_SPACER;
html += createStatBlock({ value: 'Per Message Stats', isHeader: true, info: 'Values per message, aggregated over all chats\n\n • Min: Minium value for any message\n • Avg: Average value over all messages\n • Max: Maximum value for any message' });
html += createStatBlock('',
null,
{ value: 'Min', isHeader: true, info: 'Minium value for any message', title: 'info' },
{ value: 'Avg', isHeader: true, info: 'Average value over all messages', title: 'info' },
{ value: 'Max', isHeader: true, info: 'Maximum value for any message', title: 'info' }
);
html += createStatBlock({ value: 'Generation Time', info: 'Generation time per message\nSummed generation times of the message and all swipes.' + HOVER_TOOLTIP_SUFFIX },
...aggregateFields(stats.perMessageGenTime, { basedOn: BASED_ON_MES_PLUS_SWIPE, excludeTotal: true, transform: time => humanizeTimespan(time, { short: true }) }));
html += createStatBlock({ value: 'Generated Tokens', info: `Generated tokens per message\nSummed token counts of the message and all swipes.\n${GEN_TOKEN_WARNING}` + HOVER_TOOLTIP_SUFFIX },
...aggregateFields(stats.perMessageGenTokenCount, { basedOn: BASED_ON_MES_PLUS_SWIPE, excludeTotal: true }));
html += HMTL_STAT_SPACER;
html += createStatBlock({ value: 'Swiping Time', info: 'Swiping time per message\nSummed time spend on generation alternative swipes. Excludes the final message that was chosen to continue the chat.' + HOVER_TOOLTIP_SUFFIX },
...aggregateFields(stats.perMessageSwipeGenTime, { basedOn: BASED_ON_MES_PLUS_SWIPE, excludeTotal: true, transform: time => humanizeTimespan(time, { short: true }) }));
html += createStatBlock({ value: 'Swipes', info: 'Swipes per message\nCounts all generated messages/swipes that were not chosen to continue the chat.' + HOVER_TOOLTIP_SUFFIX },
...aggregateFields(stats.perMessageSwipeCount, { basedOn: BASED_ON_MES_PLUS_SWIPE, excludeTotal: true }));
html += HMTL_STAT_SPACER;
html += createStatBlock({ value: 'User Response Time', info: 'User response time per message\nCalculated based on the time between the last action of the message before and the next user message.\nAs \'action\' counts both the message send time and when the last generation of it ended, even if that swipe wasn\'t chosen.' + HOVER_TOOLTIP_SUFFIX },
...aggregateFields(stats.perMessageUserResponseTime, { basedOn: 'message', excludeTotal: true, transform: time => humanizeTimespan(time, { short: true }) }));
html += HMTL_STAT_SPACER;
html += createStatBlock({ value: 'Words', info: 'Word count per message (excluding swipes)' + HOVER_TOOLTIP_SUFFIX },
...aggregateFields(stats.perMessageWords, { basedOn: 'message', excludeTotal: true }));
html += createStatBlock({ value: 'Words (User / Char)', classes: ['rm_stat_field_smaller'], info: 'Word count per message (excluding swipes)\nSplit into user and character, and showing a bar graph with percentages.' + HOVER_TOOLTIP_SUFFIX },
...buildBarDescsFromAggregates(stats.perMessageUserWords, stats.perMessageCharWords, { basedOn: 'message', excludeTotal: true }));
html += createStatBlock({ value: '', info: '' },
...buildBarsFromAggregates(stats.userName, stats.perMessageUserWords, stats.charName, stats.perMessageCharWords, { basedOn: 'message', excludeTotal: true }));
html += HMTL_STAT_SPACER;
html += `<div class="rm_stat_footer flex-container">
Last updated:
<div class="rm_stat_updated_time" title="${stats._calculated}">${humanizedDuration(stats._calculated, NOW, { wrapper: x => `${x} ago` })}</div>
</div>`;
const avatarBlock = buildAvatarBlock(statsType == 'character' ? stats.characterKey : null);
if (avatarBlock) {
html = avatarBlock + html;
}
return html;
}
/**
* Generates an HTML report of chat stats
*
* @param {ChatStats} stats - The stats data
* @returns {string} The html
*/
function createChatStatsHtml(stats) {
const NOW = Date.now();
// some pre calculations
const mostUsedModel = findHighestModel(stats.genModels);
// Create popup HTML with stats
let html = `<h3 class="rm_stat_popup_header">Chat Stats </h3>`;
html += `<small>Chat stats for chat '${stats.chatName}' <div class="fa-solid fa-circle-info opacity50p" title="File name as saved on the server:\n${stats.chatName}"></div></small>`;
// Chat Overview
html += HMTL_STAT_SPACER;
html += createStatBlock({ value: 'Chat Overview', isHeader: true });
html += createStatBlock({ value: 'File Size', info: 'Chat file size on disk\nThis value might not represent the exact same value your operating system uses.' },
humanFileSize(stats.chatSize), VAL_RIGHT_SPACING);
html += createStatBlock({ value: 'Most Used Model', info: 'Most used model for generations, both messages and swipes\n(Does not include internal generation commands like /gen or /impersonate)\n\nHover over the value to see the numbers behind.' },
{ value: smartTruncate(mostUsedModel.model, 32), title: 'info', info: `${mostUsedModel.model}\nUsed ${mostUsedModel.count} times to generate ${mostUsedModel.tokens} tokens\n\n${GEN_TOKEN_WARNING}` }, VAL_RIGHT_SPACING);
html += HMTL_STAT_SPACER;
html += createStatBlock({ value: 'Chat Created', info: 'Time when this chat was created' },
{ value: humanizedDuration(stats.createDate, NOW, { wrapper: x => `${x} ago` }), title: stats.createDate }, VAL_RIGHT_SPACING);
html += createStatBlock({ value: 'Chat Ended', info: 'Time when the last interaction was done in this chat' },
{ value: humanizedDuration(stats.lastInteractionDate, NOW, { wrapper: x => `${x} ago` }), title: stats.lastInteractionDate }, VAL_RIGHT_SPACING);
html += HMTL_STAT_SPACER;
html += createStatBlock({ value: 'Chatting Time', info: 'Chatting time in this chat\nCalculated based on chat creation and the last interaction in that chat.' },
humanizeTimespan(stats.chattingTime, { short: true }), VAL_RIGHT_SPACING);
// Chat Details
html += HMTL_STAT_SPACER;
html += HMTL_STAT_SPACER;
html += createStatBlock({ value: 'Chat Details', isHeader: true });
html += createStatBlock(null,
{ value: 'Messages', isHeader: true, info: 'Messages in this chat (excluding swipes)', title: 'info' },
{ value: 'Words', isHeader: true, info: 'Words in this chat (excluding swipes)', title: 'info' }
);
html += createStatBlock({ value: 'Total', info: 'Messages/words in this chat (excluding swipes)' },
stats.messages, stats.words.total);
html += createStatBlock({ value: 'System', info: 'Sytem messages in this chat (not counted for words)' },
stats.systemMessages, '-');
html += createStatBlock({ value: '(User / Char)', classes: ['rm_stat_field_smaller'], info: 'Messages/words in this chat (excluding swipes)\nSplit into user and character, and showing a bar graph with percentages.' },
...buildBarDescs(stats.userMessages, stats.charMessages), ...buildBarDescs(stats.userWords.total, stats.charWords.total));
html += createStatBlock({ value: '', info: '' },
buildBar(stats.userName, stats.userMessages, stats.charName, stats.charMessages), buildBar(stats.userName, stats.userWords.total, stats.charName, stats.charWords.total));
// Aggregated Stats
html += HMTL_STAT_SPACER;
html += HMTL_STAT_SPACER;
html += createStatBlock({ value: 'Aggregated Stats', isHeader: true, info: 'Values aggregated over this chat, per message\n\n • Total: Total summed value over this chat\n • Min: Minium value for any message\n • Avg: Average value over all messages\n • Max: Maximum value for any message' });
html += createStatBlock('',
{ value: 'Total', isHeader: true, info: 'Total summed value for this chat', title: 'info' },
{ value: 'Min', isHeader: true, info: 'Minium value for any message', title: 'info' },
{ value: 'Avg', isHeader: true, info: 'Average value over all messages', title: 'info' },
{ value: 'Max', isHeader: true, info: 'Maximum value for any message', title: 'info' }
);
html += createStatBlock({ value: 'Generation Time', info: 'Generation time per message\nSummed generation times of the message and all swipes.' + HOVER_TOOLTIP_SUFFIX },
...aggregateFields(stats.genTime, { basedOn: BASED_ON_MES_PLUS_SWIPE, transform: time => humanizeTimespan(time, { short: true }) }));
html += createStatBlock({ value: 'Generated Tokens', info: `Generated tokens per message\nSummed token counts of the message and all swipes.\n${GEN_TOKEN_WARNING}` + HOVER_TOOLTIP_SUFFIX },
...aggregateFields(stats.genTokenCount, { basedOn: BASED_ON_MES_PLUS_SWIPE }));
html += HMTL_STAT_SPACER;
html += createStatBlock({ value: 'Swiping Time', info: 'Swiping time per message\nSummed time spend on generation alternative swipes. Excludes the final message that was chosen to continue the chat.' + HOVER_TOOLTIP_SUFFIX },
...aggregateFields(stats.swipeGenTime, { basedOn: BASED_ON_MES_PLUS_SWIPE, transform: time => humanizeTimespan(time, { short: true }) }));
html += createStatBlock({ value: 'Swipes', info: 'Swipes per message\nCounts all generated messages/swipes that were not chosen to continue the chat.' + HOVER_TOOLTIP_SUFFIX },
...aggregateFields(stats.swipes, { basedOn: BASED_ON_MES_PLUS_SWIPE }));
html += HMTL_STAT_SPACER;
html += createStatBlock({ value: 'User Response Time', info: 'User response time per message\nCalculated based on the time between the last action of the message before and the next user message.\nAs \'action\' counts both the message send time and when the last generation of it ended, even if that swipe wasn\'t chosen.' + HOVER_TOOLTIP_SUFFIX },
...aggregateFields(stats.userResponseTime, { basedOn: 'message', transform: time => humanizeTimespan(time, { short: true }) }));
html += HMTL_STAT_SPACER;
html += createStatBlock({ value: 'Words', info: 'Word count per message (excluding swipes)' + HOVER_TOOLTIP_SUFFIX },
...aggregateFields(stats.words, { basedOn: 'message' }));
html += createStatBlock({ value: 'Words (User / Char)', classes: ['rm_stat_field_smaller'], info: 'Word count per message (excluding swipes)\nSplit into user and character, and showing a bar graph with percentages.' + HOVER_TOOLTIP_SUFFIX },
...buildBarDescsFromAggregates(stats.userWords, stats.charWords, { basedOn: 'message' }));
html += createStatBlock({ value: '', info: '' },
...buildBarsFromAggregates(stats.userName, stats.userWords, stats.charName, stats.charWords, { basedOn: 'message' }));
html += HMTL_STAT_SPACER;
html += `<div class="rm_stat_footer flex-container">
Last updated:
<div class="rm_stat_updated_time" title="${stats._calculated}">${humanizedDuration(stats._calculated, NOW, { wrapper: x => `${x} ago` })}</div>
</div>`;
const avatarBlock = buildAvatarBlock(stats.characterKey);
if (avatarBlock) {
html = avatarBlock + html;
}
return html;
}
/** Builds the avatar block for a given character, or user avatar if none is given. @param {string?} [characterKey=null] @returns {string} */
function buildAvatarBlock(characterKey = null) {
// Hijack avatar list function to draw the user avatar
let entity = null;
if (characterKey) {
const character = getCharacter(characterKey);
const cid = characters.indexOf(x => x === character);
entity = characterToEntity(character, cid);
} else {
const persona = getPersona(user_avatar);
entity = personaToEntity(persona);
}
if (entity) {
const placeHolder = $('<div class="rm_stat_avatar_block"></div>');
buildAvatarList(placeHolder, [entity]);
return placeHolder.prop('outerHTML');
}
return '';
}
/**
* Finds the model with the highest count and returns its name and values.
*
* @param {{[model: string]: { count: number, tokens: number }}} genModels - Object containing model usages
* @returns {{ model: string, count: number, tokens: number }} - Object containing the name and values of the model with the highest count
*/
function findHighestModel(genModels) {
return Object.entries(genModels).reduce((acc, [model, values]) => {
return values.count > acc.count ? { model: model, count: values.count, tokens: values.tokens } : acc;
}, { model: '<None>', count: 0, tokens: 0 });
}
/** @param {string} userName @param {AggregateStat} aggUser @param {string} charName @param {AggregateStat} aggChar @param {AggBuildOptions} options @returns {StatField[]} */
function buildBarsFromAggregates(userName, aggUser, charName, aggChar, options = DEFAULT_AGG_BUILD_OPTIONS) {
options = { ...DEFAULT_AGG_BUILD_OPTIONS, ...options };
const fUser = aggregateFields(aggUser, options);
const fChar = aggregateFields(aggChar, options);
const bars = fUser.map((_, i) => buildBar(userName, fUser[i]?.value, charName, fChar[i]?.value));
return bars;
}
/** @param {string} userName @param {number} userVal @param {string} charName @param {number} charVal @returns {StatField} */
function buildBar(userName, userVal, charName, charVal) {
const percentUser = (userVal / (userVal + charVal)) * 100;
const percentChar = 100 - percentUser;
const bar = `<div class="rm_stat_bar">
<div style="width: ${percentUser}%" title="${userName}: ${userVal} (${percentUser.toFixed(1)}%)" class="rm_stat_bar_user"></div>
<div style="width: ${percentChar}%" title="${charName}: ${charVal} (${percentChar.toFixed(1)}%)" class="rm_stat_bar_char"></div>
</div>`;
return statField(bar);
}
/** @param {AggregateStat} agg1 @param {AggregateStat} agg2 @param {AggBuildOptions} options @returns {StatField[]} */
function buildBarDescsFromAggregates(agg1, agg2, options = DEFAULT_AGG_BUILD_OPTIONS) {
options = { ...DEFAULT_AGG_BUILD_OPTIONS, ...options };
const f1 = aggregateFields(agg1, options);
const f2 = aggregateFields(agg2, options);
const values = [f1[0], f2[0], f1[1], f2[1], f1[2], f2[2], f1[3], f2[3]];
return buildBarDescs(values);
}
/** @param {any[]} values @returns {StatField[]} */
function buildBarDescs(...values) {
return values.flat(Infinity).map(statField).map((x, i) => i % 2 == 0 ? { classes: [...(x.classes ?? []), 'rm_stat_field_lefty'], ...x } : x);
}
/**
* Handles the user stats by getting them from the server, calculating the total and generating the HTML report.
*/
async function userStatsHandler() {
export async function showUserStatsPopup() {
// Get stats from server
await getStats();
// Calculate total stats
let totalStats = calculateTotalStats();
const userStats = await getUserStats();
// Create HTML with stats
createHtml('User', totalStats);
const html = createCharacterStatsHtml('user', userStats);
showStatsPopup(html);
}
/**
* Handles the character stats by getting them from the server and generating the HTML report.
*
* @param {Object} characters - Object containing character data.
* @param {string} this_chid - The character id.
* @param {string} characterKey - The character key for the character to request stats from
*/
async function characterStatsHandler(characters, this_chid) {
export async function showCharacterStatsPopup(characterKey) {
// Get stats from server
await getStats();
// Get character stats
let myStats = charStats[characters[this_chid].avatar];
if (myStats === undefined) {
myStats = {
total_gen_time: 0,
user_msg_count: 0,
non_user_msg_count: 0,
user_word_count: 0,
non_user_word_count: countWords(characters[this_chid].first_mes),
total_swipe_count: 0,
date_last_chat: 0,
date_first_chat: new Date('9999-12-31T23:59:59.999Z').getTime(),
};
charStats[characters[this_chid].avatar] = myStats;
updateStats();
const charStats = await getCharacterStats(characterKey);
if (charStats === null) {
toastr.info(`No stats exist for character ${getCharacter(characterKey)?.name}.`);
return;
}
// Create HTML with stats
createHtml('Character', myStats);
const html = createCharacterStatsHtml('character', charStats);
showStatsPopup(html);
}
/**
* Handles the chats stats by getting them from the server and generating the HTML report.
*
* @param {string} characterKey - The character key for the character to request stats from
* @param {string} chatName - The name of the chat file
*/
export async function showChatStatsPopup(characterKey, chatName) {
// Get stats from server
const chatStats = await getChatStats(characterKey, chatName);
if (chatStats === null) {
toastr.info(`No stats exist for chat '${chatName}' with character ${getCharacter(characterKey)?.name}.`);
return;
}
// Create HTML with stats
const html = createChatStatsHtml(chatStats);
showStatsPopup(html);
}
/**
* Fetches the user stats (global stats) from the server.
* @returns {Promise<CharacterStats>}
*/
async function getUserStats() {
const stats = await callGetStats({ global: true });
return stats;
}
/**
* Fetches the char stats for a specific character from the server.
* @param {string} characterKey - The character key for the character to request stats from
* @returns {Promise<CharacterStats?>}
*/
async function getCharacterStats(characterKey) {
const stats = await callGetStats({ characterKey: characterKey });
return stats;
}
/**
* Fetches the chat stats for a specific character chat from the server.
* @param {string} characterKey - The character key for the character to request stats from
* @param {string} chatName - The name of the chat file
* @returns {Promise<ChatStats?>}
*/
async function getChatStats(characterKey, chatName) {
const stats = await callGetStats({ characterKey: characterKey, chatName: chatName });
return stats;
}
/**
* Fetches the full stat collection from the server.
* @returns {Promise<UserStatsCollection?>}
*/
async function getFullStatsCollection() {
const stats = await callGetStats();
return stats;
}
/**
* Fetches the character stats from the server.
* For retrieving, use the more specific functions `getCharacterStats`, `getUserStats`, `getChatStats` and `getFullStatsCollection`.
* @param {StatsRequestBody} [params={}] Optional parameter for the get request
* @returns {Promise<object?>} character stats the full stats collection, depending on what was requested
*/
async function getStats() {
async function callGetStats(params = {}) {
const response = await fetch('/api/stats/get', {
method: 'POST',
headers: getRequestHeaders(),
body: JSON.stringify({}),
body: JSON.stringify(params),
cache: 'no-cache',
});
@ -183,7 +524,11 @@ async function getStats() {
toastr.error('Stats could not be loaded. Try reloading the page.');
throw new Error('Error getting stats');
}
charStats = await response.json();
// To use the custom JSON parser, we need to retrieve the body as text first
const bodyText = await response.text();
const stats = parseJson(bodyText);
return stats;
}
/**
@ -211,121 +556,16 @@ async function recreateStats() {
}
}
/**
* Calculates the generation time based on start and finish times.
*
* @param {string} gen_started - The start time in ISO 8601 format.
* @param {string} gen_finished - The finish time in ISO 8601 format.
* @returns {number} - The difference in time in milliseconds.
*/
function calculateGenTime(gen_started, gen_finished) {
if (gen_started === undefined || gen_finished === undefined) {
return 0;
}
let startDate = new Date(gen_started);
let endDate = new Date(gen_finished);
return endDate.getTime() - startDate.getTime();
}
/**
* Sends a POST request to the server to update the statistics.
*/
async function updateStats() {
const response = await fetch('/api/stats/update', {
method: 'POST',
headers: getRequestHeaders(),
body: JSON.stringify(charStats),
});
if (response.status !== 200) {
console.error('Failed to update stats');
console.log(response.status);
}
}
/**
* Returns the count of words in the given string.
* A word is a sequence of alphanumeric characters (including underscore).
*
* @param {string} str - The string to count words in.
* @returns {number} - Number of words.
*/
function countWords(str) {
const match = str.match(/\b\w+\b/g);
return match ? match.length : 0;
}
/**
* Handles stat processing for messages.
*
* @param {Object} line - Object containing message data.
* @param {string} type - The type of the message processing (e.g., 'append', 'continue', 'appendFinal', 'swipe').
* @param {Object} characters - Object containing character data.
* @param {string} this_chid - The character id.
* @param {string} oldMesssage - The old message that's being processed.
*/
async function statMesProcess(line, type, characters, this_chid, oldMesssage) {
if (this_chid === undefined || characters[this_chid] === undefined) {
return;
}
await getStats();
let stat = charStats[characters[this_chid].avatar];
if (!stat) {
stat = {
total_gen_time: 0,
user_word_count: 0,
non_user_msg_count: 0,
user_msg_count: 0,
total_swipe_count: 0,
date_first_chat: Date.now(),
date_last_chat: Date.now(),
};
}
stat.total_gen_time += calculateGenTime(
line.gen_started,
line.gen_finished,
);
if (line.is_user) {
if (type != 'append' && type != 'continue' && type != 'appendFinal') {
stat.user_msg_count++;
stat.user_word_count += countWords(line.mes);
} else {
let oldLen = oldMesssage.split(' ').length;
stat.user_word_count += countWords(line.mes) - oldLen;
}
} else {
// if continue, don't add a message, get the last message and subtract it from the word count of
// the new message
if (type != 'append' && type != 'continue' && type != 'appendFinal') {
stat.non_user_msg_count++;
stat.non_user_word_count += countWords(line.mes);
} else {
let oldLen = oldMesssage.split(' ').length;
stat.non_user_word_count += countWords(line.mes) - oldLen;
}
}
if (type === 'swipe') {
stat.total_swipe_count++;
}
stat.date_last_chat = Date.now();
stat.date_first_chat = Math.min(
stat.date_first_chat ?? new Date('9999-12-31T23:59:59.999Z').getTime(),
Date.now(),
);
updateStats();
}
export function initStats() {
$('.rm_stats_button').on('click', function () {
characterStatsHandler(characters, this_chid);
$('.rm_char_stats_button').on('click', async function () {
await showCharacterStatsPopup(characters[this_chid].avatar);
});
$('.rm_chat_stats_button').on('click', async function () {
await showChatStatsPopup(characters[this_chid].avatar, getCurrentChatId());
});
$('.user_stats_button').on('click', async function () {
await showUserStatsPopup();
});
// Wait for debug functions to load, then add the refresh stats function
registerDebugFunction('refreshStats', 'Refresh Stat File', 'Recreates the stats file based on existing chat files', recreateStats);
}
export { userStatsHandler, characterStatsHandler, getStats, statMesProcess, charStats };

View File

@ -119,6 +119,8 @@ const TAG_FOLDER_DEFAULT_TYPE = 'NONE';
* @property {string} [class] - An optional css class added to the control representing this tag when printed. Used for custom tags in the filters.
* @property {string} [icon] - An optional css class of an icon representing this tag when printed. This will replace the tag name with the icon. Used for custom tags in the filters.
* @property {string} [title] - An optional title for the tooltip of this tag. If there is no tooltip specified, and "icon" is chosen, the tooltip will be the "name" property.
*
* @property {string} [avatar=undefined] - For compatibility with other items, tags have an 'avatar' property, which is not used or filled currently
*/
/**

View File

@ -215,6 +215,49 @@ export function getBase64Async(file) {
});
}
/**
* Parse JSON data with optional reviver function.
* Converts date strings back to Date objects if found.
*
* @param {string} json - The JSON data to parse
* @param {object} [options] - Optional parameters
* @param {Reviver?} [options.reviver=null] - Custom reviver function to customize parsing
* @param {boolean} [options.disableDefaultReviver=false] - Flag to disable the default date parsing reviver
* @returns {object} - The parsed JSON object
*/
export function parseJson(json, { reviver = null, disableDefaultReviver = false } = {}) {
/**
* @typedef {((this: any, key: string, value: any) => any)} Reviver
* @param {object} this -
* @param {string} key - The key of the current property being processed
* @param {*} value - The value of the current property being processed
* @returns {*} - The processed value
*/
/** @type {Reviver} The default reviver, that converts Date strings to Date objects */
function defaultReviver(key, value) {
// Check if the value is a string and can be converted to a Date
if (typeof value === 'string' && /^\d{4}-\d{2}-\d{2}T\d{2}:\d{2}:\d{2}(\.\d{1,3})?Z$/.test(value)) {
return new Date(value);
}
// Return the original value if it's not a date string
return value;
}
// The actual reviver based on the ones given
/** @type {Reviver} */
function actualReviver(key, value) {
if (reviver) value = reviver(key, value);
if (!disableDefaultReviver) value = defaultReviver(key, value);
return value;
};
// Parse the JSON data using the specified or custom reviver function
return JSON.parse(json, actualReviver);
}
/**
* Parses a file blob as a JSON object.
* @param {Blob} file The file to read.
@ -525,24 +568,44 @@ export function trimToStartSentence(input) {
}
/**
* Format bytes as human-readable text.
*
* @param bytes Number of bytes.
* @param si True to use metric (SI) units, aka powers of 1000. False to use
* binary (IEC), aka powers of 1024.
* @param dp Number of decimal places to display.
*
* @return Formatted string.
* Build a humanized string for a duration
* @param {Date|number} start - Start time (as a Date, or in milliseconds)
* @param {Date|number|null} end - End time (as a Date, or in milliseconds), if null will be replaced with Date.now()
* @param {object} param2 - Optional parameters
* @param {string} [param2.fallback='Never'] - Fallback value no duration can be calculated
* @param {function(string): string} [param2.wrapper=null] - Optional function to wrap/format the resulting humanized duration
* @returns {string} Humanized duration string
*/
export function humanFileSize(bytes, si = false, dp = 1) {
export function humanizedDuration(start, end = null, { fallback = 'Never', wrapper = null } = {}) {
const startTime = start instanceof Date ? start.getTime() : start;
const endTime = end instanceof Date ? end.getTime() : end ?? Date.now();
if (!startTime || endTime > endTime) {
return fallback;
}
// @ts-ignore
const humanized = moment.duration(endTime - start).humanize();
return wrapper ? wrapper(humanized) : humanized;
}
/**
* Format bytes as human-readable text
*
* @param bytes Number of bytes
* @param si True to use metric (SI) units, aka powers of 1000. False to use binary (IEC), aka powers of 1024
* @param ibi If `si` is disabled, setting this to True will return unit names as 'KiB', 'MiB' etc. instead of 'KB', 'MB'.
* @param dp Number of decimal places to display
*
* @return Formatted string
*/
export function humanFileSize(bytes, si = false, ibi = false, dp = 1) {
const thresh = si ? 1000 : 1024;
if (Math.abs(bytes) < thresh) {
return bytes + ' B';
}
const units = si
? ['kB', 'MB', 'GB', 'TB', 'PB', 'EB', 'ZB', 'YB']
const units = si || !ibi
? ['KB', 'MB', 'GB', 'TB', 'PB', 'EB', 'ZB', 'YB']
: ['KiB', 'MiB', 'GiB', 'TiB', 'PiB', 'EiB', 'ZiB', 'YiB'];
let u = -1;
const r = 10 ** dp;
@ -1449,3 +1512,72 @@ export function includesIgnoreCaseAndAccents(text, searchTerm) {
// Check if the normalized text includes the normalized search term
return normalizedText.includes(normalizedSearchTerm);
}
/**
* Rounds a number conditionally in a sensible way, based on thresholds
*
* @param {number} number - The number to round
* @param {object} [options={}] - Optional parameters
* @param {{[threshold: number]: number, _: number}} [options.thresholds={ 1: 3, 100: 2, _: 0 }] - Custom rounding thresholds, specified by 'threshold value: rounding decimals'. The default value will be provided with the key '_'.
* @returns {number} - The rounded number
*/
export function sensibleRound(number, { thresholds = { 1: 3, 100: 2, _: 0 } } = {}) {
// Sort thresholds by ascending order of keys
const sortedThresholds = Object.keys(thresholds).map(parseFloat).sort((a, b) => a - b);
// Find the appropriate threshold for rounding
let decimalPlaces = thresholds._ ?? 0;
for (const threshold of sortedThresholds) {
if (number < threshold) {
decimalPlaces = thresholds[threshold];
break;
}
}
return +number.toFixed(decimalPlaces);
}
/**
* Truncates a given text at the end of word boundaries, filling in an ellipsis. The max total length will not exceed the provided value.
* If the word boundaries will make this string too short, it'll make a hard truncate instead to preserve contextual information.
* @param {string} text - The text to truncate
* @param {number} maxLength - max length to truncate to
* @param {string} [ellipsis='…'] - Ellipsis to add if the string was truncated
* @param {number} [minLength=maxLength/2] - A minimum length below which the word boundary trunaction should not go to. If hit, hard truncation at max length will be used
* @returns {string}
*/
export function smartTruncate(text, maxLength, ellipsis = '…', minLength = maxLength / 2) {
if (text.length <= maxLength) {
return text;
}
if (ellipsis.length > maxLength) {
console.warn(`Cannot truncate to length of ${maxLength}, below the length of the ellipsis '${ellipsis}'.`);
return text;
}
const isWord = (char) => /^\w$/.test(char);
const maxTruncLength = maxLength - ellipsis.length;
// If the first character beyond the trunc length is non-word, we can cut at the next word char.
let cutSoon = !isWord(text[maxTruncLength + 1]);
let index = maxTruncLength + 1;
while (index > 0) {
const char = text[index];
// Look for a non-word character to prepare for a cut
if (!isWord(char)) {
cutSoon = true;
} else if (cutSoon) {
break;
}
index--;
}
// If the cut is too close to start, or no appropriate cut point is found, fall back to hard truncation
if (index < minLength) {
return text.slice(0, maxLength - ellipsis.length) + ellipsis;
}
return text.slice(0, index + 1) + ellipsis;
}

View File

@ -2074,10 +2074,6 @@ grammarly-extension {
text-align: right;
}
.rm_stats_button {
cursor: pointer;
}
/* Focus */
#bulk_tag_popup,
@ -2108,11 +2104,6 @@ grammarly-extension {
overflow-x: hidden;
}
.rm_stat_block {
display: flex;
justify-content: space-between;
}
.large_dialogue_popup {
height: 90vh !important;
height: 90svh !important;
@ -2126,12 +2117,8 @@ grammarly-extension {
min-width: var(--sheldWidth);
}
.horizontal_scrolling_dialogue_popup {
overflow-x: unset !important;
}
.vertical_scrolling_dialogue_popup {
overflow-y: unset !important;
.wider_dialogue_popup {
min-width: 750px;
}
#bulk_tag_popup_holder,
@ -2140,15 +2127,26 @@ grammarly-extension {
display: flex;
flex-direction: column;
height: 100%;
overflow-y: hidden;
padding: 0 10px;
}
#dialogue_popup_text,
.dialogue_popup_text {
flex-grow: 1;
overflow-y: auto;
height: 100%;
position: relative;
overflow-x: hidden;
overflow-y: hidden;
max-height: calc(90vh - 50px);
max-height: calc(90svh - 50px);
}
.horizontal_scrolling_dialogue_popup #dialogue_popup_text {
overflow-x: unset;
}
.vertical_scrolling_dialogue_popup #dialogue_popup_text {
overflow-y: unset;
}
#dialogue_popup_controls,
@ -2156,6 +2154,7 @@ grammarly-extension {
display: flex;
align-self: center;
gap: 20px;
height: 40px;
}
#bulk_tag_popup_reset,

File diff suppressed because it is too large Load Diff

View File

@ -232,6 +232,69 @@ async function getImageBuffers(zipFilePath) {
});
}
/**
* Reads the contents of a .jsonl file and returns the lines parsed as json as an array
*
* @param {string} filepath - The path of the file to be read
* @returns {object[]} - The lines in the file
* @throws Will throw an error if the file cannot be read
*/
function readAndParseJsonlFile(filepath) {
try {
// Copied from /chat/get endpoint
const data = fs.readFileSync(filepath, 'utf8');
const lines = data.split('\n');
// Iterate through the array of strings and parse each line as JSON
const jsonData = lines.map((l) => { try { return JSON.parse(l); } catch (_) { return; } }).filter(x => x);
return jsonData;
} catch (error) {
console.error(`Error reading file at ${filepath}: ${error}`);
return [];
}
}
/**
* Parse JSON data with optional reviver function.
* Converts date strings back to Date objects if found.
*
* @param {string} json - The JSON data to parse
* @param {object} [options] - Optional parameters
* @param {Reviver?} [options.reviver=null] - Custom reviver function to customize parsing
* @param {boolean} [options.disableDefaultReviver=false] - Flag to disable the default date parsing reviver
* @returns {object} - The parsed JSON object
*/
function parseJson(json, { reviver = null, disableDefaultReviver = false } = {}) {
/**
* @typedef {((this: any, key: string, value: any) => any)} Reviver
* @param {object} this -
* @param {string} key - The key of the current property being processed
* @param {*} value - The value of the current property being processed
* @returns {*} - The processed value
*/
/** @type {Reviver} The default reviver, that converts Date strings to Date objects */
function defaultReviver(key, value) {
// Check if the value is a string and can be converted to a Date
if (typeof value === 'string' && /^\d{4}-\d{2}-\d{2}T\d{2}:\d{2}:\d{2}(\.\d{1,3})?Z$/.test(value)) {
return new Date(value);
}
// Return the original value if it's not a date string
return value;
}
// The actual reviver based on the ones given
/** @type {Reviver} */
function actualReviver(key, value) {
if (reviver) value = reviver(key, value);
if (!disableDefaultReviver) value = defaultReviver(key, value);
return value;
};
// Parse the JSON data using the specified or custom reviver function
return JSON.parse(json, actualReviver);
}
/**
* Gets all chunks of data from the given readable stream.
* @param {any} readableStream Readable stream to read from
@ -547,6 +610,162 @@ function trimV1(str) {
return String(str ?? '').replace(/\/$/, '').replace(/\/v1$/, '');
}
/**
* Convert a timestamp to an integer timestamp.
* (sorry, it's momentless for now, didn't want to add a package just for this)
* This function can handle several different timestamp formats:
* 1. Unix timestamps (the number of seconds since the Unix Epoch)
* 2. ST "humanized" timestamps, formatted like "YYYY-MM-DD &#64;HHh MMm SSs ms"
* 3. Date strings in the format "Month DD, YYYY H:MMam/pm"
*
* The function returns the timestamp as the number of milliseconds since
* the Unix Epoch, which can be converted to a JavaScript Date object with new Date().
*
* @param {string|number} timestamp - The timestamp to convert.
* @returns {number|null} The timestamp in milliseconds since the Unix Epoch, or null if the input cannot be parsed.
*
* @example
* // Unix timestamp
* timestampToMoment(1609459200);
* // ST humanized timestamp
* timestampToMoment("2021-01-01 &#64;00h 00m 00s 000ms");
* // Date string
* timestampToMoment("January 1, 2021 12:00am");
*/
function timestampToMoment(timestamp) {
if (!timestamp) {
return null;
}
if (typeof timestamp === 'number') {
return timestamp;
}
const pattern1 =
/(\d{4})-(\d{1,2})-(\d{1,2}) ?@(\d{1,2})h ?(\d{1,2})m ?(\d{1,2})s ?(?:(\d{1,3})ms)?/;
const replacement1 = (
match,
year,
month,
day,
hour,
minute,
second,
millisecond,
) => {
return `${year}-${month.padStart(2, '0')}-${day.padStart(
2,
'0',
)}T${hour.padStart(2, '0')}:${minute.padStart(
2,
'0',
)}:${second.padStart(2, '0')}.${(millisecond ?? '0').padStart(3, '0')}Z`;
};
const isoTimestamp1 = timestamp.replace(pattern1, replacement1);
if (!isNaN(Date.parse(isoTimestamp1))) {
return new Date(isoTimestamp1).getTime();
}
const pattern2 = /(\w+)\s(\d{1,2}),\s(\d{4})\s(\d{1,2}):(\d{1,2})(am|pm)/i;
const replacement2 = (match, month, day, year, hour, minute, meridiem) => {
const monthNames = [
'January',
'February',
'March',
'April',
'May',
'June',
'July',
'August',
'September',
'October',
'November',
'December',
];
const monthNum = monthNames.indexOf(month) + 1;
const hour24 =
meridiem.toLowerCase() === 'pm'
? (parseInt(hour, 10) % 12) + 12
: parseInt(hour, 10) % 12;
return `${year}-${monthNum.toString().padStart(2, '0')}-${day.padStart(
2,
'0',
)}T${hour24.toString().padStart(2, '0')}:${minute.padStart(
2,
'0',
)}:00Z`;
};
const isoTimestamp2 = timestamp.replace(pattern2, replacement2);
if (!isNaN(Date.parse(isoTimestamp2))) {
return new Date(isoTimestamp2).getTime();
}
return null;
}
/**
* Calculates the time difference between two dates.
*
* @param {Date|string} startTime - The start time in ISO 8601 format, or as a Date object
* @param {Date|string} endTime - The finish time in ISO 8601 format, or as a Date object
* @returns {number} - The difference in time in milliseconds, or 0 if invalid dates are provided or if start date is after end date.
*/
function calculateDuration(startTime, endTime) {
const startDate = startTime instanceof Date ? startTime : new Date(startTime);
const endDate = endTime instanceof Date ? endTime : new Date(endTime);
return startDate > endDate ? 0 : Math.max(endDate.getTime() - startDate.getTime(), 0);
}
/** @param {string} timestamp @returns {Date|null} */
function humanizedToDate(timestamp) {
const moment = timestampToMoment(timestamp);
return moment ? new Date(moment) : null;
}
/**
* Returns the maximum from all supplied dates
* @param {...Date} dates
* @returns {Date?}
*/
function maxDate(...dates) {
dates = dates.flat(Infinity);
if (dates.length == 0) return null;
/** @type {Date?} */
let max = null;
for (const date of dates) {
if (max === null || date > max) {
max = date;
}
}
return max;
}
/**
* Returns the minimum from all supplied dates
* @param {...Date} dates
* @returns {Date?}
*/
function minDate(...dates) {
dates = dates.flat(Infinity);
if (dates.length == 0) return null;
/** @type {Date?} */
let min = null;
for (const date of dates) {
if (min === null || date < min) {
min = date;
}
}
return min;
}
/**
* Returns the current date and time
* (Why the fuck is `Date.now()` returning a timestamp and no date... I don't get it)
* @returns {Date}
*/
function now() { return new Date(Date.now()); }
/**
* Simple TTL memory cache.
*/
@ -610,6 +829,8 @@ module.exports = {
getBasicAuthHeader,
extractFileFromZipBuffer,
getImageBuffers,
readAndParseJsonlFile,
parseJson,
readAllChunks,
delay,
deepMerge,
@ -627,6 +848,12 @@ module.exports = {
mergeObjectWithYaml,
excludeKeysByYaml,
trimV1,
timestampToMoment,
calculateDuration,
humanizedToDate,
maxDate,
minDate,
now,
Cache,
makeHttp2Request,
};