Merge remote-tracking branch 'origin/master'

# Conflicts:
#	website/_config.yml

src/plugins/Formtag.js

@@ -0,0 +1,28 @@
+import Plugin from './Plugin';
+
+export default class Formtag extends Plugin {
+  constructor(core, opts) {
+    super(core, opts);
+    this.type = 'selecter';
+  }
+
+  run(files) {
+    console.log(files);
+    console.log(this.opts);
+
+    this.core.setProgress(this, 0);
+
+    var selected = [];
+    // for (var i in files) {
+    //   var file = files[i];
+    //   this.upload(file);
+    //   this.core.setProgress(this, (i * 1) + 1);
+    //   selected[i]     = file;
+    //   selected[i].url = this.opts.endpoint + '/selected/' + file.name;
+    // }
+
+    this.core.setProgress(this, 100);
+
+    return Promise.resolve(selected);
+  }
+}

src/plugins/Multipart.js

@@ -4,6 +4,18 @@ export default class Multipart extends Plugin {
   constructor(core, opts) {
     super(core, opts);
     this.type = 'uploader';
+
+    try {
+        if (XMLHttpRequest.prototype.sendAsBinary) return;
+        XMLHttpRequest.prototype.sendAsBinary = function (datastr) {
+            function byteValue(x) {
+                return x.charCodeAt(0) & 0xff;
+            }
+            var ords = Array.prototype.map.call(datastr, byteValue);
+            var ui8a = new Uint8Array(ords);
+            this.send(ui8a.buffer);
+        }
+    } catch (e) {}
   }
 
   run(files) {
@@ -23,27 +35,33 @@ export default class Multipart extends Plugin {
     return Promise.resolve(uploaded);
   }
 
-  upload(data) {
-    this.displayStatus('Uploading...');
+  upload(file) {
+    const boundary = '---------------------------' + Date.now().toString(16);
+    const request  = new XMLHttpRequest();
+
+    const data = { segments: []};
+    data.segments.push(file);
 
-    const request = new XMLHttpRequest();
-    boundary = '---------------------------' + Date.now().toString(16);
+    request.open('POST', 'http://api2.transloadit.com', true);
     request.setRequestHeader('Content-Type', 'multipart\/form-data; boundary=' + boundary);
-    request.sendAsBinary('--' + boundary + '\r\n' + oData.segments.join('--' + boundary + '\r\n') + '--' + boundary + '--\r\n');
+    request.sendAsBinary('--' + boundary + '\r\n' + data.segments.join('--' + boundary + '\r\n') + '--' + boundary + '--\r\n');
+
+    // var request=new XMLHttpRequest();
+    // request.open("POST", domain, true);
+    // request.setRequestHeader("Content-type","multipart/form-data");
+    // var formData = new FormData();
+    // formData.append("data", data_json_string);
+    // request.send(formData);
 
-    request.addEventListener('load', () => {
-      console.log('fucking done!');
-      this.displayStatus('Done.');
-    });
 
     request.addEventListener('load', () => {
-      this.displayStatus('Done.');
+      console.log('fucking done!');
     });
 
     request.addEventListener('error', () => {
       console.log('fucking error!');
     });
 
-    request.send(data);
+    request.send();
   }
 }

src/plugins/index.js

@@ -4,6 +4,7 @@ import Plugin from './Plugin';
 // Selecters
 import DragDrop from './DragDrop';
 import Dropbox from './Dropbox';
+import Formtag from './Formtag';
 
 // Uploaders
 import Tus10 from './Tus10';
@@ -16,6 +17,7 @@ export default {
   Plugin,
   DragDrop,
   Dropbox,
+  Formtag,
   Tus10,
   Multipart,
   TransloaditBasic

website/_config.yml

@@ -5,9 +5,9 @@
 # Uppy versions, auto updated by update.js
 uppy_version: 0.0.1
 
-uppy_dev_size: "74.37"
-uppy_min_size: "74.37"
-uppy_gz_size: "74.37"
+uppy_dev_size: "78.16"
+uppy_min_size: "78.16"
+uppy_gz_size: "78.16"
 
 # Theme
 google_analytics: UA-63083-12

website/src/examples/dragdrop/app.css

@@ -1,6 +1,4 @@
-/**
-* Drag & Drop CSS to style the demo itself
-*/
+/* Drag & Drop CSS to style the demo itself */
 
 .UppyDragDrop-puppy {
   max-width: 80px;

website/src/examples/multipart/app.es6

@@ -0,0 +1,8 @@
+import Uppy from 'uppy/core';
+import { Formtag, Multipart } from 'uppy/plugins';
+
+const uppy = new Uppy({wait: false});
+const files = uppy
+  .use(Formtag, {selector: '#upload-form'})
+  .use(Multipart, {endpoint: 'http://api2.transloadit.com'})
+  .run();

website/src/examples/multipart/app.html

@@ -0,0 +1,8 @@
+<!-- Basic Uppy styles -->
+<link rel="stylesheet" href="/css/uppy.css">
+
+<form id="upload-form" class="UppyDragDrop" method="post" action="/" enctype="multipart/form-data">
+  <input id="input-file" class="UppyDragDrop-input" type="file" name="files[]" data-multiple-caption="{count} files selected" multiple />
+  <label class="UppyDragDrop-label" for="input-file"><strong>Choose a file</strong></label>
+  <button class="UppyDragDrop-btn" type="submit">Upload</button>
+</form>

website/src/examples/multipart/index.ejs

@@ -0,0 +1,29 @@
+---
+title: Multipart Form Uploads
+layout: example
+type: examples
+order: 3
+---
+
+{% blockquote %}
+Here you'll see a demo of how you might set up Multipart Uploads with Uppy.
+{% endblockquote %}
+
+<% include app.html %>
+<script src="app.js"></script>
+
+<hr />
+
+<p id="console-wrapper">
+  Console output (latest logs are at the top): <br />
+</p>
+
+<p>
+  On this page we're using the following HTML snippet:
+</p>
+{% include_code lang:html dragdrop/app.html %}
+
+<p>
+  Along with this JavaScript:
+</p>
+{% include_code lang:js dragdrop/app.es6 %}

website/src/guide/contributing.md

@@ -14,7 +14,34 @@ cd uppy
 npm install
 ```
 
-Our website's examples section is also our playground, read "Website Development"'s "Getting Started" section to get up and running.
+Our website's examples section is also our playground, read "Website Development"'s "Local Previews" section to get up and running.
+
+## Website Development
+
+We keep the [uppyjs.io](http://uppyjs.io) website in `./website` for so it's easy to keep docs & code in sync as we're still iterating at high velocity. For those reading this screaming murder, [HashiCorp does this](https://github.com/hashicorp/terraform/tree/master/website) for all their projects, and it's working well for them on a scale vastly more impressive than Uppy's.
+
+The site is built with [Hexo](http://hexo.io/), and Travis automatically deploys this onto GitHub Pages (it overwrites the `gh-pages` branch with Hexo's build at every change to `master`). The content is written in Markdown and located in `./website/src`. Feel free to fork & hack!  
+
+Even though bundled in this repo, the website is regarded as a separate project. So it has its own `package.json` and we aim keep the surface where the two projects interface as small as possible. `./website/update.js` is called during website builds to inject the Uppy knowledge into the site.
+
+### Local Previews
+
+It's recommended to exclude `./website/public/` from your editor if you want efficient searches.
+
+For local previews on http://127.0.0.1:4000 type:
+
+```bash
+npm run web
+```
+
+If you want to work on Uppy itself, and see its changes reflected in the website, open a new tab and type:
+
+```bash
+npm run watch
+# Or if you're only interested in one of these:
+npm run watch:js
+npm run watch:css
+```
 
 ## CSS Guidelines
 
@@ -118,30 +145,3 @@ h1 {
   width: 940px;
 }
 ```
-
-## Website Development
-
-We keep the [uppyjs.io](http://uppyjs.io) website in `./website` for so it's easy to keep docs & code in sync as we're still iterating at high velocity. For those reading this screaming murder, [HashiCorp does this](https://github.com/hashicorp/terraform/tree/master/website) for all their projects, and it's working well for them on a scale vastly more impressive than Uppy's.
-
-The site is built with [Hexo](http://hexo.io/), and Travis automatically deploys this onto GitHub Pages (it overwrites the `gh-pages` branch with Hexo's build at every change to `master`). The content is written in Markdown and located in `./website/src`. Feel free to fork & hack!  
-
-Even though bundled in this repo, the website is regarded as a separate project. So it has its own `package.json` and we aim keep the surface where the two projects interface as small as possible. `./website/update.js` is called during website builds to inject the Uppy knowledge into the site.
-
-### Getting Started
-
-It's recommended to exclude `./website/public/` from your editor if you want efficient searches.
-
-For local previews on http://127.0.0.1:4000 type:
-
-```bash
-npm run web
-```
-
-If you want to work on Uppy itself, and see its changes reflected in the website, open a new tab and type:
-
-```bash
-npm run watch
-# Or if you're only interested in one of these:
-npm run watch:js
-npm run watch:css
-```

website/src/guide/faq.md

@@ -7,14 +7,3 @@ title: "FAQ"
 ## Why does your site look like vuejs.org?
 
 The website is currently a clone of Yuxi Evan You's wonderful [Vue.js](http://vuejs.org/) website ([view license](website/VUEORG_LICENSE)) - just so we can hit the ground running in terms of Haxo boilerplate, etc. Obviously as soon as possible, we'll start rolling out our own layout & content and make this place our own. We'll keep the Vue website MIT license & credit in the footer in tact of course.
-
-## What does Travis do?
-
-Travis should:
-
-- [x] check out code 
-- [x] build project
-- [ ] run unit tests
-- [ ] run acceptance tests
-- [x] copy/install the built project into any `examples/*/`
-- [x] deploy the examples to our hackathon S3 bucket in a folder named by branch (http://hackathon.transloadit.com/uppy/master/index.html), so we can all play with the current state of the project & examples per branch, without installing everything locally.

website/src/guide/getting-started.md

@@ -13,31 +13,11 @@ NPM is the recommended installation method when building large scale apps with U
 
 ``` bash
 # latest stable
-$ npm install uppy
+$ npm install --save uppy
 ```
 
-``` javascript
-import Uppy from 'uppy/core';
-import { DragDrop, Tus10 } from 'uppy/plugins';
-
-const uppy = new Uppy({wait: false});
-const files = uppy
-  .use(DragDrop, {selector: '#upload-target'})
-  .use(Tus10, {endpoint: 'http://master.tus.io:8080'})
-  .run();
-```
+{% include_code lang:js dragdrop/app.es6 %}
 
 ## Standalone & CDN
 
-``` html
-<div id="drag-drop"></div>
-
-<script src="http://assets.transloadit.com/uppy.min.js" />
-<script>
-var uppy = new Uppy();
-uppy
-  .use(DragDrop, {selector: '#drag-drop'})
-  .use(Tus10, {endpoint: 'http://master.tus.io:8080'})
-  .run();
-</script>
-```
+{% include_code lang:html cdn/app.html %}