diff --git a/client/index.css b/client/index.css
new file mode 100644
index 0000000..d4f8bea
--- /dev/null
+++ b/client/index.css
@@ -0,0 +1,10 @@
+#drop_zone {
+ border: 1.5px solid #bbb;
+ -moz-border-radius: 5px;
+ -webkit-border-radius: 5px;
+ border-radius: 5px;
+ padding: 25px;
+ text-align: center;
+ font: 20pt 'Helvetica-Light';
+ color: #bbb;
+}
diff --git a/client/index.html b/client/index.html
new file mode 100644
index 0000000..83a913b
--- /dev/null
+++ b/client/index.html
@@ -0,0 +1,10 @@
+
+
+
+
+
+ Drop Files Here
+
+
+
+
diff --git a/client/index.js b/client/index.js
index e69de29..1582766 100644
--- a/client/index.js
+++ b/client/index.js
@@ -0,0 +1,48 @@
+var files = []
+
+function handleFileSelect(evt) {
+ evt.stopPropagation();
+ evt.preventDefault();
+
+ files = evt.dataTransfer.files; // FileList object.
+
+ // files is a FileList of File objects. List some properties.
+ var output = [];
+ metadata = [];
+ for (var i = 0, file; file = files[i]; i++) {
+ output.push('', escape(file.name), ' (', file.type || 'n/a', ') - ',
+ file.size, ' bytes, last modified: ',
+ file.lastModifiedDate ? file.lastModifiedDate.toLocaleDateString() : 'n/a',
+ '');
+ var metadaton = {"name":escape(file.name),
+ "size":file.size,
+ "type":file.type || 'n/a',
+ "crc" :""}
+ metadata.push(metadaton)
+ }
+ document.getElementById('list').innerHTML = '';
+ // post metadata to server
+}
+
+function send() { // perhaps need params for peer id or something
+ for (var i = 0, file; f = files[i]; i++) {
+ for (var bytes = 0; bytes <= file.size; bytes += 1200) {
+ endingByte = bytes+1200
+ if (endingByte > file.size) {
+ endingByte = file.size
+ }
+ var blob = file.slice(bytes, endingByte);
+ // send blob
+ }
+ }
+}
+
+function handleDragOver(evt) {
+ evt.stopPropagation();
+ evt.preventDefault();
+ evt.dataTransfer.dropEffect = 'copy';
+}
+
+var dropZone = document.getElementById('drop_zone');
+dropZone.addEventListener('dragover', handleDragOver, false);
+dropZone.addEventListener('drop', handleFileSelect, false);