updated send with tab

This commit is contained in:
Jonathan Labreuille
2015-12-04 15:31:04 +01:00
parent 1950d6661f
commit beb939df9e
3 changed files with 262 additions and 138 deletions

View File

@@ -15,10 +15,10 @@ define(
MailPoet.Router = new (Backbone.Router.extend({
routes: {
'mta(/:method)': 'sendingMethod',
'mta(/:group)': 'sendingMethodGroup',
'(:tab)': 'tabs',
},
sendingMethod: function(method) {
sendingMethodGroup: function(group) {
// display mta tab
this.tabs('mta');
@@ -30,13 +30,13 @@ define(
// hide "save settings" button
jQuery('.mailpoet_settings_submit').hide();
if(method === null) {
if(group === null) {
// show sending methods
jQuery('.mailpoet_sending_methods').fadeIn();
} else {
// hide DKIM option when using MailPoet's API
jQuery('#mailpoet_mta_dkim')[
(method === 'MailPoet')
(group === 'mailpoet')
? 'hide'
: 'show'
]();
@@ -45,7 +45,7 @@ define(
jQuery('.mailpoet_sending_methods').hide();
// display selected sending method's settings
jQuery('.mailpoet_sending_method[data-method="'+ method +'"]').show();
jQuery('.mailpoet_sending_method[data-group="'+ group +'"]').show();
jQuery('#mailpoet_sending_method_setup').fadeIn();
}
},

View File

@@ -5,27 +5,43 @@ class Hosts {
private static $_smtp = array(
'AmazonSES' => array(
'name' => 'Amazon SES',
'api' => false,
'emails' => 100,
'interval' => 5
'interval' => 5,
'fields' => array(
'region',
'access_key',
'secret_key'
),
'regions' => array(
'US East (N. Virginia)' => 'us-east-1.amazonaws.com',
'US West (Oregon)' => 'us-west-2.amazonaws.com',
'EU (Ireland)' => 'eu-west-1.amazonaws.com'
)
),
'ElasticEmail' => array(
'name' => 'ElasticEmail',
'api' => true,
'emails' => 100,
'interval' => 5
'interval' => 5,
'fields' => array(
'api_key'
)
),
'MailGun' => array(
'name' => 'MailGun',
'api' => false,
'emails' => 100,
'interval' => 5
'interval' => 5,
'fields' => array(
'domain',
'api_key'
)
),
'SendGrid' => array(
'name' => 'SendGrid',
'api' => true,
'emails' => 100,
'interval' => 5
'interval' => 5,
'fields' => array(
'api_key'
)
)
);

View File

@@ -10,7 +10,14 @@
}
} %>
<!-- smtp: method -->
<!-- mta: group -->
<input
type="hidden"
id="mta_group"
name="mta_group"
value="<%= settings.mta_group %>"
/>
<!-- mta: method -->
<input
type="hidden"
id="mta_method"
@@ -52,8 +59,8 @@
<!-- smtp: available sending methods -->
<ul class="mailpoet_sending_methods clearfix">
<li
data-method="MailPoet"
<% if(settings.mta.method == 'MailPoet') %>class="mailpoet_active"<% endif %>
data-group="mailpoet"
<% if(settings.mta_group == 'mailpoet') %>class="mailpoet_active"<% endif %>
>
<h3>
<img
@@ -77,12 +84,12 @@
<div class="mailpoet_actions">
<a
class="button-secondary"
href="#mta/MailPoet"><%= __('Configure') %></a>
href="#mta/mailpoet"><%= __('Configure') %></a>
</div>
</li>
<li
data-method="website"
<% if(settings.mta.method == 'website') %>class="mailpoet_active"<% endif %>
data-group="website"
<% if(settings.mta_group == 'website') %>class="mailpoet_active"<% endif %>
>
<h3><%= __('Your own website') %></h3>
@@ -101,8 +108,8 @@
</div>
</li>
<li
data-method="smtp"
<% if(settings.mta.method == 'smtp') %>class="mailpoet_active"<% endif %>
data-group="smtp"
<% if(settings.mta_group == 'smtp') %>class="mailpoet_active"<% endif %>
>
<h3><%= __('Third party') %></h3>
@@ -126,7 +133,7 @@
<!-- Sending Method: MailPoet -->
<div
class="mailpoet_sending_method"
data-method="MailPoet"
data-group="mailpoet"
style="display:none;"
>
<h3><%= __('Open a free account with MailPoet, and get:') %></h3>
@@ -164,10 +171,12 @@
<td>
<input
type="text"
class="regular-text"
id="mailpoet_api_key"
size="40"
name="mta[api_key]"
value="<%= settings.mta.api_key %>"
value="<% if(settings.mta_group == 'mailpoet')%>
<%=- settings.mta.api_key -%>
<% endif %>"
/>
</td>
</tr>
@@ -178,60 +187,11 @@
<!-- Sending Method: Website -->
<div
class="mailpoet_sending_method"
data-method="website"
data-group="website"
style="display:none;"
>
<table class="form-table">
<tbody>
<tr>
<th scope="row">
<label for="mailpoet_mta_local_method">
<%= __('Delivery method') %>
</label>
</th>
<td>
<!-- local sending method: mail / sendmail / wp_mail -->
<p>
<label>
<input type="radio"
name="mta[local_method]"
value="mail"
<%
if not(settings.mta.local_method)
or (settings.mta.local_method == 'mail')
%>checked="checked"<% endif %>
/>PHP Mail
</label>
</p>
<p class="description"><%= __('This email engine works on 95&#37; of servers.') %></p>
<p>
<label>
<input type="radio"
name="mta[local_method]"
value="sendmail"
<%
if(settings.mta.local_method == 'sendmail')
%>checked="checked"<% endif %>
/>Sendmail
</label>
</p>
<p class="description"><%= __('This method works on 5&#37; of servers.') %></p>
<p>
<label>
<input type="radio"
name="mta[local_method]"
value="wp_mail"
<%
if(settings.mta.local_method == 'wp_mail')
%>checked="checked"<% endif %>
/>WP Mail
</label>
</p>
</td>
</tr>
<tr>
<th scope="row">
<label for="mailpoet_web_host">
<%= __('Sending frequency') %>
@@ -328,7 +288,7 @@
</div>
<!-- Sending Method: SMTP -->
<div class="mailpoet_sending_method" data-method="smtp" style="display:none;">
<div class="mailpoet_sending_method" data-group="smtp" style="display:none;">
<table class="form-table">
<tbody>
<tr>
@@ -353,6 +313,7 @@
value="<%= host_key %>"
data-emails="<%= host.emails %>"
data-interval="<%= host.interval %>"
data-fields="<%= host.fields | join(',') %>"
<% if(settings.smtp_provider == host_key) %>
selected="selected"
<% endif %>
@@ -414,9 +375,9 @@
</td>
</tr>
<!-- smtp: host -->
<tr class="mailpoet_smtp_field">
<tr class="mailpoet_smtp_field" data-field="host">
<th scope="row">
<label for="settings[mta_smtp_host]">
<label for="settings[mta_host]">
<%= __('SMTP Hostname') %>
<p class="description">
<%= __('e.g.:smtp.mydomain.com') %>
@@ -426,78 +387,193 @@
<td>
<input
type="text"
id="settings[mta_smtp_host]"
name="mta[smtp][host]"
value="<%= settings.mta.smtp.host %>" />
class="regular-text"
id="settings[mta_host]"
name="mta[host]"
value="<%= settings.mta.host %>" />
</td>
</tr>
<!-- smtp: login -->
<tr id="mta_smtp_login" class="mailpoet_smtp_field">
<!-- smtp: port -->
<tr class="mailpoet_smtp_field" data-field="port">
<th scope="row">
<label for="settings[mta_smtp_login]">
<label for="settings[mta_port]">
<%= __('SMTP Port') %>
<p class="description">
</p>
</label>
</th>
<td>
<input
type="number"
max="65535"
min="1"
maxlength="5"
style="width:5em;"
id="settings[mta_port]"
name="mta[port]"
value="<%= settings.mta.port %>"
/>
</td>
</tr>
<!-- smtp: amazon region -->
<tr class="mailpoet_smtp_field" data-field="region">
<th scope="row">
<label for="settings[mta_region]">
<%= __('Region') %>
</label>
</th>
<td>
<select
id="settings[mta_region]"
name="mta[region]"
value="<% if(settings.mta_group == 'smtp') %>
<%=- settings.mta.region -%>
<% endif %>"
>
<% for region, server in hosts.smtp.AmazonSES.regions %>
<option value="<%= server %>"><%= region %></option>
<% endfor %>
</select>
</td>
</tr>
<!-- smtp: amazon access_key -->
<tr class="mailpoet_smtp_field" data-field="access_key">
<th scope="row">
<label for="settings[mta_access_key]">
<%= __('Access Key') %>
</label>
</th>
<td>
<input
type="text"
class="regular-text"
id="settings[mta_access_key]"
name="mta[access_key]"
value="<% if(settings.mta_group == 'smtp') %>
<%=- settings.mta.access_key -%>
<% endif %>"
/>
</td>
</tr>
<!-- smtp: amazon secret_key -->
<tr class="mailpoet_smtp_field" data-field="secret_key">
<th scope="row">
<label for="settings[mta_secret_key]">
<%= __('Secret Key') %>
</label>
</th>
<td>
<input
type="text"
class="regular-text"
id="settings[mta_secret_key]"
name="mta[secret_key]"
value="<% if(settings.mta_group == 'smtp') %>
<%=- settings.mta.secret_key -%>
<% endif %>"
/>
</td>
</tr>
<!-- smtp: domain -->
<tr class="mailpoet_smtp_field" data-field="domain">
<th scope="row">
<label for="settings[mta_domain]">
<%= __('Domain') %>
<p class="description">
<%= __('e.g.:smtp.mydomain.com') %>
</p>
</label>
</th>
<td>
<input
type="text"
class="regular-text"
id="settings[mta_host]"
name="mta[host]"
value="<%= settings.mta.host %>" />
</td>
</tr>
<!-- smtp: api key -->
<tr class="mailpoet_smtp_field" data-field="api_key">
<th scope="row">
<label for="settings[mta_api_key]">
<%= __('API Key') %>
</label>
</th>
<td>
<input
type="text"
class="regular-text"
id="settings[mta_api_key]"
name="mta[api_key]"
value="<% if(settings.mta_group == 'smtp') %>
<%=- settings.mta.api_key -%>
<% endif %>"
/>
</td>
</tr>
<!-- smtp: login -->
<tr id="mta_login" class="mailpoet_smtp_field" data-field="login">
<th scope="row">
<label for="settings[mta_login]">
<%= __('Login') %>
</label>
</th>
<td>
<input
type="text"
id="settings[mta_smtp_login]"
name="mta[smtp][login]"
value="<%= settings.mta.smtp.login %>"
class="regular-text"
id="settings[mta_login]"
name="mta[login]"
value="<%= settings.mta.login %>"
/>
</td>
</tr>
<!-- smtp: password -->
<tr id="mta_smtp_password" class="mailpoet_smtp_field">
<tr id="mta_password" class="mailpoet_smtp_field" data-field="password">
<th scope="row">
<label for="settings[mta_smtp_password]">
<%= __('Password / API key') %>
<label for="settings[mta_password]">
<%= __('Password') %>
</label>
</th>
<td>
<input
type="password"
id="settings[mta_smtp_password]"
name="mta[smtp][password]"
value="<%= settings.mta.smtp.password %>"
/>
</td>
</tr>
<!-- smtp: port -->
<tr class="mailpoet_smtp_field">
<th scope="row">
<label for="settings[mta_smtp_port]">
<%= __('SMTP Port') %>
</label>
</th>
<td>
<input
type="text"
id="settings[mta_smtp_port]"
name="mta[smtp][port]"
value="<%= settings.mta.smtp.port %>"
class="regular-text"
id="settings[mta_password]"
name="mta[password]"
value="<%= settings.mta.password %>"
/>
</td>
</tr>
<!-- smtp: security protocol -->
<tr class="mailpoet_smtp_field">
<tr class="mailpoet_smtp_field" data-field="encryption">
<th scope="row">
<label for="settings[mta_smtp_secure]">
<label for="settings[mta_encryption]">
<%= __('Secure connection') %>
</label>
</th>
<td>
<select id="settings[mta_smtp_secure]" name="mta[smtp][secure]">
<select id="settings[mta_encryption]" name="mta[encryption]">
<option value=""><%= __('No') %></option>
<option
value="ssl"
<% if(settings.mta.smtp.secure == 'ssl') %>
<% if(settings.mta.encryption == 'ssl') %>
selected="selected"
<% endif %>
>SSL</option>
<option
value="tls"
<% if(settings.mta.smtp.secure == 'tls') %>
<% if(settings.mta.encryption == 'tls') %>
selected="selected"
<% endif %>
>TLS</option>
@@ -505,7 +581,7 @@
</td>
</tr>
<!-- smtp: authentication -->
<tr class="mailpoet_smtp_field">
<tr class="mailpoet_smtp_field" data-field="authentication">
<th scope="row">
<label>
<%= __('Authentication') %>
@@ -519,8 +595,10 @@
<input
type="radio"
value="1"
name="mta[smtp][authenticate]"
<% if(settings.mta.smtp.authenticate) %>
name="mta[authentication]"
<%
if not(settings.mta.authentication)
or (settings.mta.authentication == "1") %>
checked="checked"
<% endif %>
/><%= __('Yes') %>
@@ -529,9 +607,9 @@
<label>
<input
type="radio"
value=""
name="mta[smtp][authenticate]"
<% if not(settings.mta.smtp.authenticate) %>
value="-1"
name="mta[authentication]"
<% if(settings.mta.authentication == "-1") %>
checked="checked"
<% endif %>
/><%= __('No') %>
@@ -584,6 +662,7 @@
<%= __('Key') %>
<input
type="text"
class="regular-text"
onClick="this.focus();this.select();"
readonly="readonly"
value="wys._domainkey"
@@ -595,7 +674,8 @@
<%= __('Value') %>
<input
type="text"
size="40"
class="regular-text"
onClick="this.focus();this.select();"
readonly="readonly"
value="v=DKIM1;s=email;t=s;p=<%= settings.dkim.public_key %>"
@@ -695,18 +775,18 @@
// save configuration of a sending method
$('.mailpoet_mta_setup_save').on('click', function() {
// get selected method
var method = $('.mailpoet_sending_method:visible').data('method'),
emails = $('#'+method+'_frequency_emails').val(),
interval = $('#'+method+'_frequency_interval').val();
var group = $('.mailpoet_sending_method:visible').data('group'),
emails = $('#'+group+'_frequency_emails').val(),
interval = $('#'+group+'_frequency_interval').val();
// set sending method
if(method === undefined) {
if(group === undefined) {
MailPoet.Notice.error(
"<%= __('You have selected an invalid sending method.') %>"
);
} else {
if(
method === 'mailpoet'
group === 'mailpoet'
&& $('#mailpoet_api_key').val().trim().length === 0
) {
MailPoet.Notice.error(
@@ -716,7 +796,7 @@
}
// set new sending method active
setSendingMethod(method);
setSendingMethodGroup(group);
// update sending frequency values
$('#mta_frequency_emails').val(emails);
@@ -730,16 +810,35 @@
}
});
function setSendingMethod(method) {
function setSendingMethodGroup(group) {
// deactivate other sending methods
$('.mailpoet_sending_methods .mailpoet_active')
.removeClass('mailpoet_active');
// set active sending method
$('.mailpoet_sending_methods li[data-method="'+method+'"]')
$('.mailpoet_sending_methods li[data-group="'+group+'"]')
.addClass('mailpoet_active');
// set smtp method value
$('#mta_group').val(group);
var method = '';
switch(group) {
case 'mailpoet':
method = 'MailPoet';
break;
case 'website':
method = 'WPMail';
break;
case 'smtp':
method = $('#mailpoet_smtp_provider').val();
if(method === 'manual') {
method = 'SMTP';
}
break;
}
$('#mta_method').val(method);
}
@@ -757,20 +856,27 @@
function setProviderForm() {
// check provider
var provider = $(this).find('option:selected').first();
var fields = provider.data('fields');
if(provider.val() === 'sendgrid') {
$('.mailpoet_smtp_field').hide();
// show only login & password fields
$('#mta_smtp_login, #mta_smtp_password').show();
} else if(provider.val() === 'elasticemail') {
$('.mailpoet_smtp_field').hide();
// show only password field
$('#mta_smtp_password').show();
if(fields === undefined) {
fields = [
'host',
'port',
'login',
'password',
'authentication',
'encryption'
];
} else {
// display all fields
$('.mailpoet_smtp_field').show();
fields = fields.split(',');
}
$('.mailpoet_smtp_field').hide();
fields.map(function(field) {
$('.mailpoet_smtp_field[data-field="'+field+'"]').show();
});
// update sending frequency
renderSMTPSendingFrequency(provider);
}
@@ -791,6 +897,8 @@
host.data('emails') || <%= default_frequency.website.emails %>;
var interval =
host.data('interval') || <%= default_frequency.website.interval %>;
var fields =
host.data('fields') || '';
if(host.val() === 'manual' ) {
// hide sending frequency