const mujianSdk = new window.MujianUMD.MujianSdk();
const stopController = new AbortController();

async function send(query) {
	const id = Date.now();
	addMessage("assistant", "等待回复中...", id);
	startLoading(id);
	await mujianSdk.ai.chat.complete(
		query,
		(res) => {
			updateMessage(id, res.fullContent);
			if (res.isFinished) {
				stopLoading(id);
			}
		},
		stopController.signal,
		{
			parseContent: true,
		},
	);
}

function stop() {
	stopController.abort();
}

async function renderAllMessages() {
	const messages = await mujianSdk.ai.chat.message.getAll();
	renderMessages(messages);
	scrollToBottom();
}

function updateMessage(id, message) {
	if ($(`#message-assistant-${id}`).length === 0) {
		return;
	}
	$(`#message-assistant-${id}`).text("assistant: " + message);
	scrollToBottom();
}

function addMessage(role, message, id = null) {
	const _id = id || Date.now();
	$("#messages").append(
		`<div id="message-${role}-${_id}" class="message ${role === "user" ? "user" : "assistant"}">${role}: ${message}</div>`,
	);
}

function startLoading(id) {
	$(`#message-assistant-${id}`).addClass("loading");
}

function stopLoading(id) {
	$(`#message-assistant-${id}`).removeClass("loading");
}

function clearMessages() {
	$("#messages").empty();
}

function scrollToBottom() {
	$("#messages").animate(
		{ scrollTop: $("#messages").prop("scrollHeight") },
		100,
	);
}

function renderMessages(messages) {
	// console.log("messages", messages);
	messages.forEach((message) => {
		addMessage(message.role, message.content, message.id);
	});
}

$("#send").click(async () => {
	const query = $("#input").val();
	console.log("query", query);
	if (!query) {
		return;
	}
	$("#input").val("");
	addMessage("user", query, Date.now());
	await send(query);
});

$("#stop").click(stop);

(async () => {
	await mujianSdk.init().then(async () => {
		await renderAllMessages();
	});
})();