Spaces:

noahabebe
/

baymx

Runtime error

baymx / templates /index.html

Noahabebe

baymx

ad96fea 10 months ago

2.78 kB

	<!DOCTYPE html>
	<html lang="en">
	<head>
	<meta charset="UTF-8">
	<meta name="viewport" content="width=device-width, initial-scale=1.0">
	<title>Find Matching Command</title>
	<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
	<style>
	#loading {
	display: none;
	}
	</style>
	</head>
	<body>
	<h1>Find Matching Command</h1>
	<form id="commandForm">
	<label for="description">Enter Description:</label><br>
	<textarea id="description" name="description" rows="4" cols="50"></textarea><br>
	<button type="submit">Submit</button>
	</form>
	<div id="loading">Loading...</div>
	<h2>Baymax:</h2>
	<p id="response"></p>
	<p id="command"></p>
	<p id="commandResult"></p>

	<script>
	$(document).ready(function() {
	$('#commandForm').submit(function(e) {
	e.preventDefault();
	$('#loading').show(); // Show loading message

	$.ajax({
	type: 'POST',
	url: '/',
	data: $(this).serialize(),
	success: function(response) {
	$('#loading').hide(); // Hide loading message

	if (response.command) {
	$('#command').text('<strong>Command:</strong> ' + response.command);
	$('#response').html('<strong>Baymax:</strong> ' + response.assistant_response);
	$('#commandResult').html('<strong>Result:</strong> ' + response.result);
	} else if (response.assistant_response) {
	$('#response').html('<strong>Baymax:</strong> ' + response.assistant_response);
	$('#command').text(''); // Clear command if no command
	$('#commandResult').text(''); // Clear command result if no command
	} else {
	$('#response').text('No response received.');
	$('#command').text(''); // Clear command if no response
	$('#commandResult').text(''); // Clear command result if no response
	}
	},
	error: function() {
	$('#loading').hide(); // Hide loading message
	$('#response').text('An error occurred while processing your request.');
	$('#command').text(''); // Clear command if error
	$('#commandResult').text(''); // Clear command result if error
	}
	});
	});
	});
	</script>
	</body>
	</html>