devshort

commit 2ca5789980c1347038ecaf7aac759d738bb847f1
parent 86b8d27fe81be7f236969527dd31ceb8dc3315e1
Author: Florian Kaldowski <flokX@users.noreply.github.com>
Date:   Mon,  8 Apr 2019 19:54:41 +0200

Replace ajax
Diffstat:
M
admin/main.js
 | 
40
++++++++++++++++++++++++++++------------

1 file changed, 28 insertions(+), 12 deletions(-)
diff --git a/admin/main.js b/admin/main.js
@@ -2,23 +2,34 @@ var currentDate = new Date();
 var startDate = new Date(new Date().setFullYear(currentDate.getFullYear() - 1));
 var spinner = document.getElementById('spinner');
 var chartsDiv = document.getElementById('charts');
-$.ajaxSetup({
-    cache: false
-});
+
+function post(url, data) {
+    'use strict';
+    return fetch(url, {
+            method: 'POST',
+            headers: {
+                'Content-Type': 'application/json'
+            },
+            body: JSON.stringify(data)
+        })
+        .then(function (response) {
+            return response.json();
+        });
+}
 
 $('button#add-shortlink').click(function (event) {
     'use strict';
     event.preventDefault();
     spinner.style.display = '';
-    $.post('index.php?add', {
+    post('index.php?add', {
         name: document.getElementById('name').value,
-        link: document.getElementById('link').value
-    }, function (data) {
-        if (data === '{"status": "successful"}') {
+        url: document.getElementById('url').value
+    }).then(function (data) {
+        if (data.status === 'successful') {
             document.getElementById('name').value = '';
-            document.getElementById('link').value = '';
+            document.getElementById('url').value = '';
             getCharts();
-        } else if (data === '{"status": "unvalid-url"}') {
+        } else if (data.status === 'unvalid-url') {
             document.getElementById('status').innerHTML = '<div class="alert alert-danger" role="alert">Unvalid URL. Please provide a valid URL.</div>';
         } else {
             document.getElementById('status').innerHTML = '<div class="alert alert-danger" role="alert">Error. Please try again.</div>';
@@ -38,7 +49,11 @@ function getCharts() {
     while (chartsDiv.firstChild) {
         chartsDiv.firstChild.remove();
     }
-    $.getJSON('stats.json', function (json) {
+    fetch('stats.json', {
+        cache: 'no-cache'
+    }).then(function (response) {
+        return response.json();
+    }).then(function (json) {
         $.each(json, function (name, data) {
             chartsDiv.insertAdjacentHTML('beforeend', '<div id="card-' + name + '" class="card mb-3"><div class="card-body"><div id="heatmap-' + name + '" class="heatmap"></div></div><div class="card-footer text-center text-muted"><a id="export-' + name + '" href="#download" class="card-link">Download chart</a><a id="delete-' + name + '" href="#delete" class="card-link">Delete shortlink and dataset</a></div></div>');
             let heatmap = new frappe.Chart('div#heatmap-' + name, {
@@ -57,10 +72,11 @@ function getCharts() {
             });
             $('a#delete-' + name).click(function (event) {
                 event.preventDefault();
-                $.post('index.php?delete', {
+                post('index.php?delete', {
                     name: name
+                }).then(function () {
+                    document.getElementById('card-' + name).remove();
                 });
-                document.getElementById('card-' + name).remove();
             });
         });
         spinner.style.display = 'none';