Refactored scheduling options for React (semi-converted to ES6 too)

- fixed issue with Pausing sending (missing self::)
2016-06-17 13:05:46 +02:00
parent 90c3f0e4e4
commit 269ddae93a
6 changed files with 396 additions and 437 deletions
--- a/assets/js/src/newsletters/listings/notification.jsx
+++ b/assets/js/src/newsletters/listings/notification.jsx
@ -9,6 +9,13 @@ import classNames from 'classnames'
 import jQuery from 'jquery'
 import MailPoet from 'mailpoet'

+import {
+  timeOfDayValues,
+  weekDayValues,
+  monthDayValues,
+  nthWeekDayValues
+} from 'newsletters/scheduling/common.jsx'
+
 const messages = {
  onTrash(response) {
    const count = ~~response;
@ -179,63 +186,6 @@ const NewsletterListNotification = React.createClass({
    );
  },
  renderSettings: function(newsletter) {
-    /// TO REFACTOR in order to avoid duplication with */scheduling.jsx
-    /// ========================================================================
-    const SECONDS_IN_DAY = 86400;
-    const TIME_STEP_SECONDS = 3600;
-    const numberOfTimeSteps = SECONDS_IN_DAY / TIME_STEP_SECONDS;
-
-    const timeOfDayValues = _.object(_.map(
-      _.times(numberOfTimeSteps,function(step) {
-        return step * TIME_STEP_SECONDS;
-      }), function(seconds) {
-        let date = new Date(null);
-        date.setSeconds(seconds);
-        const timeLabel = date.toISOString().substr(11, 5);
-        return [seconds, timeLabel];
-      })
-    );
-
-    const weekDayValues = {
-      0: MailPoet.I18n.t('sunday'),
-      1: MailPoet.I18n.t('monday'),
-      2: MailPoet.I18n.t('tuesday'),
-      3: MailPoet.I18n.t('wednesday'),
-      4: MailPoet.I18n.t('thursday'),
-      5: MailPoet.I18n.t('friday'),
-      6: MailPoet.I18n.t('saturday')
-    };
-
-    const NUMBER_OF_DAYS_IN_MONTH = 28;
-    const monthDayValues = _.object(
-      _.map(
-        _.times(NUMBER_OF_DAYS_IN_MONTH, function(day) {
-          return day;
-        }), function(day) {
-          const labels = {
-            0: MailPoet.I18n.t('first'),
-            1: MailPoet.I18n.t('second'),
-            2: MailPoet.I18n.t('third')
-          };
-          let label;
-          if (labels[day] !== undefined) {
-            label = labels[day];
-          } else {
-            label = MailPoet.I18n.t('nth').replace("%$1d", day + 1);
-          }
-          return [day, label];
-        }
-      )
-    );
-
-    const nthWeekDayValues = {
-      '1': MailPoet.I18n.t('first'),
-      '2': MailPoet.I18n.t('second'),
-      '3': MailPoet.I18n.t('third'),
-      'L': MailPoet.I18n.t('last')
-    };
-    /// ========================================================================
-
    let sendingFrequency;
    let sendingToSegments;

--- a/assets/js/src/newsletters/scheduling/common.jsx
+++ b/assets/js/src/newsletters/scheduling/common.jsx
@ -0,0 +1,80 @@
+import _ from 'underscore'
+import MailPoet from 'mailpoet'
+
+// welcome emails
+const _timeDelayValues = {
+  'immediate': MailPoet.I18n.t('delayImmediately'),
+  'hours': MailPoet.I18n.t('delayHoursAfter'),
+  'days': MailPoet.I18n.t('delayDaysAfter'),
+  'weeks': MailPoet.I18n.t('delayWeeksAfter'),
+};
+
+const _intervalValues = {
+  'daily': MailPoet.I18n.t('daily'),
+  'weekly': MailPoet.I18n.t('weekly'),
+  'monthly': MailPoet.I18n.t('monthly'),
+  'nthWeekDay': MailPoet.I18n.t('monthlyEvery'),
+  'immediately': MailPoet.I18n.t('immediately'),
+};
+
+// notification emails
+const SECONDS_IN_DAY = 86400;
+const TIME_STEP_SECONDS = 3600;
+const numberOfTimeSteps = SECONDS_IN_DAY / TIME_STEP_SECONDS;
+
+const _timeOfDayValues = _.object(_.map(
+  _.times(numberOfTimeSteps,function(step) {
+    return step * TIME_STEP_SECONDS;
+  }), function(seconds) {
+    let date = new Date(null);
+    date.setSeconds(seconds);
+    const timeLabel = date.toISOString().substr(11, 5);
+    return [seconds, timeLabel];
+  })
+);
+
+const _weekDayValues = {
+  0: MailPoet.I18n.t('sunday'),
+  1: MailPoet.I18n.t('monday'),
+  2: MailPoet.I18n.t('tuesday'),
+  3: MailPoet.I18n.t('wednesday'),
+  4: MailPoet.I18n.t('thursday'),
+  5: MailPoet.I18n.t('friday'),
+  6: MailPoet.I18n.t('saturday')
+};
+
+const NUMBER_OF_DAYS_IN_MONTH = 28;
+const _monthDayValues = _.object(
+  _.map(
+    _.times(NUMBER_OF_DAYS_IN_MONTH, function(day) {
+      return day;
+    }), function(day) {
+      const labels = {
+        0: MailPoet.I18n.t('first'),
+        1: MailPoet.I18n.t('second'),
+        2: MailPoet.I18n.t('third')
+      };
+      let label;
+      if (labels[day] !== undefined) {
+        label = labels[day];
+      } else {
+        label = MailPoet.I18n.t('nth').replace("%$1d", day + 1);
+      }
+      return [day, label];
+    }
+  )
+);
+
+const _nthWeekDayValues = {
+  '1': MailPoet.I18n.t('first'),
+  '2': MailPoet.I18n.t('second'),
+  '3': MailPoet.I18n.t('third'),
+  'L': MailPoet.I18n.t('last')
+};
+
+export { _timeDelayValues as timeDelayValues };
+export { _intervalValues as intervalValues };
+export { _timeOfDayValues as timeOfDayValues };
+export { _weekDayValues as weekDayValues };
+export { _monthDayValues as monthDayValues };
+export { _nthWeekDayValues as nthWeekDayValues };
--- a/assets/js/src/newsletters/types/notification/notification.jsx
+++ b/assets/js/src/newsletters/types/notification/notification.jsx
@ -18,7 +18,6 @@ define(

    var field = {
      name: 'options',
-      label: 'Periodicity',
      type: 'reactComponent',
      component: Scheduling,
    };
--- a/assets/js/src/newsletters/types/notification/scheduling.jsx
+++ b/assets/js/src/newsletters/types/notification/scheduling.jsx
@ -1,100 +1,48 @@
-define(
-  [
-    'underscore',
-    'react',
-    'react-router',
-    'mailpoet',
-    'form/fields/select.jsx'
-  ],
-  function(
-    _,
-    React,
-    Router,
-    MailPoet,
-    Select
-  ) {
+import _ from 'underscore'
+import React from 'react'
+import MailPoet from 'mailpoet'
+import Select from 'form/fields/select.jsx'
+import {
+  intervalValues,
+  timeOfDayValues,
+  weekDayValues,
+  monthDayValues,
+  nthWeekDayValues
+} from 'newsletters/scheduling/common.jsx'

-    var intervalField = {
+const intervalField = {
  name: 'intervalType',
-      values: {
-        'daily': MailPoet.I18n.t('daily'),
-        'weekly': MailPoet.I18n.t('weekly'),
-        'monthly': MailPoet.I18n.t('monthly'),
-        'nthWeekDay': MailPoet.I18n.t('monthlyEvery'),
-        'immediately': MailPoet.I18n.t('immediately'),
-      },
-    };
+  values: intervalValues
+};

-    var SECONDS_IN_DAY = 86400;
-    var TIME_STEP_SECONDS = 3600; // Default: 3600
-    var numberOfTimeSteps = SECONDS_IN_DAY / TIME_STEP_SECONDS;
-    var timeOfDayValues = _.object(_.map(
-      _.times(numberOfTimeSteps, function(step) { return step * TIME_STEP_SECONDS; }),
-      function(seconds) {
-        var date = new Date(null);
-        date.setSeconds(seconds);
-        var timeLabel = date.toISOString().substr(11, 5);
-        return [seconds, timeLabel];
-      }
-    ));
-    var timeOfDayField = {
+const timeOfDayField = {
  name: 'timeOfDay',
-      values: timeOfDayValues,
-    };
+  values: timeOfDayValues
+};

-    var weekDayField = {
+const weekDayField = {
  name: 'weekDay',
-      values: {
-        0: MailPoet.I18n.t('sunday'),
-        1: MailPoet.I18n.t('monday'),
-        2: MailPoet.I18n.t('tuesday'),
-        3: MailPoet.I18n.t('wednesday'),
-        4: MailPoet.I18n.t('thursday'),
-        5: MailPoet.I18n.t('friday'),
-        6: MailPoet.I18n.t('saturday')
-      },
-    };
+  values: weekDayValues
+};

-    var NUMBER_OF_DAYS_IN_MONTH = 28; // 28 for compatibility with MP2
-    var monthDayField = {
+const monthDayField = {
  name: 'monthDay',
-      values: _.object(_.map(
-        _.times(NUMBER_OF_DAYS_IN_MONTH, function(day) { return day; }),
-        function(day) {
-          var labels = {
-            0: MailPoet.I18n.t('first'),
-            1: MailPoet.I18n.t('second'),
-            2: MailPoet.I18n.t('third')
-          },
-            label;
-          if (labels[day] !== undefined) {
-            label = labels[day];
-          } else {
-            label = MailPoet.I18n.t('nth').replace("%$1d", day + 1);
-          }
+  values: monthDayValues
+};

-          return [day, label];
-        },
-      )),
-    };
-
-    var nthWeekDayField = {
+const nthWeekDayField = {
  name: 'nthWeekDay',
-      values: {
-        '1': MailPoet.I18n.t('first'),
-        '2': MailPoet.I18n.t('second'),
-        '3': MailPoet.I18n.t('third'),
-        'L': MailPoet.I18n.t('last'),
-      },
-    };
+  values: nthWeekDayValues
+};

-    var NotificationScheduling = React.createClass({
+const NotificationScheduling = React.createClass({
  _getCurrentValue: function() {
-        return this.props.item[this.props.field.name] || {};
+    return (this.props.item[this.props.field.name] || {});
  },
  handleValueChange: function(name, value) {
-        var oldValue = this._getCurrentValue(),
-            newValue = {};
+    const oldValue = this._getCurrentValue();
+    let newValue = {};
+
    newValue[name] = value;

    return this.props.onValueChange({
@ -135,12 +83,11 @@ define(
    );
  },
  render: function() {
-        var value = this._getCurrentValue(),
-            timeOfDaySelection,
-            weekDaySelection,
-            monthDaySelection,
-            nthWeekDaySelection;
-
+    const value = this._getCurrentValue();
+    let timeOfDaySelection;
+    let weekDaySelection;
+    let monthDaySelection;
+    let nthWeekDaySelection;

    if (value.intervalType !== 'immediately') {
      timeOfDaySelection = (
@ -151,8 +98,7 @@ define(
      );
    }

-        if (value.intervalType === 'weekly'
-            || value.intervalType === 'nthWeekDay') {
+    if (value.intervalType === 'weekly' || value.intervalType === 'nthWeekDay') {
      weekDaySelection = (
        <Select
          field={weekDayField}
@ -192,9 +138,7 @@ define(
        {timeOfDaySelection}
      </div>
    );
-      },
-    });
-
-    return NotificationScheduling;
  }
-);
+});
+
+module.exports = NotificationScheduling;
--- a/assets/js/src/newsletters/types/welcome/scheduling.jsx
+++ b/assets/js/src/newsletters/types/welcome/scheduling.jsx
@ -1,77 +1,65 @@
-define(
-  [
-    'underscore',
-    'react',
-    'react-router',
-    'mailpoet',
-    'form/fields/select.jsx',
-    'form/fields/text.jsx'
-  ],
-  function(
-    _,
-    React,
-    Router,
-    MailPoet,
-    Select,
-    Text
-  ) {
+import _ from 'underscore'
+import React from 'react'
+import MailPoet from 'mailpoet'
+import Select from 'form/fields/select.jsx'
+import Text from 'form/fields/text.jsx'
+import {
+  timeDelayValues,
+  intervalValues
+} from 'newsletters/scheduling/common.jsx'

-    var availableRoles = window.mailpoet_roles || {};
-    var availableSegments = window.mailpoet_segments || {};
+const availableRoles = window.mailpoet_roles || {};
+const availableSegments = window.mailpoet_segments || {};

-    var events = {
+const events = {
  name: 'event',
  values: {
    'segment': MailPoet.I18n.t('onSubscriptionToList'),
    'user': MailPoet.I18n.t('onWPUserRegistration'),
  }
-    };
+};

-    var availableSegmentValues = _.object(_.map(
+const availableSegmentValues = _.object(_.map(
  availableSegments,
  function(segment) {
-        var name = segment.name;
+    let name = segment.name;
    if (segment.subscribers > 0) {
      name += ' (%$1s)'.replace('%$1s', parseInt(segment.subscribers).toLocaleString());
    }
    return [segment.id, name];
  }
-    ));
-    var segmentField = {
+));
+const segmentField = {
  name: 'segment',
-      values: availableSegmentValues,
-    };
+  values: availableSegmentValues
+};

-    var roleField = {
+const roleField = {
  name: 'role',
-      values: availableRoles,
-    };
+  values: availableRoles
+};

-    var afterTimeNumberField = {
+const afterTimeNumberField = {
  name: 'afterTimeNumber',
-      size: 3,
-    };
+  size: 3
+};

-    var afterTimeTypeField = {
+const afterTimeTypeField = {
  name: 'afterTimeType',
-      values: {
-        'immediate': MailPoet.I18n.t('delayImmediately'),
-        'hours': MailPoet.I18n.t('delayHoursAfter'),
-        'days': MailPoet.I18n.t('delayDaysAfter'),
-        'weeks': MailPoet.I18n.t('delayWeeksAfter'),
-      }
-    };
+  values: timeDelayValues
+};

-    var WelcomeScheduling = React.createClass({
+const WelcomeScheduling = React.createClass({
  contextTypes: {
    router: React.PropTypes.object.isRequired
  },
  _getCurrentValue: function() {
-        return this.props.item[this.props.field.name] || {};
+    return (this.props.item[this.props.field.name] || {});
  },
  handleValueChange: function(name, value) {
-        var oldValue = this._getCurrentValue(),
-            newValue = {};
+    const oldValue = this._getCurrentValue();
+    let newValue = {};
+
    newValue[name] = value;

    return this.props.onValueChange({
@ -117,13 +105,13 @@ define(
      action: 'create',
      data: {
        type: 'welcome',
-            options: this.state,
-          },
+        options: this.state
+      }
    }).done(function(response) {
-          if(response.result && response.newsletter.id) {
+      if (response.result && response.newsletter.id) {
        this.showTemplateSelection(response.newsletter.id);
      } else {
-            if(response.errors.length > 0) {
+        if (response.errors.length > 0) {
          response.errors.map(function(error) {
            MailPoet.Notice.error(error);
          });
@ -132,57 +120,55 @@ define(
    }.bind(this));
  },
  showTemplateSelection: function(newsletterId) {
-        this.context.router.push(`/template/${newsletterId}`);
+    this.context.router.push(`/template/${ newsletterId }`);
  },
  render: function() {
-        var value = this._getCurrentValue(),
-            roleSegmentSelection, timeNumber;
+    const value = this._getCurrentValue();
+    let roleSegmentSelection;
+    let timeNumber;

    if (value.event === 'user') {
      roleSegmentSelection = (
        <Select
-              field={roleField}
-              item={this._getCurrentValue()}
-              onValueChange={this.handleRoleChange} />
+          field={ roleField }
+          item={ this._getCurrentValue() }
+          onValueChange={ this.handleRoleChange } />
      );
    } else {
      roleSegmentSelection = (
        <Select
-              field={segmentField}
-              item={this._getCurrentValue()}
-              onValueChange={this.handleSegmentChange} />
+          field={ segmentField }
+          item={ this._getCurrentValue() }
+          onValueChange={ this.handleSegmentChange } />
      );
    }
    if (value.afterTimeType !== 'immediate') {
      timeNumber = (
        <Text
-              field={afterTimeNumberField}
-              item={this._getCurrentValue()}
-              onValueChange={this.handleAfterTimeNumberChange} />
+          field={ afterTimeNumberField }
+          item={ this._getCurrentValue() }
+          onValueChange={ this.handleAfterTimeNumberChange } />
      );
    }

    return (
      <div>
        <Select
-              field={events}
-              item={this._getCurrentValue()}
-              onValueChange={this.handleEventChange} />
+          field={ events }
+          item={ this._getCurrentValue() }
+          onValueChange={ this.handleEventChange } />

-            {roleSegmentSelection}
+        { roleSegmentSelection }

-            {timeNumber}
+        { timeNumber }

        <Select
-              field={afterTimeTypeField}
-              item={this._getCurrentValue()}
-              onValueChange={this.handleAfterTimeTypeChange}/>
+          field={ afterTimeTypeField }
+          item={ this._getCurrentValue() }
+          onValueChange={ this.handleAfterTimeTypeChange } />
      </div>
    );
  },
-    });
-
-    return WelcomeScheduling;
-  }
-);
+});

+module.exports = WelcomeScheduling;
--- a/lib/Models/SendingQueue.php
+++ b/lib/Models/SendingQueue.php
@ -18,7 +18,7 @@ class SendingQueue extends Model {
    if($this->count_processed === $this->count_total) {
      return false;
    } else {
-      $this->set('status', STATUS_PAUSED);
+      $this->set('status', self::STATUS_PAUSED);
      $this->save();
      return ($this->getErrors() === false && $this->id() > 0);
    }