Skip to content

Commit

Permalink
improved ignoring of messages and display settings
Browse files Browse the repository at this point in the history
  • Loading branch information
@LeoFidjeland
LeoFidjeland committed Apr 2, 2024
1 parent 96e6051 commit 0b25dcc
Show file tree
Hide file tree
Showing 4 changed files with 80 additions and 61 deletions.
2 changes: 1 addition & 1 deletion public/index.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -19,7 +19,6 @@ <h3>model options</h3>
<br><h3>server options</h3>
trim response to last complete sentance: <input type="checkbox" id="trim-response-to-full-sentance"><br>
trim response to last complete paragraph: <input type="checkbox" id="trim-response-to-full-paragraph" checked><br>
showed trimmed content: <input type="checkbox" id="show-trimmed" checked><br>
conversation max length: <input type="number" id="conversation-max-length" placeholder="conversation max length" value="10"><br/>

Reset everything to default: <button id="factoryResetButton">Factory Reset</button>
Expand Down Expand Up @@ -89,6 +88,7 @@ <h3>human input</h3>
<div id="end-message"></div>
<div id="spinner" class="loader" style="display: none;"></div>
<div id="audio-controls"><button id="audioBack">&#x23EE;</button><button id="audioToggle">&#x23EF;</button><button id="audioNext">&#x23ED;</button></div>
<div id="display-settings"><input type="checkbox" id="show-trimmed" checked> showed trimmed content</div>
</div>
</main>

Expand Down
70 changes: 39 additions & 31 deletions public/script.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -5,6 +5,7 @@ document.addEventListener('DOMContentLoaded', () => {
let conversationActive = false;
let conversationStarted = false;
let promptsAndOptions;
let conversation;

const conversationContainer = document.getElementById('conversation-container');

Expand Down Expand Up @@ -191,35 +192,12 @@ document.addEventListener('DOMContentLoaded', () => {
// ==================

// Handle conversation updates
socket.on('conversation_update', (conversation) => {
conversationDiv.innerHTML = conversation
.map(turn => {
let speech = `<p id="${turn.id}">`;
speech += `<strong>${turn.speaker}:</strong> `;
if(turn.pretrimmed){
speech += `<span class="trimmed">${turn.pretrimmed.split('\n').join('<br>')}</span>`;
}
speech += turn.text.split('\n').join('<br>');
if(turn.trimmed){
speech += `<span class="trimmed">${turn.trimmed.split('\n').join('<br>')}</span>`;
}
speech += "</p>"
return speech;
})
.join('');
preHumanInputContainer.style.display = "none";
postHumanInputContainer.style.display = "block";
conversationContainer.scrollTop = conversationContainer.scrollHeight;
});

socket.on('debug_info', (debug) => {
console.log(debug);
if(debug.type == "skipped"){
console.log("append");
const debugDiv = document.createElement("div");
debugDiv.innerHTML = `<p><span class="trimmed">${debug.msg}</span></p>`;
conversationDiv.appendChild(debugDiv);
}
socket.on('conversation_update', (conversationUpdate) => {
conversation = conversationUpdate;
reloadConversations();
preHumanInputContainer.style.display = "none";
postHumanInputContainer.style.display = "block";
conversationContainer.scrollTop = conversationContainer.scrollHeight;
});

// Handle audio updates
Expand All @@ -230,9 +208,9 @@ document.addEventListener('DOMContentLoaded', () => {
return;
}
console.log(update);
if(update.type == 'human'){
if(update.type == 'human' || update.type == 'skipped'){
ignorePlaylist(update.message_index);
return
return;
}
//This is an async function
await addToPlaylist(update.audio, update.message_index);
Expand Down Expand Up @@ -563,6 +541,35 @@ document.addEventListener('DOMContentLoaded', () => {
unpackPromptsAndOptions();
}

function reloadConversations(){
if(!conversation) return;
conversationDiv.innerHTML = conversation
.map(turn => {
//If if we should skip this message, we still need to put the id in to the DOM, to keep track if which messages have received audio information
//So we put a hidden object
//This might not be the best idea
if(!promptsAndOptions.options.showTrimmed && turn.type == 'skipped'){
return `<p id="${turn.id}" style="display:none;"></p>`;
}
let speech = `<p id="${turn.id}">`;
speech += `<strong>${turn.speaker}:</strong> `;
if(promptsAndOptions.options.showTrimmed && turn.pretrimmed){
speech += `<span class="trimmed">${turn.pretrimmed.split('\n').join('<br>')}</span>`;
}
speech += turn.text.split('\n').join('<br>');
if(promptsAndOptions.options.showTrimmed && turn.trimmed){
speech += `<span class="trimmed">${turn.trimmed.split('\n').join('<br>')}</span>`;
}
speech += "</p>"
return speech;
})
.join('');
}

document.getElementById('show-trimmed').addEventListener('click', () => {
reloadUI();
});

// Remove the last character
document.getElementById('add-room').addEventListener('click', () => {
const rooms = document.getElementById('room-buttons');
Expand Down Expand Up @@ -659,6 +666,7 @@ document.addEventListener('DOMContentLoaded', () => {
const reloadUI = () => {
updatePromptsAndOptions();
unpackPromptsAndOptions();
reloadConversations();
};

document.getElementById('room-name').addEventListener('change', reloadUI);
Expand Down
8 changes: 8 additions & 0 deletions public/style.css
View file
Original file line number Diff line number Diff line change
Expand Up @@ -100,6 +100,14 @@ textarea {
color: red;
}

#display-settings{
position: fixed;
bottom: 3px;
right: 10px;
z-index: 10;
background-color: #b8e7b7;
}

#audio-controls{
position: fixed;
bottom: 3px;
Expand Down
61 changes: 32 additions & 29 deletions server.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -188,25 +188,31 @@ io.on('connection', (socket) => {
if(handRaised) return;
if(thisConversationCounter != conversationCounter) return;

let message = { id: id, speaker: characters[currentSpeaker].name, text: response, trimmed: trimmed, pretrimmed: pretrimmed };
//If a character has completely answered for someone else, skip it, and go to the next
if(response != ""){
if(response == ""){
message.type = 'skipped';
console.log('Skipped a message');
}

// Add the response to the conversation
conversation.push({ id: id, speaker: characters[currentSpeaker].name, text: response, trimmed: trimmed, pretrimmed: pretrimmed });
// Add the response to the conversation
conversation.push(message);

//A rolling index of the message number, so that audio can be played in the right order etc.
const message_index = conversation.length - 1;
//A rolling index of the message number, so that audio can be played in the right order etc.
const message_index = conversation.length - 1;

socket.emit('conversation_update', conversation);
socket.emit('conversation_update', conversation);

//This is an async function, and since we are not waiting for the response, it will run in a paralell thread.
//The result will be emitted to the socket when it's ready
//The rest of the conversation continues
const voice = characters[currentSpeaker].voice ? characters[currentSpeaker].voice : audioVoices[currentSpeaker % audioVoices.length];
generateAudio(id, message_index, response, voice);
//This is an async function, and since we are not waiting for the response, it will run in a paralell thread.
//The result will be emitted to the socket when it's ready
//The rest of the conversation continues
const voice = characters[currentSpeaker].voice ? characters[currentSpeaker].voice : audioVoices[currentSpeaker % audioVoices.length];
if(message.type != 'skipped'){
generateAudio(id, message_index, response, voice);
}else{
console.log("Empty reponse! Skipped a message");
socket.emit('debug_info', {type: "skipped", msg: trimmed});
//If we have an empty message, removed because this character pretended to be someone else
//Send down a message saying this the audio of this message should be skipped
socket.emit('audio_update', {id:message.id, message_index: message_index, type: 'skipped'});
}

// Check for conversation end
Expand Down Expand Up @@ -249,16 +255,16 @@ io.on('connection', (socket) => {
// System message for overall context
messages.push({
role: "system",
content: `${topic}\n\n${speaker.role}`
content: `${topic}\n\n${speaker.role}`.trim()
});

// Add previous messages as separate user objects
conversation.forEach((msg) => {
let content = msg.text;
messages.push({
role: (speaker.name == msg.speaker ? "assistant" : "user"),
content: msg.speaker + ": " + msg.text//We add the name of the character before each message, so that they will be less confused about who said what.
});
if(msg.type == 'skipped') return;//skip certain messages
messages.push({
role: (speaker.name == msg.speaker ? "assistant" : "user"),
content: msg.speaker + ": " + msg.text//We add the name of the character before each message, so that they will be less confused about who said what.
});
});

//Push a message with the character name at the end of the conversation, in the hope that the character will understand who they are and not repeat their name
Expand Down Expand Up @@ -286,8 +292,10 @@ io.on('connection', (socket) => {
let pretrimmedContent;
//If the prompt starts with the character name, remove it
if(response.startsWith(speaker.name + ":")){
//save the trimmed content, for debugging the prompts
pretrimmedContent = response.substring(0, speaker.name.length + 1);
response = response.substring(speaker.name.length + 1);
//remove the name, and any additional whitespace created by this
response = response.substring(speaker.name.length + 1).trim();
}

let trimmedContent;
Expand Down Expand Up @@ -315,20 +323,15 @@ io.on('connection', (socket) => {
}
}

//if we find someone elses name in there, cut it
//if we find someone elses name in there, trim it
for (var i = 0; i < characters.length; i++) {
if(i == currentSpeaker) continue;//Don't cut things from our own name
if(response.indexOf(characters[i].name + ": ") != -1){
response = response.substring(0, response.indexOf(characters[i].name + ": "));
trimmedContent = originalResponse.substring(response.indexOf(characters[i].name + ": "));
if(response.indexOf(characters[i].name + ":") != -1){
response = response.substring(0, response.indexOf(characters[i].name + ":")).trim();
trimmedContent = originalResponse.substring(response.indexOf(characters[i].name + ":"));
}
}

if(!options.showTrimmed){
trimmedContent = undefined;
pretrimmedContent = undefined;
}

return {id: completion.id, response: response, trimmed: trimmedContent, pretrimmed: pretrimmedContent};
} catch (error) {
console.error('Error during API call:', error);
Expand Down

0 comments on commit 0b25dcc

Please sign in to comment.