Add MailPoet.I18n for basic translation handling, removed MailPoetI18n

2016-03-18 16:25:43 +02:00 · 2016-03-18 16:25:43 +02:00 · ccab8b4cf3
commit ccab8b4cf3
parent 45df02b0ec
24 changed files with 169 additions and 120 deletions
--- a/assets/js/src/cron.jsx
+++ b/assets/js/src/cron.jsx
@ -48,7 +48,7 @@ define(
      })
      .done(function(response) {
        if(!response.result) {
-          MailPoet.Notice.error(MailPoetI18n.daemonControlError);
+          MailPoet.Notice.error(MailPoet.I18n.t('daemonControlError'));
        }
      }.bind(this));
    },
@ -103,4 +103,4 @@ define(
      container
    );
  }
-});
+});
--- a/assets/js/src/i18n.js
+++ b/assets/js/src/i18n.js
@ -0,0 +1,25 @@
+define('i18n',
+  [
+    'mailpoet',
+    'underscore',
+  ], function(
+    MailPoet,
+    _
+) {
+  'use strict';
+
+  var translations = {};
+
+  MailPoet.I18n = {
+    add: function(key, value) {
+      translations[key] = value;
+    },
+    t: function(key) {
+      return translations[key] || 'TRANSLATION NOT FOUND';
+    },
+    all: function() {
+      return translations;
+    }
+  };
+
+});
--- a/assets/js/src/listing/listing.jsx
+++ b/assets/js/src/listing/listing.jsx
@ -223,8 +223,8 @@ define(
                  className="colspanchange">
                  {
                    (this.props.loading === true)
-                    ? MailPoetI18n.loadingItems
-                    : MailPoetI18n.noItemsFound
+                    ? MailPoet.I18n.t('loadingItems')
+                    : MailPoet.I18n.t('noItemsFound')
                  }
                </td>
              </tr>
@ -250,8 +250,8 @@ define(
                  }>
                  {
                    (this.props.selection !== 'all')
-                    ? MailPoetI18n.selectAllLabel
-                    : MailPoetI18n.selectedAllLabel.replace(
+                    ? MailPoet.I18n.t('selectAllLabel')
+                    : MailPoet.I18n.t('selectedAllLabel').replace(
                      '%d',
                      this.props.count
                    )
@ -261,8 +261,8 @@ define(
                    onClick={ this.props.onSelectAll }
                    href="javascript:;">{
                      (this.props.selection !== 'all')
-                      ? MailPoetI18n.selectAllLink
-                      : MailPoetI18n.clearSelection
+                      ? MailPoet.I18n.t('selectAllLink')
+                      : MailPoet.I18n.t('clearSelection')
                    }</a>
                </td>
              </tr>
@ -519,7 +519,7 @@ define(
          group: 'trash'
        }, function(response) {
          MailPoet.Notice.success(
-            MailPoetI18n.permanentlyDeleted.replace('%d', response)
+            MailPoet.I18n.t('permanentlyDeleted').replace('%d', response)
          );
        });
      },
--- a/assets/js/src/listing/search.jsx
+++ b/assets/js/src/listing/search.jsx
@ -1,4 +1,10 @@
-define(['react'], function(React) {
+define([
+    'mailpoet',
+    'react'
+  ], function(
+    MailPoet,
+    React
+  ) {

  var ListingSearch = React.createClass({
    handleSearch: function(e) {
@ -28,7 +34,7 @@ define(['react'], function(React) {
                defaultValue={this.props.search} />
              <input
                type="submit"
-                defaultValue={MailPoetI18n.searchLabel}
+                defaultValue={MailPoet.I18n.t('searchLabel')}
                className="button" />
            </p>
          </form>
--- a/assets/js/src/newsletter_editor/blocks/automatedLatestContent.js
+++ b/assets/js/src/newsletter_editor/blocks/automatedLatestContent.js
@ -83,7 +83,7 @@ define([
        that.get('_container').get('blocks').reset(content, {parse: true});
        that.trigger('postsChanged');
      }).fail(function(error) {
-        MailPoet.Notice.error(App.getConfig().get('translations.failedToFetchRenderedPosts'));
+        MailPoet.Notice.error(MailPoet.I18n.t('failedToFetchRenderedPosts'));
      });
    },
    /**
--- a/assets/js/src/newsletter_editor/blocks/footer.js
+++ b/assets/js/src/newsletter_editor/blocks/footer.js
@ -79,7 +79,7 @@ define([
        },

        mailpoet_custom_fields: App.getConfig().get('customFields').toJSON(),
-        mailpoet_custom_fields_window_title: App.getConfig().get('translations.customFieldsWindowTitle'),
+        mailpoet_custom_fields_window_title: MailPoet.I18n.t('customFieldsWindowTitle'),
      });
    },
  });
--- a/assets/js/src/newsletter_editor/blocks/header.js
+++ b/assets/js/src/newsletter_editor/blocks/header.js
@ -79,7 +79,7 @@ define([
        },

        mailpoet_custom_fields: App.getConfig().get('customFields').toJSON(),
-        mailpoet_custom_fields_window_title: App.getConfig().get('translations.customFieldsWindowTitle'),
+        mailpoet_custom_fields_window_title: MailPoet.I18n.t('customFieldsWindowTitle'),
      });
    },
  });
--- a/assets/js/src/newsletter_editor/blocks/posts.js
+++ b/assets/js/src/newsletter_editor/blocks/posts.js
@ -101,7 +101,7 @@ define([
        that.get('_selectedPosts').reset(); // Empty out the collection
        that.trigger('change:_availablePosts');
      }).fail(function() {
-        MailPoet.Notice.error(App.getConfig().get('translations.failedToFetchAvailablePosts'));
+        MailPoet.Notice.error(MailPoet.I18n.t('failedToFetchAvailablePosts'));
      });
    },
    _refreshTransformedPosts: function() {
@ -118,7 +118,7 @@ define([
      CommunicationComponent.getTransformedPosts(data).done(function(posts) {
        that.get('_transformedPosts').get('blocks').reset(posts, {parse: true});
      }).fail(function() {
-        MailPoet.Notice.error(App.getConfig().get('translations.failedToFetchRenderedPosts'));
+        MailPoet.Notice.error(MailPoet.I18n.t('failedToFetchRenderedPosts'));
      });
    },
    _insertSelectedPosts: function() {
@ -134,7 +134,7 @@ define([
      CommunicationComponent.getTransformedPosts(data).done(function(posts) {
        collection.add(posts, { at: index });
      }).fail(function() {
-        MailPoet.Notice.error(App.getConfig().get('translations.failedToFetchRenderedPosts'));
+        MailPoet.Notice.error(MailPoet.I18n.t('failedToFetchRenderedPosts'));
      });
    },
  });
--- a/assets/js/src/newsletter_editor/blocks/text.js
+++ b/assets/js/src/newsletter_editor/blocks/text.js
@ -77,7 +77,7 @@ define([
          },

          mailpoet_custom_fields: App.getConfig().get('customFields').toJSON(),
-          mailpoet_custom_fields_window_title: App.getConfig().get('translations.customFieldsWindowTitle'),
+          mailpoet_custom_fields_window_title: MailPoet.I18n.t('customFieldsWindowTitle'),
        });
      }
    },
--- a/assets/js/src/newsletter_editor/components/save.js
+++ b/assets/js/src/newsletter_editor/components/save.js
@ -191,7 +191,7 @@ define([

      if (templateName === '') {
        MailPoet.Notice.error(
-          App.getConfig().get('translations.templateNameMissing'),
+          MailPoet.I18n.t('templateNameMissing'),
          {
            positionAfter: that.$el,
            scroll: true,
@ -199,7 +199,7 @@ define([
        );
      } else if (templateDescription === '') {
        MailPoet.Notice.error(
-          App.getConfig().get('translations.templateDescriptionMissing'),
+          MailPoet.I18n.t('templateDescriptionMissing'),
          {
            positionAfter: that.$el,
            scroll: true,
@ -211,7 +211,7 @@ define([
          description: templateDescription,
        }).done(function() {
          MailPoet.Notice.success(
-            App.getConfig().get('translations.templateSaved'),
+            MailPoet.I18n.t('templateSaved'),
            {
              positionAfter: that.$el,
              scroll: true,
@ -219,7 +219,7 @@ define([
          );
        }).fail(function() {
          MailPoet.Notice.error(
-            App.getConfig().get('translations.templateSaveFailed'),
+            MailPoet.I18n.t('templateSaveFailed'),
            {
              positionAfter: that.$el,
              scroll: true,
@ -244,7 +244,7 @@ define([

      if (templateName === '') {
        MailPoet.Notice.error(
-          App.getConfig().get('translations.templateNameMissing'),
+          MailPoet.I18n.t('templateNameMissing'),
          {
            positionAfter: that.$el,
            scroll: true,
@ -252,7 +252,7 @@ define([
        );
      } else if (templateDescription === '') {
        MailPoet.Notice.error(
-          App.getConfig().get('translations.templateDescriptionMissing'),
+          MailPoet.I18n.t('templateDescriptionMissing'),
          {
            positionAfter: that.$el,
            scroll: true,
@ -285,7 +285,7 @@ define([

      if (App.getConfig().get('validation.validateUnsubscribeLinkPresent') &&
          JSON.stringify(jsonObject).indexOf("[subscription:unsubscribe_url]") < 0) {
-        this.showValidationError(App.getConfig().get('translations.unsubscribeLinkMissing'));
+        this.showValidationError(MailPoet.I18n.t('unsubscribeLinkMissing'));
        return;
      }

--- a/assets/js/src/newsletter_editor/components/sidebar.js
+++ b/assets/js/src/newsletter_editor/components/sidebar.js
@ -265,7 +265,7 @@ define([

      if (data.subscriber.length <= 0) {
        MailPoet.Notice.error(
-          App.getConfig().get('translations.newsletterPreviewEmailMissing'),
+          MailPoet.I18n.t('newsletterPreviewEmailMissing'),
          {
            positionAfter: $emailField,
            scroll: true,
@ -279,7 +279,7 @@ define([

      CommunicationComponent.previewNewsletter(data).done(function(response) {
        if(response.result !== undefined && response.result === true) {
-          MailPoet.Notice.success(App.getConfig().get('translations.newsletterPreviewSent'), { scroll: true });
+          MailPoet.Notice.success(MailPoet.I18n.t('newsletterPreviewSent'), { scroll: true });
        } else {
          if (_.isArray(response.errors)) {
            response.errors.map(function(error) {
@ -287,7 +287,7 @@ define([
            });
          } else {
            MailPoet.Notice.error(
-              App.getConfig().get('translations.newsletterPreviewFailedToSend'),
+              MailPoet.I18n.t('newsletterPreviewFailedToSend'),
              {
                scroll: true,
                static: true,
--- a/assets/js/src/newsletters/types/welcome.jsx
+++ b/assets/js/src/newsletters/types/welcome.jsx
@ -155,7 +155,7 @@ define(
            <h1>Welcome email</h1>
            <Breadcrumb step="type" />

-            <h3>{MailPoetI18n.selectEventToSendWelcomeEmail}</h3>
+            <h3>{MailPoet.I18n.t('selectEventToSendWelcomeEmail')}</h3>

            <Select
              field={events}
--- a/assets/js/src/subscribers/importExport/export.js
+++ b/assets/js/src/subscribers/importExport/export.js
@ -150,7 +150,7 @@ define(
          if (response.result === false) {
            MailPoet.Notice.error(response.errors);
          } else {
-            resultMessage = MailPoetI18n.exportMessage
+            resultMessage = MailPoet.I18n.t('exportMessage')
             .replace('%1$s', '<strong>' + response.data.totalExported + '</strong>')
             .replace('[link]', '<a href="' + response.data.exportFileURL + '" target="_blank" >')
             .replace('[/link]', '</a>');
@ -162,7 +162,7 @@ define(
        .error(function (error) {
          MailPoet.Modal.loading(false);
          MailPoet.Notice.error(
-           MailPoetI18n.serverError + error.statusText.toLowerCase() + '.'
+           MailPoet.I18n.t('serverError') + error.statusText.toLowerCase() + '.'
          );
        });
     });
--- a/assets/js/src/subscribers/importExport/import.js
+++ b/assets/js/src/subscribers/importExport/import.js
@ -128,7 +128,7 @@ define(
            // get an approximate size of textarea paste in bytes
            var pasteSize = encodeURI(pasteInputElement.val()).split(/%..|./).length - 1;
            if (pasteSize > maxPostSizeBytes) {
-              MailPoet.Notice.error(MailPoetI18n.maxPostSizeNotice, {
+              MailPoet.Notice.error(MailPoet.I18n.t('maxPostSizeNotice'), {
                timeout: noticeTimeout,
              });
              return;
@ -148,7 +148,7 @@ define(
              var ext = this.value.match(/\.(.+)$/);
              if (ext === null || ext[1].toLowerCase() !== 'csv') {
                this.value = '';
-                MailPoet.Notice.error(MailPoetI18n.wrongFileFormat, {
+                MailPoet.Notice.error(MailPoet.I18n.t('wrongFileFormat'), {
                  timeout: noticeTimeout,
                });
              }
@ -212,7 +212,7 @@ define(
                    .removeClass()
                    .addClass('mailpoet_mailchimp-key-status mailpoet_mailchimp-ok');
                if (!response.data) {
-                  jQuery('.mailpoet_mailchimp-key-status').html(MailPoetI18n.noMailChimpLists);
+                  jQuery('.mailpoet_mailchimp-key-status').html(MailPoet.I18n.t('noMailChimpLists'));
                  mailChimpListsContainerElement.hide();
                  toggleNextStepButton(mailChimpProcessButtonElement, 'off');
                } else {
@ -223,7 +223,7 @@ define(
            }).error(function (error) {
              MailPoet.Modal.loading(false);
              MailPoet.Notice.error(
-                  MailPoetI18n.serverError + error.statusText.toLowerCase() + '.', {
+                  MailPoet.I18n.t('serverError') + error.statusText.toLowerCase() + '.', {
                    timeout: noticeTimeout,
                  }
              );
@ -258,7 +258,7 @@ define(
            }).error(function () {
              MailPoet.Modal.loading(false);
              MailPoet.Notice.error(
-                  MailPoetI18n.serverError + result.statusText.toLowerCase() + '.', {
+                  MailPoet.I18n.t('serverError') + result.statusText.toLowerCase() + '.', {
                    timeout: noticeTimeout,
                  }
              );
@ -350,7 +350,7 @@ define(
              comments: advancedOptionComments,
              error: function () {
                MailPoet.Notice.hide();
-                MailPoet.Notice.error(MailPoetI18n.dataProcessingError, {
+                MailPoet.Notice.error(MailPoet.I18n.t('dataProcessingError'), {
                  timeout: noticeTimeout,
                });
              },
@ -431,8 +431,8 @@ define(
                }
                else {
                  MailPoet.Modal.loading(false);
-                  var errorNotice = MailPoetI18n.noValidRecords;
-                  errorNotice = errorNotice.replace('[link]', MailPoetI18n.csvKBLink);
+                  var errorNotice = MailPoet.I18n.t('noValidRecords');
+                  errorNotice = errorNotice.replace('[link]', MailPoet.I18n.t('csvKBLink'));
                  errorNotice = errorNotice.replace('[/link]', '</a>');
                  MailPoet.Notice.error(errorNotice, {
                    timeout: noticeTimeout,
@ -501,17 +501,17 @@ define(
            }

            var import_results = {
-              notice: MailPoetI18n.importNoticeSkipped.replace(
+              notice: MailPoet.I18n.t('importNoticeSkipped').replace(
                  '%1$s',
                  '<strong>' + (subscribers.invalid.length + subscribers.duplicate.length) + '</strong>'
              ),
              invalid: (subscribers.invalid.length)
-                  ? MailPoetI18n.importNoticeInvalid
+                  ? MailPoet.I18n.t('importNoticeInvalid')
                  .replace('%1$s', '<strong>' + subscribers.invalid.length + '</strong>')
                  .replace('%2$s', subscribers.invalid.join(', '))
                  : null,
              duplicate: (subscribers.duplicate.length)
-                  ? MailPoetI18n.importNoticeDuplicate
+                  ? MailPoet.I18n.t('importNoticeDuplicate')
                  .replace('%1$s', '<strong>' + subscribers.duplicate.length + '</strong>')
                  .replace('%2$s', subscribers.duplicate.join(', '))
                  : null
@ -527,8 +527,8 @@ define(
                jQuery(details).toggle();
                this.text =
                    (jQuery(details).is(":visible"))
-                        ? MailPoetI18n.hideDetails
-                        : MailPoetI18n.showDetails;
+                        ? MailPoet.I18n.t('hideDetails')
+                        : MailPoet.I18n.t('showDetails');
              });

          // show available segments
@ -564,7 +564,7 @@ define(
                  var segmentSelectionNotice = jQuery('[data-id="notice_segmentSelection"]');
                  if (!this.value) {
                    if (!segmentSelectionNotice.length) {
-                      MailPoet.Notice.error(MailPoetI18n.segmentSelectionRequired, {
+                      MailPoet.Notice.error(MailPoet.I18n.t('segmentSelectionRequired'), {
                        static: true,
                        timeout: noticeTimeout,
                        scroll: true,
@ -584,7 +584,7 @@ define(

          jQuery('.mailpoet_create_segment').click(function () {
            MailPoet.Modal.popup({
-              title: MailPoetI18n.addNewList,
+              title: MailPoet.I18n.t('addNewList'),
              template: jQuery('#new_segment_template').html()
            })
            jQuery('#new_segment_name').keypress(function (e) {
@ -644,7 +644,7 @@ define(
                      else {
                        MailPoet.Modal.close();
                        MailPoet.Notice.error(
-                            MailPoetI18n.segmentCreateError + response.message + '.', {
+                            MailPoet.I18n.t('segmentCreateError') + response.message + '.', {
                              timeout: noticeTimeout,
                            }
                        );
@ -653,7 +653,7 @@ define(
                    .error(function (error) {
                      MailPoet.Modal.close();
                      MailPoet.Notice.error(
-                          MailPoetI18n.serverError + error.statusText.toLowerCase() + '.', {
+                          MailPoet.I18n.t('serverError') + error.statusText.toLowerCase() + '.', {
                            timeout: noticeTimeout
                          }
                      );
@ -770,7 +770,7 @@ define(
                  selectEvent.preventDefault();
                  jQuery(selectElement).select2('close');
                  MailPoet.Modal.popup({
-                    title: MailPoetI18n.addNewColumn,
+                    title: MailPoet.I18n.t('addNewColumn'),
                    template: jQuery('#new_column_template').html()
                  });
                  jQuery('#new_column_name').keypress(function (e) {
@ -834,7 +834,7 @@ define(
                              // if this is the first custom column, create an "optgroup"
                              if (mailpoetColumnsSelect2.length === 2) {
                                mailpoetColumnsSelect2.push({
-                                  'name': MailPoetI18n.userColumns,
+                                  'name': MailPoet.I18n.t('userColumns'),
                                  'children': []
                                });
                              }
@ -860,7 +860,7 @@ define(
                              filterSubscribers();
                            }
                            else {
-                              MailPoet.Notice.error(MailPoetI18n.customFieldCreateError, {
+                              MailPoet.Notice.error(MailPoet.I18n.t('customFieldCreateError'), {
                                timeout: noticeTimeout,
                              });
                            }
@ -869,7 +869,7 @@ define(
                          .error(function (error) {
                            MailPoet.Modal.loading(false);
                            MailPoet.Notice.error(
-                                MailPoetI18n.serverError + error.statusText.toLowerCase() + '.', {
+                                MailPoet.I18n.t('serverError') + error.statusText.toLowerCase() + '.', {
                                  timeout: noticeTimeout,
                                }
                            );
@ -890,7 +890,7 @@ define(
                        // if another column has the same value and it's not an 'ignore', prompt user
                        if (elementId === selectedOptionId
                            && elementId !== 'ignore') {
-                          if (confirm(MailPoetI18n.selectedValueAlreadyMatched + ' ' + MailPoetI18n.confirmCorrespondingColumn)) {
+                          if (confirm(MailPoet.I18n.t('selectedValueAlreadyMatched') + ' ' + MailPoet.I18n.t('confirmCorrespondingColumn'))) {
                            jQuery(element).data('column-id', 'ignore');
                          }
                          else {
@ -933,7 +933,7 @@ define(
                if (!emailRegex.test(subscribersClone.subscribers[0][matchedColumn])) {
                  preventNextStep = true;
                  if (!jQuery('[data-id="notice_invalidEmail"]').length) {
-                    MailPoet.Notice.error(MailPoetI18n.columnContainsInvalidElement, {
+                    MailPoet.Notice.error(MailPoet.I18n.t('columnContainsInvalidElement'), {
                      static: true,
                      timeout: noticeTimeout,
                      scroll: true,
@ -953,18 +953,18 @@ define(
                      date = new Date(rowData.replace(/-/g, '/')), // IE doesn't like
                  // dashes as date separators
                      month_name = [
-                        MailPoetI18n.january,
-                        MailPoetI18n.february,
-                        MailPoetI18n.march,
-                        MailPoetI18n.april,
-                        MailPoetI18n.may,
-                        MailPoetI18n.june,
-                        MailPoetI18n.july,
-                        MailPoetI18n.august,
-                        MailPoetI18n.september,
-                        MailPoetI18n.october,
-                        MailPoetI18n.november,
-                        MailPoetI18n.december
+                        MailPoet.I18n.t('january'),
+                        MailPoet.I18n.t('february'),
+                        MailPoet.I18n.t('march'),
+                        MailPoet.I18n.t('april'),
+                        MailPoet.I18n.t('may'),
+                        MailPoet.I18n.t('june'),
+                        MailPoet.I18n.t('july'),
+                        MailPoet.I18n.t('august'),
+                        MailPoet.I18n.t('september'),
+                        MailPoet.I18n.t('october'),
+                        MailPoet.I18n.t('november'),
+                        MailPoet.I18n.t('december')
                      ];

                  if (position !== fillterPosition) {
@ -977,8 +977,8 @@ define(
                    if (rowData.trim() === '') {
                      data[matchedColumn] =
                          '<span class="mailpoet_data_match mailpoet_import_error" title="'
-                          + MailPoetI18n.noDateFieldMatch + '">'
-                          + MailPoetI18n.emptyDate
+                          + MailPoet.I18n.t('noDateFieldMatch') + '">'
+                          + MailPoet.I18n.t('emptyDate')
                          + '</span>';
                      preventNextStep = true;
                      return;
@ -995,25 +995,25 @@ define(
                          + ((date.getMinutes() < 10 ? '0' : '')
                          + date.getMinutes()) + ' '
                          + ((date.getHours() >= 12)
-                                  ? MailPoetI18n.pm
-                                  : MailPoetI18n.am
+                                  ? MailPoet.I18n.t('pm')
+                                  : MailPoet.I18n.t('am')
                          );
                      data[matchedColumn] +=
                          '<span class="mailpoet_data_match" title="'
-                          + MailPoetI18n.verifyDateMatch + '">'
+                          + MailPoet.I18n.t('verifyDateMatch') + '">'
                          + date + '</span>';
                    }
                    else {
                      data[matchedColumn] +=
                          '<span class="mailpoet_data_match mailpoet_import_error" title="'
-                          + MailPoetI18n.noDateFieldMatch + '">'
-                          + MailPoetI18n.dateMatchError + '</span>';
+                          + MailPoet.I18n.t('noDateFieldMatch') + '">'
+                          + MailPoet.I18n.t('dateMatchError') + '</span>';
                      preventNextStep = true;
                    }
                  }
                });
                if (preventNextStep && !jQuery('.mailpoet_invalidDate').length) {
-                  MailPoet.Notice.error(MailPoetI18n.columnContainsInvalidDate, {
+                  MailPoet.Notice.error(MailPoet.I18n.t('columnContainsInvalidDate'), {
                    static: true,
                    timeout: noticeTimeout,
                    scroll: true,
@ -1114,7 +1114,7 @@ define(
                  })
                  .error(function (error) {
                    importResults.errors.push(
-                      MailPoetI18n.serverError + error.statusText.toLowerCase() + '.'
+                      MailPoet.I18n.t('serverError') + error.statusText.toLowerCase() + '.'
                    );
                    queue.run();
                  });
@ -1171,12 +1171,12 @@ define(
              exportMenuElement = jQuery('span.mailpoet_export'),
              importResults = {
                created: (importData.step2.created)
-                    ? MailPoetI18n.subscribersCreated
+                    ? MailPoet.I18n.t('subscribersCreated')
                    .replace('%1$s', '<strong>' + importData.step2.created + '</strong>')
                    .replace('%2$s', '"' + importData.step2.segments.join('", "') + '"')
                    : false,
                updated: (importData.step2.updated)
-                    ? MailPoetI18n.subscribersUpdated
+                    ? MailPoet.I18n.t('subscribersUpdated')
                    .replace('%1$s', '<strong>' + importData.step2.updated + '</strong>')
                    .replace('%2$s', '"' + importData.step2.segments.join('", "') + '"')
                    : false,
@ -1212,4 +1212,4 @@ define(
          Backbone.history.start();
        }
      });
-    });
+    });
--- a/lib/Twig/i18n.php
+++ b/lib/Twig/i18n.php
@ -42,10 +42,9 @@ class i18n extends \Twig_Extension {
    $output = array();

    $output[] = '<script type="text/javascript">';
-    $output[] = ' var MailPoetI18n = MailPoetI18n || {}';
    foreach($translations as $key => $translation) {
      $output[] =
-        'MailPoetI18n["'.$key.'"] = "'. str_replace('"', '\"', $translation) . '";';
+        'MailPoet.I18n.add("'.$key.'", "'. str_replace('"', '\"', $translation) . '");';
    }
    $output[] = '</script>';
    return join("\n", $output);
--- a/views/forms.html
+++ b/views/forms.html
@ -3,6 +3,14 @@
 <% block content %>
  <div id="forms_container"></div>

+  <script type="text/javascript">
+    var mailpoet_segments = <%= json_encode(segments) %>;
+    var mailpoet_form_edit_url =
+      "<%= admin_url('admin.php?page=mailpoet-form-editor&id=') %>";
+  </script>
+<% endblock %>
+
+<% block translations %>
  <%= localize({
    'pageTitle': __('Forms'),
    'searchLabel': __('Search'),
@ -14,10 +22,4 @@
    'clearSelection': __('Clear selection.'),
    'permanentlyDeleted': __('%d forms permanently deleted.')
  }) %>
-
-  <script type="text/javascript">
-    var mailpoet_segments = <%= json_encode(segments) %>;
-    var mailpoet_form_edit_url =
-      "<%= admin_url('admin.php?page=mailpoet-form-editor&id=') %>";
-  </script>
 <% endblock %>
--- a/views/layout.html
+++ b/views/layout.html
@ -30,7 +30,12 @@
 <!-- javascripts -->
 <%= javascript(
  'vendor.js',
-  'mailpoet.js',
+  'mailpoet.js'
+)%>
+
+<% block translations %><% endblock %>
+
+<%= javascript(
  'admin.js'
 )%>

--- a/views/newsletter/editor.html
+++ b/views/newsletter/editor.html
@ -311,7 +311,9 @@
      </div>
    </form>
  </div>
+<% endblock %>

+<% block translations %>
  <%= localize({
    'failedToFetchAvailablePosts': __('Failed to fetch available posts'),
    'failedToFetchRenderedPosts': __('Failed to fetch rendered posts'),
@ -1256,7 +1258,6 @@
      validation: {
        validateUnsubscribeLinkPresent: true, // TODO: Add validation based on whether Mailpoet MTA is used or not
      },
-      translations: MailPoetI18n,
      urls: {
        send: '<%= admin_url('admin.php?page=mailpoet-newsletters#/send/' ~ params('id')) %>',
        imageMissing: '<%= image_url(
--- a/views/newsletters.html
+++ b/views/newsletters.html
@ -3,6 +3,15 @@
 <% block content %>
  <div id="newsletters_container"></div>

+  <script type="text/javascript">
+    var mailpoet_segments = <%= json_encode(segments) %>;
+    var mailpoet_settings = <%= json_encode(settings) %>;
+    var mailpoet_lists = <%= json_encode(lists) %>;
+    var mailpoet_roles = <%= json_encode(roles) %>;
+  </script>
+<% endblock %>
+
+<% block translations %>
  <%= localize({
    'pageTitle': __('Newsletters'),
    'searchLabel': __('Search'),
@ -14,11 +23,4 @@
    'clearSelection': __('Clear selection.'),
    'permanentlyDeleted': __('%d newsletters permanently deleted.')
  }) %>
-
-  <script type="text/javascript">
-    var mailpoet_segments = <%= json_encode(segments) %>;
-    var mailpoet_settings = <%= json_encode(settings) %>;
-    var mailpoet_lists = <%= json_encode(lists) %>;
-    var mailpoet_roles = <%= json_encode(roles) %>;
-  </script>
 <% endblock %>
--- a/views/segments.html
+++ b/views/segments.html
@ -2,7 +2,9 @@

 <% block content %>
  <div id="segments_container"></div>
+<% endblock %>

+<% block translations %>
  <%= localize({
    'pageTitle': __('Segments'),
    'searchLabel': __('Search'),
--- a/views/subscribers/importExport/export.html
+++ b/views/subscribers/importExport/export.html
@ -107,11 +107,6 @@

 <%= stylesheet('importExport.css') %>

-<%= localize({
-  'serverError': __('Server error:'),
-  'exportMessage' : __('%1$s subscribers were exported. Get the exported file [link]here[/link].')
-}) %>
-
 <script type="text/javascript">
  // define data variables
  var
@ -127,4 +122,11 @@
     groupBySegmentOption: (segments.length > 1 || segmentsWithConfirmedSubscribers.length > 1) ? true : null
    };
 </script>
-<% endblock %>
+<% endblock %>
+
+<% block translations %>
+<%= localize({
+  'serverError': __('Server error:'),
+  'exportMessage' : __('%1$s subscribers were exported. Get the exported file [link]here[/link].')
+}) %>
+<% endblock %>
--- a/views/subscribers/importExport/import.html
+++ b/views/subscribers/importExport/import.html
@ -18,6 +18,19 @@

 <%= stylesheet('importExport.css') %>

+<script type="text/javascript">
+  var
+    maxPostSize = '<%= maxPostSize %>',
+    maxPostSizeBytes = '<%= maxPostSizeBytes %>',
+    importData = {},
+    mailpoetColumnsSelect2 = <%= subscriberFieldsSelect2|raw %>,
+    mailpoetColumns = <%= subscriberFields|raw %>,
+    mailpoetSegments = <%= segments|raw %>,
+    emailRegex = /^[a-zA-Z0-9.!#$%&'*+\/=?^_`{|}~-]+@[a-zA-Z0-9](?:[a-zA-Z0-9-_]{0,61}[a-zA-Z0-9])+.[a-zA-Z0-9](?:[a-zA-Z0-9-]{0,61}[a-zA-Z0-9])?(?:\.[a-zA-Z0-9](?:[a-zA-Z0-9-]{0,61}[a-zA-Z0-9])?)*$/;
+</script>
+<% endblock %>
+
+<% block translations %>
 <%= localize({
 'noMailChimpLists': __('No active lists found.'),
 'serverError': __('Server error:'),
@ -64,15 +77,4 @@
 'subscribersCreated': __('%1$s subscribers added to %2$s.'),
 'subscribersUpdated': __('%1$s existing subscribers were updated and added to %2$s.')
 }) %>
-
-<script type="text/javascript">
-  var
-    maxPostSize = '<%= maxPostSize %>',
-    maxPostSizeBytes = '<%= maxPostSizeBytes %>',
-    importData = {},
-    mailpoetColumnsSelect2 = <%= subscriberFieldsSelect2|raw %>,
-    mailpoetColumns = <%= subscriberFields|raw %>,
-    mailpoetSegments = <%= segments|raw %>,
-    emailRegex = /^[a-zA-Z0-9.!#$%&'*+\/=?^_`{|}~-]+@[a-zA-Z0-9](?:[a-zA-Z0-9-_]{0,61}[a-zA-Z0-9])+.[a-zA-Z0-9](?:[a-zA-Z0-9-]{0,61}[a-zA-Z0-9])?(?:\.[a-zA-Z0-9](?:[a-zA-Z0-9-]{0,61}[a-zA-Z0-9])?)*$/;
-</script>
-<% endblock %>
+<% endblock %>
--- a/views/subscribers/subscribers.html
+++ b/views/subscribers/subscribers.html
@ -3,6 +3,15 @@
 <% block content %>
  <div id="subscribers_container"></div>

+  <script type="text/javascript">
+    var mailpoet_listing_per_page = <%= per_page %>;
+    var mailpoet_segments = <%= json_encode(segments) %>;
+    var mailpoet_custom_fields = <%= json_encode(custom_fields) %>;
+    var mailpoet_month_names = <%= json_encode(month_names) %>;
+  </script>
+<% endblock %>
+
+<% block translations %>
  <%= localize({
    'pageTitle': __('Subscribers'),
    'searchLabel': __('Search'),
@ -14,11 +23,4 @@
    'clearSelection': __('Clear selection.'),
    'permanentlyDeleted': __('%d subscribers permanently deleted.')
  }) %>
-
-  <script type="text/javascript">
-    var mailpoet_listing_per_page = <%= per_page %>;
-    var mailpoet_segments = <%= json_encode(segments) %>;
-    var mailpoet_custom_fields = <%= json_encode(custom_fields) %>;
-    var mailpoet_month_names = <%= json_encode(month_names) %>;
-  </script>
 <% endblock %>
--- a/webpack.config.js
+++ b/webpack.config.js
@ -99,6 +99,7 @@ config.push(_.extend({}, baseConfig, {
      'mailpoet',
      'ajax',
      'date',
+      'i18n',
      'modal',
      'notice',
      'jquery.serialize_object',