app-MAIL-temp/templates/dashboard/custom_alias.html

143 lines
4.7 KiB
HTML
Raw Normal View History

2019-07-06 23:25:52 +02:00
{% extends 'default.html' %}
{% set active_page = "dashboard" %}
{% block title %}
Custom Alias
{% endblock %}
{% block default_content %}
2020-05-11 23:22:06 +02:00
<div class="card">
<div class="card-body">
<h1 class="h3">New Custom Alias</h1>
2019-07-06 23:25:52 +02:00
2020-05-11 23:22:06 +02:00
{% if user_custom_domains|length == 0 and not DISABLE_ALIAS_SUFFIX %}
<div class="row">
<div class="col p-1">
<div class="alert alert-primary" role="alert">
You might notice a random word after the dot(<em>.</em>) in the alias.
This part is to avoid a person taking all the "nice" aliases like
<b>hello@{{ FIRST_ALIAS_DOMAIN }}</b>,
<b>me@{{ FIRST_ALIAS_DOMAIN }}</b>, etc. <br>
If you add your own domain, this restriction is removed, and you can fully customize the alias. <br>
2020-05-11 23:22:06 +02:00
</div>
2020-02-18 05:59:03 +01:00
</div>
</div>
2020-05-11 23:22:06 +02:00
{% endif %}
2019-07-06 23:25:52 +02:00
2021-09-06 18:51:50 +02:00
<form method="post" data-parsley-validate>
2020-05-11 23:22:06 +02:00
<div class="row mb-2">
<div class="col-sm-6 mb-1 p-1" style="min-width: 4em">
<input name="prefix" class="form-control"
id="prefix"
2020-05-11 23:22:06 +02:00
type="text"
2021-09-06 18:51:50 +02:00
data-parsley-pattern="[0-9a-z-_.]{1,}"
data-parsley-trigger="change"
data-parsley-error-message="Only lowercase letters, dots, numbers, dashes (-) and underscores (_) are currently supported."
maxlength="40"
2021-04-30 11:37:17 +02:00
placeholder="Alias prefix, for example newsletter.com-123_xyz"
2020-05-11 23:22:06 +02:00
autofocus required>
2021-04-30 11:37:17 +02:00
</div>
2019-12-06 10:28:00 +01:00
2020-05-11 23:22:06 +02:00
<div class="col-sm-6 p-1">
<select class="form-control" name="signed-alias-suffix">
{% for suffix_info in alias_suffixes_with_signature %}
{% set alias_suffix = suffix_info[0] %}
<option value="{{ suffix_info[1] }}"
{% if alias_suffix.is_premium %}
title="Only available to Premium accounts"
{% elif not alias_suffix.is_custom and at_least_a_premium_domain %}
title="Available to all accounts"
2020-10-20 16:44:22 +02:00
{% endif %}
>
{% if alias_suffix.is_custom %}
{% if alias_suffix.mx_verified %}
{{ alias_suffix.suffix }} (your domain)
{% else %}
{{ alias_suffix.suffix }} (your domain, not MX verified yet)
{% endif %}
2020-05-11 23:22:06 +02:00
{% else %}
{% if alias_suffix.is_premium %}
{{ alias_suffix.suffix }} (Premium domain)
2020-10-20 16:44:22 +02:00
{% else %}
{{ alias_suffix.suffix }} (Public domain)
2020-10-20 16:44:22 +02:00
{% endif %}
2020-05-11 23:22:06 +02:00
{% endif %}
</option>
{% endfor %}
</select>
</div>
</div>
2019-12-22 13:57:19 +01:00
2020-05-11 23:22:06 +02:00
<div class="row mb-2">
<div class="col p-1">
<select data-width="100%"
class="mailbox-select" id="mailboxes" multiple name="mailboxes" required>
2020-05-11 23:22:06 +02:00
{% for mailbox in mailboxes %}
<option value="{{ mailbox.id }}" {% if mailbox.id == current_user.default_mailbox_id %}
selected {% endif %}>
{{ mailbox.email }}
2020-05-11 23:22:06 +02:00
</option>
{% endfor %}
</select>
<div class="small-text">
The mailbox(es) that owns this alias.
2020-05-11 23:22:06 +02:00
</div>
</div>
</div>
2020-05-11 23:22:06 +02:00
<div class="row mb-2">
<div class="col p-1">
<textarea name="note"
class="form-control"
rows="3"
2020-05-27 22:52:45 +02:00
placeholder="Note, can be anything to help you remember why you created this alias. This field is optional."></textarea>
2020-05-11 23:22:06 +02:00
</div>
</div>
2020-05-11 23:22:06 +02:00
<div class="row">
<div class="col p-1">
<button type="submit" id="create" class="btn btn-primary mt-1">Create</button>
2020-05-11 23:22:06 +02:00
</div>
</div>
2020-05-11 23:22:06 +02:00
</form>
</div>
2019-07-06 23:25:52 +02:00
</div>
{% endblock %}
{% block script %}
<script>
$('.mailbox-select').multipleSelect();
// Ctrl-enter submit the form
$('form').keydown(function (event) {
if (event.ctrlKey && event.keyCode === 13) {
$("#submit").click();
}
})
$("#create").on("click", async function () {
let that = $(this);
let mailbox_ids = $(`#mailboxes`).val();
let prefix = $('#prefix').val();
if (mailbox_ids.length == 0) {
toastr.error("You must select at least a mailbox", "Error");
return;
}
if (!prefix) {
toastr.error("Alias cannot be empty", "Error");
return;
}
that.closest("form").submit();
})
</script>
{% endblock %}