Fretux/KrisHD_AI
3
0
Fork 0
Code Issues 3 Pull Requests Actions Packages Projects 1 Releases Wiki Activity

Move persona market to its own page

Browse Source
This commit is contained in:
Fretux
2026-01-14 14:53:56 +01:00
parent 6685080b4f
commit b14ede6d48
5 changed files with 272 additions and 90 deletions
Download Patch File Download Diff File Expand all files Collapse all files
public/script.js
+13 -69
View File
@@ -41,9 +41,6 @@ const personaModal = document.getElementById("personaModal");
const personaCloseBtn = document.getElementById("personaClose");
const personaMenuButton = document.getElementById("personaMenuButton");
const personaPopover = document.getElementById("personaPopover");
const marketPersonaList = document.getElementById("marketPersonaList");
const marketUserPersonaList = document.getElementById("marketUserPersonaList");
const refreshMarketBtn = document.getElementById("refreshMarket");
let isProcessing = false;
let chatSessions = [];
@@ -54,7 +51,6 @@ let activePersonaId = null;
let activeUserPersonaId = null;
let editingPersonaId = null;
let editingPersonaType = "assistant";
let marketPersonas = [];
let publishedPersonaIds = new Set();
const displayModels = async () => {
@@ -214,15 +210,15 @@ function setActivePersonaStatus() {
assistantPersonas,
activePersonaId,
activePersonaStatus,
'No persona equipped.',
'AI equipped'
'No AI persona equipped.',
'AI persona equipped'
);
updateActivePersonaStatus(
userPersonas,
activeUserPersonaId,
activeUserPersonaStatus,
'No user persona set.',
'You are'
'User persona active'
);
clearPersonaBtn.disabled = !activePersonaId;
clearUserPersonaBtn.disabled = !activeUserPersonaId;
@@ -278,8 +274,15 @@ function renderPersonaList(personaItems, activeId, listElement, personaType) {
personaItems.forEach(persona => {
const item = document.createElement('div');
item.className = `persona-item${persona.id === activeId ? ' active' : ''}`;
const titleRow = document.createElement('div');
titleRow.className = 'persona-title-row';
const title = document.createElement('h4');
title.textContent = persona.name;
const roleTag = document.createElement('span');
roleTag.className = `persona-role-tag ${personaType === "user" ? "user" : "ai"}`;
roleTag.textContent = personaType === "user" ? "You" : "AI";
titleRow.appendChild(title);
titleRow.appendChild(roleTag);
const meta = document.createElement('p');
meta.textContent = persona.pronouns ? `Pronouns: ${persona.pronouns}` : 'Pronouns: —';
const actions = document.createElement('div');
@@ -287,7 +290,8 @@ function renderPersonaList(personaItems, activeId, listElement, personaType) {
const equipBtn = document.createElement('button');
equipBtn.type = 'button';
equipBtn.textContent = persona.id === activeId ? 'Equipped' : 'Equip';
const equipLabel = personaType === "user" ? "Equip as You" : "Equip as AI";
equipBtn.textContent = persona.id === activeId ? `${equipLabel} (Active)` : equipLabel;
equipBtn.disabled = persona.id === activeId;
equipBtn.addEventListener('click', () => equipPersona(persona.id, personaType));
@@ -312,7 +316,7 @@ function renderPersonaList(personaItems, activeId, listElement, personaType) {
actions.appendChild(publishBtn);
actions.appendChild(deleteBtn);
item.appendChild(title);
item.appendChild(titleRow);
item.appendChild(meta);
item.appendChild(actions);
listElement.appendChild(item);
@@ -332,49 +336,6 @@ async function loadPersonas() {
renderPersonaList(userPersonas, activeUserPersonaId, userPersonaList, "user");
}
function renderMarketList(personaItems, listElement) {
listElement.innerHTML = '';
if (!personaItems.length) {
const empty = document.createElement('p');
empty.className = 'status persona-status';
empty.textContent = 'No market personas yet. Be the first to publish!';
listElement.appendChild(empty);
return;
}
personaItems.forEach(persona => {
const item = document.createElement('div');
item.className = 'persona-item';
const title = document.createElement('h4');
title.textContent = persona.name;
const meta = document.createElement('p');
const pronouns = persona.pronouns ? `Pronouns: ${persona.pronouns}` : 'Pronouns: —';
meta.textContent = `By ${persona.creator_username} • ${pronouns}`;
const actions = document.createElement('div');
actions.className = 'persona-item-actions';
const getBtn = document.createElement('button');
getBtn.type = 'button';
getBtn.textContent = 'Get & equip';
getBtn.addEventListener('click', () => collectMarketPersona(persona.id, persona.persona_type));
actions.appendChild(getBtn);
item.appendChild(title);
item.appendChild(meta);
item.appendChild(actions);
listElement.appendChild(item);
});
}
async function loadMarketPersonas() {
const res = await get('/personas/market');
if (res.error) return;
marketPersonas = res.personas || [];
const assistantMarket = marketPersonas.filter(persona => persona.persona_type === 'assistant');
const userMarket = marketPersonas.filter(persona => persona.persona_type === 'user');
renderMarketList(assistantMarket, marketPersonaList);
renderMarketList(userMarket, marketUserPersonaList);
}
async function equipPersona(personaId, personaType) {
const endpoint = personaType === "user"
? `/personas/${personaId}/equip-user`
@@ -439,18 +400,6 @@ async function publishPersona(personaId) {
const res = await post(`/personas/${personaId}/publish`, {});
if (res.error) return;
await loadPersonas();
await loadMarketPersonas();
}
async function collectMarketPersona(marketId, personaType) {
const res = await post(`/personas/market/${marketId}/collect`, {equip: true});
if (res.error) return;
if (personaType === "user") {
activeUserPersonaId = res.activeUserPersonaId || res.persona?.id || null;
} else {
activePersonaId = res.activePersonaId || res.persona?.id || null;
}
await loadPersonas();
}
function setLoadingState(loading) {
@@ -568,7 +517,6 @@ async function checkSession() {
chatDiv.style.display = "block";
await loadChatSessions();
await loadPersonas();
await loadMarketPersonas();
msgInput.focus();
return true;
}
@@ -578,7 +526,6 @@ async function checkSession() {
async function loadServerChat() {
await loadChatSessions();
await loadPersonas();
await loadMarketPersonas();
}
async function handleAuth(endpoint, credentials) {
@@ -689,7 +636,6 @@ document.getElementById("logout").onclick = async () => {
userPersonas = [];
activePersonaId = null;
activeUserPersonaId = null;
marketPersonas = [];
publishedPersonaIds = new Set();
setAuthMessage("Logged out.", 'success');
showAuthScreen('login');
@@ -733,8 +679,6 @@ clearPersonaBtn.addEventListener('click', () => clearPersona("assistant"));
clearUserPersonaBtn.addEventListener('click', () => clearPersona("user"));
refreshMarketBtn.addEventListener('click', () => loadMarketPersonas());
personaForm.addEventListener('submit', (event) => {
event.preventDefault();
savePersona();