index.html

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Legal Research API Test</title>
</head>
<body>
    <h1>Legal Research API Test</h1>
    <form id="legal-assistance-form">
        <label for="query">Query:</label>
        <input type="text" id="query" name="query" required><br><br>
        
        <label for="option">Select Option:</label>
        <select id="option" name="option" required>
            <option value="Legal Advisory">Legal Advisory</option>
            <option value="Legal Report Generation">Legal Report Generation</option>
            <option value="Case Outcome Prediction">Case Outcome Prediction</option>
        </select><br><br>
        
        <label for="files">Upload PDF Files:</label>
        <input type="file" id="files" name="files" accept="application/pdf" multiple required><br><br>
        
        <button type="submit">Submit</button>
    </form>
    
    <h2>Response:</h2>
    <pre id="response"></pre>

    <script>
        document.getElementById('legal-assistance-form').addEventListener('submit', async function(event) {
            event.preventDefault();  // Prevent the form from submitting the traditional way
            
            const formData = new FormData();
            formData.append('query', document.getElementById('query').value);
            formData.append('option', document.getElementById('option').value);
            const files = document.getElementById('files').files;

            for (let i = 0; i < files.length; i++) {
                formData.append('files', files[i]);
            }

            try {
                const response = await fetch('https://navilaw-ai.onrender.com/legal-assistance/', {
                    method: 'POST',
                    body: formData,
                });

                const data = await response.json();
                if (!response.ok) {
                    throw new Error(data.detail || 'Something went wrong');
                }

                // Display the response from the API
                document.getElementById('response').textContent = JSON.stringify(data, null, 2);
            } catch (error) {
                document.getElementById('response').textContent = `Error: ${error.message}`;
            }
        });
    </script>
</body>
</html>