{% extends "users/base.html" %}
{% block title %}Create Default Email{% endblock title %}
{% block content %}
<div class="card card-default">
      <div class="card-header">
        <h2>Create Default Email</h2>
      </div>
      <div class="card-body">
    <form method="post">
        {% csrf_token %}
        <!-- Username Field -->
        <div class="form-group" style="display: flex; align-items: center;">
            <select id="domainx" name="domain" class="form-control" onchange="setDomainValue()">
             {% for domain in domains %}
                <option value="{{ domain.id }}">{{ domain.domain }}</option>
             {% endfor %}
            </select>
        </div>

        <label for="type" style="margin-right: 10px;">Type:</label>
        <div class="form-check">
            <input type="radio" id="emailForward" name="forwardType" value="email" class="form-check-input" checked>
            <label class="form-check-label" for="emailForward">Email Forward</label>
        </div>
        <div class="form-check">
            <input type="radio" id="pipeForward" name="forwardType" value="pipe" class="form-check-input">
            <label class="form-check-label" for="pipeForward">Pipe to a Program</label>
        </div>
<label class="form-check-label" for="pipeForward"></label>
        <!-- Email Forward Fields (Show only if "Email Forward" is selected) -->
        <div id="emailForwardFields" style="display: block;">
            <label for="forword">Forward to Email</label>
            <div class="form-group">
                <input type="email" id="email" name="email" class="form-control" placeholder="example@example.com">
            </div>
        </div>

        <!-- Pipe Forward Fields (Show only if "Pipe Forward" is selected) -->
        <div id="pipeForwardFields" style="display: none;">
            <label class="small mb-1" for="path">Document Root (File System Location):</label>
            <div class="input-group mb-2 mr-sm-2">
                <div class="input-group-prepend">
                    <div class="input-group-text"><span class="mdi mdi-home"></span></div>
                </div>
                <input type="text" id="path" name="path" class="form-control" value="" placeholder="myscript.php">
            </div>
        </div>

        <!-- Submit Button -->
        <div class="form-group">
            <button type="submit" class="mb-1 btn btn-success" style="text-transform: none;">Submit</button>
        </div>
    </form>
</div>
</div>
<script>
// JavaScript to show/hide fields based on the selected radio button
document.getElementById('emailForward').addEventListener('change', function() {
    document.getElementById('emailForwardFields').style.display = 'block';
    document.getElementById('pipeForwardFields').style.display = 'none';
});

document.getElementById('pipeForward').addEventListener('change', function() {
    document.getElementById('pipeForwardFields').style.display = 'block';
    document.getElementById('emailForwardFields').style.display = 'none';
});
</script>
{% endblock content %}
{% include "users/footer.html" %}


