Apply options to fetch() consistently

4 files changed, 151 insertions, 136 deletions

diff --git a/resources/js/webtrees.js b/resources/js/webtrees.js
index f22f1dbabf..d9f1d73db5 100644
--- a/resources/js/webtrees.js
+++ b/resources/js/webtrees.js
@@ -37,6 +37,49 @@
   }
 
   /**
+   * Simple wrapper around fetch() with our preferred headers
+   *
+   * @param {string} url
+   * @returns {Promise}
+   */
+  webtrees.httpGet = function (url) {
+    const options = {
+      method: 'GET',
+      credentials: 'same-origin',
+      referrerPolicy: 'same-origin',
+      headers: new Headers({
+        'x-requested-with': 'XMLHttpRequest',
+      })
+    };
+
+    return fetch(url, options);
+  }
+
+  /**
+   * Simple wrapper around fetch() with our preferred headers
+   *
+   * @param {string} url
+   * @param {string|FormData} body
+   * @returns {Promise}
+   */
+  webtrees.httpPost= function (url, body = '') {
+    const csrfToken = document.head.querySelector('meta[name=csrf]').getAttribute('content');
+
+    const options = {
+      body: body,
+      method: 'POST',
+      credentials: 'same-origin',
+      referrerPolicy:  'same-origin',
+      headers: new Headers({
+        'X-CSRF-TOKEN': csrfToken,
+        'x-requested-with': 'XMLHttpRequest',
+      })
+    };
+
+    return fetch(url, options, body);
+  }
+
+  /**
    * Look for non-latin characters in a string.
    * @param {string} str
    * @returns {string}
@@ -707,7 +750,7 @@
         },
         firstUrl: query => element.dataset.url + '&query=' + encodeURIComponent(query),
         load: function (query, callback) {
-          fetch(this.getUrl(query))
+          webtrees.httpGet(this.getUrl(query))
             .then(response => response.json())
             .then(json => {
               if (json.nextUrl !== null) {
@@ -919,15 +962,7 @@ document.addEventListener('click', (event) => {
   }
 
   if ('wtPostUrl' in target.dataset) {
-    const token = document.querySelector('meta[name=csrf]').content;
-
-    fetch(target.dataset.wtPostUrl, {
-      method: 'POST',
-      headers: {
-        'X-CSRF-TOKEN': token,
-        'X-Requested-with': 'XMLHttpRequest',
-      },
-    }).then(() => {
+    webtrees.httpPost(target.dataset.wtPostUrl).then(() => {
       if ('wtReloadUrl' in target.dataset) {
         // Go somewhere else. e.g. the home page after logout.
         document.location = target.dataset.wtReloadUrl;
diff --git a/resources/views/admin/data-fix-page.phtml b/resources/views/admin/data-fix-page.phtml
index 7384ff0842..ffc15719af 100644
--- a/resources/views/admin/data-fix-page.phtml
+++ b/resources/views/admin/data-fix-page.phtml
@@ -93,121 +93,108 @@ use Fisharebest\Webtrees\View;
 
 <?php View::push('javascript') ?>
 <script>
-    (function () {
-        let form        = document.getElementById("data-fix-options");
-        let container   = document.getElementById("data-fix-table-container");
-        let table       = document.getElementById("data-fix-table");
-        let progress    = document.getElementById("data-fix-progress");
-        let progressbar = progress.querySelector('.progress-bar');
-        let queue       = [];
+  (function () {
+    let form = document.getElementById('data-fix-options');
+    let container = document.getElementById('data-fix-table-container');
+    let table = document.getElementById('data-fix-table');
+    let progress = document.getElementById('data-fix-progress');
+    let progressbar = progress.querySelector('.progress-bar');
+    let queue = [];
 
-        function getParams() {
-            let formData = new FormData(form);
-            let params = {};
-            formData.forEach(function (value, key) {
-                params[key] = value;
-            });
+    function getParams () {
+      let formData = new FormData(form);
+      let params = {};
+      formData.forEach(function (value, key) {
+        params[key] = value;
+      });
 
-            return params;
-        }
+      return params;
+    }
 
-        function addParamsToUrl(u) {
-            let url      = new URL(u);
-            let formData = new FormData(form);
-            formData.forEach(function (value, key) {
-                url.searchParams.append(key, value);
-            });
+    function addParamsToUrl (u) {
+      let url = new URL(u);
+      let formData = new FormData(form);
+      formData.forEach(function (value, key) {
+        url.searchParams.append(key, value);
+      });
 
-            return url.toString();
+      return url.toString();
 
-        }
+    }
 
-        form.addEventListener('submit', function (event) {
-            event.preventDefault();
-        });
+    form.addEventListener('submit', function (event) {
+      event.preventDefault();
+    });
 
-        container.addEventListener('click', function (event) {
-            if ('updateUrl' in event.target.dataset) {
-                event.preventDefault();
+    container.addEventListener('click', function (event) {
+      if ('updateUrl' in event.target.dataset) {
+        event.preventDefault();
 
-                fetch(event.target.dataset.updateUrl, {
-                    body: getParams(),
-                    headers: new Headers({
-                        'X-CSRF-TOKEN': $('meta[name=csrf]').attr('content'),
-                        'X-Requested-with': 'XMLHttpRequest',
-                    }),
-                    method: 'POST',
-                }).then(function (response) {
-                    $(table).DataTable().ajax.reload(null, false);
-                }).catch(function (error) {
-                    alert(error);
-                });
-            }
+        webtrees.httpPost(event.target.dataset.updateUrl)
+          .then(function (response) {
+            $(table).DataTable().ajax.reload(null, false);
+          })
+          .catch(function (error) {
+            alert(error);
         });
+      }
+    });
 
-        document.getElementById('btn-search').addEventListener('click', function (event) {
-            event.preventDefault();
+    document.getElementById('btn-search').addEventListener('click', function (event) {
+      event.preventDefault();
 
-            // If we were in the middle of doing "update all", stop processing.
-            queue = [];
+      // If we were in the middle of doing "update all", stop processing.
+      queue = [];
 
-            progress.classList.add('d-none');
+      progress.classList.add('d-none');
 
-            if ($.fn.dataTable.isDataTable(table)) {
-                $(table).DataTable().ajax.reload();
-            } else {
-                $(table).DataTable({
-                    'ajax': {
-                        'url': <?= json_encode(route(DataFixData::class, ['tree' => $tree->name(), 'data_fix' => $data_fix->name()]), JSON_THROW_ON_ERROR) ?>,
-                        'data': function (data) {
-                            $.extend(data, getParams());
-                        }
-                    }
-                });
+      if ($.fn.dataTable.isDataTable(table)) {
+        $(table).DataTable().ajax.reload();
+      } else {
+        $(table).DataTable({
+          'ajax': {
+            'url': <?= json_encode(route(DataFixData::class, ['tree' => $tree->name(), 'data_fix' => $data_fix->name()]), JSON_THROW_ON_ERROR) ?>,
+            'data': function (data) {
+              $.extend(data, getParams());
             }
-
-            container.classList.remove('d-none');
+          }
         });
+      }
+
+      container.classList.remove('d-none');
+    });
 
-        document.getElementById('btn-update-all').addEventListener('click', function (event) {
-            event.preventDefault();
+    document.getElementById('btn-update-all').addEventListener('click', function (event) {
+      event.preventDefault();
 
-            progressbar.innerHTML = '';
-            progressbar.style.width = '0%';
+      progressbar.innerHTML = '';
+      progressbar.style.width = '0%';
 
-            container.classList.add('d-none');
-            progress.classList.remove('d-none');
+      container.classList.add('d-none');
+      progress.classList.remove('d-none');
 
-            let url = addParamsToUrl(<?= json_encode(route(DataFixUpdateAll::class, ['tree' => $tree->name(), 'data_fix' => $data_fix->name()]), JSON_THROW_ON_ERROR) ?>);
+      let url = addParamsToUrl(<?= json_encode(route(DataFixUpdateAll::class, ['tree' => $tree->name(), 'data_fix' => $data_fix->name()]), JSON_THROW_ON_ERROR) ?>);
 
-            fetch(url, {
-                headers: new Headers({
-                    'X-CSRF-TOKEN': $('meta[name=csrf]').attr('content'),
-                    'X-Requested-with': 'XMLHttpRequest',
-                }),
-                method: 'POST',
-            }).then(function (response) {
-                return response.json();
-            }).then(async function (data) {
-                queue = data;
-                while (queue.length > 0) {
-                    let datum = queue.shift();
-                    await fetch(datum.url, {
-                        headers: new Headers({
-                            'X-CSRF-TOKEN': $('meta[name=csrf]').attr('content'),
-                            'X-Requested-with': 'XMLHttpRequest',
-                        }),
-                        method: 'POST',
-                    }).then(function () {
-                        let progressbar = progress.querySelector('.progress-bar');
-                        progressbar.innerHTML = datum.progress;
-                        progressbar.style.width = datum.percent;
-                    });
-                }
-            }).catch(function (error) {
-                progress.innerHTML = error;
-            });
+      webtrees.httpPost(url)
+        .then(function (response) {
+          return response.json();
+        })
+        .then(async function (data) {
+          queue = data;
+          while (queue.length > 0) {
+            let datum = queue.shift();
+            await webtrees.httpPost(datum.url)
+              .then(function () {
+                let progressbar = progress.querySelector('.progress-bar');
+                progressbar.innerHTML = datum.progress;
+                progressbar.style.width = datum.percent;
+              });
+          }
+        })
+        .catch(function (error) {
+          progress.innerHTML = error;
         });
-    })();
+    });
+  })();
 </script>
 <?php View::endpush() ?>
diff --git a/resources/views/individual-page-tabs.phtml b/resources/views/individual-page-tabs.phtml
index a99a6790de..21afb659f1 100644
--- a/resources/views/individual-page-tabs.phtml
+++ b/resources/views/individual-page-tabs.phtml
@@ -40,9 +40,7 @@ use Illuminate\Support\Collection;
     let target = $(this.hash + ':empty');
     if (target.length > 0) {
       // Start the download immediately...
-      let download = fetch(this.dataset.wtHref, {
-        headers: new Headers({ 'X-Requested-with': 'XMLHttpRequest' }),
-      });
+      let download = webtrees.httpGet(this.dataset.wtHref);
 
       // ...but don't insert it until the tab is ready.
       $(this).one('shown.bs.tab', () => {
diff --git a/resources/views/modules/census-assistant.phtml b/resources/views/modules/census-assistant.phtml
index 1aa312f707..5fe4f69d6d 100644
--- a/resources/views/modules/census-assistant.phtml
+++ b/resources/views/modules/census-assistant.phtml
@@ -85,7 +85,7 @@ use Fisharebest\Webtrees\View;
 <?php View::push('javascript') ?>
 <script>
   // When a census date/place is selected, activate the census-assistant
-  function censusAssistantSelect() {
+  function censusAssistantSelect () {
     const select = this;
     const option = select.options[select.selectedIndex];
     const form = select.closest('form');
@@ -93,11 +93,11 @@ use Fisharebest\Webtrees\View;
     form.querySelector('.census-assistant-class').value = option.dataset.wtCensus;
 
     var censusAssistantLink = document.querySelector('.census-assistant-link');
-    var censusAssistant     = document.querySelector('#census-assistant');
-    var censusOption        = this.options[this.selectedIndex];
-    var census              = censusOption.dataset.wtCensus;
-    var censusPlace         = censusOption.dataset.wtPlace;
-    var censusYear          = censusOption.dataset.wtDate.substr(-4);
+    var censusAssistant = document.querySelector('#census-assistant');
+    var censusOption = this.options[this.selectedIndex];
+    var census = censusOption.dataset.wtCensus;
+    var censusPlace = censusOption.dataset.wtPlace;
+    var censusYear = censusOption.dataset.wtDate.substr(-4);
 
     if (censusOption.value !== '') {
       censusAssistantLink.removeAttribute('hidden');
@@ -113,20 +113,17 @@ use Fisharebest\Webtrees\View;
     formData.append('census', census);
     formData.append('_csrf', document.querySelector('meta[name=csrf]').content);
 
-    fetch(<?= json_encode(route('module', ['module' => 'GEDFact_assistant', 'action' => 'CensusHeader', 'tree' => $individual->tree()->name()]), JSON_THROW_ON_ERROR) ?>, {
-        credentials: 'same-origin',
-        body: formData,
-        method: 'POST',
-    })
-    .then(response => response.text())
-    .then(function (text) {
+    const url = <?= json_encode(route('module', ['module' => 'GEDFact_assistant', 'action' => 'CensusHeader', 'tree' => $individual->tree()->name()]), JSON_THROW_ON_ERROR) ?>;
+    webtrees.httpPost(url, formData)
+      .then(response => response.text())
+      .then(function (text) {
         document.querySelector('#census-assistant-table thead').innerHTML = text;
         document.querySelector('#census-assistant-table tbody').innerHTML = '';
-    });
+      });
   }
 
   // When the census assistant is activated, show the input fields
-  function censusAssistantLink() {
+  function censusAssistantLink () {
     document.querySelector('.census-selector').setAttribute('hidden', '');
     this.setAttribute('hidden', '');
     document.getElementById('census-assistant').removeAttribute('hidden');
@@ -137,13 +134,13 @@ use Fisharebest\Webtrees\View;
   }
 
   // Add the currently selected individual to the census
-  function censusAssistantAdd() {
+  function censusAssistantAdd () {
     var censusSelector = document.querySelector('.census-selector');
-    var census         = censusSelector.options[censusSelector.selectedIndex].dataset.wtCensus;
-    var indi_selector  = document.querySelector('#census-assistant-individual');
-    var xref           = indi_selector.options[indi_selector.selectedIndex].value;
-    var headInput      = document.querySelector('#census-assistant-table td input');
-    var head           = headInput === null ? xref : headInput.value;
+    var census = censusSelector.options[censusSelector.selectedIndex].dataset.wtCensus;
+    var indi_selector = document.querySelector('#census-assistant-individual');
+    var xref = indi_selector.options[indi_selector.selectedIndex].value;
+    var headInput = document.querySelector('#census-assistant-table td input');
+    var head = headInput === null ? xref : headInput.value;
 
     let formData = new FormData();
     formData.append('census', census);
@@ -151,11 +148,9 @@ use Fisharebest\Webtrees\View;
     formData.append('head', head);
     formData.append('xref', xref);
 
-    fetch(<?= json_encode(route('module', ['module' => 'GEDFact_assistant', 'action' => 'CensusIndividual', 'tree' => $individual->tree()->name()]), JSON_THROW_ON_ERROR) ?>, {
-      credentials: 'same-origin',
-      body: formData,
-      method: 'POST'
-    })
+    const url = <?= json_encode(route('module', ['module' => 'GEDFact_assistant', 'action' => 'CensusIndividual', 'tree' => $individual->tree()->name()]), JSON_THROW_ON_ERROR) ?>;
+
+    webtrees.httpPost(url, formData)
       .then(response => response.text())
       .then(function (text) {
         document.querySelector('#census-assistant-table tbody').insertAdjacentHTML('beforeend', text);
@@ -182,7 +177,7 @@ use Fisharebest\Webtrees\View;
       if (el.target.matches('.wt-icon-delete')) {
         el.target.closest('tr').remove();
       }
-    })
-  })
+    });
+  });
 </script>
 <?php View::endpush() ?>