src/Products/NotificationsBundle/Resources/views/dashboard/messages/translations.html.twig line 1

Open in your IDE?
  1. {% extends '@ProductsNotifications/base--full.html.twig' %}
  3. {% block topbar %}
  4.     {% include '@ui2022/topbar--wizard.html.twig' with {
  5.         steps: [
  6.             {
  7.                 text: 'Create message',
  8.                 active: true,
  9.                 button: {
  10.                     button: 'form',
  11.                     type: 'submit',
  12.                     styles: 'wizard',
  13.                     form: {
  14.                         name: '',
  15.                         value: 'save',
  16.                         formaction: path('app.notifications.dashboard.messages.translations', {
  17.                             message: message.id,
  18.                             jump: path('app.notifications.dashboard.messages.update', {
  19.                                 message: message.id,
  20.                             }),
  21.                         }),
  22.                     },
  23.                 },
  24.             },
  25.             {
  26.                 text: 'Review and test',
  27.                     button: {
  28.                     button: 'form',
  29.                     type: 'submit',
  30.                     styles: 'wizard',
  31.                     form: {
  32.                         name: '',
  33.                         value: 'save',
  34.                         formaction: path('app.notifications.dashboard.messages.manage', {
  35.                             message: message.id,
  36.                             jump: path('app.notifications.dashboard.messages.manage', {
  37.                                 message: message.id,
  38.                             }),
  39.                         }),
  40.                     },
  41.                 },
  42.             },
  43.         ],
  44.         subactions: [
  45.         ],
  46.         actions: [
  47.             {
  48.                 button: 'form',
  49.                 type: 'submit',
  50.                 text: 'Next',
  51.                 styles: 'primary wide md',
  52.             },
  53.         ],
  54.     } %}
  55. {% endblock %}
  57. {% block content %}
  58.     <div class="py-5">
  59.         <div class="mx-auto w-50 text-center">
  60.             <img src="/ui2022/images/translation-animation.gif" alt="translating..." style="width: 150px;" />
  61.             <div class="pt-4" id="translation-statuses">
  62.                 {% for locale,status in statuses['statuses'] %}
  63.                     <div class="row justify-content-md-center">
  64.                         <div class="col-4 text-left">{{ humanReadableLocaleNames[locale] }}</div>
  65.                         <div class="col-1" id="translation-statuses-{{ locale }}">
  66.                             {% if status is same as(null) %}
  67.                                 <i class="fas fa-pause"></i>
  68.                             {% elseif status is same as(false) %}
  69.                                 <i class="fas fa-spinner fa-spin"></i>
  70.                             {% elseif status is same as(true) %}
  71.                                 <i class="fas fa-check"></i>
  72.                             {% endif %}
  73.                         </div>
  74.                     </div>
  75.                 {% endfor %}
  76.             </div>
  77.         </div>
  78.     </div>
  79.     <script type="text/javascript">
  80.         (function (window, document, $, undefined) {
  81.             $(function () {
  82.                 let waitingSince = Date.now();
  83.                 const translationsCheckUrl = '{{ path('app.notifications.dashboard.messages.check_translation_progress', {message: message.id}) }}';
  84.                 const redirectUrl = '{{ path('app.notifications.dashboard.messages.manage', {message: message.id}) }}';
  86.                 toastr.options = {
  87.                     positionClass: "toast-top-left mt-5 pt-4",
  88.                     timeOut: 0,
  89.                     extendedTimeOut: 0,
  90.                     tapToDismiss: false,
  91.                     fadeOut: 0,
  92.                 };
  94.                 const translationWarning =
  95.                     '<div class="mb-3">There is a problem with the translation services.</div>' +
  96.                     '<div><a href="{{ path('app.notifications.dashboard.messages.update', {message: message.id}) }}" class="alert-link">Exit</a> and try again later.</div>' +
  97.                     '<div>Or <a href="https://www.schoolnow.com/support" target="_blank" class="alert-link">report</a> to the support team.</div>';
  99.                 let translationWarningElement = null;
  100.                 let lastResponseJson = '{}';
  102.                 setInterval(() => {
  103.                     $.ajax({
  104.                         method: 'GET',
  105.                         url: translationsCheckUrl
  106.                     }).done(function (response) {
  107.                         if (JSON.stringify(response) !== lastResponseJson) {
  108.                             lastResponseJson = JSON.stringify(response);
  109.                             waitingSince = Date.now();
  110.                             toastr.clear();
  111.                             translationWarningElement = null;
  112.                         }
  113.                         for (var [locale, status] of Object.entries(response.statuses)) {
  114.                             switch (status) {
  115.                                 case null:
  116.                                     status = 'fas fa-pause';
  117.                                     break;
  118.                                 case false:
  119.                                     status = 'fas fa-spinner fa-spin';
  120.                                     break;
  121.                                 case true:
  122.                                     status = 'fas fa-check';
  123.                                     break;
  124.                             }
  125.                             $('#translation-statuses-' + locale + ' i').attr('class', status);
  126.                         }
  127.                         let waitSeconds = Math.floor(((Date.now() - waitingSince) / 1000));
  128.                         if (45 < waitSeconds && !translationWarningElement) {
  129.                             translationWarningElement = toastr.warning(translationWarning);
  130.                         }
  131.                         if ( (response.ready === true)) {
  132.                             window.location.replace(redirectUrl);
  133.                         }
  134.                     });
  135.                 }, 2000);
  136.             });
  137.         })(window, document, jQuery);
  138.     </script>
  139. {% endblock %}