<% extends 'layout.html' %>

<% block content %>

<div class="wrap mailpoet-about-wrap">
  <h1><%= __('Welcome to MailPoet version 3!') %> <%= settings.version %></h1>

  <p class="about-text"><%= __('Before we start, we will first migrate your data automatically from your previous MailPoet to the new one.') %></p>

  <h3><%= __('What will be kept in MailPoet 3') %></h3>
  <ul class="default-list">
    <li><strong><%= __('Subscribers and lists') %> <img draggable="false" class="emoji" alt="✔" src="https://s.w.org/images/core/emoji/2.2.1/svg/2714.svg"></strong></li>
    <li><strong><%= __('Forms') %> <img draggable="false" class="emoji" alt="✔" src="https://s.w.org/images/core/emoji/2.2.1/svg/2714.svg"></strong></li>
    <li><strong><%= __('Settings') %> <img draggable="false" class="emoji" alt="✔" src="https://s.w.org/images/core/emoji/2.2.1/svg/2714.svg"></strong></li>
    <li><%= __('Archive of sent newsletters (will not be migrated)') %></li>
    <li><%= __('Statistics (will not be migrated)') %></li>
  </ul>
  <div style="position: absolute; top: .2em; right: 0;"></div>
  <hr />

  <div>
    <br />
    <div id="import-actions">
      <input type="submit" name="import" id="import" class="button button-primary" value="<%= __('Start upgrade') %>"  />
      <input type="submit" name="stop-import" id="stop-import" class="button button-secondary" value="<%= __('Pause') %>" style="display: none"/>
      <small> <a id="skip-import" href="#"><%= __("No thanks, I'll skip and start from scratch.") %></a></small>
      <br />
      <br />
    </div>

    <div id="progressbar" class="mailpoet_progress mailpoet_progress_complete" style="display: none">
      <span id="progresslabel" class="mailpoet_progress_label">0%</span>
    </div>

    <div id="upgrade-completed" style="display: none">
      <h3><%= __('Upgrade completed!') %></h3>
      <input type="button" name="goto-welcome" id="goto-welcome" class="button button-primary" value="<%= __('Go to MailPoet') %>"  />
    </div>

    <br />
    <div id="logger-container" style="display: none">
      <small><strong><%= __('Log...') %></strong></small>
      <div id="logger"></div>
    </div>

  </div>

</div>
<% endblock %>

<% block after_javascript %>
  <%= javascript(
    'mp2migrator.js'
  )%>
  <script type="text/javascript">
    var mailpoet_mp2_migrator = {
      log_file_url: '<%= log_file_url %>',
      progress_url: '<%= progress_url %>'
    };
  </script>
<% endblock %>

<% block translations %>
  <%= localize({
    'import_complete' : __('IMPORT COMPLETE'),
    'importing' : __('Importing…'),
    'import_stopped_by_user' : __('IMPORT STOPPED BY USER'),
  }) %>
<% endblock %>
