Merge pull request #3084 from AHOHNMYC/js-helpers-polyfills

JS refactoring part 2: helper functions, poyfills

1 files changed, 11 insertions, 28 deletions

diff --git a/assets/js/watched_widget.js b/assets/js/watched_widget.js
index 87989a79..f1ac9cb4 100644
--- a/assets/js/watched_widget.js
+++ b/assets/js/watched_widget.js
@@ -1,5 +1,6 @@
 'use strict';
 var watched_data = JSON.parse(document.getElementById('watched_data').textContent);
+var payload = 'csrf_token=' + watched_data.csrf_token;
 
 function mark_watched(target) {
     var tile = target.parentNode.parentNode.parentNode.parentNode.parentNode;
@@ -7,45 +8,27 @@ function mark_watched(target) {
 
     var url = '/watch_ajax?action_mark_watched=1&redirect=false' +
         '&id=' + target.getAttribute('data-id');
-    var xhr = new XMLHttpRequest();
-    xhr.responseType = 'json';
-    xhr.timeout = 10000;
-    xhr.open('POST', url, true);
-    xhr.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded');
 
-    xhr.onreadystatechange = function () {
-        if (xhr.readyState === 4) {
-            if (xhr.status !== 200) {
-                tile.style.display = '';
-            }
+    helpers.xhr('POST', url, {payload: payload}, {
+        onNon200: function (xhr) {
+            tile.style.display = '';
         }
-    };
-
-    xhr.send('csrf_token=' + watched_data.csrf_token);
+    });
 }
 
 function mark_unwatched(target) {
     var tile = target.parentNode.parentNode.parentNode.parentNode.parentNode;
     tile.style.display = 'none';
     var count = document.getElementById('count');
-    count.innerText = count.innerText - 1;
+    count.textContent--;
 
     var url = '/watch_ajax?action_mark_unwatched=1&redirect=false' +
         '&id=' + target.getAttribute('data-id');
-    var xhr = new XMLHttpRequest();
-    xhr.responseType = 'json';
-    xhr.timeout = 10000;
-    xhr.open('POST', url, true);
-    xhr.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded');
 
-    xhr.onreadystatechange = function () {
-        if (xhr.readyState === 4) {
-            if (xhr.status !== 200) {
-                count.innerText = count.innerText - 1 + 2;
-                tile.style.display = '';
-            }
+    helpers.xhr('POST', url, {payload: payload}, {
+        onNon200: function (xhr) {
+            count.textContent++;
+            tile.style.display = '';
         }
-    };
-
-    xhr.send('csrf_token=' + watched_data.csrf_token);
+    });
 }