brought back 7.5 file-upload as file-upload-multiple-posts; updated to latest API

renamed form-upload to file-upload-html-form
renamed file-upload to file-upload-single-post

examples/file-upload-multiple-posts/web_root/app.js

@@ -0,0 +1,41 @@
+// Copyright (c) 2020 Cesanta Software Limited
+// All rights reserved
+
+// Helper function to display upload status
+var setStatus = function(text) {
+  document.getElementById('el3').innerText = text;
+};
+
+// When user clicks on a button, trigger file selection dialog
+var button = document.getElementById('el2');
+button.onclick = function(ev) {
+  input.click();
+};
+
+// Send a large blob of data chunk by chunk
+var sendFileData = function(name, data, chunkSize) {
+  var sendChunk = function(offset) {
+    var chunk = data.subarray(offset, offset + chunkSize) || '';
+    var opts = {method: 'POST', body: chunk};
+    var url = '/upload?offset=' + offset + '&name=' + encodeURIComponent(name);
+    setStatus(
+        'sending bytes ' + offset + '..' + (offset + chunk.length) + ' of ' +
+        data.length);
+    fetch(url, opts).then(function(res) {
+      if (chunk.length > 0) sendChunk(offset + chunk.length);
+    });
+  };
+  sendChunk(0);
+};
+
+// If user selected a file, read it into memory and trigger sendFileData()
+var input = document.getElementById('el1');
+input.onchange = function(ev) {
+  if (!ev.target.files[0]) return;
+  var f = ev.target.files[0], r = new FileReader();
+  r.readAsArrayBuffer(f);
+  r.onload = function() {
+    ev.target.value = '';
+    sendFileData(f.name, new Uint8Array(r.result), 4096);
+  };
+};

examples/file-upload-multiple-posts/web_root/index.html

@@ -0,0 +1,36 @@
+<!DOCTYPE html>
+<html lang="en">
+  <head>
+    <title>example</title>
+    <meta charset="utf-8" />
+    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
+    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+    <style>
+      #container { margin-right: auto; margin-left: auto; max-width: 480px; }
+      #info { background: #e0f0f0; border-radius: .5em; padding: 2em;  }
+      #wrapper { margin-top: 1em; }
+    </style>
+  </head>
+  <body>
+    <div id="container">
+      <div id="info">
+        Mongoose always buffers a full HTTP message before invoking
+        the MG_EV_HTTP_MSG event. A big POST request would require a lot
+        of RAM to buffer everything. Therefore, in order to upload large
+        files on memory-constrained systems, a large file should be sent
+        in small chunks.
+        <br/><br/>
+        In this example, the JavaScript code on this page sends the chosen
+        file in 4K chunks using the <code>/upload</code> endpoint.
+        The uploaded file is stored in the <code>/tmp</code> directory by
+        the helper API function <code>mg_http_upload()</code>
+      </div>
+      <div id="wrapper">
+        <input type="file" id="el1" style="display: none"/>
+        <button id="el2">choose file...</button>
+        <div id="el3"></div>
+      </div>
+    </div>
+  </body>
+  <script src="app.js"></script>
+</html>