{% extends "base.html" %}
{% block title %}Schedule - THU Home Alert{% endblock %}
{% block content %}
<h1>Schedule</h1>

<div class="schedule-info">
    <p><strong>OS:</strong> {{ status.os }}</p>
    <p><strong>Installed:</strong>
        {% if status.installed %}
            <span class="status-ok">Yes</span>
        {% else %}
            <span class="status-no">No</span>
        {% endif %}
    </p>
    {% if status.next_run %}
    <p><strong>Next Run:</strong> {{ status.next_run }}</p>
    {% endif %}
    {% if status.detail %}
    <details>
        <summary>Details</summary>
        <pre>{{ status.detail }}</pre>
    </details>
    {% endif %}
</div>

<div class="actions">
    <h3>Install Schedule</h3>
    <form onsubmit="installSchedule(event)">
        <label>Time (HH:MM)
            <input type="time" id="sched-time" value="08:00" required>
        </label>
        <button type="submit">Install</button>
        <span id="install-status"></span>
    </form>
</div>

{% if status.installed %}
<div class="actions">
    <h3>Uninstall</h3>
    <button onclick="uninstallSchedule()">Uninstall Schedule</button>
    <span id="uninstall-status"></span>
</div>
{% endif %}

<script>
function installSchedule(event) {
    event.preventDefault();
    const time = document.getElementById('sched-time').value;
    const status = document.getElementById('install-status');
    const formData = new FormData();
    formData.append('time', time);

    status.textContent = 'Installing...';
    fetch('{{ url_for("schedule_install") }}', { method: 'POST', body: formData })
        .then(r => r.json())
        .then(data => {
            status.textContent = data.message;
            if (data.success) setTimeout(() => location.reload(), 1500);
        })
        .catch(err => { status.textContent = 'Error: ' + err; });
}

function uninstallSchedule() {
    const status = document.getElementById('uninstall-status');
    status.textContent = 'Uninstalling...';
    fetch('{{ url_for("schedule_uninstall") }}', { method: 'POST' })
        .then(r => r.json())
        .then(data => {
            status.textContent = data.message;
            if (data.success) setTimeout(() => location.reload(), 1500);
        })
        .catch(err => { status.textContent = 'Error: ' + err; });
}
</script>
{% endblock %}