Обучение. Рефакторинг

js/training/modal.js

@@ -1,23 +1,44 @@
 const request = new XMLHttpRequest();
 
 const training_handler = () => {
-    request.open('POST', '/api/training/complete')
+
+    const url = (condition) => {
+        return condition ? '/api/training/complete' : '/api/training/go_back';
+    };
+
+    request.open('POST', url(training_data().answer === null || training_data().answer === get_user_answer()))
     request.setRequestHeader("Content-Type", "application/json;charset=UTF-8");
-    request.onreadystatechange = function() {//Call a function when the state changes.
-        if(request.readyState === 4 && request.status === 200) {
-            parent.frames['main'].location.reload();
+    request.onreadystatechange = function () {//Call a function when the state changes.
+        if (request.readyState === 4) {
+            if(request.status === 200) {
+                parent.frames['main'].location.reload();
+            }
+
+            if(request.responseText !== '') {
+                let response = JSON.parse(request.responseText);
+
+                if (response.message !== undefined) {
+                    alert(response.message);
+                }
+            }
         }
     }
 
     request.send(JSON.stringify({
         time: training_data().time,
         token: training_data().token,
-        short_name: training_data().short_name
+        short_name: training_data().short_name,
+        answer: get_user_answer(),
     }))
-
 }
 
-let active_training = null;
+function get_user_answer() {
+    if(training_data().answer === '') {
+        return '';
+    }
+
+    return document.getElementsByName('user_answer')[0].value;
+}
 
 (function () {
     if (typeof window.CustomEvent === "function") return false;
@@ -44,20 +65,24 @@ $modal = function (options) {
             elemModal = document.createElement('div'),
             modalTemplate = '<div class="modal__backdrop" data-dismiss="modal"><div class="modal__content"><div class="modal__header"><div class="modal__title" data-modal="title">{{title}}</div><span class="modal__btn-close" data-dismiss="modal" title="Закрыть">×</span></div><div id="modal_content" class="modal__body" data-modal="content">{{content}}</div>{{footer}}</div></div>',
             modalFooterTemplate = '<div class="modal__footer">{{buttons}}</div>',
+            modalInputAnswer = '',
             modalButtonTemplate = '<button type="button" class="{{button_class}}" data-handler={{button_handler}}>{{button_text}}</button>',
             modalHTML,
             modal_content,
             modalFooterHTML = '';
 
+        if(training_data().answer !== '') {
+            modalInputAnswer = '<br><br><input name="user_answer" placeholder="Укажите ответ"/>';
+        }
+
         elemModal.classList.add('modal');
         modalHTML = modalTemplate.replace('{{title}}', options.title || 'Новое окно');
-        //modalHTML = modalHTML.replace('{{content}}', options.content || '');
 
         if (options.footerButtons) {
             for (var i = 0, length = options.footerButtons.length; i < length; i++) {
                 var modalFooterButton = modalButtonTemplate.replace('{{button_class}}', options.footerButtons[i].class);
                 modalFooterButton = modalFooterButton.replace('{{button_handler}}', options.footerButtons[i].handler);
-                modalFooterButton = modalFooterButton.replace('{{button_text}}', options.footerButtons[i].text);
+                modalFooterButton = modalFooterButton.replace('{{button_text}}', options.footerButtons[i].text) + modalInputAnswer;
                 modalFooterHTML += modalFooterButton;
             }
             modalFooterHTML = modalFooterTemplate.replace('{{buttons}}', modalFooterHTML);