added all pages + started implementing basics
This commit is contained in:
@@ -1,118 +0,0 @@
|
||||
define('settings', ['react/addons', 'jquery', 'mailpoet'], function(React, jQuery, MailPoet) {
|
||||
|
||||
var SettingsForm = React.createClass({
|
||||
mixins: [React.addons.LinkedStateMixin],
|
||||
load: function() {
|
||||
this.setState({ loading: true });
|
||||
|
||||
MailPoet.Ajax.post({
|
||||
endpoint: 'settings',
|
||||
action: 'get',
|
||||
onSuccess: function(response) {
|
||||
// index settings by key
|
||||
var settings = {};
|
||||
|
||||
jQuery.each(response, function(i, setting) {
|
||||
settings[setting.name] = setting.value;
|
||||
});
|
||||
|
||||
this.setState({
|
||||
loading: false,
|
||||
settings: settings
|
||||
});
|
||||
}.bind(this)
|
||||
});
|
||||
},
|
||||
handleSubmit: function(e) {
|
||||
this.setState({ loading: true });
|
||||
|
||||
e.preventDefault();
|
||||
|
||||
// format data
|
||||
var settings = [];
|
||||
|
||||
jQuery.each(this.state.settings, function(name, value) {
|
||||
settings.push({
|
||||
name: name,
|
||||
value: value
|
||||
});
|
||||
});
|
||||
|
||||
MailPoet.Ajax.post({
|
||||
endpoint: 'settings',
|
||||
action: 'set',
|
||||
data: settings,
|
||||
onSuccess: function(response) {
|
||||
this.setState({ loading: false });
|
||||
}.bind(this)
|
||||
})
|
||||
},
|
||||
getInitialState: function() {
|
||||
return {
|
||||
loading: false,
|
||||
settings: {}
|
||||
};
|
||||
},
|
||||
linkSettingValue: function(key) {
|
||||
return {
|
||||
value: this.state['settings'][key],
|
||||
requestChange: function(newValue) {
|
||||
var settings = this.state.settings;
|
||||
settings[key] = newValue;
|
||||
this.setState({ 'settings': settings });
|
||||
}.bind(this)
|
||||
};
|
||||
},
|
||||
componentDidMount: function() {
|
||||
this.load();
|
||||
},
|
||||
render: function() {
|
||||
return (
|
||||
<form onSubmit={this.handleSubmit} className="mailpoet_settings_form">
|
||||
<p>
|
||||
<label>
|
||||
From name:
|
||||
<input
|
||||
type="text"
|
||||
valueLink={this.linkSettingValue('from_name')} />
|
||||
</label>
|
||||
</p>
|
||||
|
||||
<p>
|
||||
<label>
|
||||
From email:
|
||||
<input
|
||||
type="text"
|
||||
valueLink={this.linkSettingValue('from_address')} />
|
||||
</label>
|
||||
</p>
|
||||
|
||||
<p>
|
||||
<label>
|
||||
API key:
|
||||
<input
|
||||
type="text"
|
||||
valueLink={this.linkSettingValue('api_key')} />
|
||||
</label>
|
||||
</p>
|
||||
|
||||
<input
|
||||
ref="submit"
|
||||
type="submit"
|
||||
className="button button-primary"
|
||||
disabled={this.state.loading}
|
||||
value="Save" />
|
||||
</form>
|
||||
);
|
||||
}
|
||||
});
|
||||
|
||||
var element = jQuery('#mailpoet_settings');
|
||||
|
||||
if(element.length > 0) {
|
||||
React.render(
|
||||
<SettingsForm />,
|
||||
element[0]
|
||||
);
|
||||
}
|
||||
});
|
37
assets/js/src/settings/advanced.jsx
Normal file
37
assets/js/src/settings/advanced.jsx
Normal file
@@ -0,0 +1,37 @@
|
||||
define(
|
||||
[
|
||||
'react',
|
||||
'mailpoet',
|
||||
'form/form.jsx'
|
||||
],
|
||||
function(
|
||||
React,
|
||||
MailPoet,
|
||||
Form
|
||||
) {
|
||||
|
||||
var fields = [
|
||||
];
|
||||
|
||||
var messages = {
|
||||
updated: function() {
|
||||
MailPoet.Notice.success('Settings succesfully updated!');
|
||||
}
|
||||
};
|
||||
|
||||
var SettingsForm = React.createClass({
|
||||
render: function() {
|
||||
|
||||
return (
|
||||
<Form
|
||||
endpoint="settings"
|
||||
fields={ fields }
|
||||
params={ this.props.params }
|
||||
messages={ messages } />
|
||||
);
|
||||
}
|
||||
});
|
||||
|
||||
return SettingsForm;
|
||||
}
|
||||
);
|
243
assets/js/src/settings/basics.jsx
Normal file
243
assets/js/src/settings/basics.jsx
Normal file
@@ -0,0 +1,243 @@
|
||||
define(
|
||||
[
|
||||
'react',
|
||||
'mailpoet',
|
||||
'form/form.jsx',
|
||||
'form/fields/field.jsx'
|
||||
],
|
||||
function(
|
||||
React,
|
||||
MailPoet
|
||||
) {
|
||||
|
||||
var BasicsForm = React.createClass({
|
||||
selectInput: function(input) {
|
||||
input.focus();
|
||||
input.select();
|
||||
},
|
||||
render: function() {
|
||||
console.log(this.props);
|
||||
return (
|
||||
<table className="form-table">
|
||||
<tbody>
|
||||
<tr>
|
||||
<th scope="row">
|
||||
<label htmlFor="settings[notification_email]">
|
||||
Email notifications
|
||||
<p className="description">
|
||||
Enter the email addresses that should receive
|
||||
notifications (separate by comma).
|
||||
</p>
|
||||
</label>
|
||||
</th>
|
||||
<td>
|
||||
<p>
|
||||
<input
|
||||
type="text"
|
||||
className="regular-text"
|
||||
id="settings[notification_email]"
|
||||
name="mailpoet[settings][notification_email]"
|
||||
defaultValue={ this.props.settings.notification_email }
|
||||
placeholder="notification@mydomain.com" />
|
||||
</p>
|
||||
<p>
|
||||
<label htmlFor="settings[notification_on_subscribe]">
|
||||
<input
|
||||
type="checkbox"
|
||||
id="settings[notification_on_subscribe]"
|
||||
name="mailpoet[settings][notification_on_subscribe]"
|
||||
value="1" />
|
||||
When someone subscribes
|
||||
</label>
|
||||
</p>
|
||||
<p>
|
||||
<label htmlFor="settings[notification_on_unsubscribe]">
|
||||
<input type="checkbox"
|
||||
id="settings[notification_on_unsubscribe]"
|
||||
name="mailpoet[settings][notification_on_unsubscribe]"
|
||||
value="1" />
|
||||
When someone unsubscribes
|
||||
</label>
|
||||
</p>
|
||||
<p>
|
||||
<label htmlFor="settings[notification_daily_report]">
|
||||
<input type="checkbox"
|
||||
id="settings[notification_daily_report]"
|
||||
name="mailpoet[settings][notification_daily_report]"
|
||||
value="1" />
|
||||
Daily summary of emails sent
|
||||
</label>
|
||||
</p>
|
||||
|
||||
<p>
|
||||
<label htmlFor="settings[from_name]">
|
||||
From
|
||||
</label>
|
||||
<input
|
||||
type="text"
|
||||
id="settings[from_name]"
|
||||
name="mailpoet[settings][from_name]"
|
||||
defaultValue={ this.props.settings.from_name }
|
||||
placeholder="Your name" />
|
||||
<input
|
||||
type="text"
|
||||
id="settings[from_email]"
|
||||
name="mailpoet[settings][from_email]"
|
||||
defaultValue={ this.props.settings.from_email }
|
||||
placeholder="info@mydomain.com" />
|
||||
</p>
|
||||
|
||||
<p>
|
||||
<label htmlFor="settings[notification_reply_name]">
|
||||
Reply-to
|
||||
</label>
|
||||
<input
|
||||
type="text"
|
||||
id="settings[notification_reply_name]"
|
||||
name="mailpoet[settings][notification_reply_name]"
|
||||
defaultValue={
|
||||
this.props.settings.notification_reply_name
|
||||
}
|
||||
placeholder="Your name" />
|
||||
<input
|
||||
type="text"
|
||||
id="settings[notification_reply_email]"
|
||||
name="mailpoet[settings][notification_reply_email]"
|
||||
defaultValue={
|
||||
this.props.settings.notification_reply_email
|
||||
}
|
||||
placeholder="info@mydomain.com" />
|
||||
</p>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<th scope="row">
|
||||
<label htmlFor="settings[subscribe_on_comment]">
|
||||
Subscribe in comments
|
||||
<p className="description">
|
||||
Visitors who submit a comment on a post can click on
|
||||
a checkbox to subscribe.
|
||||
</p>
|
||||
</label>
|
||||
</th>
|
||||
<td>
|
||||
<div id="mailpoet_subscribe_on_comment">
|
||||
<p>
|
||||
subscribe_on_comment_label
|
||||
</p>
|
||||
</div>
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<th scope="row">
|
||||
<label htmlFor="settings[subscribe_on_register]">
|
||||
Subscribe in registration form
|
||||
<p className="description">
|
||||
Allow users who register to your site to subscribe on
|
||||
a list of your choice.
|
||||
</p>
|
||||
</label>
|
||||
</th>
|
||||
<td>
|
||||
<p>
|
||||
<input
|
||||
data-toggle="mailpoet_subscribe_in_form"
|
||||
type="checkbox"
|
||||
value="1"
|
||||
id="settings[subscribe_on_register]"
|
||||
name="mailpoet[settings][subscribe_on_register]" />
|
||||
</p>
|
||||
<div id="mailpoet_subscribe_in_form">
|
||||
<p>
|
||||
<input
|
||||
type="text"
|
||||
id="settings[subscribe_on_register_label]"
|
||||
name="mailpoet[settings][subscribe_on_register_label]"
|
||||
value={ this.props.settings.subscribe_on_register_label } />
|
||||
</p>
|
||||
<p>
|
||||
subscribe_on_register_lists
|
||||
</p>
|
||||
</div>
|
||||
<em>Registration is disabled on this site.</em>
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<th scope="row">
|
||||
<label htmlFor="settings[subscription_edit]">
|
||||
Unsubscribe & Manage Subscription page
|
||||
<p className="description">
|
||||
The page your subscribers see when they click to "Unsubscribe" or "Manage your subscription" in your emails.
|
||||
</p>
|
||||
</label>
|
||||
</th>
|
||||
<td>
|
||||
<p>
|
||||
subscription_edit_page
|
||||
</p>
|
||||
<p>
|
||||
<label>Subscribers can choose from these lists :</label>
|
||||
</p>
|
||||
<p>
|
||||
subscription_edit_lists
|
||||
</p>
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<th scope="row">
|
||||
<label>
|
||||
Archive page shortcode
|
||||
<p className="description">
|
||||
Paste this shortcode in a page to display a list of past newsletters.
|
||||
</p>
|
||||
</label>
|
||||
</th>
|
||||
<td>
|
||||
<p>
|
||||
<input
|
||||
type="text"
|
||||
id="mailpoet_shortcode_archives"
|
||||
value="[mailpoet_archive]"
|
||||
onClick={ this.selectInput.bind(null, this) }
|
||||
readOnly={ true } />
|
||||
</p>
|
||||
<p>
|
||||
mailpoet_shortcode_archives_list
|
||||
</p>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<th scope="row">
|
||||
<label>
|
||||
Shortcode to display total number of subscribers
|
||||
<p className="description">
|
||||
Paste this shortcode to display the number of confirmed subscribers in post or page.
|
||||
</p>
|
||||
</label>
|
||||
</th>
|
||||
<td>
|
||||
<p>
|
||||
<input
|
||||
type="text"
|
||||
id="mailpoet_shortcode_subscribers"
|
||||
value="[mailpoet_subscribers_count]"
|
||||
onClick={ this.selectInput.bind(null, this) }
|
||||
readOnly={ true } />
|
||||
</p>
|
||||
<p>
|
||||
mailpoet_shortcode_subscribers_list
|
||||
</p>
|
||||
</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
);
|
||||
}
|
||||
});
|
||||
|
||||
return BasicsForm;
|
||||
}
|
||||
);
|
37
assets/js/src/settings/bounce.jsx
Normal file
37
assets/js/src/settings/bounce.jsx
Normal file
@@ -0,0 +1,37 @@
|
||||
define(
|
||||
[
|
||||
'react',
|
||||
'mailpoet',
|
||||
'form/form.jsx'
|
||||
],
|
||||
function(
|
||||
React,
|
||||
MailPoet,
|
||||
Form
|
||||
) {
|
||||
|
||||
var fields = [
|
||||
];
|
||||
|
||||
var messages = {
|
||||
updated: function() {
|
||||
MailPoet.Notice.success('Settings succesfully updated!');
|
||||
}
|
||||
};
|
||||
|
||||
var SettingsForm = React.createClass({
|
||||
render: function() {
|
||||
|
||||
return (
|
||||
<Form
|
||||
endpoint="settings"
|
||||
fields={ fields }
|
||||
params={ this.props.params }
|
||||
messages={ messages } />
|
||||
);
|
||||
}
|
||||
});
|
||||
|
||||
return SettingsForm;
|
||||
}
|
||||
);
|
37
assets/js/src/settings/mta.jsx
Normal file
37
assets/js/src/settings/mta.jsx
Normal file
@@ -0,0 +1,37 @@
|
||||
define(
|
||||
[
|
||||
'react',
|
||||
'mailpoet',
|
||||
'form/form.jsx'
|
||||
],
|
||||
function(
|
||||
React,
|
||||
MailPoet,
|
||||
Form
|
||||
) {
|
||||
|
||||
var fields = [
|
||||
];
|
||||
|
||||
var messages = {
|
||||
updated: function() {
|
||||
MailPoet.Notice.success('Settings succesfully updated!');
|
||||
}
|
||||
};
|
||||
|
||||
var SettingsForm = React.createClass({
|
||||
render: function() {
|
||||
|
||||
return (
|
||||
<Form
|
||||
endpoint="settings"
|
||||
fields={ fields }
|
||||
params={ this.props.params }
|
||||
messages={ messages } />
|
||||
);
|
||||
}
|
||||
});
|
||||
|
||||
return SettingsForm;
|
||||
}
|
||||
);
|
122
assets/js/src/settings/settings.jsx
Normal file
122
assets/js/src/settings/settings.jsx
Normal file
@@ -0,0 +1,122 @@
|
||||
define(
|
||||
[
|
||||
'react',
|
||||
'react-router',
|
||||
'classnames',
|
||||
'settings/basics.jsx',
|
||||
'settings/signup.jsx',
|
||||
'settings/mta.jsx',
|
||||
'settings/advanced.jsx',
|
||||
'settings/bounce.jsx'
|
||||
],
|
||||
function(
|
||||
React,
|
||||
Router,
|
||||
classNames,
|
||||
Basics,
|
||||
Signup,
|
||||
Mta,
|
||||
Advanced,
|
||||
Bounce
|
||||
) {
|
||||
var DefaultRoute = Router.DefaultRoute;
|
||||
var Link = Router.Link;
|
||||
var Route = Router.Route;
|
||||
var RouteHandler = Router.RouteHandler;
|
||||
var NotFoundRoute = Router.NotFoundRoute;
|
||||
|
||||
var settings = mailpoet_settings || {};
|
||||
|
||||
var Tabs = React.createClass({
|
||||
render: function() {
|
||||
var current_tab = window.location.hash.split('/')[1];
|
||||
var tabs = this.props.tabs.map(function(tab, index) {
|
||||
var tabClasses = classNames(
|
||||
'nav-tab',
|
||||
{ 'nav-tab-active': (current_tab === tab.to) }
|
||||
);
|
||||
return (
|
||||
<Link
|
||||
key={ 'tab-' + index }
|
||||
to={ tab.to }
|
||||
className={ tabClasses }
|
||||
>
|
||||
{ tab.label }
|
||||
</Link>
|
||||
);
|
||||
});
|
||||
|
||||
return (
|
||||
<h2
|
||||
id="mailpoet_settings_tabs"
|
||||
className="nav-tab-wrapper"
|
||||
>
|
||||
{ tabs }
|
||||
</h2>
|
||||
);
|
||||
}
|
||||
});
|
||||
|
||||
var App = React.createClass({
|
||||
getInitialState: function() {
|
||||
return {
|
||||
loading: false
|
||||
}
|
||||
},
|
||||
render: function() {
|
||||
return (
|
||||
<div>
|
||||
<h1>{ MailPoetI18n.pageTitle }</h1>
|
||||
|
||||
<Tabs tabs={ [
|
||||
{ to: 'basics', label: 'Basics'},
|
||||
{ to: 'signup', label: 'Signup Confirmation'},
|
||||
{ to: 'mta', label: 'Send With...'},
|
||||
{ to: 'advanced', label: 'Advanced'},
|
||||
{ to: 'bounce', label: 'Bounce Handling'}
|
||||
]} />
|
||||
|
||||
<form
|
||||
id="mailpoet_settings_form"
|
||||
name="mailpoet_settings_form"
|
||||
autoComplete="off"
|
||||
noValidate
|
||||
>
|
||||
<RouteHandler settings={ settings } />
|
||||
|
||||
<input
|
||||
className="button button-primary"
|
||||
type="submit"
|
||||
value="Save"
|
||||
disabled={this.state.loading} />
|
||||
</form>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
});
|
||||
|
||||
var routes = (
|
||||
<Route name="app" path="/" handler={App}>
|
||||
<Route name="basics" path="/basics" handler={Basics} />
|
||||
<Route name="signup" path="/signup" handler={Signup} />
|
||||
<Route name="mta" path="/mta" handler={Mta} />
|
||||
<Route name="advanced" path="/advanced" handler={Advanced} />
|
||||
<Route name="bounce" path="/bounce" handler={Bounce} />
|
||||
<NotFoundRoute handler={Basics} />
|
||||
<DefaultRoute handler={Basics} />
|
||||
</Route>
|
||||
);
|
||||
|
||||
var hook = document.getElementById('mailpoet_settings');
|
||||
if(hook) {
|
||||
Router.run(routes, function(Handler, state) {
|
||||
React.render(
|
||||
<Handler
|
||||
params={state.params}
|
||||
query={state.query} />,
|
||||
hook
|
||||
);
|
||||
});
|
||||
}
|
||||
}
|
||||
);
|
36
assets/js/src/settings/signup.jsx
Normal file
36
assets/js/src/settings/signup.jsx
Normal file
@@ -0,0 +1,36 @@
|
||||
define(
|
||||
[
|
||||
'react',
|
||||
'mailpoet',
|
||||
'form/form.jsx'
|
||||
],
|
||||
function(
|
||||
React,
|
||||
MailPoet,
|
||||
Form
|
||||
) {
|
||||
|
||||
var fields = [
|
||||
];
|
||||
|
||||
var messages = {
|
||||
updated: function() {
|
||||
MailPoet.Notice.success('Settings succesfully updated!');
|
||||
}
|
||||
};
|
||||
|
||||
var SignupForm = React.createClass({
|
||||
render: function() {
|
||||
return (
|
||||
<Form
|
||||
endpoint="settings"
|
||||
fields={ fields }
|
||||
params={ this.props.params }
|
||||
messages={ messages } />
|
||||
);
|
||||
}
|
||||
});
|
||||
|
||||
return SignupForm;
|
||||
}
|
||||
);
|
@@ -93,7 +93,35 @@ class Menu {
|
||||
|
||||
function settings() {
|
||||
$data = array();
|
||||
$flags = array();
|
||||
|
||||
// check if registration is enabled
|
||||
if(is_multisite()) {
|
||||
// get multisite registration option
|
||||
$registration = apply_filters(
|
||||
'wpmu_registration_enabled',
|
||||
get_site_option('registration', 'all')
|
||||
);
|
||||
|
||||
// check if users can register
|
||||
$flags['registration_enabled'] = !(in_array($registration, array('none', 'blog')));
|
||||
} else {
|
||||
// check if users can register
|
||||
$flags['registration_enabled'] = (bool)get_option('users_can_register', false);
|
||||
}
|
||||
|
||||
$data['flags'] = $flags;
|
||||
|
||||
$data['segments'] = Segment::findArray();
|
||||
|
||||
$settings = Setting::findMany();
|
||||
$data['settings'] = array();
|
||||
foreach($settings as $setting) {
|
||||
$data['settings'][$setting->name] = $setting->value;
|
||||
}
|
||||
|
||||
echo $this->renderer->render('settings.html', $data);
|
||||
|
||||
}
|
||||
|
||||
function subscribers() {
|
||||
|
@@ -1,7 +1,15 @@
|
||||
<% extends 'layout.html' %>
|
||||
|
||||
<% block content %>
|
||||
<h1><%= __('Settings') %></h1>
|
||||
|
||||
<div id="mailpoet_settings"></div>
|
||||
|
||||
<%= localize({
|
||||
'pageTitle': __('Settings')
|
||||
}) %>
|
||||
|
||||
<script type="text/javascript">
|
||||
var mailpoet_settings = <%= json_encode(settings) %>;
|
||||
var mailpoet_segments = <%= json_encode(segments) %>;
|
||||
var mailpoet_flags = <%= json_encode(flags) %>;
|
||||
</script>
|
||||
<% endblock %>
|
||||
|
@@ -66,7 +66,7 @@ config.push(_.extend({}, baseConfig, {
|
||||
'jquery.serialize_object'
|
||||
],
|
||||
admin: [
|
||||
'settings.jsx',
|
||||
'settings/settings.jsx',
|
||||
'subscribers/subscribers.jsx',
|
||||
'newsletters/newsletters.jsx',
|
||||
'segments/segments.jsx'
|
||||
|
Reference in New Issue
Block a user