-
${characterName}
+
+ ${characterName}
+
+
diff --git a/public/script.js b/public/script.js
index 8cb473f50..65ab8e5fb 100644
--- a/public/script.js
+++ b/public/script.js
@@ -1,4 +1,4 @@
-import { humanizedDateTime, favsToHotswap } from "./scripts/RossAscends-mods.js";
+import { humanizedDateTime, favsToHotswap, getMessageTimeStamp } from "./scripts/RossAscends-mods.js";
import { encode } from "../scripts/gpt-2-3-tokenizer/mod.js";
import { GPT3BrowserTokenizer } from "../scripts/gpt-3-tokenizer/gpt3-tokenizer.js";
import {
@@ -1090,6 +1090,7 @@ function getMessageFromTemplate({
timerTitle,
bookmarkLink,
forceAvatar,
+ timestamp,
} = {}) {
const mes = $('#message_template .mes').clone();
mes.attr({
@@ -1099,10 +1100,12 @@ function getMessageFromTemplate({
'is_system': !!isSystem,
'bookmark_link': bookmarkLink,
'force_avatar': !!forceAvatar,
+ 'timestamp': timestamp,
});
mes.find('.avatar img').attr('src', avatarImg);
mes.find('.ch_name .name_text').text(characterName);
mes.find('.mes_bias').html(bias);
+ mes.find('.timestamp').text(timestamp);
title && mes.attr('title', title);
timerValue && mes.find('.mes_timer').attr('title', timerTitle).text(timerValue);
@@ -1150,6 +1153,7 @@ export function addCopyToCodeBlocks(messageElement) {
function addOneMessage(mes, { type = "normal", insertAfter = null, scroll = true } = {}) {
var messageText = mes["mes"];
+ var timestamp = mes.send_date;
if (mes?.extra?.display_text) {
messageText = mes.extra.display_text;
@@ -1211,6 +1215,7 @@ function addOneMessage(mes, { type = "normal", insertAfter = null, scroll = true
title: title,
bookmarkLink: bookmarkLink,
forceAvatar: mes.force_avatar,
+ timestamp: timestamp,
...formatGenerationTimer(mes.gen_started, mes.gen_finished),
};
@@ -2639,7 +2644,7 @@ export async function sendMessageAsUser(textareaText, messageBias) {
chat[chat.length - 1]['name'] = name1;
chat[chat.length - 1]['is_user'] = true;
chat[chat.length - 1]['is_name'] = true;
- chat[chat.length - 1]['send_date'] = humanizedDateTime();
+ chat[chat.length - 1]['send_date'] = getMessageTimeStamp();
chat[chat.length - 1]['mes'] = substituteParams(textareaText);
chat[chat.length - 1]['extra'] = {};
@@ -3343,7 +3348,7 @@ function saveReply(type, getMessage, this_mes_is_name, title) {
chat[chat.length - 1]['name'] = name2;
chat[chat.length - 1]['is_user'] = false;
chat[chat.length - 1]['is_name'] = this_mes_is_name;
- chat[chat.length - 1]['send_date'] = humanizedDateTime();
+ chat[chat.length - 1]['send_date'] = getMessageTimeStamp();
getMessage = $.trim(getMessage);
chat[chat.length - 1]['mes'] = getMessage;
chat[chat.length - 1]['title'] = title;
@@ -3742,7 +3747,7 @@ async function getChatResult() {
name: name2,
is_user: false,
is_name: true,
- send_date: humanizedDateTime(),
+ send_date: getMessageTimeStamp(),
mes: firstMes,
};
diff --git a/public/scripts/RossAscends-mods.js b/public/scripts/RossAscends-mods.js
index 8638fb529..8dec587fd 100644
--- a/public/scripts/RossAscends-mods.js
+++ b/public/scripts/RossAscends-mods.js
@@ -177,6 +177,29 @@ export function humanizedDateTime() {
return HumanizedDateTime;
}
+//this is a common format version to display a timestamp on each chat message
+//returns something like: June 19, 2023 2:20pm
+export function getMessageTimeStamp() {
+ const date = Date.now();
+ const months = ['January', 'February', 'March', 'April', 'May', 'June', 'July', 'August', 'September', 'October', 'November', 'December'];
+ const d = new Date(date);
+ const month = months[d.getMonth()];
+ const day = d.getDate();
+ const year = d.getFullYear();
+ let hours = d.getHours();
+ const minutes = ('0' + d.getMinutes()).slice(-2);
+ let meridiem = 'am';
+ if (hours >= 12) {
+ meridiem = 'pm';
+ hours -= 12;
+ }
+ if (hours === 0) {
+ hours = 12;
+ }
+ const formattedDate = month + ' ' + day + ', ' + year + ' ' + hours + ':' + minutes + meridiem;
+ return formattedDate;
+}
+
// triggers:
$("#rm_button_create").on("click", function () { //when "+New Character" is clicked
diff --git a/public/scripts/power-user.js b/public/scripts/power-user.js
index 0a4f1d592..c9cd5449b 100644
--- a/public/scripts/power-user.js
+++ b/public/scripts/power-user.js
@@ -134,6 +134,7 @@ let power_user = {
allow_name2_display: false,
hotswap_enabled: true,
timer_enabled: true,
+ timestamps_enabled: true,
max_context_unlocked: false,
prefer_character_prompt: true,
prefer_character_jailbreak: true,
@@ -182,6 +183,7 @@ const storage_keys = {
hotswap_enabled: 'HotswapEnabled',
timer_enabled: 'TimerEnabled',
+ timestamps_enabled: 'TimestampsEnabled',
};
let browser_has_focus = true;
@@ -252,6 +254,13 @@ function switchTimer() {
$("#messageTimerEnabled").prop("checked", power_user.timer_enabled);
}
+function switchTimestamps() {
+ const value = localStorage.getItem(storage_keys.timestamps_enabled);
+ power_user.timestamps_enabled = value === null ? true : value == "true";
+ $("body").toggleClass("no-timestamps", !power_user.timestamps_enabled);
+ $("#messageTimestampsEnabled").prop("checked", power_user.timestamps_enabled);
+}
+
function switchUiMode() {
const fastUi = localStorage.getItem(storage_keys.fast_ui_mode);
power_user.fast_ui_mode = fastUi === null ? true : fastUi == "true";
@@ -447,6 +456,13 @@ async function applyTheme(name) {
switchTimer();
}
},
+ {
+ key: 'timestamps_enabled',
+ action: async () => {
+ localStorage.setItem(storage_keys.timestamps_enabled, power_user.timestamps_enabled);
+ switchTimestamps();
+ }
+ },
{
key: 'hotswap_enabled',
action: async () => {
@@ -484,6 +500,7 @@ switchMovingUI();
noShadows();
switchHotswap();
switchTimer();
+switchTimestamps();
function loadPowerUserSettings(settings, data) {
// Load from settings.json
@@ -505,11 +522,13 @@ function loadPowerUserSettings(settings, data) {
const noShadows = localStorage.getItem(storage_keys.noShadows);
const hotswap = localStorage.getItem(storage_keys.hotswap_enabled);
const timer = localStorage.getItem(storage_keys.timer_enabled);
+ const timestamps = localStorage.getItem(storage_keys.timestamps_enabled);
power_user.fast_ui_mode = fastUi === null ? true : fastUi == "true";
power_user.movingUI = movingUI === null ? false : movingUI == "true";
power_user.noShadows = noShadows === null ? false : noShadows == "true";
power_user.hotswap_enabled = hotswap === null ? true : hotswap == "true";
power_user.timer_enabled = timer === null ? true : timer == "true";
+ power_user.timestamps_enabled = timestamps === null ? true : timestamps == "true";
power_user.avatar_style = Number(localStorage.getItem(storage_keys.avatar_style) ?? avatar_styles.ROUND);
power_user.chat_display = Number(localStorage.getItem(storage_keys.chat_display) ?? chat_styles.DEFAULT);
power_user.sheld_width = Number(localStorage.getItem(storage_keys.sheld_width) ?? sheld_width.DEFAULT);
@@ -554,6 +573,7 @@ function loadPowerUserSettings(settings, data) {
$("#allow_name2_display").prop("checked", power_user.allow_name2_display);
$("#hotswapEnabled").prop("checked", power_user.hotswap_enabled);
$("#messageTimerEnabled").prop("checked", power_user.timer_enabled);
+ $("#messageTimestampsEnabled").prop("checked", power_user.timestamps_enabled);
$("#prefer_character_prompt").prop("checked", power_user.prefer_character_prompt);
$("#prefer_character_jailbreak").prop("checked", power_user.prefer_character_jailbreak);
$(`input[name="avatar_style"][value="${power_user.avatar_style}"]`).prop("checked", true);
@@ -809,6 +829,7 @@ async function saveTheme() {
noShadows: power_user.noShadows,
sheld_width: power_user.sheld_width,
timer_enabled: power_user.timer_enabled,
+ timestamps_enabled: power_user.timestamps_enabled,
hotswap_enabled: power_user.hotswap_enabled,
};
@@ -1251,6 +1272,13 @@ $(document).ready(() => {
switchTimer();
});
+ $("#messageTimestampsEnabled").on("input", function () {
+ const value = !!$(this).prop('checked');
+ power_user.timestamps_enabled = value;
+ localStorage.setItem(storage_keys.timestamps_enabled, power_user.timestamps_enabled);
+ switchTimestamps();
+ });
+
$("#hotswapEnabled").on("input", function () {
const value = !!$(this).prop('checked');
power_user.hotswap_enabled = value;
diff --git a/public/style.css b/public/style.css
index 5a72e4fa3..83e83adf2 100644
--- a/public/style.css
+++ b/public/style.css
@@ -768,6 +768,10 @@ body.no-timer .mes_timer {
display: none !important;
}
+body.no-timestamps .timestamp {
+ display: none !important;
+}
+
body.big-avatars .avatar {
width: 60px;
height: 90px;
@@ -4305,6 +4309,11 @@ body.waifuMode #avatar_zoom_popup {
gap: 5px;
}
+.timestamp {
+ font-size: calc(var(--mainFontSize) * 0.7);
+ font-weight: 400;
+}
+
/* ---------- @media queries must always go at the bottom ------------*/
/*will apply to anything 1000px or less. this catches ipads, horizontal phones, and vertical phones)*/