Set the baseURL for ajax requests (#373)

* Set the baseURL for ajax requests

* Use async/await on AJAX calls

* Add mix_public() cache generated asset cache busting

* Move storage container into separate class

* Fix some styling

resources/js/admin/airport_lookup.js

@@ -1,18 +1,17 @@
+'use strict';
+
 /**
  * Lookup an airport from the server
- * @param icao
- * @param callback
+ *
+ * @param {String} icao
  */
-export default (icao, callback) => {
+export default async (icao) => {
     let params = {
         method: 'GET',
         url: '/api/airports/' + icao + '/lookup',
     };
 
-    console.log('Looking airport up');
-    axios(params)
-        .then(response => {
-            console.log(response);
-            callback(response.data);
-        });
+    const response = await axios(params);
+    console.log('lookup raw response: ', response);
+    return response.data;
 };

resources/js/admin/calculate_distance.js

@@ -1,19 +1,16 @@
 /**
  * Lookup an airport from the server
- * @param fromICAO
- * @param toICAO
- * @param callback
+ *
+ * @param {String} fromICAO
+ * @param {String} toICAO
  */
-export default (fromICAO, toICAO, callback) => {
+export default async (fromICAO, toICAO) => {
     let params = {
         method: 'GET',
         url: '/api/airports/' + fromICAO + '/distance/' + toICAO,
     };
 
-    console.log('Calcuating airport distance');
-    axios(params)
-        .then(response => {
-            console.log(response);
-            callback(response.data);
-        });
+    const response = await axios(params);
+    console.log('distance raw response: ', response);
+    return response.data;
 };

resources/js/bootstrap.js

@@ -2,12 +2,18 @@
  * Bootstrap any Javascript libraries required
  */
 
+
 window.axios = require('axios');
 
+import Storage from "./storage";
+
 /**
  * Container for phpVMS specific functions
  */
-window.phpvms = {};
+window.phpvms = {
+  config: {},
+  Storage,
+};
 
 /**
  * Configure Axios with both the csrf token and the API key
@@ -15,17 +21,17 @@ window.phpvms = {};
 
 const base_url = document.head.querySelector('meta[name="base-url"]');
 if(base_url) {
-  window.axios.default.baseURL = base_url;
+  console.log(`baseURL=${base_url.content}`);
+  window.phpvms.config.base_url = base_url.content;
+  window.axios.default.baseURL = base_url.content;
 }
 
 window.axios.defaults.headers.common['X-Requested-With'] = 'XMLHttpRequest';
 const token = document.head.querySelector('meta[name="csrf-token"]');
 
 if (token) {
+  window.phpvms.config.csrf_token = token.content;
   window.axios.defaults.headers.common['X-CSRF-TOKEN'] = token.content
-  /*window.jquery.ajaxSetup({
-    'X-CSRF-TOKEN': token.content
-  })*/
 } else {
   console.error('CSRF token not found: https://laravel.com/docs/csrf#csrf-x-csrf-token')
 }
@@ -33,8 +39,10 @@ if (token) {
 const api_key = document.head.querySelector('meta[name="api-key"]');
 if (api_key) {
   window.axios.defaults.headers.common['x-api-key'] = api_key.content;
+  window.phpvms.config.user_api_key = api_key.content;
   window.PHPVMS_USER_API_KEY = api_key.content
 } else {
+  window.phpvms.config.user_api_key = false;
   window.PHPVMS_USER_API_KEY = false;
   console.error('API Key not found!')
 }

resources/js/frontend/app.js

@@ -1,5 +1,12 @@
 
 require('./../bootstrap');
 
+// Import the bids functionality
+import {addBid, removeBid} from './bids';
+window.phpvms.bids = {
+    addBid,
+    removeBid,
+};
+
 // Import the mapping function
 window.phpvms.map = require('../maps/index');

resources/js/frontend/bids.js

@@ -0,0 +1,41 @@
+'use strict';
+
+/**
+ * Add a bid to a flight
+ *
+ * @param {String} flight_id
+ *
+ * @returns {Promise<*>}
+ */
+export async function addBid(flight_id) {
+    const params = {
+        method: 'POST',
+        url: '/api/user/bids',
+        data: {
+            '_method': 'POST',
+            'flight_id': flight_id
+        }
+    };
+
+    return axios(params);
+}
+
+/**
+ * Remove a bid from a given flight
+ *
+ * @param {String} flight_id
+ *
+ * @returns {Promise<*>}
+ */
+export async function removeBid(flight_id) {
+    const params = {
+        method: 'POST',
+        url: '/api/user/bids',
+        data: {
+            '_method': 'DELETE',
+            'flight_id': flight_id
+        }
+    };
+
+    return axios(params);
+}

resources/js/storage.js

@@ -0,0 +1,77 @@
+'use strict';
+
+/**
+ * Simple browser storage interface
+ */
+export default class Storage {
+    constructor(name, default_value) {
+        this.name = name;
+
+        // Read the object from storage; if it doesn't exist, set
+        // it to the default value
+        const st = window.localStorage.getItem(this.name);
+        if (!st) {
+            console.log('Nothing found in storage, starting from default');
+            this.data = default_value;
+        } else {
+            console.log('Found in storage: ', st);
+            this.data = JSON.parse(st);
+        }
+    }
+
+    /**
+     * Save to local storage
+     */
+    save() {
+        window.localStorage.setItem(this.name, JSON.stringify(this.data));
+    }
+
+    /**
+     * Return a list from a given key
+     *
+     * @param {String} key
+     *
+     * @returns {Array|*}
+     */
+    getList(key) {
+        if (!(key in this.data)) {
+            return [];
+        }
+
+        return this.data[key];
+    }
+
+    /**
+     * Add `value` to a given `key`
+     *
+     * @param {string} key
+     * @param {*} value
+     */
+    addToList(key, value) {
+        if (!(key in this.data)) {
+            this.data[key] = [];
+        }
+
+        const index = this.data[key].indexOf(value);
+        if (index === -1) {
+            this.data[key].push(value);
+        }
+    }
+
+    /**
+     * Remove `value` from the given `key`
+     *
+     * @param {String} key
+     * @param {*} value
+     */
+    removeFromList(key, value) {
+        if (!(key in this.data)) {
+            return;
+        }
+
+        const index = this.data[key].indexOf(value);
+        if (index !== -1) {
+            this.data[key].splice(index, 1);
+        }
+    }
+}