diff --git a/assets/js/src/form/fields/select.jsx b/assets/js/src/form/fields/select.jsx index 98ac8d905f..57803866b0 100644 --- a/assets/js/src/form/fields/select.jsx +++ b/assets/js/src/form/fields/select.jsx @@ -1,4 +1,5 @@ import React from 'react' +import _ from 'underscore' const FormFieldSelect = React.createClass({ render() { @@ -8,6 +9,7 @@ const FormFieldSelect = React.createClass({ let filter = false; let placeholder = false; + let sortBy = false; if (this.props.field.placeholder !== undefined) { placeholder = ( @@ -19,7 +21,28 @@ const FormFieldSelect = React.createClass({ filter = this.props.field.filter; } - const options = Object.keys(this.props.field.values).map( + if (_.isFunction(this.props.field.sortBy)) { + sortBy = this.props.field.sortBy; + } + + let keys; + if (sortBy) { + // Extract keys from sorted [key, value] select value pairs, sorted by + // provided sorting order. + keys = + _.map( + _.sortBy( + _.pairs(this.props.field.values), + (item) => sortBy(item[0], item[1]) + ), + (item) => item[0] + ); + console.log(JSON.stringify(this.props.field.values), keys); + } else { + keys = Object.keys(this.props.field.values) + } + + const options = keys.map( (value, index) => { if (filter !== false && filter(this.props.item, value) === false) { @@ -51,4 +74,4 @@ const FormFieldSelect = React.createClass({ } }); -module.exports = FormFieldSelect; \ No newline at end of file +module.exports = FormFieldSelect; diff --git a/assets/js/src/newsletters/send.jsx b/assets/js/src/newsletters/send.jsx index 47045c8da5..9b3dbafeeb 100644 --- a/assets/js/src/newsletters/send.jsx +++ b/assets/js/src/newsletters/send.jsx @@ -34,15 +34,20 @@ define( }; }, getFieldsByNewsletter: function(newsletter) { + var type = this.getSubtype(newsletter); + return type.getFields(newsletter); + }, + getSendButtonOptions: function() { + var type = this.getSubtype(this.state.item); + return type.getSendButtonOptions(this.state.item); + }, + getSubtype: function(newsletter) { switch(newsletter.type) { case 'notification': return NotificationNewsletterFields; case 'welcome': return WelcomeNewsletterFields; default: return StandardNewsletterFields; } }, - isAutomatedNewsletter: function() { - return this.state.item.type !== 'standard'; - }, isValid: function() { return jQuery('#mailpoet_newsletter').parsley().isValid(); }, @@ -128,7 +133,7 @@ define( this.context.router.push(`/${ this.state.item.type || '' }`); }); }, - handleRedirectToEditor: function(e) { + handleRedirectToDesign: function(e) { e.preventDefault(); var redirectTo = e.target.href; @@ -188,10 +193,9 @@ define( className="button button-primary" type="button" onClick={ this.handleSend } - value={ - this.isAutomatedNewsletter() - ? MailPoet.I18n.t('activate') - : MailPoet.I18n.t('send')} /> + value={MailPoet.I18n.t('send')} + {...this.getSendButtonOptions()} + />   + onClick={this.handleRedirectToDesign}> {MailPoet.I18n.t('goBackToDesign')} .

diff --git a/assets/js/src/newsletters/send/notification.jsx b/assets/js/src/newsletters/send/notification.jsx index de76cc2b4e..42dd3cd7c2 100644 --- a/assets/js/src/newsletters/send/notification.jsx +++ b/assets/js/src/newsletters/send/notification.jsx @@ -95,6 +95,15 @@ define( } ]; - return fields; + return { + getFields: function(newsletter) { + return fields; + }, + getSendButtonOptions: function(newsletter) { + return { + value: MailPoet.I18n.t('activate') + }; + }, + }; } ); diff --git a/assets/js/src/newsletters/send/standard.jsx b/assets/js/src/newsletters/send/standard.jsx index b36b022059..1d05e3e37f 100644 --- a/assets/js/src/newsletters/send/standard.jsx +++ b/assets/js/src/newsletters/send/standard.jsx @@ -401,6 +401,29 @@ define( } ]; - return fields; + return { + getFields: function(newsletter) { + return fields; + }, + getSendButtonOptions: function(newsletter) { + newsletter = newsletter || {}; + + var isScheduled = + typeof newsletter.options === 'object' + && newsletter.options.isScheduled === '1', + options = { + value: isScheduled + ? MailPoet.I18n.t('schedule') + : MailPoet.I18n.t('send') + }; + + if (newsletter.status === 'sent' + || newsletter.status === 'sending') { + options['disabled'] = 'disabled'; + } + + return options; + }, + }; } ); diff --git a/assets/js/src/newsletters/send/welcome.jsx b/assets/js/src/newsletters/send/welcome.jsx index cb8940ceb8..d7983d8a1b 100644 --- a/assets/js/src/newsletters/send/welcome.jsx +++ b/assets/js/src/newsletters/send/welcome.jsx @@ -71,7 +71,16 @@ define( } ]; - return fields; + return { + getFields: function(newsletter) { + return fields; + }, + getSendButtonOptions: function(newsletter) { + return { + value: MailPoet.I18n.t('activate') + }; + }, + }; } ); diff --git a/assets/js/src/newsletters/types/welcome/scheduling.jsx b/assets/js/src/newsletters/types/welcome/scheduling.jsx index f552e2f3d0..849220a816 100644 --- a/assets/js/src/newsletters/types/welcome/scheduling.jsx +++ b/assets/js/src/newsletters/types/welcome/scheduling.jsx @@ -36,7 +36,8 @@ const availableSegmentValues = _.object(_.map( )); const segmentField = { name: 'segment', - values: availableSegmentValues + values: availableSegmentValues, + sortBy: (key, value) => value.toLowerCase() }; const roleField = { diff --git a/views/newsletters.html b/views/newsletters.html index e475e9f847..a83e0d368a 100644 --- a/views/newsletters.html +++ b/views/newsletters.html @@ -165,7 +165,8 @@ 'orSimply': __('or simply'), 'goBackToDesign': __('go back to the Design page'), 'websiteTimeIs': __("Your website’s time is"), - 'noScheduledDateError': __('Please enter a scheduled date'), + 'noScheduledDateError': __('Please enter the scheduled date'), + 'schedule': __('Schedule'), 'close': __('Close'), 'today': __('Today'),