Multiple File Upload with RingoJS

01_upload.html

<h1>Upload photos</h1>
<form action="/upload/" method="POST" enctype="multipart/form-data">
	<input type="file" name="photos[]" multiple="multiple" />
	<hr style="clear: both; border: 0;">
	<input type="submit" value="Upload photos" />
</form>

02_ringojs-upload.js

/*
 * Mounted: /upload
 * Note: this is just a skeleton app and will not work out of the box. But it's good to get the idea!
 */

var log = require("ringo/logging").getLogger(module.id);
var response = require('ringo/jsgi/response');
var fs = require("fs");

var {Application, helpers} = require("stick");
var app = exports.app = Application();

// The magic: upload and params middleware. They parse the incomming parameters and provide req.postParams.XYZ
app.configure("upload", "params", "mount", "route", "render");

app.render.base = module.resolve("templates");
app.render.master = "base.html";

app.get("/", function(req) {
   return app.render("upload.html", {
      title: "Upload photos"
   });
});

app.post("/", function(req) {
   var res = "<ul>";
   
   for (var i in req.postParams) {
      res += "<li>" + i + "  ->  " + req.postParams[i]
      if (typeof req.postParams[i] == "object") {
         res += "<ul>";
         for (var u in req.postParams[i]) {
            res += "<li>" + u + "  ->  " + JSON.stringify(req.postParams[i][u]);

            // Write the file to the disk
            var path = "./public-files/photos/" + req.postParams[i][u]["filename"];
            fs.write(path, req.postParams[i][u]["value"]);
         }
         res += "</ul>";
      }
   }
   res += "</ul>";

   return response.html("<h1>Upload!</h1>" + res);
});

03_response.html

<h1>Upload!</h1>
<ul>
   <li>photos  ->  [object Object],[object Object],[object Object]
   <ul>
      <li>0  ->  {"name":"photos[]","filename":"20110820_1656-001.jpg","contentType":"image/jpeg","value":{}}
      <li>1  ->  {"name":"photos[]","filename":"20110820_1700-002.jpg","contentType":"image/jpeg","value":{}}
      <li>2  ->  {"name":"photos[]","filename":"20110820_1748-003.jpg","contentType":"image/jpeg","value":{}}
   </ul>
</ul>

Note: this is just a skeleton app and will not work out of the box. But it's good to get the idea.