view src/chat.html.luan @ 55:5bdd4bc11123

add push
author Franklin Schmidt <fschmidt@gmail.com>
date Sun, 17 Aug 2025 18:12:42 +0900
parents 27758f3b2d69
children bd3f16f7b8b7
line wrap: on
line source

local Luan = require "luan:Luan.luan"
local error = Luan.error
local ipairs = Luan.ipairs or error()
local Parsers = require "luan:Parsers.luan"
local json_string = Parsers.json_string or error()
local Html = require "luan:Html.luan"
local html_encode = Html.encode or error()
local Io = require "luan:Io.luan"
local Http = require "luan:http/Http.luan"
local Shared = require "site:/lib/Shared.luan"
local head = Shared.head or error()
local header = Shared.header or error()
local started = Shared.started or error()
local voices = Shared.voices or error()
local User = require "site:/lib/User.luan"
local current_user = User.current or error()
local Chat = require "site:/lib/Chat.luan"
local get_chat_by_id = Chat.get_by_id or error()
local Utils = require "site:/lib/Utils.luan"
local capitalize = Utils.capitalize or error()


return function()
	local chat_id = Http.request.parameters.chat or error()
	local chat = get_chat_by_id(chat_id) or error()
	local user = current_user()
	local is_owner = user ~= nil and user.id == chat.user_id
	is_owner or not chat.is_private or error "private"
	local init_text = chat.init_text()
	Io.stdout = Http.response.text_writer()
%>
<!doctype html>
<html lang="en">
	<head>
<%		head() %>
		<style>
			@import "/chat.css?s=<%=started%>";
		</style>
		<script src="/chat.js?s=<%=started%>"></script>
	</head>
	<body>
<%		header() %>
		<div content ai_container>
			<div top>
				<h2 name></h2>
				<span pulldown>
					<img onclick="clickMenu(this)" src="/images/menu.svg">
					<div>
<%	if is_owner then %>
						<span onclick="editChat()">Edit Chat</span>
						<span onclick="deleteChat()">Delete Chat</span>
<%	end %>
						<span onclick="systemPrompt()">System Prompt</span>
					</div>
				</span>
			</div>
			<div messages>
<%				chat.output_messages_html() %>
			</div>
<%	if is_owner then %>
			<div ask>
				<textarea oninput="fixChatTextarea(event.target)" onkeydown="textareaKey(event)"><%= html_encode(init_text) %></textarea>
				<div buttons>
					<audio controls preload=none></audio>
					<button record onclick="toggleRecording()">Record</button>
					<button onclick="askAi()" title="Send"><img src="/images/send.svg"></button>
				</div>
			</div>
<%	end %>
		</div>
		<img waiting-ai-icon src="/images/spinner_green.gif">
		<dialog edit>
			<h2>Edit Chat</h2>
			<form onsubmit="saveChat(this)" action="javascript:">
				<input type=hidden name=chat value="<%=chat.id%>">
				<p>
					<label>Chat name</label><br> 
					<input type=text name=name required><br>
					<span error></span>
				</p>
				<p><%= chat.language_name() %></p>
				<p>
					<label>Voice</label><br> 
					<select name=voice>
<%	for _, voice in ipairs(voices) do %>
						<option value="<%=voice%>"><%=capitalize(voice)%></option>
<%	end %>
					<select>
				</p>
				<p>
					<label clickable><input type=checkbox name=autoplay>Autoplay</label>
				</p>
				<p>
					<select name=show_text>
						<option value=show_text>Show text</option>
<%	if chat.has_ruby then %>
						<option value=hide_ruby>Hide pronunciation</option>
<%	end %>
						<option value=hide_text>Hide text</option>
					</select>
				</p>
				<p>
					<label clickable><input type=checkbox name=is_private>Private chat</label>
				</p>
				<div buttons>
					<button type=button onclick="closeModal(this)">Cancel</button>
					<button type=submit>Save</button>
				</div>
			</form>
		</dialog>
		<dialog delete>
			<h2>Delete Chat</h2>
			<p>Are you sure that you want to delete this chat?</p>
			<div buttons>
				<button onclick="closeModal(this)">Cancel</button>
				<button onclick="doDeleteChat(this)">Delete</button>
			</div>
		</dialog>
		<dialog system_prompt>
			<h2>System Prompt</h2>
			<pre>
<%				chat.output_system_prompt() %>
			</pre>
			<h3>Text to speech instructions</h3>
			<pre>
<%=				chat.tts_instructions %>
			</pre>
			<p><a href="view_course.html?course=<%=chat.course_id%>">View course</a></p>
			<div buttons>
				<button onclick="closeModal(this)">Close</button>
			</div>
		</dialog>
		<input name=initialized style="display:none">
		<script>
			'use strict';
			setChat(<%= json_string(chat.info()) %>);
			handleChatMarkdown();
			setTimeout(function(){
				let initialized = document.querySelector('[name=initialized]');
				if( !initialized.value ) {
					initialized.value = 'yes';
					//alert('init');
					document.querySelector('textarea').focus();
					scrollToEnd();
				}
			},100);
		</script>
	</body>
</html>
<%
end