mirror of
				https://github.com/mail-in-a-box/mailinabox.git
				synced 2025-10-25 18:00:54 +00:00 
			
		
		
		
	
		
			
				
	
	
		
			267 lines
		
	
	
		
			11 KiB
		
	
	
	
		
			HTML
		
	
	
	
	
	
			
		
		
	
	
			267 lines
		
	
	
		
			11 KiB
		
	
	
	
		
			HTML
		
	
	
	
	
	
| <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="#" onclick="return show_panel('users')">mail user</a> or to any email address.</p>
 | |
| 
 | |
| <p>To use an alias or any address besides your own login username in outbound mail, the sending user must be included as a permitted sender for the alias.</p>
 | |
| 
 | |
| <form id="addalias-form" class="form-horizontal" role="form" onsubmit="do_add_alias(); return false;">
 | |
|   <div class="form-group">
 | |
|     <div class="col-sm-offset-1 col-sm-11">
 | |
|       <div id="alias_type_buttons" class="btn-group btn-group-xs">
 | |
|         <button type="button" class="btn btn-default" data-mode="regular">Regular</button>
 | |
|         <button type="button" class="btn btn-default" data-mode="catchall">Catch-All</button>
 | |
|         <button type="button" class="btn btn-default" data-mode="domainalias">Domain Alias</button>
 | |
|       </div>
 | |
|       <div id="alias_mode_info" class="text-info small" style="display: none; margin: .5em 0 0 0;">
 | |
|         <span class="catchall hidden">A catch-all alias captures all otherwise unmatched email to a domain.</span>
 | |
|         <span class="domainalias hidden">A domain alias forwards all otherwise unmatched email from one domain to another domain, preserving the part before the @-sign.</span>
 | |
|       </div>
 | |
|     </div>
 | |
|   </div>
 | |
|   <div class="form-group">
 | |
|     <label for="addaliasAddress" class="col-sm-1 control-label">Alias</label>
 | |
|     <div class="col-sm-10">
 | |
|       <input type="email" class="form-control" id="addaliasAddress">
 | |
|       <div style="margin-top: 3px; padding-left: 3px; font-size: 90%" class="text-muted">
 | |
|         <span class="catchall domainalias">Enter just the part of an email address starting with the @-sign.</span>
 | |
|         You may use international (non-ASCII) characters for the domain part of the email address only.
 | |
|       </div>
 | |
|     </div>
 | |
|   </div>
 | |
|   <div class="form-group">
 | |
|     <label for="addaliasForwardsTo" class="col-sm-1 control-label">Forwards To</label>
 | |
|     <div class="col-sm-10">
 | |
|       <textarea class="form-control" rows="3" id="addaliasForwardsTo"></textarea>
 | |
|       <div style="margin-top: 3px; padding-left: 3px; font-size: 90%" class="text-muted">
 | |
|         <span class="domainalias">Enter just the part of an email address starting with the @-sign.</span>
 | |
|       </div>
 | |
|     </div>
 | |
|   </div>
 | |
|   <div class="form-group">
 | |
|     <label for="addaliasSenders" class="col-sm-1 control-label">Permitted Senders</label>
 | |
|     <div class="col-sm-10">
 | |
|       <div class="radio">
 | |
|         <label>
 | |
|           <input id="addaliasForwardsToNotAdvanced" name="addaliasForwardsToDivToggle" type="radio" checked onclick="$('#addaliasForwardsToDiv').toggle(false)">
 | |
|           Any mail user listed in the Fowards To box can send mail claiming to be from <span class="regularalias">the alias address</span><span class="catchall domainalias">any address on the alias domain</span>.
 | |
|         </label>
 | |
|       </div>
 | |
|       <div class="radio">
 | |
|         <label>
 | |
|           <input id="addaliasForwardsToAdvanced" name="addaliasForwardsToDivToggle" type="radio" id="addaliasForwardsToDivShower" onclick="$('#addaliasForwardsToDiv').toggle(true)">
 | |
|           I’ll enter the mail users that can send mail claiming to be from <span class="regularalias">the alias address</span><span class="catchall domainalias">any address on the alias domain</span>.
 | |
|         </label>
 | |
|       </div>
 | |
|       <div id="addaliasForwardsToDiv" style="margin-top: .5em; margin-left: 1.4em; display: none;">
 | |
|         <textarea class="form-control" rows="3" id="addaliasSenders" placeholder="one user per line or separated by commas"></textarea>
 | |
|       </div>
 | |
|     </div>
 | |
|   </div>
 | |
|   <div class="form-group">
 | |
|     <div class="col-sm-offset-1 col-sm-11">
 | |
|       <button id="add-alias-button" type="submit" class="btn btn-primary">Add Alias</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>Alias<br></th>
 | |
|       <th>Forwards To</th>
 | |
|       <th>Permitted Senders</th>
 | |
|     </tr>
 | |
|   </thead>
 | |
|   <tbody>
 | |
|   </tbody>
 | |
| </table>
 | |
| 
 | |
| <p style="margin-top: 1.5em"><small>hostmaster@, postmaster@, admin@ and abuse@ 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); scroll_top(); 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='address'> </td>
 | |
|     <td class='forwardsTo'> </td>
 | |
|     <td class='senders'> </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 hdr = $("<tr><td colspan='3'><h4/></td></tr>");
 | |
|         hdr.find('h4').text(r[i].domain);
 | |
|         $('#alias_table tbody').append(hdr);
 | |
| 
 | |
|         for (var k = 0; k < r[i].aliases.length; k++) {
 | |
|           var alias = r[i].aliases[k];
 | |
| 
 | |
|           var n = $("#alias-template").clone();
 | |
|           n.attr('id', '');
 | |
| 
 | |
|           if (alias.required) n.addClass('alias-required');
 | |
|           n.attr('data-address', alias.address_display); // this is decoded from IDNA, but will get re-coded to IDNA on the backend
 | |
|           n.find('td.address').text(alias.address_display)
 | |
|           for (var j = 0; j < alias.forwards_to.length; j++)
 | |
|             n.find('td.forwardsTo').append($("<div></div>").text(alias.forwards_to[j]))
 | |
|           for (var j = 0; j < (alias.permitted_senders ? alias.permitted_senders.length : 0); j++)
 | |
|             n.find('td.senders').append($("<div></div>").text(alias.permitted_senders[j]))
 | |
|           $('#alias_table tbody').append(n);
 | |
|         }
 | |
|       }
 | |
|     })
 | |
| 
 | |
|   $(function() {
 | |
|     $('#alias_type_buttons button').off('click').click(function() {
 | |
|       $('#alias_type_buttons button').removeClass('active');
 | |
|       $(this).addClass('active');
 | |
|       $('#addalias-form .regularalias, #addalias-form .catchall, #addalias-form .domainalias').addClass('hidden');
 | |
|       if ($(this).attr('data-mode') == "regular") {
 | |
|         $('#addaliasAddress').attr('type', 'email');
 | |
|         $('#addaliasAddress').attr('placeholder', 'you@yourdomain.com (incoming email address)');
 | |
|         $('#addaliasForwardsTo').attr('placeholder', 'one address per line or separated by commas');
 | |
|         $('#alias_mode_info').slideUp();
 | |
|         $('#addalias-form .regularalias').removeClass('hidden');
 | |
|       } else if ($(this).attr('data-mode') == "catchall") {
 | |
|         $('#addaliasAddress').attr('type', 'text');
 | |
|         $('#addaliasAddress').attr('placeholder', '@yourdomain.com (incoming catch-all domain)');
 | |
|         $('#addaliasForwardsTo').attr('placeholder', 'one address per line or separated by commas');
 | |
|         $('#alias_mode_info').slideDown();
 | |
|         $('#addalias-form .catchall').removeClass('hidden');
 | |
|       } else if ($(this).attr('data-mode') == "domainalias") {
 | |
|         $('#addaliasAddress').attr('type', 'text');
 | |
|         $('#addaliasAddress').attr('placeholder', '@yourdomain.com (incoming catch-all domain)');
 | |
|         $('#addaliasForwardsTo').attr('placeholder', '@otherdomain.com (forward to other domain)');
 | |
|         $('#alias_mode_info').slideDown();
 | |
|         $('#addalias-form .domainalias').removeClass('hidden');
 | |
|       }
 | |
|     })
 | |
|     $('#alias_type_buttons button[data-mode="regular"]').click(); // init
 | |
|   })
 | |
| }
 | |
| 
 | |
| var is_alias_add_update = false;
 | |
| function do_add_alias() {
 | |
|   var title = (!is_alias_add_update) ? "Add Alias" : "Update Alias";
 | |
|   var form_address = $("#addaliasAddress").val();
 | |
|   var form_forwardsto = $("#addaliasForwardsTo").val();
 | |
|   var form_senders = ($('#addaliasForwardsToAdvanced').prop('checked') ? $("#addaliasSenders").val() : '');
 | |
|   if ($('#addaliasForwardsToAdvanced').prop('checked') && !/\S/.exec($("#addaliasSenders").val())) {
 | |
|     show_modal_error(title, "You did not enter any permitted senders.");
 | |
|     return false;
 | |
|   }
 | |
|   api(
 | |
|     "/mail/aliases/add",
 | |
|     "POST",
 | |
|     {
 | |
|       update_if_exists: is_alias_add_update ? '1' : '0',
 | |
|       address: form_address,
 | |
|       forwards_to: form_forwardsto,
 | |
|       permitted_senders: form_senders
 | |
|     },
 | |
|     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() {
 | |
|   $("#addaliasAddress").prop('disabled', false);
 | |
|   $("#addaliasAddress").val('')
 | |
|   $("#addaliasForwardsTo").val('')
 | |
|   $("#addaliasSenders").val('')
 | |
|   $('#alias-cancel').addClass('hidden');
 | |
|   $('#add-alias-button').text('Add Alias');
 | |
|   is_alias_add_update = false;
 | |
| }
 | |
| 
 | |
| function aliases_edit(elem) {
 | |
|   var address = $(elem).parents('tr').attr('data-address');
 | |
|   var receiverdivs = $(elem).parents('tr').find('.forwardsTo div');
 | |
|   var senderdivs = $(elem).parents('tr').find('.senders div');
 | |
|   var forwardsTo = "";
 | |
|   for (var i = 0; i < receiverdivs.length; i++)
 | |
|     forwardsTo += $(receiverdivs[i]).text() + "\n";
 | |
|   var senders = "";
 | |
|   for (var i = 0; i < senderdivs.length; i++)
 | |
|     senders += $(senderdivs[i]).text() + "\n";
 | |
|   if (address.charAt(0) == '@' && forwardsTo.charAt(0) == '@')
 | |
|     $('#alias_type_buttons button[data-mode="domainalias"]').click();
 | |
|   else if (address.charAt(0) == '@')
 | |
|     $('#alias_type_buttons button[data-mode="catchall"]').click();
 | |
|   else
 | |
|     $('#alias_type_buttons button[data-mode="regular"]').click();
 | |
|   $('#alias-cancel').removeClass('hidden');
 | |
|   $("#addaliasAddress").prop('disabled', true);
 | |
|   $("#addaliasAddress").val(address);
 | |
|   $("#addaliasForwardsTo").val(forwardsTo);
 | |
|   $('#addaliasForwardsToAdvanced').prop('checked', senders != "");
 | |
|   $('#addaliasForwardsToNotAdvanced').prop('checked', senders == "");
 | |
|   $("#addaliasSenders").val(senders);
 | |
|   $('#add-alias-button').text('Update');
 | |
|   $('body').animate({ scrollTop: 0 })
 | |
|   is_alias_add_update = true;
 | |
| }
 | |
| 
 | |
| function aliases_remove(elem) {
 | |
|   var row_address = $(elem).parents('tr').attr('data-address');
 | |
|   show_modal_confirm(
 | |
|     "Remove Alias",
 | |
|     "Remove " + row_address + "?",
 | |
|     "Remove",
 | |
|     function() {
 | |
|       api(
 | |
|         "/mail/aliases/remove",
 | |
|         "POST",
 | |
|         {
 | |
|           address: row_address
 | |
|         },
 | |
|         function(r) {
 | |
|           // Responses are multiple lines of pre-formatted text.
 | |
|           show_modal_error("Remove User", $("<pre/>").text(r));
 | |
|           show_aliases();
 | |
|         });
 | |
|     });
 | |
| }
 | |
| 
 | |
| function scroll_top() {
 | |
|         $('html, body').animate({
 | |
|             scrollTop: $("#panel_aliases").offset().top
 | |
|         }, 1000);
 | |
| }
 | |
| </script>
 |