Bump version up to 0.0.14

Enables conditional bypassing of unit tests

.env.sample

@@ -1,2 +1,16 @@
 WP_TEST_PATH="/var/www/wordpress"
-
+WP_TEST_ENABLE_NETWORK_TESTS="true"
+WP_TEST_IMPORT_MAILCHIMP_API=""
+WP_TEST_IMPORT_MAILCHIMP_LISTS="" // (separated with comma)
+WP_TEST_MAILER_ENABLE_SENDING="true"
+WP_TEST_MAILER_AMAZON_ACCESS=""
+WP_TEST_MAILER_AMAZON_SECRET=""
+WP_TEST_MAILER_AMAZON_REGION=""
+WP_TEST_MAILER_ELASTICEMAIL_API=""
+WP_TEST_MAILER_MAILGUN_API=""
+WP_TEST_MAILER_MAILGUN_DOMAIN=""
+WP_TEST_MAILER_MAILPOET_API=""
+WP_TEST_MAILER_SENDGRID_API=""
+WP_TEST_MAILER_SMTP_HOST=""
+WP_TEST_MAILER_SMTP_LOGIN=""
+WP_TEST_MAILER_SMTP_PASSWORD=""

.gitignore

@@ -1,7 +1,7 @@
 .DS_Store
 TODO
 composer.phar
-vendor
+/vendor
 tests/_output/*
 tests/acceptance.suite.yml
 tests/_support/_generated/*

README.md

@@ -8,7 +8,6 @@ MailPoet done the right way.
 ```
 php
 nodejs
-phantomjs
 wordpress
 ```
 
@@ -47,16 +46,6 @@ $ ./do compile:all
 $ ./do test:unit
 ```
 
-- Acceptance tests:
-```sh
-$ ./do test:acceptance
-```
-
-- Run all tests:
-```sh
-$ ./do test:all
-```
-
 - Debug tests:
 ```sh
 $ ./do test:debug

RoboFile.php

@@ -47,6 +47,15 @@ class RoboFile extends \Robo\Tasks {
       ->run();
   }
 
+  function watchCss() {
+    $css_files = $this->rsearch('assets/css/src/', array('styl'));
+    $this->taskWatch()
+      ->monitor($css_files, function() {
+        $this->compileCss();
+      })
+      ->run();
+  }
+
   function watchJs() {
     $this->_exec('./node_modules/webpack/bin/webpack.js --watch');
   }
@@ -96,7 +105,17 @@ class RoboFile extends \Robo\Tasks {
   function testUnit($file = null) {
     $this->loadEnv();
     $this->_exec('vendor/bin/codecept build');
-    $this->_exec('vendor/bin/codecept run unit '.(($file) ? $file : ''));
+    $this->_exec('vendor/bin/codecept run unit -f '.(($file) ? $file : ''));
+  }
+
+  function testCoverage() {
+    $this->loadEnv();
+    $this->_exec('vendor/bin/codecept build');
+    $this->_exec(join(' ', array(
+      'vendor/bin/codecept run',
+      '--coverage',
+      '--coverage-html'
+    )));
   }
 
   function testJavascript() {

Vagrantfile

@@ -1,67 +0,0 @@
-# -*- mode: ruby -*-
-# vi: set ft=ruby :
-
-Vagrant.configure(2) do |config|
-  config.vm.provider "virtualbox" do |v|
-    v.name = "phoenix"
-    v.memory = "2048"
-  end
-
-  config.vm.define :web do |web|
-    web.vm.box = "ubuntu/trusty64"
-    web.vm.hostname = "phoenix"
-    web.vm.network "forwarded_port", guest: 80, host: 8080
-    web.vm.synced_folder(
-      ".",
-      "/var/www/html/wp-content/plugins/wysija-newsletters",
-      create: true,
-      owner: "vagrant",
-      group: "www-data"
-    )
-
-    web.vm.provision "shell", inline: <<-SHELL
-    sudo apt-get update
-    sudo apt-get install -y apache2 curl zip sendmail git build-essential
-
-    sudo debconf-set-selections <<< 'mysql-server mysql-server/root_password password root'
-    sudo debconf-set-selections <<< 'mysql-server mysql-server/root_password_again password root'
-    sudo apt-get install -y mysql-server-5.5
-
-    sudo apt-get install -y php5 libapache2-mod-php5 php5-curl php5-gd php5-mcrypt php5-readline mysql-server-5.5 php5-mysql php-apc
-    sudo sed -i "s/error_reporting = .*/error_reporting = E_ALL/" /etc/php5/apache2/php.ini
-    sudo sed -i "s/display_errors = .*/display_errors = On/" /etc/php5/apache2/php.ini
-
-    cd /var/www/html
-
-    sudo wget https://github.com/calvinlough/sqlbuddy/raw/gh-pages/sqlbuddy.zip -O /var/www/html/sqlbuddy.zip
-    sudo rm index.html
-    unzip sqlbuddy.zip
-
-    sudo curl -O https://raw.githubusercontent.com/wp-cli/builds/gh-pages/phar/wp-cli.phar
-    sudo chmod +x wp-cli.phar
-    sudo mv wp-cli.phar /usr/local/bin/wp
-    sudo wp core download --allow-root
-    mysql -uroot -proot -e "create database wordpress"
-    sudo wp core config --allow-root --dbname=wordpress --dbuser=root --dbpass=root
-    sudo wp core install --allow-root --url="http://localhost:8080" --title=WordPress --admin_user=admin --admin_password=password --admin_email=test@mailpoet-container.com
-
-    sudo sed -i "s/upload_max_filesize = .*/upload_max_filesize = 32M/" /etc/php5/apache2/php.ini
-    sudo sed -i "s/post_max_size = .*/post_max_size = 32M/" /etc/php5/apache2/php.ini
-    sudo chown -hR vagrant:www-data /var/www/html/
-    sudo a2enmod rewrite > /dev/null 2>&1
-
-    cd /var/www/html/wp-content/plugins/wysija-newsletters
-
-    curl -sS https://getcomposer.org/installer | php
-
-    sudo add-apt-repository -y ppa:chris-lea/node.js
-    sudo apt-get update
-    sudo apt-get install -y nodejs
-
-    sudo sed -i "s/export APACHE_RUN_USER.*/export APACHE_RUN_USER=vagrant/" /etc/apache2/envvars
-    sudo chown -R vagrant:www-data /var/lock/apache2
-
-    sudo service apache2 restart
-    SHELL
-  end
-end

assets/css/src/admin.styl

@@ -5,12 +5,15 @@
 @require 'common'
 @require 'modal'
 @require 'notice'
-@require 'parsley'
 
 @require 'form_editor'
 @require 'listing'
 @require 'box'
 @require 'breadcrumb'
-@require 'form'
 
-@require 'settings'
+@require 'form'
+@require 'parsley'
+@require 'form_validation'
+
+@require 'settings'
+@require 'progress_bar'

assets/css/src/common.styl

@@ -19,6 +19,8 @@ a:focus
 
 // select 2
 .select2-container
+  width: 25em !important
+
 // textareas
 textarea.regular-text
   width: 25em !important
@@ -26,3 +28,25 @@ textarea.regular-text
 @media screen and (max-width: 782px)
   .select2-container
     width: 100% !important
+
+// progress bars
+progress-border-radius = 5px
+progress-background = #efefef
+progress-foreground = #69b1e9
+
+progress
+  background-color: progress-background;
+  height: 2em
+  border: 0
+  width: 100%
+
+progress::-webkit-progress-bar
+  background-color: progress-background;
+
+progress::-webkit-progress-value
+  background-color: progress-foreground
+  border-radius: progress-border-radius
+
+progress::-moz-progress-bar
+  background-color: progress-foreground
+  border-radius: progress-border-radius

assets/css/src/form_editor.styl

@@ -4,6 +4,9 @@
 icons = '../img/form_editor_icons.png'
 handle_icon = '../img/handle.png'
 
+#mailpoet_form_name
+  font-size: 23px
+
 #mailpoet_form_history
   display: none
 
@@ -99,6 +102,7 @@ handle_icon = '../img/handle.png'
 /* MailPoet Form wrapper */
 #mailpoet_form_wrapper
   position: relative
+  margin: 20px 0 0 0
 
 /* MailPoet Form container */
 #mailpoet_form_container
@@ -121,6 +125,7 @@ handle_icon = '../img/handle.png'
   float: none
 
 #mailpoet_form_toolbar
+  z-index: 999
   position: absolute
   width: 400px
 

assets/css/src/form_validation.styl

@@ -0,0 +1,6 @@
+.parsley-errors-list
+  margin-top: 8px
+
+.parsley-required
+.parsley-custom-error-message
+  color: #b94a48

assets/css/src/modal.styl

@@ -90,7 +90,7 @@ body.mailpoet_modal_opened
   padding: 0
   margin: 0
   width: 100%
-  transition: margin 0.3s ease-out
+  transition: margin 350ms ease-out
 
 .mailpoet_panel_wrapper
   background-color: #f1f1f1
@@ -200,4 +200,4 @@ body.mailpoet_modal_opened
   0%
   50%
     background-color: #064E6D
-  100%
+  100%

assets/css/src/newsletter_editor/components/blockTools.styl

@@ -7,7 +7,6 @@ $tool-active-secondary-color = #ffffff
 
 $tool-width = 20px
 $master-column-tool-width = 24px
-$layer-selector-width = 30px
 
 .mailpoet_tools
   position: absolute
@@ -33,10 +32,35 @@ $layer-selector-width = 30px
         width: $master-column-tool-width
         height: $master-column-tool-width
 
+
+    .mailpoet_delete_block_activate
+      max-width: 100%
+      max-height: $master-column-tool-width
+      opacity: 1
+      display: block
+
+    .mailpoet_delete_block_confirm,
+    .mailpoet_delete_block_cancel
+      max-width: 100%
+      max-height: 0
+      opacity: 0
+      overflow: hidden
+      display: block
+
     .mailpoet_delete_block_activated
       width: auto
       height: auto
 
+      .mailpoet_delete_block_activate
+        overflow: hidden
+        max-height: 0
+        opacity: 0
+
+      .mailpoet_delete_block_confirm,
+      .mailpoet_delete_block_cancel
+        max-height: $master-column-tool-width*2
+        opacity: 1
+
 .mailpoet_tool
   display: inline-block
   width: $tool-width
@@ -76,28 +100,45 @@ $layer-selector-width = 30px
   display: inline-block
   padding: 2px
   vertical-align: top
+  animation-background-color()
 
   .mailpoet_tool
     padding: 0
 
+  .mailpoet_delete_block_activate
+    max-width: $tool-width
+    display: inline-block
+    opacity: 1
+    animation-fade-in-and-scale-horizontally()
+
   .mailpoet_delete_block_confirm,
   .mailpoet_delete_block_cancel
-    display: none
+    max-width: 0
+    opacity: 0
+    overflow: hidden
+    display: inline-block
+    animation-fade-in-and-scale-horizontally()
 
 .mailpoet_delete_block_activated
+  height: auto
   width: auto
   border-radius(3px)
   background-color: $warning-background-color
   padding: 3px 5px
   line-height: 1.2em
-  height: auto
 
   .mailpoet_delete_block_activate
-    display: none
+    overflow: hidden
+    max-width: 0
+    opacity: 0
 
   .mailpoet_delete_block_confirm,
   .mailpoet_delete_block_cancel
-    display: inline-block
+    max-width: 100%
+    opacity: 1
+
+  .mailpoet_delete_block_cancel
+    margin-left: 3px
 
 .mailpoet_delete_block_confirm
   color: $warning-text-color

assets/css/src/newsletter_editor/components/dragAndDrop.styl

@@ -52,6 +52,7 @@ $draggable-widget-z-index = 2
   padding: 0
   margin: 0
   z-index: $draggable-widget-z-index
+  animation-fade-in()
 
   .mailpoet_widget_icon
     padding: 0

assets/css/src/newsletter_editor/components/save.styl

@@ -48,7 +48,7 @@
 .mailpoet_save_as_template_container,
 .mailpoet_export_template_container
   border-radius(3px)
-  float: left
+  display: inline-block
   clear: both
 
   margin-top: 5px

assets/css/src/newsletter_editor/components/sidebar.styl

@@ -26,13 +26,9 @@ $widget-icon-width = 30px
     border-right: 0
 
     &.closed .mailpoet_region_content
-      max-height: 0px
-      overflow: hidden
-      margin-top: 0
+      display: none
 
   .mailpoet_region_content
-    max-height: 2000px
-    transition: max-height 0.2s ease
     padding: 0 20px
     margin-top: 12px
 

assets/css/src/newsletter_editor/contentBlocks/automatedLatestContent.styl

@@ -18,3 +18,6 @@
 
   & > .mailpoet_block
     width: 100%
+
+.mailpoet_automated_latest_content_display_options
+  animation-slide-open-downwards()

assets/css/src/newsletter_editor/contentBlocks/container.styl

@@ -79,3 +79,4 @@ $three-column-width = ($newsletter-width / 3) - (2 * $column-margin)
   box-shadow(inset 1px 2px 1px $primary-inactive-color)
   color: #656565
   border-radius(3px)
+  animation-background-color()

assets/css/src/newsletter_editor/contentBlocks/posts.styl

@@ -15,7 +15,11 @@
 .mailpoet_posts_categories_and_tags
   width: 100%
 
-.mailpoet_settings_posts_show_display_options
+.mailpoet_settings_posts_display_options
+.mailpoet_settings_posts_selection
+  animation-slide-open-downwards()
+
+.mailpoet_settings_posts_show_display_options,
 .mailpoet_settings_posts_show_post_selection
   display: block
   margin-top: 10px

assets/css/src/newsletter_editor/libraryOverrides.styl

@@ -129,3 +129,7 @@ body
 
 #mailpoet_modal_close
   display: none
+
+.wrap > .mailpoet_notice,
+.update-nag
+  margin-left: 2px + 15px !important

assets/css/src/newsletter_editor/mixins/transitions.styl

@@ -0,0 +1,31 @@
+animation-slide-open-downwards()
+  transition: all 250ms cubic-bezier(0.420, 0.000, 0.580, 1.000) /* ease-in-out */
+  max-height: 2000px
+  opacity: 1
+
+  &.mailpoet_closed
+    max-height: 0
+    opacity: 0
+    overflow-y: hidden
+
+animation-background-color()
+  transition: background 250ms cubic-bezier(0.420, 0.000, 0.580, 1.000) /* ease-in-out */
+
+animation-fade-in()
+  animation-name: fadeIn
+  animation-duration: 300ms
+  animation-fill-mode: forwards
+  animation-timing-function: ease-in
+
+animation-fade-in-and-scale-horizontally()
+  transition: all 250ms cubic-bezier(0.420, 0.000, 0.580, 1.000) /* ease-in-out */
+
+@keyframes fadeIn {
+  0% {
+    opacity: 0.3
+  }
+
+  100% {
+    opacity: 1
+  }
+}

assets/css/src/newsletter_editor/newsletter_editor.styl

@@ -6,6 +6,7 @@
 @require 'mixins/border-radius'
 @require 'mixins/box-shadow'
 @require 'mixins/filter-shadow'
+@require 'mixins/transitions'
 
 @require 'variables'
 @require 'common'

assets/css/src/progress_bar.styl

@@ -0,0 +1,29 @@
+.mailpoet_progress
+  background-color: #efefef
+  height: 25px
+  padding: 0
+  width: 100%
+  margin: 0
+  border-radius: 5px
+  position: relative
+
+.mailpoet_progress_label
+  position: absolute
+  width: 100%
+  text-align: center
+  display: inline-block
+  margin: 2px 0 0 0
+
+.mailpoet_progress_bar
+  position: absolute
+  display: inline-block
+  height: 100%
+  border-radius: 3px
+  box-shadow: 0 1px 0 rgba(255, 255, 255, .5) inset
+  background-color: #34c2e3
+  background-image: linear-gradient(top, #34c2e3, darken(#34c2e3, 20%))
+
+.mailpoet_progress_complete
+  .mailpoet_progress_bar
+    background-color: #fecf23
+    background-image: linear-gradient(top, #fecf23, #fd9215)

assets/css/src/public.styl

@@ -1,3 +1,4 @@
 @import 'nib'
 
 @require 'parsley'
+@require 'form_validation'

assets/img/preview_magnifying_glass.svg

@@ -0,0 +1,12 @@
+<?xml version="1.0" encoding="utf-8"?>
+<!-- Generator: Adobe Illustrator 16.0.4, SVG Export Plug-In . SVG Version: 6.00 Build 0)  -->
+<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
+<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
+	 width="47.002px" height="38.003px" viewBox="0 0 47.002 38.003" enable-background="new 0 0 47.002 38.003" xml:space="preserve">
+<path fill-rule="evenodd" clip-rule="evenodd" fill="#565656" d="M46.328,36.365c-1.188,1.725-3.553,2.158-5.273,0.962L25.479,26.52
+	c-1.104-0.763-1.674-2.007-1.631-3.257c-2.006,2.157-4.642,3.606-7.594,4.145c-3.626,0.663-7.288-0.13-10.311-2.227
+	c-3.024-2.098-5.054-5.253-5.714-8.887c-0.661-3.636,0.127-7.31,2.221-10.344c4.325-6.264,12.927-7.834,19.177-3.5
+	c5.672,3.938,7.486,11.412,4.537,17.443c1.152-0.486,2.519-0.392,3.627,0.377l15.58,10.808C47.09,32.274,47.52,34.641,46.328,36.365
+	z M23.235,12.09c-0.459-2.534-1.874-4.734-3.982-6.196C14.897,2.87,8.896,3.963,5.878,8.331c-3.014,4.373-1.922,10.388,2.435,13.408
+	c4.356,3.025,10.356,1.932,13.374-2.438C23.146,17.187,23.696,14.625,23.235,12.09z"/>
+</svg>

assets/js/src/cron.jsx

@@ -0,0 +1,106 @@
+define(
+  [
+    'react',
+    'react-dom',
+    'mailpoet'
+  ],
+  function(
+    React,
+    ReactDOM,
+    MailPoet
+  ) {
+  var CronControl = React.createClass({
+    getInitialState: function() {
+      return {
+        status: 'loading'
+      };
+    },
+    getCronData: function() {
+      MailPoet.Ajax.post({
+          endpoint: 'cron',
+          action: 'getStatus'
+        })
+        .done(function(response) {
+          jQuery('.button-primary')
+            .removeClass('disabled');
+          if(response.status !== undefined) {
+            this.setState(response);
+          } else {
+            this.replaceState();
+          }
+        }.bind(this));
+    },
+    componentDidMount: function() {
+      if(this.isMounted()) {
+        this.getCronData();
+        setInterval(this.getCronData, 5000);
+      }
+    },
+    controlCron: function(action) {
+      if(jQuery('.button-primary').hasClass('disabled')) {
+        return;
+      }
+      jQuery('.button-primary')
+        .addClass('disabled');
+      MailPoet.Ajax.post({
+        endpoint: 'cron',
+        action: action,
+      })
+      .done(function(response) {
+        if(!response.result) {
+          MailPoet.Notice.error(MailPoetI18n.daemonControlError);
+        }
+      }.bind(this));
+    },
+    render: function() {
+      if(this.state.status === 'loading') {
+        return(<div>Loading daemon status...</div>);
+      }
+      switch(this.state.status) {
+        case 'started':
+          return(
+            <div>
+              Cron daemon is running.
+              <br/>
+              <br/>
+              It was started
+              <strong> {this.state.timeSinceStart} </strong> and last executed
+              <strong> {this.state.timeSinceUpdate} </strong> for a total of
+              <strong> {this.state.counter} </strong> times (once every 30 seconds, unless it was interrupted and restarted).
+              <br />
+              <br />
+              <a href="#" className="button-primary" onClick={this.controlCron.bind(null, 'stop')}>Stop</a>
+            </div>
+          );
+        break;
+        case 'starting':
+        case 'stopping':
+          return(
+            <div>
+              Daemon is {this.state.status}
+            </div>
+          );
+        break;
+        case 'stopped':
+          return(
+            <div>
+              Daemon is {this.state.status}
+              <br />
+              <br />
+              <a href="#" className="button-primary" onClick={this.controlCron.bind(null, 'start')}>Start</a>
+            </div>
+          );
+        break;
+      }
+    }
+  });
+
+  const container = document.getElementById('cron_container');
+
+  if(container) {
+    ReactDOM.render(
+      <CronControl />,
+      container
+    );
+  }
+});

assets/js/src/form/fields/checkbox.jsx

@@ -1,31 +1,31 @@
 define([
-  'react',
-  'react-checkbox-group'
+  'react'
 ],
 function(
-  React,
-  CheckboxGroup
+  React
 ) {
-  var FormFieldCheckbox = React.createClass({
+  const FormFieldCheckbox = React.createClass({
+    onValueChange: function(e) {
+      e.target.value = this.refs.checkbox.checked ? '1' : '';
+      return this.props.onValueChange(e);
+    },
     render: function() {
-      var selected_values = this.props.item[this.props.field.name] || '';
-      if(
-        selected_values !== undefined
-        && selected_values.constructor !== Array
-      ) {
-        selected_values = selected_values.split(';').map(function(value) {
-          return value.trim();
-        });
-      }
-      var count = Object.keys(this.props.field.values).length;
+      const isChecked = !!(this.props.item[this.props.field.name]);
 
-      var options = Object.keys(this.props.field.values).map(
+      const options = Object.keys(this.props.field.values).map(
         function(value, index) {
           return (
             <p key={ 'checkbox-' + index }>
               <label>
-                <input type="checkbox" value={ value } />
-                &nbsp;{ this.props.field.values[value] }
+                <input
+                  ref="checkbox"
+                  type="checkbox"
+                  value="1"
+                  checked={ isChecked }
+                  onChange={ this.onValueChange }
+                  name={ this.props.field.name }
+                />
+                { this.props.field.values[value] }
               </label>
             </p>
           );
@@ -33,30 +33,10 @@ function(
       );
 
       return (
-        <CheckboxGroup
-          name={ this.props.field.name }
-          value={ selected_values }
-          ref={ this.props.field.name }
-          onChange={ this.handleValueChange }>
+        <div>
           { options }
-        </CheckboxGroup>
+        </div>
       );
-    },
-    handleValueChange: function() {
-      var field = this.props.field.name;
-      var group = this.refs[field];
-      var selected_values = [];
-
-      if(group !== undefined) {
-        selected_values = group.getCheckedValues();
-      }
-
-      return this.props.onValueChange({
-        target: {
-          name: field,
-          value: selected_values.join(';')
-        }
-      });
     }
   });
 

assets/js/src/form/fields/date.jsx

@@ -0,0 +1,196 @@
+define([
+  'react',
+  'moment',
+], function(
+  React,
+  Moment
+) {
+  class FormFieldDateYear extends React.Component {
+    render() {
+      const yearsRange = 100;
+      const years = [];
+      const currentYear = Moment().year();
+      for (let i = currentYear; i >= currentYear - yearsRange; i--) {
+        years.push((
+          <option
+            key={ i }
+            value={ i }
+         >{ i }</option>
+        ));
+      }
+      return (
+        <select
+          name={ this.props.name + '[year]' }
+          value={ this.props.year }
+          onChange={ this.props.onValueChange }
+        >
+          { years }
+        </select>
+      );
+    }
+  }
+
+  class FormFieldDateMonth extends React.Component {
+    render() {
+      const months = [];
+      for (let i = 1; i <= 12; i++) {
+        months.push((
+          <option
+            key={ i }
+            value={ i }
+         >{ this.props.monthNames[i - 1] }</option>
+        ));
+      }
+      return (
+        <select
+          name={ this.props.name + '[month]' }
+          value={ this.props.month }
+          onChange={ this.props.onValueChange }
+        >
+          { months }
+        </select>
+      );
+    }
+  }
+
+  class FormFieldDateDay extends React.Component {
+    render() {
+      const days = [];
+      for (let i = 1; i <= 31; i++) {
+        days.push((
+          <option
+            key={ i }
+            value={ i }
+          >{ i }</option>
+        ));
+      }
+
+      return (
+        <select
+          name={ this.props.name + '[day]' }
+          value={ this.props.day }
+          onChange={ this.props.onValueChange }
+        >
+          { days }
+        </select>
+      );
+    }
+  }
+
+  class FormFieldDate extends React.Component {
+    constructor(props) {
+      super(props);
+      this.state = {
+        year: Moment().year(),
+        month: 1,
+        day: 1
+      }
+    }
+    componentDidMount() {
+    }
+    componentDidUpdate(prevProps, prevState) {
+      if (
+        (this.props.item !== undefined && prevProps.item !== undefined)
+        && (this.props.item.id !== prevProps.item.id)
+      ) {
+        this.extractTimeStamp();
+      }
+    }
+    extractTimeStamp() {
+      const timeStamp = parseInt(this.props.item[this.props.field.name], 10);
+
+      this.setState({
+        year: Moment.unix(timeStamp).year(),
+        // Moment returns the month as [0..11]
+        // We increment it to match PHP's mktime() which expects [1..12]
+        month: Moment.unix(timeStamp).month() + 1,
+        day: Moment.unix(timeStamp).date()
+      });
+    }
+    updateTimeStamp(field) {
+      let newTimeStamp = Moment(
+        `${this.state.month}/${this.state.day}/${this.state.year}`,
+        'M/D/YYYY'
+      ).valueOf();
+      if (!isNaN(newTimeStamp) && parseInt(newTimeStamp, 10) > 0) {
+        // convert milliseconds to seconds
+        newTimeStamp /= 1000;
+        return this.props.onValueChange({
+          target: {
+            name: field,
+            value: newTimeStamp
+          }
+        });
+      }
+    }
+    onValueChange(e) {
+      // extract property from name
+      const matches = e.target.name.match(/(.*?)\[(.*?)\]/);
+      let field = null;
+      let property = null;
+
+      if (matches !== null && matches.length === 3) {
+        field = matches[1];
+        property = matches[2];
+
+        let value = parseInt(e.target.value, 10);
+
+        this.setState({
+          [`${property}`]: value
+        }, () => {
+          this.updateTimeStamp(field);
+        });
+      }
+    }
+    render() {
+      const monthNames = window.mailpoet_month_names || [];
+
+      const dateType = this.props.field.params.date_type;
+
+      const dateSelects = dateType.split('_');
+
+      const fields = dateSelects.map(type => {
+        switch(type) {
+          case 'year':
+            return (<FormFieldDateYear
+              onValueChange={ this.onValueChange.bind(this) }
+              ref={ 'year' }
+              key={ 'year' }
+              name={ this.props.field.name }
+              year={ this.state.year }
+            />);
+          break;
+
+          case 'month':
+            return (<FormFieldDateMonth
+              onValueChange={ this.onValueChange.bind(this) }
+              ref={ 'month' }
+              key={ 'month' }
+              name={ this.props.field.name }
+              month={ this.state.month }
+              monthNames={ monthNames }
+            />);
+          break;
+
+          case 'day':
+            return (<FormFieldDateDay
+              onValueChange={ this.onValueChange.bind(this) }
+              ref={ 'day' }
+              key={ 'day' }
+              name={ this.props.field.name }
+              day={ this.state.day }
+            />);
+          break;
+        }
+       });
+
+      return (
+        <div>
+          {fields}
+        </div>
+      );
+    }
+  };
+
+  return FormFieldDate;
+});

assets/js/src/form/fields/field.jsx

@@ -5,7 +5,8 @@ define([
   'form/fields/select.jsx',
   'form/fields/radio.jsx',
   'form/fields/checkbox.jsx',
-  'form/fields/selection.jsx'
+  'form/fields/selection.jsx',
+  'form/fields/date.jsx',
 ],
 function(
   React,
@@ -14,7 +15,8 @@ function(
   FormFieldSelect,
   FormFieldRadio,
   FormFieldCheckbox,
-  FormFieldSelection
+  FormFieldSelection,
+  FormFieldDate
 ) {
   var FormField = React.createClass({
     renderField: function(data, inline = false) {
@@ -55,6 +57,10 @@ function(
         case 'selection':
           field = (<FormFieldSelection {...data} />);
         break;
+
+        case 'date':
+          field = (<FormFieldDate {...data} />);
+        break;
       }
 
       if(inline === true) {
@@ -66,10 +72,10 @@ function(
         );
       } else {
         return (
-          <p key={ 'field-' + (data.index || 0) }>
+          <div key={ 'field-' + (data.index || 0) }>
             { field }
             { description }
-          </p>
+          </div>
         );
       }
     },

assets/js/src/form/fields/radio.jsx

@@ -7,7 +7,6 @@ function(
   var FormFieldRadio = React.createClass({
     render: function() {
       var selected_value = this.props.item[this.props.field.name];
-      var count = Object.keys(this.props.field.values).length;
 
       var options = Object.keys(this.props.field.values).map(
         function(value, index) {
@@ -20,7 +19,7 @@ function(
                   value={ value }
                   onChange={ this.props.onValueChange }
                   name={ this.props.field.name } />
-                 { this.props.field.values[value] }
+                { this.props.field.values[value] }
               </label>
             </p>
           );

assets/js/src/form/fields/select.jsx

@@ -23,7 +23,9 @@ function(
           name={ this.props.field.name }
           id={ 'field_'+this.props.field.name }
           value={ this.props.item[this.props.field.name] }
-          onChange={ this.props.onValueChange }>
+          onChange={ this.props.onValueChange }
+          {...this.props.field.validation}
+        >
           {options}
         </select>
       );

assets/js/src/form/fields/selection.jsx

@@ -25,13 +25,10 @@ function(
         (this.props.item !== undefined && prevProps.item !== undefined)
         && (this.props.item.id !== prevProps.item.id)
       ) {
-        jQuery('#'+this.refs.select.id).select2(
-          'val',
-          this.props.item[this.props.field.name]
-        );
+        jQuery('#'+this.refs.select.id)
+          .val(this.props.item[this.props.field.name])
+          .trigger('change');
       }
-
-      this.setupSelect2();
     },
     setupSelect2: function() {
       if(
@@ -53,7 +50,19 @@ function(
         }
       });
 
+      var hasRemoved = false;
+      select2.on('select2:unselecting', function(e) {
+        hasRemoved = true;
+      });
+      select2.on('select2:opening', function(e) {
+        if(hasRemoved === true) {
+          hasRemoved = false;
+          e.preventDefault();
+        }
+      });
+
       select2.on('change', this.handleChange);
+
       select2.select2(
         'val',
         this.props.item[this.props.field.name]
@@ -77,7 +86,7 @@ function(
     handleChange: function(e) {
       if(this.props.onValueChange !== undefined) {
         if(this.props.field.multiple) {
-          value = jQuery('#'+this.refs.select.id).select2('val');
+          value = jQuery('#'+this.refs.select.id).val();
         } else {
           value = e.target.value;
         }
@@ -88,7 +97,6 @@ function(
           }
         });
       }
-      return true;
     },
     render: function() {
       var options = this.state.items.map(function(item, index) {
@@ -112,10 +120,10 @@ function(
         <select
           id={ this.props.field.id || this.props.field.name }
           ref="select"
-          placeholder={ this.props.field.placeholder }
+          data-placeholder={ this.props.field.placeholder }
           multiple={ this.props.field.multiple }
-          onChange={ this.handleChange }
           defaultValue={ default_value }
+          {...this.props.field.validation}
         >{ options }</select>
       );
     }

assets/js/src/form/fields/text.jsx

@@ -6,6 +6,8 @@ function(
 ) {
   var FormFieldText = React.createClass({
     render: function() {
+      var value = this.props.item[this.props.field.name];
+      if(!value) { value = null; }
       return (
         <input
           type="text"
@@ -17,10 +19,12 @@ function(
           }
           name={ this.props.field.name }
           id={ 'field_'+this.props.field.name }
-          value={ this.props.item[this.props.field.name] }
+          value={ value }
           placeholder={ this.props.field.placeholder }
           defaultValue={ this.props.field.defaultValue }
-          onChange={ this.props.onValueChange } />
+          onChange={ this.props.onValueChange }
+          {...this.props.field.validation}
+        />
       );
     }
   });

assets/js/src/form/fields/textarea.jsx

@@ -15,7 +15,9 @@ function(
           value={ this.props.item[this.props.field.name] }
           placeholder={ this.props.field.placeholder }
           defaultValue={ this.props.field.defaultValue }
-          onChange={ this.props.onValueChange } />
+          onChange={ this.props.onValueChange }
+          {...this.props.field.validation}
+        />
       );
     }
   });

assets/js/src/form/form.jsx

@@ -48,7 +48,7 @@ define(
         MailPoet.Ajax.post({
           endpoint: this.props.endpoint,
           action: 'get',
-          data: { id: id }
+          data: id
         }).done(function(response) {
           if(response === false) {
             this.setState({
@@ -68,12 +68,25 @@ define(
       handleSubmit: function(e) {
         e.preventDefault();
 
+        // handle validation
+        if(this.props.isValid !== undefined) {
+          if(this.props.isValid() === false) {
+            return;
+          }
+        }
+
         this.setState({ loading: true });
 
         // only get values from displayed fields
-        item = {};
+        var item = {};
         this.props.fields.map(function(field) {
-          item[field.name] = this.state.item[field.name];
+          if(field['fields'] !== undefined) {
+            field.fields.map(function(subfield) {
+              item[subfield.name] = this.state.item[subfield.name];
+            }.bind(this));
+          } else {
+            item[field.name] = this.state.item[field.name];
+          }
         }.bind(this));
 
         // set id if specified

assets/js/src/form_editor/form_editor.js

@@ -231,7 +231,7 @@ var WysijaHistory = {
 
 /* MailPoet Form */
 var WysijaForm = {
-  version: '0.6',
+  version: '0.7',
   options: {
     container: 'mailpoet_form_container',
     editor: 'mailpoet_form_editor',
@@ -317,6 +317,7 @@ var WysijaForm = {
   save: function() {
     var position = 1,
       data = {
+        'name': $F('mailpoet_form_name'),
         'settings': $('mailpoet_form_settings').serialize(true),
         'body': [],
         'styles': (MailPoet.CodeEditor !== undefined) ? MailPoet.CodeEditor.getValue() : null
@@ -616,6 +617,28 @@ var WysijaForm = {
       // this is a url, so do not encode the protocol
       return encodeURI(str).replace(/[!'()*]/g, escape);
     }
+  },
+  updateBlock: function(field) {
+    var hasUpdated = false;
+    WysijaForm.getBlocks().each(function(b) {
+      if(b.block.getData().id === field.id) {
+        hasUpdated = true;
+        b.block.redraw(field);
+      }
+    });
+
+    return hasUpdated;
+  },
+  removeBlock: function(field, callback) {
+    var hasRemoved = false;
+    WysijaForm.getBlocks().each(function(b) {
+      if(b.block.getData().id === field.id) {
+        hasRemoved = true;
+        b.block.removeBlock(callback);
+      }
+    });
+
+    return hasRemoved;
   }
 };
 
@@ -824,10 +847,6 @@ WysijaForm.Block = Class.create({
     Effect.Fade(this.element.identify(), {
       duration: 0.2,
       afterFinish: function(effect) {
-        if(effect.element.next('.mailpoet_form_block') !== undefined && callback !== false) {
-          // show controls of next block to allow mass delete
-          WysijaForm.get(effect.element.next('.mailpoet_form_block')).block.showControls();
-        }
         // remove placeholder
         if(effect.element.previous('.block_placeholder') !== undefined) {
           effect.element.previous('.block_placeholder').remove();

assets/js/src/forms/list.jsx

@@ -105,6 +105,9 @@ const item_actions = [
         refresh();
       });
     }
+  },
+  {
+    name: 'trash'
   }
 ];
 
@@ -122,8 +125,8 @@ const FormList = React.createClass({
       endpoint: 'forms',
       action: 'create'
     }).done(function(response) {
-      if(response !== false) {
-        window.location = response;
+      if(response.result && response.form_id) {
+        window.location = mailpoet_form_edit_url + response.form_id;
       }
     });
   },

assets/js/src/listing/listing.jsx

@@ -79,27 +79,48 @@ define(
 
         if(custom_actions.length > 0) {
           item_actions = custom_actions.map(function(action, index) {
-            if(action.refresh) {
+            if(action.display !== undefined) {
+              if(action.display(this.props.item) === false) {
+                return;
+              }
+            }
+
+            if(action.name === 'trash') {
+              return (
+                <span key={ 'action-'+index } className="trash">
+                  {(index > 0) ? ' | ' : ''}
+                  <a
+                    href="javascript:;"
+                    onClick={ this.handleTrashItem.bind(
+                      null,
+                      this.props.item.id
+                    ) }>
+                    Trash
+                  </a>
+                </span>
+              );
+            } else if(action.refresh) {
               return (
                 <span
                   onClick={ this.props.onRefreshItems }
                   key={ 'action-'+index } className={ action.name }>
+                  {(index > 0) ? ' | ' : ''}
                   { action.link(this.props.item) }
-                  {(index < (custom_actions.length - 1)) ? ' | ' : ''}
                 </span>
               );
             } else if(action.link) {
               return (
                 <span
                   key={ 'action-'+index } className={ action.name }>
+                  {(index > 0) ? ' | ' : ''}
                   { action.link(this.props.item) }
-                  {(index < (custom_actions.length - 1)) ? ' | ' : ''}
                 </span>
               );
             } else {
               return (
                 <span
                   key={ 'action-'+index } className={ action.name }>
+                  {(index > 0) ? ' | ' : ''}
                   <a href="javascript:;" onClick={
                     (action.onClick !== undefined)
                     ? action.onClick.bind(null,
@@ -108,7 +129,6 @@ define(
                       )
                     : false
                   }>{ action.label }</a>
-                  {(index < (custom_actions.length - 1)) ? ' | ' : ''}
                 </span>
               );
             }
@@ -158,17 +178,6 @@ define(
             <div>
               <div className="row-actions">
                 { item_actions }
-                { ' | ' }
-                <span className="trash">
-                  <a
-                    href="javascript:;"
-                    onClick={ this.handleTrashItem.bind(
-                      null,
-                      this.props.item.id
-                    ) }>
-                    Trash
-                  </a>
-                </span>
               </div>
               <button
                 onClick={ this.handleToggleItem.bind(null, this.props.item.id) }
@@ -388,6 +397,12 @@ define(
         if(this.isMounted()) {
           const params = this.props.params || {}
           this.initWithParams(params)
+
+          if(this.props.auto_refresh) {
+            jQuery(document).on('heartbeat-tick.mailpoet', function(e, data) {
+              this.getItems();
+            }.bind(this));
+          }
         }
       },
       componentWillReceiveProps: function(nextProps) {
@@ -637,7 +652,7 @@ define(
         // bulk actions
         var bulk_actions = this.props.bulk_actions || [];
 
-        if(this.state.group === 'trash') {
+        if(this.state.group === 'trash' && bulk_actions.length > 0) {
           bulk_actions = [
             {
               name: 'restore',

assets/js/src/newsletter_editor/behaviors/DraggableBehavior.js

@@ -47,7 +47,6 @@ define([
         autoScroll: true,
 
         onstart: function(event) {
-          console.log('Drag start', event, this);
 
           if (that.options.cloneOriginal === true) {
             // Use substitution instead of a clone

assets/js/src/newsletter_editor/blocks/automatedLatestContent.js

@@ -11,10 +11,10 @@ define([
     'newsletter_editor/blocks/base',
     'newsletter_editor/blocks/button',
     'newsletter_editor/blocks/divider',
-    'newsletter_editor/components/wordpress',
+    'newsletter_editor/components/communication',
     'underscore',
     'jquery'
-  ], function(App, BaseBlock, ButtonBlock, DividerBlock, WordpressComponent, _, jQuery) {
+  ], function(App, BaseBlock, ButtonBlock, DividerBlock, CommunicationComponent, _, jQuery) {
 
   "use strict";
 
@@ -69,9 +69,9 @@ define([
     },
     fetchPosts: function() {
       var that = this;
-      WordpressComponent.getTransformedPosts(this.toJSON()).done(function(content) {
-        console.log('ALC fetched', arguments);
+      CommunicationComponent.getTransformedPosts(this.toJSON()).done(function(content) {
         that.get('_container').get('blocks').reset(content, {parse: true});
+        that.trigger('postsChanged');
       }).fail(function(error) {
         console.log('ALC fetchPosts error', arguments);
       });
@@ -100,6 +100,11 @@ define([
       toolsRegion: '.mailpoet_tools',
       postsRegion: '.mailpoet_automated_latest_content_block_posts',
     },
+    modelEvents: _.extend(
+      _.omit(base.BlockView.prototype.modelEvents, 'change'),
+      {
+        'postsChanged': 'render',
+      }),
     events: _.extend(base.BlockView.prototype.events, {
       'click .mailpoet_automated_latest_content_block_overlay': 'showSettings',
     }),
@@ -161,7 +166,7 @@ define([
       var that = this;
 
       // Dynamically update available post types
-      WordpressComponent.getPostTypes().done(_.bind(this._updateContentTypes, this));
+      CommunicationComponent.getPostTypes().done(_.bind(this._updateContentTypes, this));
 
       this.$('.mailpoet_automated_latest_content_categories_and_tags').select2({
         multiple: true,
@@ -174,10 +179,10 @@ define([
           },
           transport: function(options, success, failure) {
             var taxonomies,
-                promise = WordpressComponent.getTaxonomies(that.model.get('contentType')).then(function(tax) {
+                promise = CommunicationComponent.getTaxonomies(that.model.get('contentType')).then(function(tax) {
               taxonomies = tax;
               // Fetch available terms based on the list of taxonomies already fetched
-              var promise = WordpressComponent.getTerms({
+              var promise = CommunicationComponent.getTerms({
                 search: options.data.term,
                 taxonomies: _.keys(taxonomies)
               }).then(function(terms) {
@@ -226,11 +231,11 @@ define([
     toggleDisplayOptions: function(event) {
       var el = this.$('.mailpoet_automated_latest_content_display_options'),
         showControl = this.$('.mailpoet_automated_latest_content_show_display_options');
-      if (el.hasClass('mailpoet_hidden')) {
-        el.removeClass('mailpoet_hidden');
+      if (el.hasClass('mailpoet_closed')) {
+        el.removeClass('mailpoet_closed');
         showControl.addClass('mailpoet_hidden');
       } else {
-        el.addClass('mailpoet_hidden');
+        el.addClass('mailpoet_closed');
         showControl.removeClass('mailpoet_hidden');
       }
     },

assets/js/src/newsletter_editor/blocks/base.js

@@ -48,6 +48,7 @@ define([
     },
     modelEvents: {
       'change': 'render',
+      'delete': 'deleteBlock',
     },
     events: {
       "mouseenter": "showTools",
@@ -88,7 +89,9 @@ define([
       this.$el.addClass('mailpoet_editor_view_' + this.cid);
     },
     initialize: function() {
-      this.on('showSettings', this.showSettings);
+      this.on('showSettings', this.showSettings, this);
+      this.on('dom:refresh', this.showBlock, this);
+      this._isFirstRender = true;
     },
     showTools: function(_event) {
       if (!this.showingToolsDisabled) {
@@ -114,12 +117,49 @@ define([
      * Defines drop behavior of BlockView instance
      */
     getDropFunc: function() {
-      var that = this;
       return function() {
-        var newModel = that.model.clone();
-        //that.model.destroy();
-        return newModel;
-      };
+        return this.model.clone();
+      }.bind(this);
+    },
+    showBlock: function() {
+      if (this._isFirstRender) {
+        this.transitionIn();
+        this._isFirstRender = false;
+      }
+    },
+    deleteBlock: function() {
+      this.transitionOut().then(function() {
+        this.model.destroy();
+      }.bind(this));
+    },
+    transitionIn: function() {
+      return this._transition('slideDown', 'fadeIn', 'easeOut');
+    },
+    transitionOut: function() {
+      return this._transition('slideUp', 'fadeOut', 'easeIn');
+    },
+    _transition: function(slideDirection, fadeDirection, easing) {
+      var promise = jQuery.Deferred();
+
+      this.$el.velocity(
+        slideDirection,
+        {
+          duration: 250,
+          easing: easing,
+          complete: function() {
+            promise.resolve();
+          }.bind(this),
+        }
+      ).velocity(
+        fadeDirection,
+        {
+          duration: 250,
+          easing: easing,
+          queue: false, // Do not enqueue, trigger animation in parallel
+        }
+      );
+
+      return promise;
     },
   });
 
@@ -168,24 +208,22 @@ define([
     },
     deleteBlock: function(event) {
       event.preventDefault();
-      this.model.destroy();
+      this.model.trigger('delete');
       return false;
-    }
+    },
   });
 
   Module.BlockSettingsView = Marionette.LayoutView.extend({
     className: 'mailpoet_editor_settings',
     initialize: function() {
-      var that = this;
-
       MailPoet.Modal.panel({
         element: this.$el,
         template: '',
         position: 'right',
         width: App.getConfig().get('sidepanelWidth'),
         onCancel: function() {
-          that.destroy();
-        },
+          this.destroy();
+        }.bind(this),
       });
     },
     close: function(event) {

assets/js/src/newsletter_editor/blocks/button.js

@@ -42,16 +42,12 @@ define([
   Module.ButtonBlockView = base.BlockView.extend({
     className: "mailpoet_block mailpoet_button_block mailpoet_droppable_block",
     getTemplate: function() { return templates.buttonBlock; },
-    modelEvents: {
-      'change': 'render',
-    },
     onDragSubstituteBy: function() { return Module.ButtonWidgetView; },
     initialize: function() {
       base.BlockView.prototype.initialize.apply(this, arguments);
-      var that = this;
 
       // Listen for attempts to change all dividers in one go
-      this._replaceButtonStylesHandler = function(data) { that.model.set(data); };
+      this._replaceButtonStylesHandler = function(data) { this.model.set(data); }.bind(this);
       App.getChannel().on('replaceAllButtonStyles', this._replaceButtonStylesHandler);
     },
     onRender: function() {

assets/js/src/newsletter_editor/blocks/container.js

@@ -75,7 +75,8 @@ define([
     getEmptyView: function() { return Module.ContainerBlockEmptyView; },
     emptyViewOptions: function() { return { renderOptions: this.renderOptions }; },
     modelEvents: {
-      'change': 'render'
+      'change': 'render',
+      'delete': 'deleteBlock',
     },
     events: {
       "mouseenter": "showTools",
@@ -136,6 +137,8 @@ define([
     },
     initialize: function(options) {
       this.renderOptions = _.defaults(options.renderOptions || {}, {});
+      this.on('dom:refresh', this.showBlock, this);
+      this._isFirstRender = true;
     },
     // Determines which view type should be used for a child
     getChildView: function(model) {
@@ -229,12 +232,49 @@ define([
       _.extend(this, this._buildRegions(this.regions));
     },
     getDropFunc: function() {
-      var that = this;
       return function() {
-        var newModel = that.model.clone();
-        that.model.destroy();
-        return newModel;
-      };
+        return this.model.clone();
+      }.bind(this);
+    },
+    showBlock: function() {
+      if (this._isFirstRender) {
+        this.transitionIn();
+        this._isFirstRender = false;
+      }
+    },
+    deleteBlock: function() {
+      this.transitionOut().done(function() {
+        this.model.destroy();
+      }.bind(this));
+    },
+    transitionIn: function() {
+      return this._transition('slideDown', 'fadeIn', 'easeIn');
+    },
+    transitionOut: function() {
+      return this._transition('slideUp', 'fadeOut', 'easeOut');
+    },
+    _transition: function(slideDirection, fadeDirection, easing) {
+      var promise = jQuery.Deferred();
+
+      this.$el.velocity(
+        slideDirection,
+        {
+          duration: 250,
+          easing: easing,
+          complete: function() {
+            promise.resolve();
+          }.bind(this),
+        }
+      ).velocity(
+        fadeDirection,
+        {
+          duration: 250,
+          easing: easing,
+          queue: false, // Do not enqueue, trigger animation in parallel
+        }
+      );
+
+      return promise;
     },
   });
 

assets/js/src/newsletter_editor/blocks/divider.js

@@ -57,11 +57,9 @@ define([
       this.listenTo(this.model, 'change:styles.block.padding', this.changePadding);
     },
     templateHelpers: function() {
-      return {
-        model: this.model.toJSON(),
-        viewCid: this.cid,
+      return _.extend({
         totalHeight: parseInt(this.model.get('styles.block.padding'), 10)*2 + parseInt(this.model.get('styles.block.borderWidth')) + 'px',
-      };
+      }, base.BlockView.prototype.templateHelpers.apply(this));
     },
     onRender: function() {
       this.toolsView = new Module.DividerBlockToolsView({ model: this.model });

assets/js/src/newsletter_editor/blocks/footer.js

@@ -39,9 +39,9 @@ define([
   Module.FooterBlockView = base.BlockView.extend({
     className: "mailpoet_block mailpoet_footer_block mailpoet_droppable_block",
     getTemplate: function() { return templates.footerBlock; },
-    modelEvents: {
+    modelEvents: _.extend({
       'change:styles.block.backgroundColor change:styles.text.fontColor change:styles.text.fontFamily change:styles.text.fontSize change:styles.text.textAlign change:styles.link.fontColor change:styles.link.textDecoration': 'render',
-    },
+    }, base.BlockView.prototype.modelEvents),
     onDragSubstituteBy: function() { return Module.FooterWidgetView; },
     onRender: function() {
       this.toolsView = new Module.FooterBlockToolsView({ model: this.model });

assets/js/src/newsletter_editor/blocks/header.js

@@ -39,9 +39,9 @@ define([
   Module.HeaderBlockView = base.BlockView.extend({
     className: "mailpoet_block mailpoet_header_block mailpoet_droppable_block",
     getTemplate: function() { return templates.headerBlock; },
-    modelEvents: {
+    modelEvents: _.extend({
       'change:styles.block.backgroundColor change:styles.text.fontColor change:styles.text.fontFamily change:styles.text.fontSize change:styles.text.textAlign change:styles.link.fontColor change:styles.link.textDecoration': 'render',
-    },
+    }, base.BlockView.prototype.modelEvents),
     onDragSubstituteBy: function() { return Module.HeaderWidgetView; },
     onRender: function() {
       this.toolsView = new Module.HeaderBlockToolsView({ model: this.model });

assets/js/src/newsletter_editor/blocks/image.js

@@ -37,11 +37,9 @@ define([
     getTemplate: function() { return templates.imageBlock; },
     onDragSubstituteBy: function() { return Module.ImageWidgetView; },
     templateHelpers: function() {
-      return {
-        model: this.model.toJSON(),
-        viewCid: this.cid,
+      return _.extend({
         imageMissingSrc: App.getConfig().get('urls.imageMissing'),
-      };
+      }, base.BlockView.prototype.templateHelpers.apply(this));
     },
     onRender: function() {
       this.toolsView = new Module.ImageBlockToolsView({ model: this.model });

assets/js/src/newsletter_editor/blocks/posts.js

@@ -18,12 +18,12 @@ define([
     'jquery',
     'mailpoet',
     'newsletter_editor/App',
-    'newsletter_editor/components/wordpress',
+    'newsletter_editor/components/communication',
     'newsletter_editor/blocks/base',
     'newsletter_editor/blocks/button',
     'newsletter_editor/blocks/divider',
     'select2'
-  ], function(Backbone, Marionette, Radio, _, jQuery, MailPoet, App, WordpressComponent, BaseBlock, ButtonBlock, DividerBlock) {
+  ], function(Backbone, Marionette, Radio, _, jQuery, MailPoet, App, CommunicationComponent, BaseBlock, ButtonBlock, DividerBlock) {
 
   "use strict";
 
@@ -96,8 +96,7 @@ define([
     },
     fetchAvailablePosts: function() {
       var that = this;
-      WordpressComponent.getPosts(this.toJSON()).done(function(posts) {
-        console.log('Posts fetched', arguments);
+      CommunicationComponent.getPosts(this.toJSON()).done(function(posts) {
         that.get('_availablePosts').reset(posts);
         that.get('_selectedPosts').reset(); // Empty out the collection
         that.trigger('change:_availablePosts');
@@ -116,8 +115,7 @@ define([
         return;
       }
 
-      WordpressComponent.getTransformedPosts(data).done(function(posts) {
-        console.log('Transformed posts fetched', arguments);
+      CommunicationComponent.getTransformedPosts(data).done(function(posts) {
         that.get('_transformedPosts').get('blocks').reset(posts, {parse: true});
       }).fail(function() {
         console.log('Posts _refreshTransformedPosts error', arguments);
@@ -133,8 +131,7 @@ define([
 
       if (data.posts.length === 0) return;
 
-      WordpressComponent.getTransformedPosts(data).done(function(posts) {
-        console.log('Available posts fetched', arguments);
+      CommunicationComponent.getTransformedPosts(data).done(function(posts) {
         collection.add(posts, { at: index });
       }).fail(function() {
         console.log('Posts fetchPosts error', arguments);
@@ -145,13 +142,14 @@ define([
   Module.PostsBlockView = base.BlockView.extend({
     className: "mailpoet_block mailpoet_posts_block mailpoet_droppable_block",
     getTemplate: function() { return templates.postsBlock; },
-    modelEvents: {},
+    modelEvents: {}, // Forcefully disable all events
     regions: _.extend({
       postsRegion: '.mailpoet_posts_block_posts',
     }, base.BlockView.prototype.regions),
     onDragSubstituteBy: function() { return Module.PostsWidgetView; },
     initialize: function() {
       base.BlockView.prototype.initialize.apply(this, arguments);
+
       this.toolsView = new Module.PostsBlockToolsView({ model: this.model });
       this.model.reply('blockView', this.notifyAboutSelf, this);
     },
@@ -222,8 +220,8 @@ define([
     },
     switchToDisplayOptions: function() {
       // Switch content view
-      this.$('.mailpoet_settings_posts_selection').addClass('mailpoet_hidden');
-      this.$('.mailpoet_settings_posts_display_options').removeClass('mailpoet_hidden');
+      this.$('.mailpoet_settings_posts_selection').addClass('mailpoet_closed');
+      this.$('.mailpoet_settings_posts_display_options').removeClass('mailpoet_closed');
 
       // Switch controls
       this.$('.mailpoet_settings_posts_show_display_options').addClass('mailpoet_hidden');
@@ -231,8 +229,8 @@ define([
     },
     switchToPostSelection: function() {
       // Switch content view
-      this.$('.mailpoet_settings_posts_display_options').addClass('mailpoet_hidden');
-      this.$('.mailpoet_settings_posts_selection').removeClass('mailpoet_hidden');
+      this.$('.mailpoet_settings_posts_display_options').addClass('mailpoet_closed');
+      this.$('.mailpoet_settings_posts_selection').removeClass('mailpoet_closed');
 
       // Switch controls
       this.$('.mailpoet_settings_posts_show_post_selection').addClass('mailpoet_hidden');
@@ -271,7 +269,7 @@ define([
       var that = this;
 
       // Dynamically update available post types
-      WordpressComponent.getPostTypes().done(_.bind(this._updateContentTypes, this));
+      CommunicationComponent.getPostTypes().done(_.bind(this._updateContentTypes, this));
 
       this.$('.mailpoet_posts_categories_and_tags').select2({
         multiple: true,
@@ -284,10 +282,10 @@ define([
           },
           transport: function(options, success, failure) {
             var taxonomies,
-                promise = WordpressComponent.getTaxonomies(that.model.get('contentType')).then(function(tax) {
+                promise = CommunicationComponent.getTaxonomies(that.model.get('contentType')).then(function(tax) {
               taxonomies = tax;
               // Fetch available terms based on the list of taxonomies already fetched
-              var promise = WordpressComponent.getTerms({
+              var promise = CommunicationComponent.getTerms({
                 search: options.data.term,
                 taxonomies: _.keys(taxonomies)
               }).then(function(terms) {

assets/js/src/newsletter_editor/blocks/social.js

@@ -103,7 +103,8 @@ define([
     getTemplate: function() { return templates.socialBlock; },
     childViewContainer: '.mailpoet_social',
     modelEvents: {
-      'change': 'render'
+      'change': 'render',
+      'delete': 'deleteBlock',
     },
     events: {
       "mouseover": "showTools",
@@ -145,6 +146,10 @@ define([
       arguments[0].collection = arguments[0].model.get('icons');
       Marionette.CompositeView.apply(this, arguments);
     },
+    initialize: function() {
+      this.on('dom:refresh', this.showBlock, this);
+      this._isFirstRender = true;
+    },
     // Determines which view type should be used for a child
     childView: SocialIconView,
     templateHelpers: function() {
@@ -170,12 +175,9 @@ define([
       _event.stopPropagation();
     },
     getDropFunc: function() {
-      var that = this;
       return function() {
-        var newModel = that.model.clone();
-        //that.model.destroy();
-        return newModel;
-      };
+        return this.model.clone();
+      }.bind(this);
     },
     _buildRegions: function(regions) {
       var that = this;
@@ -194,6 +196,46 @@ define([
       this.regionManager.destroy();
       _.extend(this, this._buildRegions(this.regions));
     },
+    showBlock: function() {
+      if (this._isFirstRender) {
+        this.transitionIn();
+        this._isFirstRender = false;
+      }
+    },
+    deleteBlock: function() {
+      this.transitionOut().done(function() {
+        this.model.destroy();
+      }.bind(this));
+    },
+    transitionIn: function() {
+      return this._transition('slideDown', 'fadeIn', 'easeIn');
+    },
+    transitionOut: function() {
+      return this._transition('slideUp', 'fadeOut', 'easeOut');
+    },
+    _transition: function(slideDirection, fadeDirection, easing) {
+      var promise = jQuery.Deferred();
+
+      this.$el.velocity(
+        slideDirection,
+        {
+          duration: 250,
+          easing: easing,
+          complete: function() {
+            promise.resolve();
+          }.bind(this),
+        }
+      ).velocity(
+        fadeDirection,
+        {
+          duration: 250,
+          easing: easing,
+          queue: false, // Do not enqueue, trigger animation in parallel
+        }
+      );
+
+      return promise;
+    },
   });
 
   Module.SocialBlockToolsView = base.BlockToolsView.extend({

assets/js/src/newsletter_editor/blocks/text.js

@@ -26,6 +26,8 @@ define([
     getTemplate: function() { return templates.textBlock; },
     modelEvents: _.omit(base.BlockView.prototype.modelEvents, 'change'), // Prevent rerendering on model change due to text editor redrawing
     initialize: function(options) {
+      base.BlockView.prototype.initialize.apply(this, arguments);
+
       this.renderOptions = _.defaults(options.renderOptions || {}, {
         disableTextEditor: false,
       });

assets/js/src/newsletter_editor/components/communication.js

@@ -9,7 +9,7 @@ define([
 
   Module._query = function(args) {
     return MailPoet.Ajax.post({
-      endpoint: 'wordpress',
+      endpoint: 'automatedLatestContent',
       action: args.action,
       data: args.options || {},
     });
@@ -56,23 +56,25 @@ define([
   };
 
   Module.getTransformedPosts = function(options) {
-    return Module._query({
+    return Module._cachedQuery({
       action: 'getTransformedPosts',
       options: options,
     });
   };
 
   Module.saveNewsletter = function(options) {
-    return Module._query({
+    return MailPoet.Ajax.post({
+      endpoint: 'newsletters',
       action: 'save',
-      options: options,
+      data: options || {},
     });
   };
 
   Module.previewNewsletter = function(options) {
-    return Module._query({
-      action: 'preview',
-      options: options,
+    return MailPoet.Ajax.post({
+      endpoint: 'newsletters',
+      action: 'sendPreview',
+      data: options || {},
     });
   };
 

assets/js/src/newsletter_editor/components/content.js

@@ -11,7 +11,7 @@ define([
   // Does not hold newsletter content nor newsletter styles, those are
   // handled by other components.
   Module.NewsletterModel = SuperModel.extend({
-    stale: ['body'],
+    stale: ['body', 'created_at', 'deleted_at', 'updated_at'],
     initialize: function(options) {
       this.on('change', function() {
           App.getChannel().trigger('autoSave');
@@ -44,10 +44,10 @@ define([
   };
 
   Module.getBody = function() {
-    return JSON.stringify({
+    return {
       content: App._contentContainer.toJSON(),
       globalStyles: App.getGlobalStyles().toJSON(),
-    });
+    };
   };
 
   Module.toJSON = function() {
@@ -73,8 +73,7 @@ define([
   });
 
   App.on('start', function(options) {
-    // TODO: Other newsletter information will be needed as well.
-    var body = JSON.parse(options.newsletter.body);
+    var body = options.newsletter.body;
     App._contentContainer = new (App.getBlockTypeModel('container'))(body.content, {parse: true});
     App._contentContainerView = new (App.getBlockTypeView('container'))({
       model: App._contentContainer,

assets/js/src/newsletter_editor/components/save.js

@@ -1,13 +1,26 @@
 define([
     'newsletter_editor/App',
+    'newsletter_editor/components/communication',
     'mailpoet',
     'notice',
     'backbone',
     'backbone.marionette',
     'jquery',
     'blob',
-    'filesaver'
-  ], function(App, MailPoet, Notice, Backbone, Marionette, jQuery, Blob, FileSaver) {
+    'filesaver',
+    'html2canvas'
+  ], function(
+    App,
+    CommunicationComponent,
+    MailPoet,
+    Notice,
+    Backbone,
+    Marionette,
+    jQuery,
+    Blob,
+    FileSaver,
+    html2canvas
+  ) {
 
   "use strict";
 
@@ -16,26 +29,33 @@ define([
 
   // Save editor contents to server
   Module.save = function() {
-    App.getChannel().trigger('beforeEditorSave');
 
     var json = App.toJSON();
 
+    // Stringify to enable transmission of primitive non-string value types
+    if (!_.isUndefined(json.body)) {
+      json.body = JSON.stringify(json.body);
+    }
+
+    App.getChannel().trigger('beforeEditorSave', json);
+
     // save newsletter
-    MailPoet.Ajax.post({
-      endpoint: 'newsletters',
-      action: 'save',
-      data: json,
-    }).done(function(response) {
+    CommunicationComponent.saveNewsletter(json).done(function(response) {
       if(response.success !== undefined && response.success === true) {
         // TODO: Handle translations
         //MailPoet.Notice.success("<?php _e('Newsletter has been saved.'); ?>");
       } else if(response.error !== undefined) {
         if(response.error.length === 0) {
           // TODO: Handle translations
-          MailPoet.Notice.error("<?php _e('An unknown error occurred, please check your settings.'); ?>");
+          MailPoet.Notice.error(
+            "An unknown error occurred, please check your settings.",
+            {
+              scroll: true,
+            }
+          );
         } else {
           $(response.error).each(function(i, error) {
-            MailPoet.Notice.error(error);
+            MailPoet.Notice.error(error, { scroll: true });
           });
         }
       }
@@ -46,26 +66,52 @@ define([
     });
   };
 
+  Module.getThumbnail = function(element, options) {
+    return html2canvas(element, options || {});
+  };
+
   Module.saveTemplate = function(options) {
-    return MailPoet.Ajax.post({
-      endpoint: 'newsletterTemplates',
-      action: 'save',
-      data: _.extend(options || {}, {
-        body: App.getBody(),
-      }),
+    var that = this,
+        promise = jQuery.Deferred();
+
+    promise.then(function(thumbnail) {
+      var data = _.extend(options || {}, {
+        thumbnail: thumbnail.toDataURL('image/jpeg'),
+        body: JSON.stringify(App.getBody()),
+      });
+
+      return MailPoet.Ajax.post({
+        endpoint: 'newsletterTemplates',
+        action: 'save',
+        data: data,
+      });
     });
+
+    Module.getThumbnail(
+      jQuery('#mailpoet_editor_content > .mailpoet_block').get(0)
+    ).then(function(thumbnail) {
+      promise.resolve(thumbnail);
+    });
+
+    return promise;
   };
 
   Module.exportTemplate = function(options) {
-    var data = _.extend(options || {}, {
-      body: App.getBody(),
-    });
-    var blob = new Blob(
-      [JSON.stringify(data)],
-      { type: 'application/json;charset=utf-8' }
-    );
+    var that = this;
+    return Module.getThumbnail(
+      jQuery('#mailpoet_editor_content > .mailpoet_block').get(0)
+    ).then(function(thumbnail) {
+      var data = _.extend(options || {}, {
+        thumbnail: thumbnail.toDataURL('image/jpeg'),
+        body: App.getBody(),
+      });
+      var blob = new Blob(
+        [JSON.stringify(data)],
+        { type: 'application/json;charset=utf-8' }
+      );
 
-    FileSaver.saveAs(blob, 'template.json');
+      FileSaver.saveAs(blob, 'template.json');
+    });
   };
 
   Module.SaveView = Marionette.LayoutView.extend({
@@ -119,20 +165,52 @@ define([
     },
     saveAsTemplate: function() {
       var templateName = this.$('.mailpoet_save_as_template_name').val(),
-          templateDescription = this.$('.mailpoet_save_as_template_description').val();
+          templateDescription = this.$('.mailpoet_save_as_template_description').val(),
+          that = this;
 
-      console.log('Saving template with ', templateName, templateDescription);
-      Module.saveTemplate({
-        name: templateName,
-        description: templateDescription,
-      }).done(function() {
-        console.log('Template saved', arguments);
-      }).fail(function() {
-        // TODO: Handle error messages
-        console.log('Template save failed', arguments);
-      });
+      if (templateName === '') {
+        MailPoet.Notice.error(
+          App.getConfig().get('translations.templateNameMissing'),
+          {
+            positionAfter: that.$el,
+            scroll: true,
+          }
+        );
+      } else if (templateDescription === '') {
+        MailPoet.Notice.error(
+          App.getConfig().get('translations.templateDescriptionMissing'),
+          {
+            positionAfter: that.$el,
+            scroll: true,
+          }
+        );
+      } else {
+        console.log('Saving template with ', templateName, templateDescription);
+        Module.saveTemplate({
+          name: templateName,
+          description: templateDescription,
+        }).done(function() {
+          console.log('Template saved', arguments);
+          MailPoet.Notice.success(
+            App.getConfig().get('translations.templateSaved'),
+            {
+              positionAfter: that.$el,
+              scroll: true,
+            }
+          );
+        }).fail(function() {
+          console.log('Template save failed', arguments);
+          MailPoet.Notice.error(
+            App.getConfig().get('translations.templateSaveFailed'),
+            {
+              positionAfter: that.$el,
+              scroll: true,
+            }
+          );
+        });
+        this.hideOptionContents();
+      }
 
-      this.hideOptionContents();
     },
     toggleExportTemplate: function() {
       this.$('.mailpoet_export_template_container').toggleClass('mailpoet_hidden');
@@ -143,12 +221,25 @@ define([
     },
     exportTemplate: function() {
       var templateName = this.$('.mailpoet_export_template_name').val(),
-          templateDescription = this.$('.mailpoet_export_template_description').val();
+          templateDescription = this.$('.mailpoet_export_template_description').val(),
+          that = this;
 
       if (templateName === '') {
-        MailPoet.Notice.error(App.getConfig().get('translations.templateNameMissing'));
+        MailPoet.Notice.error(
+          App.getConfig().get('translations.templateNameMissing'),
+          {
+            positionAfter: that.$el,
+            scroll: true,
+          }
+        );
       } else if (templateDescription === '') {
-        MailPoet.Notice.error(App.getConfig().get('translations.templateDescriptionMissing'));
+        MailPoet.Notice.error(
+          App.getConfig().get('translations.templateDescriptionMissing'),
+          {
+            positionAfter: that.$el,
+            scroll: true,
+          }
+        );
       } else {
         console.log('Exporting template with ', templateName, templateDescription);
         Module.exportTemplate({

assets/js/src/newsletter_editor/components/sidebar.js

@@ -1,12 +1,13 @@
 define([
     'newsletter_editor/App',
+    'newsletter_editor/components/communication',
     'backbone',
     'backbone.marionette',
     'backbone.supermodel',
     'underscore',
     'jquery',
     'sticky-kit'
-  ], function(App, Backbone, Marionette, SuperModel, _, jQuery, StickyKit) {
+  ], function(App, CommunicationComponent, Backbone, Marionette, SuperModel, _, jQuery, StickyKit) {
 
   "use strict";
 
@@ -50,8 +51,33 @@ define([
     },
     events: {
       'click .mailpoet_sidebar_region h3, .mailpoet_sidebar_region .handlediv': function(event) {
-        this.$el.find('.mailpoet_sidebar_region').addClass('closed');
-        this.$el.find(event.target).parent().parent().removeClass('closed');
+        var $openRegion = this.$el.find('.mailpoet_sidebar_region:not(.closed)'),
+          $targetRegion = this.$el.find(event.target).closest('.mailpoet_sidebar_region');
+
+        if ($openRegion.get(0) === $targetRegion.get(0)) {
+          return;
+        }
+
+        $openRegion.find('.mailpoet_region_content').velocity(
+          'slideUp',
+          {
+            duration: 250,
+            easing: "easeOut",
+            complete: function() {
+              $openRegion.addClass('closed');
+            }.bind(this)
+          }
+        );
+        $targetRegion.find('.mailpoet_region_content').velocity(
+          'slideDown',
+          {
+            duration: 250,
+            easing: "easeIn",
+            complete: function() {
+              $targetRegion.removeClass('closed');
+            },
+          }
+        );
       },
     },
     initialize: function(options) {
@@ -90,7 +116,6 @@ define([
       });
     },
     onDomRefresh: function() {
-      var that = this;
       this.$el.parent().stick_in_parent({
         offset_top: 32,
       });
@@ -169,10 +194,8 @@ define([
     },
     initialize: function(options) {
       this.availableStyles = options.availableStyles;
-      var that = this;
     },
     onRender: function() {
-      var that = this;
       this.$('.mailpoet_color').spectrum({
         clickoutFiresChange: true,
         showInput: true,
@@ -219,26 +242,29 @@ define([
       console.log('trying to send a preview');
       // get form data
       var data = {
-        from_name: this.$('#mailpoet_preview_from_name').val(),
-        from_email: this.$('#mailpoet_preview_from_email').val(),
-        to_email: this.$('#mailpoet_preview_to_email').val(),
-        newsletter: App.newsletterId,
+        subscriber: this.$('#mailpoet_preview_to_email').val(),
+        id: App.getNewsletter().get('id'),
       };
 
       // send test email
       MailPoet.Modal.loading(true);
 
-      // TODO: Migrate logic to new AJAX format
-      Wordpress.previewNewsletter(data).done(function(response) {
-        if(response.success !== undefined && response.success === true) {
-          MailPoet.Notice.success(App.getConfig().get('translations.testEmailSent'));
-        } else if(response.error !== undefined) {
-          if(response.error.length === 0) {
-            MailPoet.Notice.error(App.getConfig().get('translations.unknownErrorOccurred'));
-          } else {
-            $(response.error).each(function(i, error) {
-              MailPoet.Notice.error(error);
+      CommunicationComponent.previewNewsletter(data).done(function(response) {
+        if(response.result !== undefined && response.result === true) {
+          MailPoet.Notice.success(App.getConfig().get('translations.newsletterPreviewSent'), { scroll: true });
+        } else {
+          if (_.isArray(response.errors)) {
+            response.errors.map(function(error) {
+              MailPoet.Notice.error(error, { scroll: true });
             });
+          } else {
+            MailPoet.Notice.error(
+              App.getConfig().get('translations.newsletterPreviewFailedToSend'),
+              {
+                scroll: true,
+                static: true,
+              }
+            );
           }
         }
         MailPoet.Modal.loading(false);

assets/js/src/newsletter_editor/components/styles.js

@@ -17,7 +17,7 @@ define([
       },
       h1: {
         fontColor: '#111111',
-        fontFamily: 'Arial Black',
+        fontFamily: 'Arial',
         fontSize: '40px'
       },
       h2: {
@@ -72,7 +72,7 @@ define([
 
     App.getAvailableStyles = Module.getAvailableStyles;
 
-    var body = JSON.parse(options.newsletter.body);
+    var body = options.newsletter.body;
     this.setGlobalStyles(body.globalStyles);
   });
 

assets/js/src/newsletters/list.jsx

@@ -21,6 +21,10 @@ define(
         label: 'Subject',
         sortable: true
       },
+      {
+        name: 'status',
+        label: 'Status'
+      },
       {
         name: 'segments',
         label: 'Lists'
@@ -112,12 +116,101 @@ define(
             </a>
           );
         }
+      },
+      {
+        name: 'trash'
       }
     ];
 
     var NewsletterList = React.createClass({
-      renderItem: function(newsletter, actions) {
+      pauseSending: function(item) {
+        MailPoet.Ajax.post({
+          endpoint: 'sendingQueue',
+          action: 'pause',
+          data: item.id
+        }).done(function() {
+          jQuery('#resume_'+item.id).show();
+          jQuery('#pause_'+item.id).hide();
+        });
+      },
+      resumeSending: function(item) {
+        MailPoet.Ajax.post({
+          endpoint: 'sendingQueue',
+          action: 'resume',
+          data: item.id
+        }).done(function() {
+          jQuery('#pause_'+item.id).show();
+          jQuery('#resume_'+item.id).hide();
+        });
+      },
+      renderStatus: function(item) {
+        if(item.queue === null) {
+          return (
+            <span>Not sent yet.</span>
+          );
+        } else {
+          var progressClasses = classNames(
+            'mailpoet_progress',
+            { 'mailpoet_progress_complete': item.queue.status === 'completed'}
+          );
 
+          // calculate percentage done
+          var percentage = Math.round(
+            (item.queue.count_processed * 100) / (item.queue.count_total)
+          );
+
+          var label = false;
+
+          if(item.queue.status === 'completed') {
+            label = (
+              <span>
+                Sent to {
+                  item.queue.count_processed - item.queue.count_failed
+                } out of { item.queue.count_total }.
+              </span>
+            );
+          } else {
+            label = (
+              <span>
+                { item.queue.count_processed } / { item.queue.count_total }
+                &nbsp;&nbsp;
+                <a
+                  id={ 'resume_'+item.id }
+                  className="button"
+                  style={{ display: (item.queue.status === 'paused') ? 'inline-block': 'none' }}
+                  href="javascript:;"
+                  onClick={ this.resumeSending.bind(null, item) }
+                >Resume</a>
+                <a
+                  id={ 'pause_'+item.id }
+                  className="button mailpoet_pause"
+                  style={{ display: (item.queue.status === null) ? 'inline-block': 'none' }}
+                  href="javascript:;"
+                  onClick={ this.pauseSending.bind(null, item) }
+                >Pause</a>
+              </span>
+            );
+          }
+
+          return (
+            <div>
+              <div className={ progressClasses }>
+                  <span
+                    className="mailpoet_progress_bar"
+                    style={ { width: percentage + "%"} }
+                  ></span>
+                  <span className="mailpoet_progress_label">
+                    { percentage + "%" }
+                  </span>
+              </div>
+              <p style={{ textAlign:'center' }}>
+                { label }
+              </p>
+            </div>
+          );
+        }
+      },
+      renderItem: function(newsletter, actions) {
         var rowClasses = classNames(
           'manage-column',
           'column-primary',
@@ -138,6 +231,9 @@ define(
               </strong>
               { actions }
             </td>
+            <td className="column" data-colname="Lists">
+              { this.renderStatus(newsletter) }
+            </td>
             <td className="column" data-colname="Lists">
               { segments }
             </td>
@@ -164,7 +260,8 @@ define(
               columns={columns}
               bulk_actions={ bulk_actions }
               item_actions={ item_actions }
-              messages={ messages } />
+              messages={ messages }
+              auto_refresh={ true } />
           </div>
         );
       }

assets/js/src/newsletters/send.jsx

@@ -16,7 +16,7 @@ define(
     Breadcrumb
   ) {
 
-    var settings = window.mailpoet_settings || {};
+    var settings = window.mailpoet_settings || {};
 
     var fields = [
       {
@@ -24,19 +24,25 @@ define(
         label: 'Subject line',
         tip: "Be creative! It's the first thing your subscribers see."+
              "Tempt them to open your email.",
-        type: 'text'
+        type: 'text',
+        validation: {
+          'data-parsley-required': true
+        }
       },
       {
         name: 'segments',
-        label: 'Lists',
-        tip: "The subscriber list that will be used for this campaign.",
+        label: 'Segments',
+        tip: "The subscriber segment that will be used for this campaign.",
         type: 'selection',
-        placeholder: "Select a list",
+        placeholder: "Select a segment",
         id: "mailpoet_segments",
         endpoint: "segments",
         multiple: true,
         filter: function(segment) {
           return !!(!segment.deleted_at);
+        },
+        validation: {
+          'data-parsley-required': true
         }
       },
       {
@@ -45,17 +51,24 @@ define(
         tip: "Name & email of yourself or your company.",
         fields: [
           {
-            name: 'from_name',
+            name: 'sender_name',
             type: 'text',
             placeholder: 'John Doe',
-            defaultValue: settings.from_name
+            defaultValue: (settings.sender !== undefined) ? settings.sender.name : '',
+            validation: {
+              'data-parsley-required': true
+            }
           },
           {
-            name: 'from_email',
+            name: 'sender_address',
             type: 'text',
             placeholder: 'john.doe@email.com',
-            defaultValue: settings.from_address
-          },
+            defaultValue: (settings.sender !== undefined) ? settings.sender.address : '',
+            validation: {
+              'data-parsley-required': true,
+              'data-parsley-type': 'email'
+            }
+          }
         ]
       },
       {
@@ -68,20 +81,25 @@ define(
           {
             name: 'reply_to_name',
             type: 'text',
-            placeholder: 'John Doe'
+            placeholder: 'John Doe',
+            defaultValue: (settings.reply_to !== undefined) ? settings.reply_to.name : '',
           },
           {
-            name: 'reply_to_email',
+            name: 'reply_to_address',
             type: 'text',
-            placeholder: 'john.doe@email.com'
+            placeholder: 'john.doe@email.com',
+            defaultValue: (settings.reply_to !== undefined) ? settings.reply_to.address : ''
           },
         ]
       }
     ];
 
     var messages = {
-      updated: function() {
-        MailPoet.Notice.success('The newsletter has been updated!');
+      onUpdate: function() {
+        MailPoet.Notice.success('Newsletter successfully updated!');
+      },
+      onCreate: function() {
+        MailPoet.Notice.success('Newsletter successfully added!');
       }
     };
 
@@ -90,34 +108,42 @@ define(
         Router.History
       ],
       handleSend: function() {
-        MailPoet.Ajax.post({
-          endpoint: 'newsletters',
-          action: 'send',
-          data: {
-            id: this.props.params.id,
-            newsletter: jQuery('#mailpoet_newsletter').serializeObject(),
-            segments: jQuery('#mailpoet_segments').val()
-          }
-        }).done(function(response) {
-          if(response === true) {
-            this.history.pushState(null, '/');
-
-            MailPoet.Notice.success(
-              'The newsletter has been sent!'
-            );
-          } else {
-            if(response.errors) {
-              MailPoet.Notice.error(
-                response.errors.join("<br />")
+        if(jQuery('#mailpoet_newsletter').parsley().validate() === true) {
+          MailPoet.Ajax.post({
+            endpoint: 'sendingQueue',
+            action: 'add',
+            data: {
+              newsletter_id: this.props.params.id,
+              segments: jQuery('#mailpoet_segments').val(),
+              sender: {
+                'name': jQuery('#mailpoet_newsletter [name="sender_name"]').val(),
+                'address': jQuery('#mailpoet_newsletter [name="sender_address"]').val()
+              },
+              reply_to: {
+                'name': jQuery('#mailpoet_newsletter [name="reply_to_name"]').val(),
+                'address': jQuery('#mailpoet_newsletter [name="reply_to_address"]').val()
+              }
+            }
+          }).done(function(response) {
+            if(response.result === true) {
+              this.history.pushState(null, '/');
+              MailPoet.Notice.success(
+                'The newsletter is being sent...'
               );
             } else {
-              MailPoet.Notice.error(
-                'An error occurred while trying to send. '+
-                '<a href="?page=mailpoet-settings">Check your settings.</a>'
-              );
+              if(response.errors) {
+                MailPoet.Notice.error(
+                  response.errors.join("<br />")
+                );
+              } else {
+                MailPoet.Notice.error(
+                  'An error occurred while trying to send. '+
+                  '<a href="?page=mailpoet-settings">Check your settings.</a>'
+                );
+              }
             }
-          }
-        }.bind(this));
+          }.bind(this));
+        }
       },
       render: function() {
         return (
@@ -131,8 +157,8 @@ define(
               endpoint="newsletters"
               fields={ fields }
               params={ this.props.params }
-              messages={ messages }>
-
+              messages={ messages }
+            >
               <p className="submit">
                 <input
                   className="button button-primary"

assets/js/src/newsletters/templates.jsx

@@ -18,12 +18,18 @@ define(
 
     var ImportTemplate = React.createClass({
       saveTemplate: function(template) {
+
+        // Stringify to enable transmission of primitive non-string value types
+        if (!_.isUndefined(template.body)) {
+          template.body = JSON.stringify(template.body);
+        }
+
         MailPoet.Ajax.post({
           endpoint: 'newsletterTemplates',
           action: 'save',
           data: template
         }).done(function(response) {
-          if(response === true) {
+          if(response.result === true) {
             this.props.onImport(template);
           } else {
             response.map(function(error) {
@@ -99,7 +105,7 @@ define(
                     "MailPoet's Guide",
                   description:
                     "This is the standard template that comes with MailPoet.",
-                  readonly: true
+                  readonly: "1"
                 }
               ]
             }
@@ -111,12 +117,19 @@ define(
         }.bind(this));
       },
       handleSelectTemplate: function(template) {
+        var body = template.body;
+
+        // Stringify to enable transmission of primitive non-string value types
+        if (!_.isUndefined(body)) {
+          body = JSON.stringify(body);
+        }
+
         MailPoet.Ajax.post({
           endpoint: 'newsletters',
           action: 'save',
           data: {
             id: this.props.params.id,
-            body: template.body
+            body: body
           }
         }).done(function(response) {
           if(response.result === true) {
@@ -150,6 +163,13 @@ define(
            this.setState({ loading: false });
         }
       },
+      handleShowTemplate: function(template) {
+        MailPoet.Modal.popup({
+          title: template.name,
+          template: '<div class="mailpoet_boxes_preview" style="background-color: {{ body.globalStyles.body.backgroundColor }}"><img src="{{ thumbnail }}" /></div>',
+          data: template,
+        });
+      },
       handleTemplateImport: function() {
         this.getTemplates();
       },
@@ -164,11 +184,22 @@ define(
                 Delete
               </a>
             </div>
-          );
+          ), thumbnail = '';
+
+          if (typeof template.thumbnail === 'string'
+              && template.thumbnail.length > 0) {
+            thumbnail = (
+              <a href="javascript:;" onClick={this.handleShowTemplate.bind(null, template)}>
+                <img src={ template.thumbnail } />
+                <div className="mailpoet_overlay"></div>
+              </a>
+            );
+          }
 
           return (
             <li key={ 'template-'+index }>
               <div className="mailpoet_thumbnail">
+                { thumbnail }
               </div>
 
               <div className="mailpoet_description">
@@ -192,7 +223,7 @@ define(
                     Preview
                   </a>
               </div>
-              { (template.readonly) ? false : deleteLink }
+              { (template.readonly === "1") ? false : deleteLink }
             </li>
           );
         }.bind(this));

assets/js/src/newsletters/types.jsx

@@ -26,14 +26,17 @@ define(
           action: 'create',
           data: {
             type: type,
+            subject: 'Draft newsletter',
           }
         }).done(function(response) {
-          if(response.id !== undefined) {
-            this.history.pushState(null, `/template/${response.id}`);
+          if(response.result && response.newsletter.id) {
+            this.history.pushState(null, `/template/${response.newsletter.id}`);
           } else {
-            response.map(function(error) {
-              MailPoet.Notice.error(error);
-            });
+            if(response.errors.length > 0) {
+              response.errors.map(function(error) {
+                MailPoet.Notice.error(error);
+              });
+            }
           }
         }.bind(this));
       },

assets/js/src/newsletters/types/notification.jsx

@@ -138,12 +138,14 @@ define(
             options: this.state,
           },
         }).done(function(response) {
-          if(response.id !== undefined) {
-            this.showTemplateSelection(response.id);
+          if(response.result && response.newsletter.id) {
+            this.showTemplateSelection(response.newsletter.id);
           } else {
-            response.map(function(error) {
-              MailPoet.Notice.error(error);
-            });
+            if(response.errors.length > 0) {
+              response.errors.map(function(error) {
+                MailPoet.Notice.error(error);
+              });
+            }
           }
         }.bind(this));
       },

assets/js/src/newsletters/types/standard.jsx

@@ -32,12 +32,15 @@ define(
             type: 'standard',
           }
         }).done(function(response) {
-          if(response.id !== undefined) {
-            this.showTemplateSelection(response.id);
+          console.log(response);
+          if(response.result && response.newsletter.id) {
+            this.showTemplateSelection(response.newsletter.id);
           } else {
-            response.map(function(error) {
-              MailPoet.Notice.error(error);
-            });
+            if(response.errors.length > 0) {
+              response.errors.map(function(error) {
+                MailPoet.Notice.error(error);
+              });
+            }
           }
         }.bind(this));
       },

assets/js/src/newsletters/types/welcome.jsx

@@ -111,12 +111,14 @@ define(
             options: this.state,
           },
         }).done(function(response) {
-          if(response.id !== undefined) {
-            this.showTemplateSelection(response.id);
+          if(response.result && response.newsletter.id) {
+            this.showTemplateSelection(response.newsletter.id);
           } else {
-            response.map(function(error) {
-              MailPoet.Notice.error(error);
-            });
+            if(response.errors.length > 0) {
+              response.errors.map(function(error) {
+                MailPoet.Notice.error(error);
+              });
+            }
           }
         }.bind(this));
       },

assets/js/src/notice.js

@@ -1,203 +1,212 @@
-define('notice', ['mailpoet', 'jquery'], function(MailPoet, jQuery) {
-  "use strict";
-  /*==================================================================================================
-
-      MailPoet Notice:
-
-          description: Handles notices
-          version: 0.2
-          author: Jonathan Labreuille
-          company: Wysija
-          dependencies: jQuery
-
-      Usage:
-
-      // success message (static: false)
-          MailPoet.Notice.success('Yatta!');
-
-          // error message (static: false)
-          MailPoet.Notice.error('Boo!');
-
-          // system message (static: true)
-          MailPoet.Notice.system('You need to updated ASAP!');
-
-      Examples:
-
-          MailPoet.Notice.success('-  success #1 -');
-          setTimeout(function() {
-              MailPoet.Notice.success('-  success #2 -');
-              setTimeout(function() {
-                  MailPoet.Notice.error('-  error -');
-                  setTimeout(function() {
-                      MailPoet.Notice.system('- system -');
-
-                      setTimeout(function() {
-                          MailPoet.Notice.hide();
-                      }, 2500);
-                  }, 300);
-              }, 400);
-          }, 500);
-
-  ==================================================================================================*/
-
-  MailPoet.Notice = {
-      version: 0.2,
-      // default options
-      defaults: {
-          type: 'success',
-          message: '',
-          static: false,
-          hideClose: false,
-          id: null,
-          scroll: false,
-          timeout: 2000,
-          onOpen: null,
-          onClose: null
-      },
-      options: {},
-      init: function(options) {
-          // set options
-          this.options = jQuery.extend({}, this.defaults, options);
-
-          // clone element
-          this.element = jQuery('#mailpoet_notice_'+this.options.type).clone();
-
-          // add data-id to the element
-          if (this.options.id) this.element.attr('data-id', 'notice_' + this.options.id);
-
-          // remove id from clone
-          this.element.removeAttr('id');
-
-          // insert notice after its parent
-          jQuery('#mailpoet_notice_'+this.options.type).after(this.element);
-
-          // setup onClose callback
-          var onClose = null;
-          if(this.options.onClose !== null) {
-              onClose = this.options.onClose;
-          }
-
-          // listen to remove event
-          jQuery(this.element).on('close', function() {
-              jQuery(this).fadeOut(200, function() {
-                  // on close callback
-                  if(onClose !== null) {
-                      onClose();
-                  }
-                  // remove notice
-                  jQuery(this).remove();
-              });
-          }.bind(this.element));
-
-          // listen to message event
-          jQuery(this.element).on('message', function(e, message) {
-              MailPoet.Notice.setMessage(message);
-          }.bind(this.element));
-
-          return this;
-      },
-      isHTML: function(str) {
-          var a = document.createElement('div');
-          a.innerHTML = str;
-          for(var c = a.childNodes, i = c.length; i--;) {
-              if(c[i].nodeType == 1) return true;
-          }
-          return false;
-      },
-      setMessage: function(message) {
-          // if it's not an html message, let's sugar coat the message with a fancy <p>
-          if(this.isHTML(message) === false) {
-              message = '<p>'+message+'</p>';
-          }
-          // set message
-          return this.element.html(message);
-      },
-      show: function(options) {
-        // initialize
-        this.init(options);
-
-          // show notice
-          this.showNotice();
-
-          // return this;
-      },
-      showNotice: function() {
-          // set message
-          this.setMessage(this.options.message);
-
-          // position notice
-          this.element.insertAfter(jQuery('h2.title'));
-
-          // set class name
-          switch(this.options.type) {
-            case 'success':
-              this.element.addClass('updated');
-            break;
-            case 'system':
-              this.element.addClass('update-nag');
-            break;
-            case 'error':
-              this.element.addClass('error');
-            break;
-          }
-
-          // make the notice appear
-          this.element.fadeIn(200);
-
-          // if scroll option is enabled, scroll to the notice
-          if(this.options.scroll === true) {
-              this.element.get(0).scrollIntoView(false);
-          }
-
-          // if the notice is not static, it has to disappear after a timeout
-          if(this.options.static === false) {
-              this.element.delay(this.options.timeout).trigger('close');
-          } else if (this.options.hideClose === false) {
-              this.element.append('<a href="javascript:;" class="mailpoet_notice_close"><span class="dashicons dashicons-dismiss"></span></a>');
-              this.element.find('.mailpoet_notice_close').on('click', function() {
-                  jQuery(this).trigger('close');
-              });
-          }
-
-          // call onOpen callback
-          if(this.options.onOpen !== null) {
-              this.options.onOpen(this.element);
-          }
-      },
-      hide: function(all) {
-          if(all !== undefined && all === true) {
-              jQuery('.mailpoet_notice:not([id])').trigger('close');
-          } else if (all !== undefined && jQuery.isArray(all)) {
-              for (var id in all) {
-                  jQuery('[data-id="notice_' + all[id] + '"]')
-                   .trigger('close');
-              }
-          } if (all !== undefined) {
-              jQuery('[data-id="notice_' + all + '"]')
-               .trigger('close');
-          } else {
-              jQuery('.mailpoet_notice.updated:not([id]), .mailpoet_notice.error:not([id])')
-              .trigger('close');
-          }
-      },
-      error: function(message, options) {
-        this.show(jQuery.extend({}, {
-              type: 'error',
-              message: '<p>'+message+'</p>'
-          }, options));
-      },
-      success: function(message, options) {
-          this.show(jQuery.extend({}, {
-              type: 'success',
-              message: '<p>'+message+'</p>'
-          }, options));
-      },
-      system: function(message, options) {
-          this.show(jQuery.extend({}, {
-              type: 'system',
-              static: true,
-              message: message
-          }, options));
-      }
-  };
+define('notice', ['mailpoet', 'jquery'], function(MailPoet, jQuery) {
+  "use strict";
+  /*==================================================================================================
+
+      MailPoet Notice:
+
+          description: Handles notices
+          version: 0.2
+          author: Jonathan Labreuille
+          company: Wysija
+          dependencies: jQuery
+
+      Usage:
+
+      // success message (static: false)
+          MailPoet.Notice.success('Yatta!');
+
+          // error message (static: false)
+          MailPoet.Notice.error('Boo!');
+
+          // system message (static: true)
+          MailPoet.Notice.system('You need to updated ASAP!');
+
+      Examples:
+
+          MailPoet.Notice.success('-  success #1 -');
+          setTimeout(function() {
+              MailPoet.Notice.success('-  success #2 -');
+              setTimeout(function() {
+                  MailPoet.Notice.error('-  error -');
+                  setTimeout(function() {
+                      MailPoet.Notice.system('- system -');
+
+                      setTimeout(function() {
+                          MailPoet.Notice.hide();
+                      }, 2500);
+                  }, 300);
+              }, 400);
+          }, 500);
+
+  ==================================================================================================*/
+
+  MailPoet.Notice = {
+      version: 0.2,
+      // default options
+      defaults: {
+          type: 'success',
+          message: '',
+          static: false,
+          hideClose: false,
+          id: null,
+          positionAfter: false,
+          scroll: false,
+          timeout: 2000,
+          onOpen: null,
+          onClose: null
+      },
+      options: {},
+      init: function(options) {
+          // set options
+          this.options = jQuery.extend({}, this.defaults, options);
+
+          // clone element
+          this.element = jQuery('#mailpoet_notice_'+this.options.type).clone();
+
+          // add data-id to the element
+          if (this.options.id) this.element.attr('data-id', 'notice_' + this.options.id);
+
+          // remove id from clone
+          this.element.removeAttr('id');
+
+          // insert notice after its parent
+          var positionAfter;
+          if (typeof this.options.positionAfter === 'object') {
+            positionAfter = this.options.positionAfter;
+          } else if (typeof this.options.positionAfter === 'string') {
+            positionAfter = jQuery(this.options.positionAfter);
+          } else {
+            positionAfter = jQuery('#mailpoet_notice_'+this.options.type);
+          }
+          positionAfter.after(this.element);
+
+          // setup onClose callback
+          var onClose = null;
+          if(this.options.onClose !== null) {
+              onClose = this.options.onClose;
+          }
+
+          // listen to remove event
+          jQuery(this.element).on('close', function() {
+              jQuery(this).fadeOut(200, function() {
+                  // on close callback
+                  if(onClose !== null) {
+                      onClose();
+                  }
+                  // remove notice
+                  jQuery(this).remove();
+              });
+          }.bind(this.element));
+
+          // listen to message event
+          jQuery(this.element).on('message', function(e, message) {
+              MailPoet.Notice.setMessage(message);
+          }.bind(this.element));
+
+          return this;
+      },
+      isHTML: function(str) {
+          var a = document.createElement('div');
+          a.innerHTML = str;
+          for(var c = a.childNodes, i = c.length; i--;) {
+              if(c[i].nodeType == 1) return true;
+          }
+          return false;
+      },
+      setMessage: function(message) {
+          // if it's not an html message, let's sugar coat the message with a fancy <p>
+          if(this.isHTML(message) === false) {
+              message = '<p>'+message+'</p>';
+          }
+          // set message
+          return this.element.html(message);
+      },
+      show: function(options) {
+        // initialize
+        this.init(options);
+
+          // show notice
+          this.showNotice();
+
+          // return this;
+      },
+      showNotice: function() {
+          // set message
+          this.setMessage(this.options.message);
+
+          // position notice
+          this.element.insertAfter(jQuery('h2.title'));
+
+          // set class name
+          switch(this.options.type) {
+            case 'success':
+              this.element.addClass('updated');
+            break;
+            case 'system':
+              this.element.addClass('update-nag');
+            break;
+            case 'error':
+              this.element.addClass('error');
+            break;
+          }
+
+          // make the notice appear
+          this.element.fadeIn(200);
+
+          // if scroll option is enabled, scroll to the notice
+          if(this.options.scroll === true) {
+              this.element.get(0).scrollIntoView(false);
+          }
+
+          // if the notice is not static, it has to disappear after a timeout
+          if(this.options.static === false) {
+              this.element.delay(this.options.timeout).trigger('close');
+          } else if (this.options.hideClose === false) {
+              this.element.append('<a href="javascript:;" class="mailpoet_notice_close"><span class="dashicons dashicons-dismiss"></span></a>');
+              this.element.find('.mailpoet_notice_close').on('click', function() {
+                  jQuery(this).trigger('close');
+              });
+          }
+
+          // call onOpen callback
+          if(this.options.onOpen !== null) {
+              this.options.onOpen(this.element);
+          }
+      },
+      hide: function(all) {
+          if(all !== undefined && all === true) {
+              jQuery('.mailpoet_notice:not([id])').trigger('close');
+          } else if (all !== undefined && jQuery.isArray(all)) {
+              for (var id in all) {
+                  jQuery('[data-id="notice_' + all[id] + '"]')
+                   .trigger('close');
+              }
+          } if (all !== undefined) {
+              jQuery('[data-id="notice_' + all + '"]')
+               .trigger('close');
+          } else {
+              jQuery('.mailpoet_notice.updated:not([id]), .mailpoet_notice.error:not([id])')
+              .trigger('close');
+          }
+      },
+      error: function(message, options) {
+        this.show(jQuery.extend({}, {
+              type: 'error',
+              message: '<p>'+message+'</p>'
+          }, options));
+      },
+      success: function(message, options) {
+          this.show(jQuery.extend({}, {
+              type: 'success',
+              message: '<p>'+message+'</p>'
+          }, options));
+      },
+      system: function(message, options) {
+          this.show(jQuery.extend({}, {
+              type: 'system',
+              static: true,
+              message: message
+          }, options));
+      }
+  };
 });

assets/js/src/segments/form.jsx

@@ -42,11 +42,7 @@ define(
         return (
           <div>
             <h2 className="title">
-              Segment <a
-                href="javascript:;"
-                className="add-new-h2"
-                onClick={ this.history.goBack }
-              >Back to list</a>
+              Segment
             </h2>
 
             <Form

assets/js/src/segments/list.jsx

@@ -121,6 +121,32 @@ const item_actions = [
         );
         refresh();
       });
+    },
+    display: function(segment) {
+      return (segment.type !== 'wp_users');
+    }
+  },
+  {
+    name: 'synchronize_segment',
+    label: 'Update',
+    className: 'update',
+    onClick: function(item, refresh) {
+      MailPoet.Modal.loading(true);
+      MailPoet.Ajax.post({
+        endpoint: 'segments',
+        action: 'synchronize'
+      }).done(function(response) {
+        MailPoet.Modal.loading(false);
+        if(response === true) {
+          MailPoet.Notice.success(
+            ('List "%$1s" has been synchronized.').replace('%$1s', item.name)
+          );
+          refresh();
+        }
+      });
+    },
+    display: function(segment) {
+      return (segment.type === 'wp_users');
     }
   },
   {
@@ -130,15 +156,16 @@ const item_actions = [
         <a href={ item.subscribers_url }>View subscribers</a>
       );
     }
+  },
+  {
+    name: 'trash',
+    display: function(segment) {
+      return (segment.type !== 'wp_users');
+    }
   }
 ];
 
 const bulk_actions = [
-  {
-    name: 'trash',
-    label: 'Trash',
-    onSuccess: messages.onTrash
-  }
 ];
 
 const SegmentList = React.createClass({
@@ -148,7 +175,6 @@ const SegmentList = React.createClass({
       'column-primary',
       'has-row-actions'
     );
-
     return (
       <div>
         <td className={ rowClasses }>

assets/js/src/settings/tabs.js

@@ -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();
         }
       },

assets/js/src/subscribers/form.jsx

@@ -51,6 +51,24 @@ define(
       }
     ];
 
+    var custom_fields = window.mailpoet_custom_fields || [];
+    custom_fields.map(custom_field => {
+      let field = {
+        name: 'cf_' + custom_field.id,
+        label: custom_field.name,
+        type: custom_field.type
+      };
+      if(custom_field.params) {
+        field.params = custom_field.params;
+      }
+
+      if(custom_field.params.values) {
+        field.values = custom_field.params.values;
+      }
+
+      fields.push(field);
+    });
+
     var messages = {
       onUpdate: function() {
         MailPoet.Notice.success('Subscriber successfully updated!');
@@ -70,11 +88,7 @@ define(
         return (
           <div>
             <h2 className="title">
-              Subscriber <a
-                href="javascript:;"
-                className="add-new-h2"
-                onClick={ this.history.goBack }
-              >Back to list</a>
+              Subscriber
             </h2>
 
             <Form

assets/js/src/subscribers/importExport/export.js

@@ -62,7 +62,7 @@ define(
            if (_.contains(fieldsToExclude, selectedOptionId)) {
              selectEvent.preventDefault();
              if (selectedOptionId === 'deselect') {
-               jQuery(selectElement).select2('val', '');
+               jQuery(selectElement).val('').trigger('change');
              } else {
                var allOptions = [];
                _.each(container.find('option'), function (field) {
@@ -70,7 +70,7 @@ define(
                    allOptions.push(field.value);
                  }
                });
-               jQuery(selectElement).select2('val', allOptions);
+               jQuery(selectElement).val(allOptions).trigger('change');
              }
              jQuery(selectElement).select2('close');
            }
@@ -138,11 +138,11 @@ define(
           endpoint: 'ImportExport',
           action: 'processExport',
           data: JSON.stringify({
-            'exportConfirmedOption': exportData.exportConfirmedOption,
-            'exportFormatOption': jQuery(':radio[name="option_format"]:checked').val(),
-            'groupBySegmentOption': (groupBySegmentOptionElement.is(":visible")) ? groupBySegmentOptionElement.prop('checked') : false,
+            'export_confirmed_option': exportData.exportConfirmedOption,
+            'export_format_option': jQuery(':radio[name="option_format"]:checked').val(),
+            'group_by_segment_option': (groupBySegmentOptionElement.is(":visible")) ? groupBySegmentOptionElement.prop('checked') : false,
             'segments': (exportData.segments) ? segmentsContainerElement.val() : false,
-            'subscriberFields': subscriberFieldsContainerElement.val()
+            'subscriber_fields': subscriberFieldsContainerElement.val()
           })
         })
         .done(function (response) {

assets/js/src/subscribers/list.jsx

@@ -103,7 +103,9 @@ const bulk_actions = [
         id: 'move_to_segment',
         endpoint: 'segments',
         filter: function(segment) {
-          return !!(!segment.deleted_at);
+          return !!(
+            !segment.deleted_at && segment.type === 'default'
+          );
         }
       };
 
@@ -132,7 +134,9 @@ const bulk_actions = [
         id: 'add_to_segment',
         endpoint: 'segments',
         filter: function(segment) {
-          return !!(!segment.deleted_at);
+          return !!(
+            !segment.deleted_at && segment.type === 'default'
+          );
         }
       };
 
@@ -159,7 +163,12 @@ const bulk_actions = [
     onSelect: function() {
       let field = {
         id: 'remove_from_segment',
-        endpoint: 'segments'
+        endpoint: 'segments',
+        filter: function(segment) {
+          return !!(
+            segment.type === 'default'
+          );
+        }
       };
 
       return (
@@ -206,6 +215,21 @@ const bulk_actions = [
   }
 ];
 
+const item_actions = [
+  {
+    name: 'edit',
+    label: 'Edit',
+    link: function(item) {
+      return (
+        <Link to={ `/edit/${item.id}` }>Edit</Link>
+      );
+    }
+  },
+  {
+    name: 'trash'
+  }
+];
+
 const SubscriberList = React.createClass({
   renderItem: function(subscriber, actions) {
     let row_classes = classNames(
@@ -295,6 +319,7 @@ const SubscriberList = React.createClass({
           onRenderItem={ this.renderItem }
           columns={ columns }
           bulk_actions={ bulk_actions }
+          item_actions={ item_actions }
           messages={ messages }
           onGetItems={ this.onGetItems }
         />

build

@@ -1,39 +0,0 @@
-#!/bin/sh
-
-# Remove previous build.
-rm wysija-newsletters.zip;
-
-# Create temp dir.
-mkdir wysija-newsletters;
-
-# Production assets.
-npm install;
-./do compile:all;
-
-# Production libraries.
-./composer.phar install --no-dev;
-
-# Copy release folders.
-cp -Rf lang wysija-newsletters;
-cp -RfL assets wysija-newsletters;
-cp -Rf lib wysija-newsletters;
-cp -Rf vendor wysija-newsletters;
-cp -Rf views wysija-newsletters;
-rm -Rf wysija-newsletters/assets/css/src;
-rm -Rf wysija-newsletters/assets/js/src;
-
-# Copy release files.
-cp LICENSE wysija-newsletters;
-cp index.php wysija-newsletters;
-cp mailpoet.php wysija-newsletters;
-cp readme.txt wysija-newsletters;
-cp uninstall.php wysija-newsletters;
-
-# Zip final release.
-zip -r wysija-newsletters.zip wysija-newsletters;
-
-# Remove temp dir.
-rm -rf wysija-newsletters;
-
-# Reinstall dev dependencies.
-./composer.phar install;

build.sh

@@ -0,0 +1,42 @@
+#!/bin/sh
+
+plugin_name='mailpoet'
+
+# Remove previous build.
+rm $plugin_name.zip
+
+# Create temp dir.
+mkdir $plugin_name
+
+# Production assets.
+rm -rf node_modules
+npm install
+./do compile:all
+
+# Production libraries.
+./composer.phar install --no-dev
+
+# Copy release folders.
+cp -Rf lang $plugin_name
+cp -RfL assets $plugin_name
+cp -Rf lib $plugin_name
+cp -Rf vendor $plugin_name
+cp -Rf views $plugin_name
+rm -Rf $plugin_name/assets/css/src
+rm -Rf $plugin_name/assets/js/src
+
+# Copy release files.
+cp LICENSE $plugin_name
+cp index.php $plugin_name
+cp $plugin_name.php $plugin_name
+cp readme.txt $plugin_name
+cp uninstall.php $plugin_name
+
+# Zip final release.
+zip -r $plugin_name.zip $plugin_name
+
+# Remove temp dir.
+rm -rf $plugin_name
+
+# Reinstall dev dependencies.
+./composer.phar install

codeception.yml

@@ -19,3 +19,12 @@ modules:
             user: ''
             password: ''
             dump: tests/_data/dump.sql
+coverage:
+    enabled: true
+    whitelist:
+        include:
+            - lib/*
+        exclude:
+    blacklist:
+        include:
+        exclude:

composer.json

@@ -8,7 +8,10 @@
     "tburry/pquery": "*",
     "j4mie/paris": "1.5.4",
     "swiftmailer/swiftmailer": "^5.4",
-    "phpseclib/phpseclib": "*"
+    "phpseclib/phpseclib": "*",
+    "mtdowling/cron-expression": "^1.0",
+    "nesbot/carbon": "^1.21",
+    "soundasleep/html2text": "^0.3.0"
   },
   "require-dev": {
     "codeception/codeception": "*",

lib/Config/Activator.php

@@ -9,13 +9,6 @@ class Activator {
   function __construct() {
   }
 
-  function init() {
-    register_activation_hook(
-      Env::$file,
-      array($this, 'activate')
-    );
-  }
-
   function activate() {
     $migrator = new Migrator();
     $migrator->up();
@@ -23,4 +16,9 @@ class Activator {
     $populator = new Populator();
     $populator->up();
   }
+
+  function deactivate() {
+    $migrator = new Migrator();
+    $migrator->down();
+  }
 }

lib/Config/Analytics.php

@@ -10,7 +10,8 @@ class Analytics {
   }
 
   function init() {
-    add_action('admin_enqueue_scripts', array($this, 'setupAdminDependencies'));
+    // review: this creates a fatal error when mailpoet tables are dropped.
+    //add_action('admin_enqueue_scripts', array($this, 'setupAdminDependencies'));
   }
 
   function setupAdminDependencies() {

lib/Config/Env.php

@@ -4,41 +4,41 @@ namespace MailPoet\Config;
 if(!defined('ABSPATH')) exit;
 
 class Env {
-  public static $version;
-  public static $plugin_name;
-  public static $plugin_url;
-  public static $file;
-  public static $path;
-  public static $views_path;
-  public static $assets_path;
-  public static $assets_url;
-  public static $temp_name;
-  public static $temp_path;
-  public static $languages_path;
-  public static $lib_path;
-  public static $plugin_prefix;
-  public static $db_prefix;
-  public static $db_source_name;
-  public static $db_host;
-  public static $db_socket;
-  public static $db_port;
-  public static $db_name;
-  public static $db_username;
-  public static $db_password;
-  public static $db_charset;
+  static $version;
+  static $plugin_name;
+  static $plugin_path;
+  static $file;
+  static $path;
+  static $views_path;
+  static $assets_path;
+  static $assets_url;
+  static $temp_path;
+  static $temp_URL;
+  static $languages_path;
+  static $lib_path;
+  static $plugin_prefix;
+  static $db_prefix;
+  static $db_source_name;
+  static $db_host;
+  static $db_socket;
+  static $db_port;
+  static $db_name;
+  static $db_username;
+  static $db_password;
+  static $db_charset;
 
-  public static function init($file, $version) {
+  static function init($file, $version) {
     global $wpdb;
     self::$version = $version;
     self::$file = $file;
     self::$path = dirname(self::$file);
     self::$plugin_name = 'mailpoet';
-    self::$plugin_url = plugins_url() . '/' . basename(Env::$path);
     self::$views_path = self::$path . '/views';
     self::$assets_path = self::$path . '/assets';
     self::$assets_url = plugins_url('/assets', $file);
-    self::$temp_name = 'temp';
-    self::$temp_path = self::$path . '/' . self::$temp_name;
+    $wp_upload_dir = wp_upload_dir();
+    self::$temp_path = $wp_upload_dir['path'];
+    self::$temp_URL = $wp_upload_dir['url'];
     self::$languages_path = self::$path . '/lang';
     self::$lib_path = self::$path . '/lib';
     self::$plugin_prefix = 'mailpoet_';
@@ -46,11 +46,12 @@ class Env {
     self::$db_host = DB_HOST;
     self::$db_port = 3306;
     self::$db_socket = false;
-    if (preg_match('/(?=:\d+$)/', DB_HOST)) {
+    if(preg_match('/(?=:\d+$)/', DB_HOST)) {
       list(self::$db_host, self::$db_port) = explode(':', DB_HOST);
-    }
-    else if (preg_match('/:/', DB_HOST)) {
-      self::$db_socket = true;
+    } else {
+      if(preg_match('/:/', DB_HOST)) {
+        self::$db_socket = true;
+      }
     }
     self::$db_name = DB_NAME;
     self::$db_username = DB_USER;
@@ -59,7 +60,7 @@ class Env {
     self::$db_source_name = self::dbSourceName(self::$db_host, self::$db_socket, self::$db_port);
   }
 
-  private static function dbSourceName($host, $socket,$port) {
+  private static function dbSourceName($host, $socket, $port) {
     $source_name = array(
       (!$socket) ? 'mysql:host=' : 'mysql:unix_socket=',
       $host,

lib/Config/Hooks.php

@@ -0,0 +1,106 @@
+<?php
+namespace MailPoet\Config;
+use \MailPoet\Models\Setting;
+
+class Hooks {
+  function __construct() {
+  }
+
+  function init() {
+    // Subscribe in comments
+    if((bool)Setting::getValue('subscribe.on_comment.enabled')) {
+      add_action(
+        'comment_form_after_fields',
+        '\MailPoet\Subscription\Comment::extendForm'
+      );
+
+      add_action(
+        'comment_post',
+        '\MailPoet\Subscription\Comment::onSubmit',
+        60,
+        2
+      );
+
+      add_action(
+        'wp_set_comment_status',
+        '\MailPoet\Subscription\Comment::onStatusUpdate',
+        60,
+        2
+      );
+    }
+
+    // Subscribe in registration form
+    if((bool)Setting::getValue('subscribe.on_register.enabled')) {
+      if(is_multisite()) {
+        add_action(
+          'signup_extra_fields',
+          '\MailPoet\Subscription\Registration::extendForm'
+        );
+        add_action(
+          'wpmu_validate_user_signup',
+          '\MailPoet\Subscription\Registration::onMultiSiteRegister',
+          60,
+          1
+        );
+      } else {
+        add_action(
+          'register_form',
+          '\MailPoet\Subscription\Registration::extendForm'
+        );
+        add_action(
+          'register_post',
+          '\MailPoet\Subscription\Registration::onRegister',
+          60,
+          3
+        );
+      }
+    }
+
+    // WP Users synchronization
+    add_action(
+      'user_register',
+      '\MailPoet\Segments\WP::synchronizeUser',
+      1
+    );
+    add_action(
+      'added_existing_user',
+      '\MailPoet\Segments\WP::synchronizeUser',
+      1
+    );
+    add_action(
+      'profile_update',
+      '\MailPoet\Segments\WP::synchronizeUser',
+      1
+    );
+    add_action(
+      'delete_user',
+      '\MailPoet\Segments\WP::synchronizeUser',
+      1
+    );
+    // multisite
+    add_action(
+      'deleted_user',
+      '\MailPoet\Segments\WP::synchronizeUser',
+      1
+    );
+    add_action(
+      'remove_user_from_blog',
+      '\MailPoet\Segments\WP::synchronizeUser',
+      1
+    );
+
+    add_filter(
+      'image_size_names_choose',
+      array(
+        $this,
+        'appendImageSizes'
+      )
+    );
+  }
+
+  function appendImageSizes($sizes) {
+    return array_merge($sizes, array(
+      'mailpoet_newsletter_max' => __('MailPoet Newsletter'),
+    ));
+  }
+}

lib/Config/Initializer.php

@@ -2,10 +2,15 @@
 namespace MailPoet\Config;
 
 use MailPoet\Models;
+use MailPoet\Cron\Supervisor;
 use MailPoet\Router;
+use MailPoet\Models\Setting;
+use MailPoet\Settings\Pages;
 
 if(!defined('ABSPATH')) exit;
 
+require_once(ABSPATH . 'wp-admin/includes/plugin.php');
+
 class Initializer {
   function __construct($params = array(
     'file' => '',
@@ -16,15 +21,34 @@ class Initializer {
 
   function init() {
     $this->setupDB();
-    $this->setupActivator();
-    $this->setupRenderer();
-    $this->setupLocalizer();
-    $this->setupMenu();
-    $this->setupRouter();
-    $this->setupWidget();
-    $this->setupAnalytics();
-    $this->setupPermissions();
-    $this->setupChangelog();
+
+    register_activation_hook(Env::$file, array($this, 'runMigrator'));
+    register_activation_hook(Env::$file, array($this, 'runPopulator'));
+
+    add_action('init', array($this, 'setup'));
+    add_action('widgets_init', array($this, 'setupWidget'));
+  }
+
+  function setup() {
+    try {
+      $this->setupRenderer();
+      $this->setupLocalizer();
+      $this->setupMenu();
+      $this->setupRouter();
+      $this->setupPermissions();
+      $this->setupPublicAPI();
+      $this->setupAnalytics();
+      $this->setupChangelog();
+      $this->runQueueSupervisor();
+      $this->setupShortcodes();
+      $this->setupHooks();
+      $this->setupPages();
+      $this->setupImages();
+    } catch(\Exception $e) {
+      // if anything goes wrong during init
+      // automatically deactivate the plugin
+      deactivate_plugins(Env::$file);
+    }
   }
 
   function setupDB() {
@@ -33,7 +57,8 @@ class Initializer {
     \ORM::configure('password', Env::$db_password);
     \ORM::configure('logging', WP_DEBUG);
     \ORM::configure('driver_options', array(
-      \PDO::MYSQL_ATTR_INIT_COMMAND => 'SET NAMES utf8'
+      \PDO::MYSQL_ATTR_INIT_COMMAND => 'SET NAMES utf8',
+      \PDO::MYSQL_ATTR_INIT_COMMAND => 'SET TIME_ZONE = "+00:00"'
     ));
 
     $subscribers = Env::$db_prefix . 'subscribers';
@@ -41,6 +66,8 @@ class Initializer {
     $newsletters = Env::$db_prefix . 'newsletters';
     $newsletter_templates = Env::$db_prefix . 'newsletter_templates';
     $segments = Env::$db_prefix . 'segments';
+    $filters = Env::$db_prefix . 'filters';
+    $segment_filter = Env::$db_prefix . 'segment_filter';
     $forms = Env::$db_prefix . 'forms';
     $subscriber_segment = Env::$db_prefix . 'subscriber_segment';
     $newsletter_segment = Env::$db_prefix . 'newsletter_segment';
@@ -48,11 +75,15 @@ class Initializer {
     $subscriber_custom_field = Env::$db_prefix . 'subscriber_custom_field';
     $newsletter_option_fields = Env::$db_prefix . 'newsletter_option_fields';
     $newsletter_option = Env::$db_prefix . 'newsletter_option';
+    $sending_queues = Env::$db_prefix . 'sending_queues';
+    $newsletter_statistics = Env::$db_prefix . 'newsletter_statistics';
 
     define('MP_SUBSCRIBERS_TABLE', $subscribers);
     define('MP_SETTINGS_TABLE', $settings);
     define('MP_NEWSLETTERS_TABLE', $newsletters);
     define('MP_SEGMENTS_TABLE', $segments);
+    define('MP_FILTERS_TABLE', $filters);
+    define('MP_SEGMENT_FILTER_TABLE', $segment_filter);
     define('MP_FORMS_TABLE', $forms);
     define('MP_SUBSCRIBER_SEGMENT_TABLE', $subscriber_segment);
     define('MP_NEWSLETTER_TEMPLATES_TABLE', $newsletter_templates);
@@ -61,11 +92,18 @@ class Initializer {
     define('MP_SUBSCRIBER_CUSTOM_FIELD_TABLE', $subscriber_custom_field);
     define('MP_NEWSLETTER_OPTION_FIELDS_TABLE', $newsletter_option_fields);
     define('MP_NEWSLETTER_OPTION_TABLE', $newsletter_option);
+    define('MP_SENDING_QUEUES_TABLE', $sending_queues);
+    define('MP_NEWSLETTER_STATISTICS_TABLE', $newsletter_statistics);
   }
 
-  function setupActivator() {
-    $activator = new Activator();
-    $activator->init();
+  function runMigrator() {
+    $migrator = new Migrator();
+    $migrator->up();
+  }
+
+  function runPopulator() {
+    $populator = new Populator();
+    $populator->up();
   }
 
   function setupRenderer() {
@@ -79,10 +117,7 @@ class Initializer {
   }
 
   function setupMenu() {
-    $menu = new Menu(
-      $this->renderer,
-      Env::$assets_url
-    );
+    $menu = new Menu($this->renderer, Env::$assets_url);
     $menu->init();
   }
 
@@ -110,4 +145,37 @@ class Initializer {
     $changelog = new Changelog();
     $changelog->init();
   }
-}
+
+  function setupPages() {
+    $pages = new Pages();
+    $pages->init();
+  }
+
+  function setupShortcodes() {
+    $shortcodes = new Shortcodes();
+    $shortcodes->init();
+  }
+
+  function setupHooks() {
+    $hooks = new Hooks();
+    $hooks->init();
+  }
+
+  function setupPublicAPI() {
+    $publicAPI = new PublicAPI();
+    $publicAPI->init();
+  }
+
+  function runQueueSupervisor() {
+    if(php_sapi_name() === 'cli') return;
+    try {
+      $supervisor = new Supervisor();
+      $supervisor->checkDaemon();
+    } catch(\Exception $e) {
+    }
+  }
+
+  function setupImages() {
+    add_image_size('mailpoet_newsletter_max', 1320);
+  }
+}

lib/Config/Menu.php

@@ -1,17 +1,18 @@
 <?php
 namespace MailPoet\Config;
 
+use MailPoet\Form\Block;
+use MailPoet\Form\Renderer as FormRenderer;
+use MailPoet\Models\CustomField;
+use MailPoet\Models\Form;
+use MailPoet\Models\Segment;
+use MailPoet\Models\Setting;
+use MailPoet\Settings\Charsets;
+use MailPoet\Settings\Hosts;
+use MailPoet\Settings\Pages;
 use MailPoet\Subscribers\ImportExport\BootStrapMenu;
-use \MailPoet\Models\Segment;
-use \MailPoet\Models\Setting;
-use \MailPoet\Models\Form;
-use \MailPoet\Form\Block;
-use \MailPoet\Form\Renderer as FormRenderer;
-use \MailPoet\Settings\Hosts;
-use \MailPoet\Settings\Pages;
-use \MailPoet\Settings\Charsets;
-use \MailPoet\Util\Permissions;
-use \MailPoet\Util\DKIM;
+use MailPoet\Util\DKIM;
+use MailPoet\Util\Permissions;
 
 if(!defined('ABSPATH')) exit;
 
@@ -24,7 +25,10 @@ class Menu {
   function init() {
     add_action(
       'admin_menu',
-      array($this, 'setup')
+      array(
+        $this,
+        'setup'
+      )
     );
   }
 
@@ -34,7 +38,10 @@ class Menu {
       'MailPoet',
       'manage_options',
       'mailpoet',
-      array($this, 'home'),
+      array(
+        $this,
+        'home'
+      ),
       $this->assets_url . '/img/menu_icon.png',
       30
     );
@@ -44,7 +51,10 @@ class Menu {
       __('Newsletters'),
       'manage_options',
       'mailpoet-newsletters',
-      array($this, 'newsletters')
+      array(
+        $this,
+        'newsletters'
+      )
     );
     add_submenu_page(
       'mailpoet',
@@ -52,7 +62,10 @@ class Menu {
       __('Forms'),
       'manage_options',
       'mailpoet-forms',
-      array($this, 'forms')
+      array(
+        $this,
+        'forms'
+      )
     );
     add_submenu_page(
       'mailpoet',
@@ -60,7 +73,10 @@ class Menu {
       __('Subscribers'),
       'manage_options',
       'mailpoet-subscribers',
-      array($this, 'subscribers')
+      array(
+        $this,
+        'subscribers'
+      )
     );
     add_submenu_page(
       'mailpoet',
@@ -68,7 +84,10 @@ class Menu {
       __('Segments'),
       'manage_options',
       'mailpoet-segments',
-      array($this, 'segments')
+      array(
+        $this,
+        'segments'
+      )
     );
     add_submenu_page(
       'mailpoet',
@@ -76,7 +95,10 @@ class Menu {
       __('Settings'),
       'manage_options',
       'mailpoet-settings',
-      array($this, 'settings')
+      array(
+        $this,
+        'settings'
+      )
     );
     add_submenu_page(
       null,
@@ -84,7 +106,10 @@ class Menu {
       __('Import'),
       'manage_options',
       'mailpoet-import',
-      array($this, 'import')
+      array(
+        $this,
+        'import'
+      )
     );
     add_submenu_page(
       null,
@@ -92,7 +117,10 @@ class Menu {
       __('Export'),
       'manage_options',
       'mailpoet-export',
-      array($this, 'export')
+      array(
+        $this,
+        'export'
+      )
     );
 
     add_submenu_page(
@@ -101,7 +129,10 @@ class Menu {
       __('Welcome'),
       'manage_options',
       'mailpoet-welcome',
-      array($this, 'welcome')
+      array(
+        $this,
+        'welcome'
+      )
     );
 
     add_submenu_page(
@@ -110,7 +141,10 @@ class Menu {
       __('Update'),
       'manage_options',
       'mailpoet-update',
-      array($this, 'update')
+      array(
+        $this,
+        'update'
+      )
     );
 
     add_submenu_page(
@@ -119,7 +153,10 @@ class Menu {
       __('Form editor'),
       'manage_options',
       'mailpoet-form-editor',
-      array($this, 'formEditor')
+      array(
+        $this,
+        'formEditor'
+      )
     );
 
     add_submenu_page(
@@ -128,7 +165,22 @@ class Menu {
       __('Newsletter editor'),
       'manage_options',
       'mailpoet-newsletter-editor',
-      array($this, 'newletterEditor')
+      array(
+        $this,
+        'newletterEditor'
+      )
+    );
+
+    add_submenu_page(
+      'mailpoet',
+      __('Cron'),
+      __('Cron'),
+      'manage_options',
+      'mailpoet-cron',
+      array(
+        $this,
+        'cron'
+      )
     );
   }
 
@@ -138,12 +190,14 @@ class Menu {
   }
 
   function welcome() {
+    if((bool)(defined('DOING_AJAX') && DOING_AJAX)) return;
+
     global $wp;
     $current_url = home_url(add_query_arg($wp->query_string, $wp->request));
     $redirect_url =
       (!empty($_GET['mailpoet_redirect']))
-      ? urldecode($_GET['mailpoet_redirect'])
-      : wp_get_referer();
+        ? urldecode($_GET['mailpoet_redirect'])
+        : wp_get_referer();
 
     if(
       $redirect_url === $current_url
@@ -166,8 +220,8 @@ class Menu {
     $current_url = home_url(add_query_arg($wp->query_string, $wp->request));
     $redirect_url =
       (!empty($_GET['mailpoet_redirect']))
-      ? urldecode($_GET['mailpoet_redirect'])
-      : wp_get_referer();
+        ? urldecode($_GET['mailpoet_redirect'])
+        : wp_get_referer();
 
     if(
       $redirect_url === $current_url
@@ -188,6 +242,7 @@ class Menu {
 
   function settings() {
     $settings = Setting::getAll();
+    $flags = $this->_getFlags();
 
     // dkim: check if public/private keys have been generated
     if(
@@ -206,9 +261,9 @@ class Menu {
 
     $data = array(
       'settings' => $settings,
-      'segments' => Segment::getPublished()->findArray(),
+      'segments' => Segment::getPublic()->findArray(),
       'pages' => Pages::getAll(),
-      'flags' => $this->_getFlags(),
+      'flags' => $flags,
       'charsets' => Charsets::getAll(),
       'current_user' => wp_get_current_user(),
       'permissions' => Permissions::getAll(),
@@ -234,7 +289,10 @@ class Menu {
 
       // check if users can register
       $flags['registration_enabled'] =
-        !(in_array($registration, array('none', 'blog')));
+        !(in_array($registration, array(
+          'none',
+          'blog'
+        )));
     } else {
       // check if users can register
       $flags['registration_enabled'] =
@@ -249,7 +307,24 @@ class Menu {
 
     $data['segments'] = Segment::findArray();
 
-    echo $this->renderer->render('subscribers.html', $data);
+    $data['custom_fields'] = array_map(function($field) {
+      $field['params'] = unserialize($field['params']);
+
+      if(!empty($field['params']['values'])) {
+        $values = array();
+
+        foreach($field['params']['values'] as $value) {
+          $values[$value['value']] = $value['value'];
+        }
+        $field['params']['values'] = $values;
+      }
+      return $field;
+    }, CustomField::findArray());
+
+    $data['date_formats'] = Block\Date::getDateFormats();
+    $data['month_names'] = Block\Date::getMonthNames();
+
+    echo $this->renderer->render('subscribers/subscribers.html', $data);
   }
 
   function segments() {
@@ -270,17 +345,22 @@ class Menu {
     $data = array();
 
     $data['segments'] = Segment::findArray();
-    $settings = Setting::findArray();
-    $data['settings'] = array();
-    foreach($settings as $setting) {
-      $data['settings'][$setting['name']] = $setting['value'];
-    }
+    $data['settings'] = Setting::getAll();
     $data['roles'] = $wp_roles->get_names();
     echo $this->renderer->render('newsletters.html', $data);
   }
 
   function newletterEditor() {
-    $data = array();
+    $custom_fields = array_map(function($field) {
+      return array(
+        'text' =>  $field['name'],
+        'shortcode' => 'field:' . $field['id'],
+      );
+    }, CustomField::findArray());
+
+    $data = array(
+      'customFields' => $custom_fields,
+    );
     wp_enqueue_media();
     wp_enqueue_script('tinymce-wplink', includes_url('js/tinymce/plugins/wplink/plugin.js'));
     wp_enqueue_style('editor', includes_url('css/editor.css'));
@@ -290,17 +370,17 @@ class Menu {
   function import() {
     $import = new BootStrapMenu('import');
     $data = $import->bootstrap();
-    echo $this->renderer->render('import.html', $data);
+    echo $this->renderer->render('subscribers/importExport/import.html', $data);
   }
 
   function export() {
     $export = new BootStrapMenu('export');
     $data = $export->bootstrap();
-    echo $this->renderer->render('export.html', $data);
+    echo $this->renderer->render('subscribers/importExport/export.html', $data);
   }
 
   function formEditor() {
-    $id = (isset($_GET['id']) ? (int)$_GET['id'] : 0);
+    $id = (isset($_GET['id']) ? (int) $_GET['id'] : 0);
     $form = Form::findOne($id);
     if($form !== false) {
       $form = $form->asArray();
@@ -309,12 +389,18 @@ class Menu {
     $data = array(
       'form' => $form,
       'pages' => Pages::getAll(),
-      'segments' => Segment::getPublished()->findArray(),
+      'segments' => Segment::getPublic()
+        ->findArray(),
       'styles' => FormRenderer::getStyles($form),
       'date_types' => Block\Date::getDateTypes(),
-      'date_formats' => Block\Date::getDateFormats()
+      'date_formats' => Block\Date::getDateFormats(),
+      'month_names' => Block\Date::getMonthNames()
     );
 
     echo $this->renderer->render('form/editor.html', $data);
   }
-}
+
+  function cron() {
+    echo $this->renderer->render('cron.html');
+  }
+}

lib/Config/Migrator.php

@@ -1,7 +1,7 @@
 <?php
 namespace MailPoet\Config;
 
-if (!defined('ABSPATH')) exit;
+if(!defined('ABSPATH')) exit;
 
 require_once(ABSPATH . 'wp-admin/includes/upgrade.php');
 
@@ -21,6 +21,8 @@ class Migrator {
       'subscriber_custom_field',
       'newsletter_option_fields',
       'newsletter_option',
+      'sending_queues',
+      'newsletter_statistics',
       'forms'
     );
   }
@@ -39,7 +41,7 @@ class Migrator {
   function down() {
     global $wpdb;
 
-    $drop_table = function($model) {
+    $drop_table = function($model) use($wpdb) {
       $table = $this->prefix . $model;
       $wpdb->query("DROP TABLE {$table}");
     };
@@ -50,6 +52,7 @@ class Migrator {
   function subscribers() {
     $attributes = array(
       'id mediumint(9) NOT NULL AUTO_INCREMENT,',
+      'wp_user_id bigint(20) NULL,',
       'first_name tinytext NOT NULL,',
       'last_name tinytext NOT NULL,',
       'email varchar(150) NOT NULL,',
@@ -81,6 +84,10 @@ class Migrator {
       'id mediumint(9) NOT NULL AUTO_INCREMENT,',
       'subject varchar(250) NOT NULL,',
       'type varchar(20) NOT NULL DEFAULT "standard",',
+      'sender_address varchar(150) NOT NULL,',
+      'sender_name varchar(150) NOT NULL,',
+      'reply_to_address varchar(150) NOT NULL,',
+      'reply_to_name varchar(150) NOT NULL,',
       'preheader varchar(250) NOT NULL,',
       'body longtext,',
       'created_at TIMESTAMP NOT NULL DEFAULT 0,',
@@ -96,7 +103,9 @@ class Migrator {
       'id mediumint(9) NOT NULL AUTO_INCREMENT,',
       'name varchar(250) NOT NULL,',
       'description varchar(250) NOT NULL,',
-      'body longtext,',
+      'body LONGTEXT,',
+      'thumbnail LONGTEXT,',
+      'readonly TINYINT(1) DEFAULT 0,',
       'created_at TIMESTAMP NOT NULL DEFAULT 0,',
       'updated_at TIMESTAMP NOT NULL DEFAULT CURRENT_TIMESTAMP ON UPDATE CURRENT_TIMESTAMP,',
       'PRIMARY KEY  (id)'
@@ -106,14 +115,15 @@ class Migrator {
 
   function segments() {
     $attributes = array(
-        'id mediumint(9) NOT NULL AUTO_INCREMENT,',
-        'name varchar(90) NOT NULL,',
-        'description varchar(250) NOT NULL,',
-        'created_at TIMESTAMP NOT NULL DEFAULT 0,',
-        'deleted_at TIMESTAMP NULL DEFAULT NULL,',
-        'updated_at TIMESTAMP NOT NULL DEFAULT CURRENT_TIMESTAMP ON UPDATE CURRENT_TIMESTAMP,',
-        'PRIMARY KEY  (id),',
-        'UNIQUE KEY name (name)'
+      'id mediumint(9) NOT NULL AUTO_INCREMENT,',
+      'name varchar(90) NOT NULL,',
+      'type varchar(90) NOT NULL DEFAULT "default",',
+      'description varchar(250) NOT NULL,',
+      'created_at TIMESTAMP NOT NULL DEFAULT 0,',
+      'deleted_at TIMESTAMP NULL DEFAULT NULL,',
+      'updated_at TIMESTAMP NOT NULL DEFAULT CURRENT_TIMESTAMP ON UPDATE CURRENT_TIMESTAMP,',
+      'PRIMARY KEY  (id),',
+      'UNIQUE KEY name (name)'
     );
     return $this->sqlify(__FUNCTION__, $attributes);
   }
@@ -123,6 +133,7 @@ class Migrator {
       'id mediumint(9) NOT NULL AUTO_INCREMENT,',
       'subscriber_id mediumint(9) NOT NULL,',
       'segment_id mediumint(9) NOT NULL,',
+      'status varchar(12) NOT NULL DEFAULT "subscribed",',
       'created_at TIMESTAMP NOT NULL DEFAULT 0,',
       'updated_at TIMESTAMP NOT NULL DEFAULT CURRENT_TIMESTAMP ON UPDATE CURRENT_TIMESTAMP,',
       'PRIMARY KEY  (id),',
@@ -199,6 +210,41 @@ class Migrator {
     return $this->sqlify(__FUNCTION__, $attributes);
   }
 
+  function sending_queues() {
+    $attributes = array(
+      'id mediumint(9) NOT NULL AUTO_INCREMENT,',
+      'newsletter_id mediumint(9) NOT NULL,',
+      'subscribers longtext,',
+      'status varchar(12) NULL DEFAULT NULL,',
+      'priority mediumint(9) NOT NULL DEFAULT 0,',
+      'count_total mediumint(9) NOT NULL DEFAULT 0,',
+      'count_processed mediumint(9) NOT NULL DEFAULT 0,',
+      'count_to_process mediumint(9) NOT NULL DEFAULT 0,',
+      'count_failed mediumint(9) NOT NULL DEFAULT 0,',
+      'processed_at TIMESTAMP NOT NULL DEFAULT 0,',
+      'created_at TIMESTAMP NOT NULL DEFAULT 0,',
+      'updated_at TIMESTAMP NOT NULL DEFAULT CURRENT_TIMESTAMP ON UPDATE CURRENT_TIMESTAMP,',
+      'deleted_at TIMESTAMP NULL DEFAULT NULL,',
+      'PRIMARY KEY  (id)',
+    );
+    return $this->sqlify(__FUNCTION__, $attributes);
+  }
+
+  function newsletter_statistics() {
+    $attributes = array(
+      'id mediumint(9) NOT NULL AUTO_INCREMENT,',
+      'newsletter_id mediumint(9) NOT NULL,',
+      'subscriber_id mediumint(9) NOT NULL,',
+      'queue_id mediumint(9) NOT NULL,',
+      'sent_at TIMESTAMP NOT NULL DEFAULT 0,',
+      'created_at TIMESTAMP NOT NULL DEFAULT 0,',
+      'updated_at TIMESTAMP NOT NULL DEFAULT CURRENT_TIMESTAMP ON UPDATE CURRENT_TIMESTAMP,',
+      'deleted_at TIMESTAMP NULL DEFAULT NULL,',
+      'PRIMARY KEY  (id)',
+    );
+    return $this->sqlify(__FUNCTION__, $attributes);
+  }
+
   function forms() {
     $attributes = array(
       'id mediumint(9) NOT NULL AUTO_INCREMENT,',

lib/Config/Populator.php

@@ -1,120 +1,223 @@
-<?php
-namespace MailPoet\Config;
-
-if (!defined('ABSPATH')) exit;
-
-require_once(ABSPATH . 'wp-admin/includes/upgrade.php');
-
-class Populator {
-  function __construct() {
-    $this->prefix = Env::$db_prefix;
-    $this->models = array(
-      'newsletter_option_fields',
-    );
-  }
-
-  function up() {
-    global $wpdb;
-
-    $_this = $this;
-
-    $populate = function($model) use($_this, $wpdb) {
-      $fields = $_this->$model();
-      $table = $_this->prefix . $model;
-
-      array_map(function($field) use ($wpdb, $table) {
-        $column_conditions = array_map(function($key) use ($field) {
-          return $key . '=' . $field[$key];
-        }, $field);
-        if ($wpdb->get_var("SELECT COUNT(*) FROM " . $table . " WHERE " . implode(' AND ', $column_conditions)) === 0) {
-          $wpdb->insert(
-            $table,
-            $field
-          );
-        }
-      }, $fields);
-    };
-
-    array_map(array($this, 'populate'), $this->models);
-  }
-
-  function newsletter_option_fields() {
-    return array(
-      array(
-        'name' => 'event',
-        'newsletter_type' => 'welcome',
-      ),
-      array(
-        'name' => 'segment',
-        'newsletter_type' => 'welcome',
-      ),
-      array(
-        'name' => 'role',
-        'newsletter_type' => 'welcome',
-      ),
-      array(
-        'name' => 'afterTimeNumber',
-        'newsletter_type' => 'welcome',
-      ),
-      array(
-        'name' => 'afterTimeType',
-        'newsletter_type' => 'welcome',
-      ),
-
-      array(
-        'name' => 'intervalType',
-        'newsletter_type' => 'notification',
-      ),
-      array(
-        'name' => 'timeOfDay',
-        'newsletter_type' => 'notification',
-      ),
-      array(
-        'name' => 'weekDay',
-        'newsletter_type' => 'notification',
-      ),
-      array(
-        'name' => 'monthDay',
-        'newsletter_type' => 'notification',
-      ),
-      array(
-        'name' => 'nthWeekDay',
-        'newsletter_type' => 'notification',
-      ),
-    );
-  }
-
-  private function populate($model) {
-    $rows = $this->$model();
-    $table = $this->prefix . $model;
-    $_this = $this;
-
-    array_map(function($row) use ($_this, $table) {
-      if (!$_this->rowExists($table, $row)) {
-        $_this->insertRow($table, $row);
-      }
-    }, $rows);
-  }
-
-  private function rowExists($table, $columns) {
-    global $wpdb;
-
-    $conditions = array_map(function($key) use ($columns) {
-      return $key . '=%s';
-    }, array_keys($columns));
-
-    return $wpdb->get_var($wpdb->prepare(
-      "SELECT COUNT(*) FROM $table WHERE " . implode(' AND ', $conditions),
-      array_values($columns)
-    )) > 0;
-  }
-
-  private function insertRow($table, $row) {
-    global $wpdb;
-
-    return $wpdb->insert(
-      $table,
-      $row
-    );
-  }
-}
+<?php
+namespace MailPoet\Config;
+
+use MailPoet\Config\PopulatorData\Templates\FranksRoastHouseTemplate;
+use MailPoet\Config\PopulatorData\Templates\BlankTemplate;
+use MailPoet\Config\PopulatorData\Templates\WelcomeTemplate;
+use MailPoet\Config\PopulatorData\Templates\PostNotificationsBlankTemplate;
+use \MailPoet\Models\Segment;
+use \MailPoet\Segments\WP;
+use \MailPoet\Models\Setting;
+use \MailPoet\Settings\Pages;
+
+if (!defined('ABSPATH')) exit;
+
+require_once(ABSPATH . 'wp-admin/includes/upgrade.php');
+
+class Populator {
+  function __construct() {
+    $this->prefix = Env::$db_prefix;
+    $this->models = array(
+      'newsletter_option_fields',
+      'newsletter_templates',
+    );
+  }
+
+  function up() {
+    global $wpdb;
+
+    $_this = $this;
+
+    $populate = function($model) use($_this, $wpdb) {
+      $fields = $_this->$model();
+      $table = $_this->prefix . $model;
+
+      array_map(function($field) use ($wpdb, $table) {
+        $column_conditions = array_map(function($key) use ($field) {
+          return $key . '=' . $field[$key];
+        }, $field);
+        if ($wpdb->get_var("SELECT COUNT(*) FROM " . $table . " WHERE " . implode(' AND ', $column_conditions)) === 0) {
+          $wpdb->insert(
+            $table,
+            $field
+          );
+        }
+      }, $fields);
+    };
+
+    array_map(array($this, 'populate'), $this->models);
+
+    $this->createDefaultSegments();
+    $this->createDefaultSettings();
+    $this->createMailPoetPage();
+  }
+
+  private function createMailPoetPage() {
+    $pages = get_posts(array(
+      'posts_per_page' => 1,
+      'orderby' => 'date',
+      'order' => 'DESC',
+      'post_type' => 'mailpoet_page'
+    ));
+
+    $page = null;
+    if(!empty($pages)) {
+      $page = array_shift($pages);
+      if(strpos($page->post_content, '[mailpoet_page]') === false) {
+        $page = null;
+      }
+    }
+
+    if($page === null) {
+      $mailpoet_page_id = Pages::createMailPoetPage();
+      Setting::setValue('subscription.page', $mailpoet_page_id);
+    }
+  }
+
+  private function createDefaultSettings() {
+    $current_user = wp_get_current_user();
+
+    // user name
+    $user_name = '';
+    if($current_user->user_firstname) {
+      $user_name = $current_user->user_firstname;
+    }
+    if($current_user->user_lastname) {
+      if($user_name) {
+        $user_name .= ' '.$current_user->user_lastname;
+      }
+    }
+    if(!$user_name) {
+      $user_name = $current_user->display_name;
+    }
+
+    // default from name & address
+    Setting::setValue('sender', array(
+      'name' => $user_name,
+      'address' => $current_user->user_email
+    ));
+
+    // enable signup confirmation by default
+    Setting::setValue('signup_confirmation.enabled', true);
+  }
+
+  private function createDefaultSegments() {
+    // WP Users segment
+    $wp_users_segment = Segment::getWPUsers();
+
+    if($wp_users_segment === false) {
+      // create the wp users list
+      $wp_users_segment = Segment::create();
+      $wp_users_segment->hydrate(array(
+        'name' => __('WordPress Users'),
+        'description' =>
+          __('The list containing all of your WordPress users.'),
+        'type' => 'wp_users'
+      ));
+      $wp_users_segment->save();
+    }
+
+    // Synchronize WP Users
+    WP::synchronizeUsers();
+
+    // Default segment
+    if(Segment::where('type', 'default')->count() === 0) {
+      $default_segment = Segment::create();
+      $default_segment->hydrate(array(
+        'name' => __('My First List'),
+        'description' =>
+          __('The list created automatically on install of MailPoet')
+      ));
+      $default_segment->save();
+    }
+  }
+
+  function newsletter_option_fields() {
+    return array(
+      array(
+        'name' => 'event',
+        'newsletter_type' => 'welcome',
+      ),
+      array(
+        'name' => 'segment',
+        'newsletter_type' => 'welcome',
+      ),
+      array(
+        'name' => 'role',
+        'newsletter_type' => 'welcome',
+      ),
+      array(
+        'name' => 'afterTimeNumber',
+        'newsletter_type' => 'welcome',
+      ),
+      array(
+        'name' => 'afterTimeType',
+        'newsletter_type' => 'welcome',
+      ),
+
+      array(
+        'name' => 'intervalType',
+        'newsletter_type' => 'notification',
+      ),
+      array(
+        'name' => 'timeOfDay',
+        'newsletter_type' => 'notification',
+      ),
+      array(
+        'name' => 'weekDay',
+        'newsletter_type' => 'notification',
+      ),
+      array(
+        'name' => 'monthDay',
+        'newsletter_type' => 'notification',
+      ),
+      array(
+        'name' => 'nthWeekDay',
+        'newsletter_type' => 'notification',
+      ),
+    );
+  }
+
+  private function newsletter_templates() {
+    return array(
+      (new FranksRoastHouseTemplate(Env::$assets_url))->get(),
+      (new BlankTemplate(Env::$assets_url))->get(),
+      (new WelcomeTemplate(Env::$assets_url))->get(),
+      (new PostNotificationsBlankTemplate(Env::$assets_url))->get(),
+    );
+  }
+
+  private function populate($model) {
+    $rows = $this->$model();
+    $table = $this->prefix . $model;
+    $_this = $this;
+
+    array_map(function($row) use ($_this, $table) {
+      if (!$_this->rowExists($table, $row)) {
+        $_this->insertRow($table, $row);
+      }
+    }, $rows);
+  }
+
+  private function rowExists($table, $columns) {
+    global $wpdb;
+
+    $conditions = array_map(function($key) use ($columns) {
+      return $key . '=%s';
+    }, array_keys($columns));
+
+    return $wpdb->get_var($wpdb->prepare(
+      "SELECT COUNT(*) FROM $table WHERE " . implode(' AND ', $conditions),
+      array_values($columns)
+    )) > 0;
+  }
+
+  private function insertRow($table, $row) {
+    global $wpdb;
+
+    return $wpdb->insert(
+      $table,
+      $row
+    );
+  }
+}

lib/Config/PublicAPI.php

@@ -0,0 +1,53 @@
+<?php
+namespace MailPoet\Config;
+
+use MailPoet\Cron\Daemon;
+use MailPoet\Util\Helpers;
+
+if(!defined('ABSPATH')) exit;
+
+class PublicAPI {
+  public $api;
+  public $section;
+  public $action;
+  public $request_payload;
+
+  function __construct() {
+    # http://example.com/?mailpoet-api&section=&action=&request_payload=
+    $this->api = isset($_GET['mailpoet-api']) ? true : false;
+    $this->section = isset($_GET['section']) ? $_GET['section'] : false;
+    $this->action = isset($_GET['action']) ?
+      Helpers::underscoreToCamelCase($_GET['action']) :
+      false;
+    $this->request_payload = isset($_GET['request_payload']) ?
+      unserialize(base64_decode($_GET['request_payload'])) :
+      false;
+  }
+
+  function init() {
+    if(!$this->api && !$this->section) return;
+    $this->_checkAndCallMethod($this, $this->section, $terminate = true);
+  }
+
+  function queue() {
+    try {
+      $queue = new Daemon($this->request_payload);
+      $this->_checkAndCallMethod($queue, $this->action);
+    } catch(\Exception $e) {
+    }
+  }
+
+  private function _checkAndCallMethod($class, $method, $terminate = false) {
+    if(!method_exists($class, $method)) {
+      if(!$terminate) return;
+      header('HTTP/1.0 404 Not Found');
+      exit;
+    }
+    call_user_func(
+      array(
+        $class,
+        $method
+      )
+    );
+  }
+}

lib/Config/Shortcodes.php

@@ -0,0 +1,121 @@
+<?php
+namespace MailPoet\Config;
+use \MailPoet\Models\Newsletter;
+use \MailPoet\Models\Subscriber;
+use \MailPoet\Models\SubscriberSegment;
+
+class Shortcodes {
+  function __construct() {
+  }
+
+  function init() {
+    // form widget shortcode
+    add_shortcode('mailpoet_form', array($this, 'formWidget'));
+    add_shortcode('wysija_form', array($this, 'formWidget'));
+
+    // subscribers count shortcode
+    add_shortcode('mailpoet_subscribers_count', array(
+      $this, 'getSubscribersCount'
+    ));
+    add_shortcode('wysija_subscribers_count', array(
+      $this, 'getSubscribersCount'
+    ));
+
+    // archives page
+    add_shortcode('mailpoet_archive', array(
+      $this, 'getArchive'
+    ));
+
+    add_filter('mailpoet_archive_date', array(
+      $this, 'renderArchiveDate'
+    ), 2);
+    add_filter('mailpoet_archive_subject', array(
+      $this, 'renderArchiveSubject'
+    ), 2);
+  }
+
+  function formWidget($params = array()) {
+    // IMPORTANT: fixes conflict with MagicMember
+    remove_shortcode('user_list');
+
+    if(isset($params['id']) && (int)$params['id'] > 0) {
+      $form_widget = new \MailPoet\Form\Widget();
+      return $form_widget->widget(array(
+        'form' => (int)$params['id'],
+        'form_type' => 'shortcode'
+      ));
+    }
+  }
+
+  function getSubscribersCount($params) {
+    if(!empty($params['segments'])) {
+      $segment_ids = array_map(function($segment_id) {
+        return (int)trim($segment_id);
+      }, explode(',', $params['segments']));
+    }
+
+    if(empty($segment_ids)) {
+      return Subscriber::filter('subscribed')->count();
+    } else {
+      return SubscriberSegment::whereIn('segment_id', $segment_ids)
+        ->select('subscriber_id')->distinct()
+        ->filter('subscribed')
+        ->findResultSet()->count();
+    }
+  }
+
+  function getArchive($params) {
+    if(!empty($params['segments'])) {
+      $segment_ids = array_map(function($segment_id) {
+        return (int)trim($segment_id);
+      }, explode(',', $params['segments']));
+    }
+
+    $newsletters = array();
+    $html = '';
+
+    // TODO: needs more advanced newsletters in order to finish
+    $newsletters = Newsletter::limit(10)->orderByDesc('created_at')->findMany();
+
+    if(empty($newsletters)) {
+      return apply_filters(
+        'mailpoet_archive_no_newsletters',
+        __('Oops! There are no newsletters to display.')
+      );
+    } else {
+      $title = apply_filters('mailpoet_archive_title', '');
+      if(!empty($title)) {
+        $html .= '<h3 class="mailpoet_archive_title">'.$title.'</h3>';
+      }
+
+      $html .= '<ul class="mailpoet_archive">';
+      foreach($newsletters as $newsletter) {
+        $html .= '<li>'.
+          '<span class="mailpoet_archive_date">'.
+            apply_filters('mailpoet_archive_date', $newsletter).
+          '</span>
+          <span class="mailpoet_archive_subject">'.
+            apply_filters('mailpoet_archive_subject', $newsletter).
+          '</span>
+        </li>';
+      }
+      $html .= '</ul>';
+    }
+    return $html;
+  }
+
+  function renderArchiveDate($newsletter) {
+    return date_i18n(
+      get_option('date_format'),
+      strtotime($newsletter->created_at)
+    );
+  }
+
+  function renderArchiveSubject($newsletter) {
+    return '<a href="TODO" target="_blank" title="'
+      .esc_attr(__('Preview in new tab')).'">'
+      .esc_attr($newsletter->subject).
+    '</a>';
+  }
+
+}

lib/Config/Widget.php

@@ -1,6 +1,5 @@
 <?php
 namespace MailPoet\Config;
-use \MailPoet\Models\Subscriber;
 use \MailPoet\Util\Security;
 
 if(!defined('ABSPATH')) exit;
@@ -10,30 +9,17 @@ class Widget {
   }
 
   function init() {
-    add_action('widgets_init', array($this, 'registerWidget'));
+    $this->registerWidget();
 
     if(!is_admin()) {
-      //$this->setupActions();
-      add_action('widgets_init', array($this, 'setupDependencies'));
+      $this->setupDependencies();
     } else {
-      add_action('widgets_init', array($this, 'setupAdminDependencies'));
+      $this->setupAdminDependencies();
     }
   }
 
   function registerWidget() {
     register_widget('\MailPoet\Form\Widget');
-
-    // subscribers count shortcode
-    add_shortcode('mailpoet_subscribers_count', array(
-      $this, 'getSubscribersCount'
-    ));
-    add_shortcode('wysija_subscribers_count', array(
-      $this, 'getSubscribersCount'
-    ));
-  }
-
-  function getSubscribersCount($params) {
-    return Subscriber::filter('subscribed')->count();
   }
 
   function setupDependencies() {
@@ -61,21 +47,30 @@ class Widget {
   }
 
   function setupAdminDependencies() {
-    wp_enqueue_script('mailpoet_vendor',
-      Env::$assets_url.'/js/vendor.js',
-      array(),
-      Env::$version,
-      true
-    );
+    if(
+      empty($_GET['page'])
+      or
+      isset($_GET['page']) && strpos($_GET['page'], 'mailpoet') === false
+    ) {
+      wp_enqueue_script('mailpoet_vendor',
+        Env::$assets_url.'/js/vendor.js',
+        array(),
+        Env::$version,
+        true
+      );
 
-    wp_enqueue_script('mailpoet_admin',
-      Env::$assets_url.'/js/mailpoet.js',
-      array(),
-      Env::$version,
-      true
-    );
+      wp_enqueue_script('mailpoet_admin',
+        Env::$assets_url.'/js/mailpoet.js',
+        array(),
+        Env::$version,
+        true
+      );
+    }
   }
 
+  // TODO: extract this method into an Initializer
+  // - the "ajax" part might probably be useless
+  // - the "post" (non-ajax) part needs to be redone properly
   function setupActions() {
     // ajax requests
     add_action(

lib/Cron/BootStrapMenu.php

@@ -0,0 +1,36 @@
+<?php
+namespace MailPoet\Cron;
+
+use Carbon\Carbon;
+use MailPoet\Models\Setting;
+
+class BootStrapMenu {
+  function __construct() {
+    $this->daemon = Setting::where('name', 'cron_daemon')
+      ->findOne();
+  }
+
+  function bootStrap() {
+    return ($this->daemon) ?
+      array_merge(
+        array(
+          'timeSinceStart' =>
+            Carbon::createFromFormat(
+              'Y-m-d H:i:s',
+              $this->daemon->created_at,
+              'UTC'
+            )
+              ->diffForHumans(),
+          'timeSinceUpdate' =>
+            Carbon::createFromFormat(
+              'Y-m-d H:i:s',
+              $this->daemon->updated_at,
+              'UTC'
+            )
+              ->diffForHumans()
+        ),
+        json_decode($this->daemon->value, true)
+      ) :
+      "false";
+  }
+}