aliases.html 4.73 KB
Newer Older
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 101 102 103 104 105 106 107 108 109 110 111 112 113 114 115 116 117 118 119 120 121 122 123 124 125 126 127 128 129 130 131 132 133 134 135 136 137 138 139 140 141 142 143 144 145 146 147 148 149 150 151 152 153 154 155 156 157 158 159
<style>
#alias_table .actions > * { padding-right: 3px; }
#alias_table .alias-required .remove { display: none }
</style>

<h2>Aliases</h2>

<h3>Add a mail alias</h3>

<p>Aliases are email forwarders. An alias can forward email to a <a href="javascript:show_panel('users')">mail user</a> or to any email address.</p>

<form class="form-horizontal" role="form" onsubmit="do_add_alias(); return false;">
  <div class="form-group">
    <label for="addaliasEmail" class="col-sm-2 control-label">Email Address</label>
    <div class="col-sm-10">
      <input type="email" class="form-control" id="addaliasEmail" placeholder="Incoming Email Address">
    </div>
  </div>
  <div class="form-group">
    <label for="addaliasTargets" class="col-sm-2 control-label">Forward To</label>
    <div class="col-sm-10">
      <textarea class="form-control" rows="3" id="addaliasTargets" placeholder="Forward to these email addresses (one per line or separated by commas)"></textarea>
    </div>
  </div>
  <div class="form-group">
    <div class="col-sm-offset-2 col-sm-10">
      <button id="add-alias-button" type="submit" class="btn btn-primary">Add</button>
      <button id="alias-cancel" class="btn btn-default hidden" onclick="aliases_reset_form(); return false;">Cancel</button>
    </div>
  </div>
</form>

<h3>Existing mail aliases</h3>
<table id="alias_table" class="table" style="width: auto">
  <thead>
    <tr>
      <th></th>
      <th>Email Address<br></th>
      <th>Forwards To</th>
    </tr>
  </thead>
  <tbody>
  </tbody>
</table>

<p style="margin-top: 1.5em"><small>Hostmaster@, postmaster@, and admin@ email addresses are required on some domains.</small></p>

<div style="display: none">
  <table>
  <tr id="alias-template">
    <td class='actions'>
        <a href="#" onclick="aliases_edit(this); return false;" class='edit' title="Edit Alias">
          <span class="glyphicon glyphicon-pencil"></span>
        </a>
        <a href="#" onclick="aliases_remove(this); return false;" class='remove' title="Remove Alias">
          <span class="glyphicon glyphicon-trash"></span>
        </a>
    </td>
    <td class='email'> </td>
    <td class='target'> </td>
  </tr>
  </table>
</div>


<script>
function show_aliases() {
  $('#alias_table tbody').html("<tr><td colspan='2' class='text-muted'>Loading...</td></tr>")
  api(
    "/mail/aliases",
    "GET",
    { format: 'json' },
    function(r) {
      $('#alias_table tbody').html("");
      for (var i = 0; i < r.length; i++) {
        var n = $("#alias-template").clone();
        n.attr('id', '');

        if (r[i].required) n.addClass('alias-required');
        n.attr('data-email', r[i].source);
        n.find('td.email').text(r[i].source)
        for (var j = 0; j < r[i].destination.length; j++)
          n.find('td.target').append($("<div></div>").text(r[i].destination[j]))
        $('#alias_table tbody').append(n);
      }
    })
}

var is_alias_add_update = false;
function do_add_alias() {
  var title = (!is_alias_add_update) ? "Add Alias" : "Update Alias";
  var email = $("#addaliasEmail").val();
  var targets = $("#addaliasTargets").val();
  api(
    "/mail/aliases/add",
    "POST",
    {
      update_if_exists: is_alias_add_update ? '1' : '0',
      source: email,
      destination: targets
    },
    function(r) {
      // Responses are multiple lines of pre-formatted text.
      show_modal_error(title, $("<pre/>").text(r));
      show_aliases()
      aliases_reset_form();
    },
    function(r) {
      show_modal_error(title, r);
    });
  return false;
}

function aliases_reset_form() {
  $("#addaliasEmail").prop('disabled', false);
  $("#addaliasEmail").val('')
  $("#addaliasTargets").val('')
  $('#alias-cancel').addClass('hidden');
  $('#add-alias-button').text('Add');
  is_alias_add_update = false;
}

function aliases_edit(elem) {
  var email = $(elem).parents('tr').attr('data-email');
  var targetdivs = $(elem).parents('tr').find('.target div');
  var targets = "";
  for (var i = 0; i < targetdivs.length; i++)
    targets += $(targetdivs[i]).text() + "\n";

  is_alias_add_update = true;
  $('#alias-cancel').removeClass('hidden');
  $("#addaliasEmail").prop('disabled', true);
  $("#addaliasEmail").val(email);
  $("#addaliasTargets").val(targets);
  $('#add-alias-button').text('Update');
  $('body').animate({ scrollTop: 0 })
}

function aliases_remove(elem) {
  var email = $(elem).parents('tr').attr('data-email');
  show_modal_confirm(
    "Remove Alias",
    "Remove " + email + "?",
    "Remove",
    function() {
      api(
        "/mail/aliases/remove",
        "POST",
        {
          source: email
        },
        function(r) {
          // Responses are multiple lines of pre-formatted text.
          show_modal_error("Remove User", $("<pre/>").text(r));
          show_aliases();
        });
    });
}
</script>