129 lines
4.7 KiB
JavaScript
Executable file
129 lines
4.7 KiB
JavaScript
Executable file
const conversations_list_item = `
|
|
<div id="conversations-list-item-{CONVERSATION_ID}" class="conversations-list-btn" onclick="goToConversation(event, '{CONVERSATION_ID}')">
|
|
<i class="fa-solid fa-message"></i>
|
|
<span id="conversations-list-item-{CONVERSATION_ID}-name">{CONVERSATION_TITLE}</span>
|
|
<div class="conversations-list-item-manage-container" id="conversations-list-item-manage-container-{CONVERSATION_ID}">
|
|
<div class="conversations-list-item-manage-btn" onclick="startDeletingConversation(event, '{CONVERSATION_ID}')">
|
|
<i class="fa-solid fa-trash"></i>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
`;
|
|
|
|
const conversations_list_item_active = `
|
|
<div id="conversations-list-item-{CONVERSATION_ID}" class="conversations-list-btn conversations-list-btn-active" onclick="goToConversation(event, '{CONVERSATION_ID}')">
|
|
<i class="fa-solid fa-message"></i>
|
|
<span id="conversations-list-item-{CONVERSATION_ID}-name">{CONVERSATION_TITLE}</span>
|
|
<div class="conversations-list-item-manage-container" id="conversations-list-item-manage-container-{CONVERSATION_ID}">
|
|
<div class="conversations-list-item-manage-btn" onclick="startDeletingConversation(event, '{CONVERSATION_ID}')">
|
|
<i class="fa-solid fa-trash"></i>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
`;
|
|
|
|
const conversations_list_item_manage_options_html = `
|
|
<div class="conversations-list-item-manage-btn" onclick="startDeletingConversation(event, '{CONVERSATION_ID}')">
|
|
<i class="fa-solid fa-trash"></i>
|
|
</div>
|
|
`;
|
|
|
|
const conversations_list_item_manage_delete_options_html = `
|
|
<div class="conversations-list-item-manage-btn conversations-list-item-delete-btn" onclick="deleteConversation(event, '{CONVERSATION_ID}')">
|
|
<i class="fa-solid fa-trash"></i>
|
|
</div>
|
|
<div class="conversations-list-item-manage-btn" onclick="stopDeletingConversation(event, '{CONVERSATION_ID}')">
|
|
<i class="fa-solid fa-rotate-left"></i>
|
|
</div>
|
|
`;
|
|
|
|
const chat_new_conversation_html = `
|
|
<div class="chat-container">
|
|
<div class="chat-header">
|
|
<div class="assistants-list-container">
|
|
<div class="assistant-name-container" id="assistant-name-container" onclick="toggleAssistantsDropdown()">
|
|
<div class="assistant-name assistant-name-placeholder" id="assistant-name">Select an Assistant</div>
|
|
</div>
|
|
<div class="assistants-list assistants-list-hidden" id="assistants-list"></div>
|
|
</div>
|
|
<div class="tov-list-container">
|
|
<div class="tov-name-container" id="tov-name-container" onclick="toggleTOVsDropdown()">
|
|
<div class="tov-name tov-name-placeholder" id="tov-name">Select a Tone of Voice</div>
|
|
</div>
|
|
<div class="tov-list tov-list-hidden" id="tov-list"></div>
|
|
</div>
|
|
</div>
|
|
<div id="chat" class="chat"></div>
|
|
<div class="message-input-container">
|
|
<textarea id="message-input" placeholder="Type a message here" rows="1"></textarea>
|
|
<button id="send-button" onclick="sendMessage()">
|
|
<i class="fa-solid fa-paper-plane"></i>
|
|
</button>
|
|
</div>
|
|
</div>
|
|
`;
|
|
|
|
const assistant_list_item = `
|
|
<div class="assistants-list-item" onclick="selectAssistant('{ASSISTANT_KEY}')">{ASSISTANT_NAME}</div>
|
|
`;
|
|
|
|
const tov_list_item = `
|
|
<div class="tov-list-item" onclick="selectTOV('{TOV_ID}')">{TOV_NAME}</div>
|
|
`;
|
|
|
|
const chat_message_user = `
|
|
<div class="chat-message chat-message-user">
|
|
<div class="chat-message-role">
|
|
<i class="fa-solid fa-user"></i>
|
|
</div>
|
|
<div class="chat-message-content">{CONTENT}</div>
|
|
</div>
|
|
`;
|
|
|
|
const chat_message_user_new = `
|
|
<div class="chat-message chat-message-user chat-message-appear">
|
|
<div class="chat-message-role">
|
|
<i class="fa-solid fa-user"></i>
|
|
</div>
|
|
<div class="chat-message-content">{CONTENT}</div>
|
|
</div>
|
|
`;
|
|
|
|
const chat_message_assistant = `
|
|
<div class="chat-message chat-message-assistant">
|
|
<div class="chat-message-role">
|
|
<i class="fa-solid fa-robot"></i>
|
|
</div>
|
|
<div class="chat-message-content">{CONTENT}</div>
|
|
</div>
|
|
`;
|
|
|
|
const chat_message_assistant_new = `
|
|
<div class="chat-message chat-message-assistant chat-message-appear">
|
|
<div class="chat-message-role">
|
|
<i class="fa-solid fa-robot"></i>
|
|
</div>
|
|
<div class="chat-message-content">{CONTENT}</div>
|
|
</div>
|
|
`;
|
|
|
|
const chat_message_assistant_loading_dots = `
|
|
<div class="chat-message chat-message-assistant chat-message-appear chat-message-loading-dots">
|
|
<div class="chat-message-role">
|
|
<i class="fa-solid fa-robot"></i>
|
|
</div>
|
|
<div class="chat-message-content">
|
|
<div class="chat-message-loading-dots-wrapper">
|
|
<div class="chat-message-loading-dot"></div>
|
|
<div class="chat-message-loading-dot"></div>
|
|
<div class="chat-message-loading-dot"></div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
`;
|
|
|
|
const loading_circle = `
|
|
<div class="loading-circle-container">
|
|
<div class='loading-circle'></div>
|
|
</div>
|
|
`;
|