Cavemanon/piratepoet
7
Fork 0
Code Pull Requests Actions Releases 16 Activity

MailPoet.Date to handle localized dates and times

Browse Source
This commit is contained in:
Jonathan Labreuille
2016-02-22 15:21:23 +01:00
parent 2ec6bc8c99
commit f56bee76f2
9 changed files with 158 additions and 20 deletions
Download Patch File Download Diff File Expand all files Collapse all files

136
assets/js/src/date.js Normal file
View File

@ -0,0 +1,136 @@
define('date',
[
'mailpoet',
'jquery',
'moment'
], function(
MailPoet,
jQuery,
Moment
) {
'use strict';
MailPoet.Date = {
version: 0.1,
options: {},
defaults: {
offset: 0,
format: 'F, d Y H:i:s'
},
init: function(options) {
options = options || {};
// set UTC offset
if (
options.offset === undefined
&& window.mailpoet_date_offset !== undefined
) {
options.offset = window.mailpoet_date_offset;
}
// set date format
if (
options.format === undefined
&& window.mailpoet_date_format !== undefined
) {
options.format = window.mailpoet_date_format;
}
// merge options
this.options = jQuery.extend({}, this.defaults, options);
return this;
},
format: function(date, options) {
this.init(options);
return Moment.utc(date)
.local()
.format(this.convertFormat(this.options.format));
},
short: function(date) {
return this.format(date, {
format: 'F, j Y'
});
},
full: function(date) {
return this.format(date, {
format: 'F, j Y H:i:s'
});
},
time: function(date) {
return this.format(date, {
format: 'H:i:s'
});
},
convertFormat: function(format) {
const format_mappings = {
date: {
D: 'ddd',
l: 'dddd',
d: 'DD',
j: 'D',
z: 'DDDD',
N: 'E',
S: '',
M: 'MMM',
F: 'MMMM',
m: 'MM',
n: '',
t: '',
y: 'YY',
Y: 'YYYY',
H: 'HH',
h: 'hh',
g: 'h',
A: 'A',
i: 'mm',
s: 'ss',
T: 'z',
O: 'ZZ',
w: 'd',
W: 'WW'
},
strftime: {
a: 'ddd',
A: 'dddd',
b: 'MMM',
B: 'MMMM',
d: 'DD',
e: 'D',
F: 'YYYY-MM-DD',
H: 'HH',
I: 'hh',
j: 'DDDD',
k: 'H',
l: 'h',
m: 'MM',
M: 'mm',
p: 'A',
S: 'ss',
u: 'E',
w: 'd',
W: 'WW',
y: 'YY',
Y: 'YYYY',
z: 'ZZ',
Z: 'z'
}
};
const replacements = format_mappings['date'];
let outputFormat = '';
Object.keys(replacements).forEach(function (key) {
if (format.contains(key)) {
format = format.replace(key, '%'+key);
}
});
outputFormat = format;
Object.keys(replacements).forEach(function(key) {
if (outputFormat.contains('%'+key)) {
outputFormat = outputFormat.replace('%'+key, replacements[key]);
}
});
return outputFormat;
}
};
});

2
assets/js/src/forms/list.jsx
View File

@ -146,7 +146,7 @@ const FormList = React.createClass({
{ segments }
</td>
<td className="column-date" data-colname="Created on">
<abbr>{ form.created_at }</abbr>
<abbr>{ MailPoet.Date.full(form.created_at) }</abbr>
</td>
</div>
);

4
assets/js/src/newsletters/list.jsx
View File

@ -229,10 +229,10 @@ define(
{ segments }
</td>
<td className="column-date" data-colname="Subscribed on">
<abbr>{ newsletter.created_at }</abbr>
<abbr>{ MailPoet.Date.full(newsletter.created_at) }</abbr>
</td>
<td className="column-date" data-colname="Last modified on">
<abbr>{ newsletter.updated_at }</abbr>
<abbr>{ MailPoet.Date.full(newsletter.updated_at) }</abbr>
</td>
</div>
);

2
assets/js/src/segments/list.jsx
View File

@ -190,7 +190,7 @@ const SegmentList = React.createClass({
<abbr>{ segment.subscribers_count.unsubscribed || 0 }</abbr>
</td>
<td className="column-date" data-colname="Created on">
<abbr>{ segment.created_at }</abbr>
<abbr>{ MailPoet.Date.full(segment.created_at) }</abbr>
</td>
</div>
);

11
assets/js/src/subscribers/form.jsx
View File

@ -3,15 +3,13 @@ define(
'react',
'react-router',
'mailpoet',
'form/form.jsx',
'moment'
'form/form.jsx'
],
function(
React,
Router,
MailPoet,
Form,
Moment
Form
) {
var fields = [
{
@ -69,9 +67,8 @@ define(
label = segment.name;
if (subscription.status === 'unsubscribed') {
const unsubscribed_at = Moment(subscription.updated_at)
.utcOffset(parseInt(mailpoet_date_offset))
.format('ddd, D MMM YYYY HH:mm:ss');
const unsubscribed_at = MailPoet.Date
.format(subscription.updated_at);
label += ' (Unsubscribed on '+unsubscribed_at+')';
}
}

4
assets/js/src/subscribers/list.jsx
View File

@ -331,10 +331,10 @@ const SubscriberList = React.createClass({
{ segments }
</td>
<td className="column-date" data-colname="Subscribed on">
<abbr>{ subscriber.created_at }</abbr>
<abbr>{ MailPoet.Date.full(subscriber.created_at) }</abbr>
</td>
<td className="column-date" data-colname="Last modified on">
<abbr>{ subscriber.updated_at }</abbr>
<abbr>{ MailPoet.Date.full(subscriber.updated_at) }</abbr>
</td>
</div>
);

4
views/layout.html
View File

@ -32,6 +32,10 @@
'admin.js'
)%>
<script type="text/javascript">
var mailpoet_date_format = "<%= get_option('date_format') %>";
</script>
<script>
HS.beacon.config({
icon: 'message',

2
views/subscribers/subscribers.html
View File

@ -20,7 +20,5 @@
var mailpoet_segments = <%= json_encode(segments) %>;
var mailpoet_custom_fields = <%= json_encode(custom_fields) %>;
var mailpoet_month_names = <%= json_encode(month_names) %>;
var mailpoet_date_format = "<%= get_option('date_format') %>";
var mailpoet_date_offset = "<%= get_option('gmt_offset') %>";
</script>
<% endblock %>

13
webpack.config.js
View File

@ -91,10 +91,14 @@ baseConfig = {
config.push(_.extend({}, baseConfig, {
name: 'admin',
entry: {
vendor: ['handlebars', 'handlebars_helpers'],
vendor: [
'handlebars',
'handlebars_helpers'
],
mailpoet: [
'mailpoet',
'ajax',
'date',
'modal',
'notice',
'jquery.serialize_object',
@ -129,7 +133,6 @@ config.push(_.extend({}, baseConfig, {
'blob',
'filesaver',
'velocity-animate',
'newsletter_editor/communicationsFix.js',
'newsletter_editor/App',
'newsletter_editor/components/config.js',
@ -156,11 +159,11 @@ config.push(_.extend({}, baseConfig, {
'newsletter_editor/blocks/header.js',
'newsletter_editor/blocks/automatedLatestContent.js',
'newsletter_editor/blocks/posts.js',
'newsletter_editor/blocks/social.js',
],
'newsletter_editor/blocks/social.js'
]
},
plugins: [
new webpack.optimize.CommonsChunkPlugin('vendor', 'vendor.js'),
new webpack.optimize.CommonsChunkPlugin('vendor', 'vendor.js')
],
externals: {
'jquery': 'jQuery',