3 files changed, 273 insertions, 0 deletions
diff --git a/axios/sandbox/client.html b/axios/sandbox/client.html
new file mode 100644
index 0000000..55051c2
--- /dev/null
+++ b/axios/sandbox/client.html
@@ -0,0 +1,173 @@
+<!doctype html>
+<html>
+<head>
+  <title>axios</title>
+  <link rel="stylesheet" type="text/css" href="//maxcdn.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css"/>
+  <style type="text/css">
+    pre {
+      max-height: 200px;
+      min-height: 39px;
+      overflow: auto;
+    }
+  </style>
+</head>
+<body class="container">
+  <h1>axios</h1>
+
+  <div class="well">
+    <h3>Input</h3>
+    <form role="form" onsubmit="return false;">
+      <div class="form-group">
+        <label for="url">URL</label>
+        <input id="url" type="url" class="form-control" placeholder="/api"/>
+      </div>
+      <div class="form-group">
+        <label for="method">Method</label>
+        <select id="method" class="form-control">
+          <option value="GET">GET</option>
+          <option value="POST">POST</option>
+          <option value="PUT">PUT</option>
+          <option value="DELETE">DELETE</option>
+          <option value="HEAD">HEAD</option>
+          <option value="PATCH">PATCH</option>
+        </select>
+      </div>
+      <div class="form-group">
+        <label for="params">Params</label>
+        <textarea id="params" class="form-control" placeholder='{"foo": "bar", "baz": 123.45}'></textarea>
+      </div>
+      <div class="form-group" style="display: none;">
+        <label for="data">Data</label>
+        <textarea id="data" class="form-control" placeholder='{"foo": "bar", "baz": 123.45}'></textarea>
+      </div>
+      <div class="form-group">
+        <label for="headers">Headers</label>
+        <textarea id="headers" class="form-control" placeholder='{"X-Requested-With": "XMLHttpRequest"}'></textarea>
+      </div>
+      <button id="submit" type="submit" class="btn btn-primary">Send Request</button>
+    </form>
+  </div>
+
+  <div class="well">
+    <h3>Request</h3>
+    <pre id="request">No Data</pre>
+  </div>
+
+  <div class="well">
+    <h3>Response</h3>
+    <pre id="response">No Data</pre>
+  </div>
+
+  <script src="/axios.js"></script>
+  <script>
+    (function () {
+      // Just for you IE8
+      if (typeof Array.prototype.indexOf === 'undefined') {
+        Array.prototype.indexOf = function (item) {
+          for (var i=0, l=this.length; i<l; i++) {
+            if (this[i] === item) {
+              return i;
+            }
+          }
+          return -1;
+        }
+      }
+
+      var url = document.getElementById('url');
+      var method = document.getElementById('method');
+      var params = document.getElementById('params');
+      var data = document.getElementById('data');
+      var headers = document.getElementById('headers');
+      var submit = document.getElementById('submit');
+      var request = document.getElementById('request');
+      var response = document.getElementById('response');
+
+      function acceptsData(method) {
+        return ['PATCH', 'POST', 'PUT'].indexOf(method) > -1;
+      }
+
+      function getUrl() {
+        return url.value.length === 0 ? '/api' : url.value;
+      }
+
+      function getParams() {
+        return params.value.length === 0 ? null : JSON.parse(params.value);
+      }
+
+      function getData() {
+        return data.value.length === 0 ? null : JSON.parse(data.value);
+      }
+
+      function getHeaders() {
+        return headers.value.length === 0 ? null : JSON.parse(headers.value);
+      }
+
+      function syncWithLocalStorage() {
+        method.value = localStorage.getItem('method') || 'GET';
+        params.value = localStorage.getItem('params') || '';
+        data.value = localStorage.getItem('data') || '';
+        headers.value = localStorage.getItem('headers') || '';
+      }
+
+      function syncParamsAndData() {
+        switch (method.value) {
+          case 'PATCH':
+          case 'POST':
+          case 'PUT':
+            params.parentNode.style.display = 'none';
+            data.parentNode.style.display = '';
+            break;
+          default:
+            params.parentNode.style.display = '';
+            data.parentNode.style.display = 'none';
+            break;
+        }
+      }
+
+      submit.onclick = function () {
+        var options = {
+          url: getUrl(),
+          params: !acceptsData(method.value) ? getParams() : undefined,
+          data: acceptsData(method.value) ? getData() : undefined,
+          method: method.value,
+          headers: getHeaders()
+        };
+
+        request.innerHTML = JSON.stringify(options, null, 2);
+
+        axios(options)
+          .then(function (res) {
+            response.innerHTML = JSON.stringify(res.data, null, 2);
+          })
+          .catch(function (res) {
+            response.innerHTML = JSON.stringify(res.data, null, 2);
+          });
+      };
+
+      url.onchange = function () {
+        localStorage.setItem('url', url.value);
+      };
+
+      method.onchange = function () {
+        localStorage.setItem('method', method.value);
+        syncParamsAndData();
+      };
+
+      params.onchange = function () {
+        localStorage.setItem('params', params.value);
+      };
+
+      data.onchange = function () {
+        localStorage.setItem('data', data.value);
+      };
+
+      headers.onchange = function () {
+        localStorage.setItem('headers', headers.value);
+      };
+
+      syncWithLocalStorage();
+      syncParamsAndData();
+    })();
+  </script>
+</body>
+</html>
+\ No newline at end of file
diff --git a/axios/sandbox/client.js b/axios/sandbox/client.js
new file mode 100644
index 0000000..9a18a69
--- /dev/null
+++ b/axios/sandbox/client.js
@@ -0,0 +1,20 @@
+var axios = require('../index');
+
+var URL = 'http://127.0.0.1:3000/api';
+var BODY = {
+  foo: 'bar',
+  baz: 1234
+};
+
+function handleSuccess(data) { console.log(data); }
+function handleFailure(data) { console.log('error', data); }
+
+// GET
+axios.get(URL, { params: BODY })
+  .then(handleSuccess)
+  .catch(handleFailure);
+
+// POST
+axios.post(URL, BODY)
+  .then(handleSuccess)
+  .catch(handleFailure);
+\ No newline at end of file
diff --git a/axios/sandbox/server.js b/axios/sandbox/server.js
new file mode 100644
index 0000000..7a5d9a9
--- /dev/null
+++ b/axios/sandbox/server.js
@@ -0,0 +1,80 @@
+var fs = require('fs');
+var url = require('url');
+var path = require('path');
+var http = require('http');
+var server;
+
+function pipeFileToResponse(res, file, type) {
+  if (type) {
+    res.writeHead(200, {
+      'Content-Type': type
+    });
+  }
+
+  fs.createReadStream(path.join(__dirname, file)).pipe(res);
+}
+
+server = http.createServer(function (req, res) {
+  req.setEncoding('utf8');
+
+  var parsed = url.parse(req.url, true);
+  var pathname = parsed.pathname;
+
+  console.log('[' + new Date() + ']', req.method, pathname);
+
+  if (pathname === '/') {
+    pathname = '/index.html';
+  }
+
+  if (pathname === '/index.html') {
+    pipeFileToResponse(res, './client.html');
+  } else if (pathname === '/axios.js') {
+    pipeFileToResponse(res, '../dist/axios.js', 'text/javascript');
+  } else if (pathname === '/axios.map') {
+    pipeFileToResponse(res, '../dist/axios.map', 'text/javascript');
+  } else if (pathname === '/api') {
+    var status;
+    var result;
+    var data = '';
+
+    req.on('data', function (chunk) {
+      data += chunk;
+    });
+
+    req.on('end', function () {
+      try {
+        status = 200;
+        result = {
+          url: req.url,
+          data: data ? JSON.parse(data) : undefined,
+          method: req.method,
+          headers: req.headers
+        };
+      } catch (e) {
+        console.error('Error:', e.message);
+        status = 400;
+        result = {
+          error: e.message
+        };
+      }
+
+      res.writeHead(status, {
+        'Content-Type': 'application/json'
+      });
+      res.end(JSON.stringify(result));
+    });
+  } else {
+    res.writeHead(404);
+    res.end('<h1>404 Not Found</h1>');
+  }
+});
+
+const PORT = 3000;
+
+server.listen(PORT, console.log(`Listening on localhost:${PORT}...`));
+server.on('error', (error) => {
+  if (error.code === 'EADDRINUSE') {
+    console.log(`Address localhost:${PORT} in use please retry when the port is available!`);
+    server.close();
+  }
+});