aboutsummaryrefslogtreecommitdiff
path: root/src
diff options
context:
space:
mode:
Diffstat (limited to 'src')
-rw-r--r--src/client/views/Main.tsx10
-rw-r--r--src/client/views/collections/CollectionViewBase.tsx83
-rw-r--r--src/server/index.ts22
3 files changed, 92 insertions, 23 deletions
diff --git a/src/client/views/Main.tsx b/src/client/views/Main.tsx
index 6f08566bc..b78f59681 100644
--- a/src/client/views/Main.tsx
+++ b/src/client/views/Main.tsx
@@ -55,16 +55,16 @@ Documents.initProtos(mainDocId, (res?: Document) => {
let pdfurl = "http://www.adobe.com/support/products/enterprise/knowledgecenter/media/c4611_sample_explain.pdf"
let weburl = "https://cs.brown.edu/courses/cs166/";
let audiourl = "http://techslides.com/demos/samples/sample.mp3";
- let videourl = "http://techslides.com/demos/sample-videos/small.mp4";
+ let videourl = "http://techslides.com/demos/sample-videos/small.mp4";
let clearDatabase = action(() => Utils.Emit(Server.Socket, MessageStore.DeleteAll, {}))
let addTextNode = action(() => Documents.TextDocument({ width: 200, height: 200, title: "a text note" }))
let addColNode = action(() => Documents.FreeformDocument([], { width: 200, height: 200, title: "a freeform collection" }));
let addSchemaNode = action(() => Documents.SchemaDocument([Documents.TextDocument()], { width: 200, height: 200, title: "a schema collection" }));
- let addVideoNode = action(() => Documents.VideoDocument(videourl, {width: 200, height:200, title: "video node"}));
+ let addVideoNode = action(() => Documents.VideoDocument(videourl, { width: 200, height: 200, title: "video node" }));
let addPDFNode = action(() => Documents.PdfDocument(pdfurl, { width: 200, height: 200, title: "a schema collection" }));
let addImageNode = action(() => Documents.ImageDocument(imgurl, { width: 200, height: 200, title: "an image of a cat" }));
let addWebNode = action(() => Documents.WebDocument(weburl, { width: 200, height: 200, title: "a sample web page" }));
- let addAudioNode = action(() => Documents.AudioDocument(audiourl,{ width: 200, height: 200, title: "audio node" } ))
+ let addAudioNode = action(() => Documents.AudioDocument(audiourl, { width: 200, height: 200, title: "audio node" }))
let addClick = (creator: () => Document) => action(() =>
mainfreeform.GetList<Document>(KeyStore.Data, []).push(creator())
);
@@ -74,8 +74,8 @@ Documents.initProtos(mainDocId, (res?: Document) => {
let webRef = React.createRef<HTMLDivElement>();
let textRef = React.createRef<HTMLDivElement>();
let schemaRef = React.createRef<HTMLDivElement>();
- let videoRef = React.createRef<HTMLDivElement>();
- let audioRef = React.createRef<HTMLDivElement>();
+ let videoRef = React.createRef<HTMLDivElement>();
+ let audioRef = React.createRef<HTMLDivElement>();
let colRef = React.createRef<HTMLDivElement>();
ReactDOM.render((
diff --git a/src/client/views/collections/CollectionViewBase.tsx b/src/client/views/collections/CollectionViewBase.tsx
index 0a3b965f2..661cec8ae 100644
--- a/src/client/views/collections/CollectionViewBase.tsx
+++ b/src/client/views/collections/CollectionViewBase.tsx
@@ -1,4 +1,4 @@
-import { action } from "mobx";
+import { action, runInAction } from "mobx";
import { Document } from "../../../fields/Document";
import { ListField } from "../../../fields/ListField";
import React = require("react");
@@ -11,6 +11,7 @@ import { Documents, DocumentOptions } from "../../documents/Documents";
import { Key } from "../../../fields/Key";
import { Transform } from "../../util/Transform";
import { CollectionView } from "./CollectionView";
+import * as request from "request";
export interface CollectionViewProps {
fieldKey: Key;
@@ -68,13 +69,17 @@ export class CollectionViewBase extends React.Component<SubCollectionViewProps>
let html = e.dataTransfer.getData("text/html");
let text = e.dataTransfer.getData("text/plain");
if (html && html.indexOf("<img") != 0) {
+ console.log("not good");
let htmlDoc = Documents.HtmlDocument(html, { ...options, width: 300, height: 300 });
htmlDoc.SetText(KeyStore.DocumentText, text);
this.props.addDocument(htmlDoc);
return;
}
+ console.log(e.dataTransfer.items.length);
+
for (let i = 0; i < e.dataTransfer.items.length; i++) {
+ const upload = window.location.origin + "/upload";
let item = e.dataTransfer.items[i];
if (item.kind === "string" && item.type.indexOf("uri") != -1) {
e.dataTransfer.items[i].getAsString(function (s) {
@@ -93,29 +98,71 @@ export class CollectionViewBase extends React.Component<SubCollectionViewProps>
})
}
- if (item.kind == "file" && item.type.indexOf("image")) {
+ if (item.kind == "file" && item.type.indexOf("image") !== -1) {
let fReader = new FileReader()
let file = item.getAsFile();
-
- fReader.addEventListener("load", action("drop", () => {
- if (fReader.result) {
- let url = "" + fReader.result;
- let doc = Documents.ImageDocument(url, options)
- let docs = that.props.Document.GetT(KeyStore.Data, ListField);
- if (docs != FieldWaiting) {
- if (!docs) {
- docs = new ListField<Document>();
- that.props.Document.Set(KeyStore.Data, docs)
- }
- docs.Data.push(doc);
- }
- }
- }), false)
+ let formData = new FormData()
if (file) {
- fReader.readAsDataURL(file)
+ formData.append('file', file)
}
+
+ fetch(upload, {
+ method: 'POST',
+ body: formData
+ })
+ .then((res: Response) => {
+ return res.json()
+ }).then(json => {
+
+ json.map((file: any) => {
+ console.log(file)
+ console.log(typeof file)
+ let path = window.location.origin + file
+ console.log(path)
+ runInAction(() => {
+ var img = Documents.ImageDocument(path, { ...options, nativeWidth: 300, width: 300, })
+ let docs = that.props.Document.GetT(KeyStore.Data, ListField);
+ if (docs != FieldWaiting) {
+ if (!docs) {
+ docs = new ListField<Document>();
+ that.props.Document.Set(KeyStore.Data, docs)
+ }
+ docs.Data.push(img);
+
+ }
+ })
+
+
+ })
+ })
+ // fReader.addEventListener("load", action("drop", () => {
+ // if (fReader.result) {
+ // let form = request.post(upload).form();
+ // form.append('file', fReader.result);
+ // // let url = "" + fReader.result;
+ // // let doc = Documents.ImageDocument(url, options)
+ // // let docs = that.props.Document.GetT(KeyStore.Data, ListField);
+ // // if (docs != FieldWaiting) {
+ // // if (!docs) {
+ // // docs = new ListField<Document>();
+ // // that.props.Document.Set(KeyStore.Data, docs)
+ // // }
+ // // docs.Data.push(doc);
+ // // }
+ // }
+ // }), false)
+ // if (file) {
+ // fReader.readAsBinaryString(file)
+ // }
+
}
+ // request.post(upload, {
+ // body: {
+ // test: "DEAR GOD PLEASE SEND! (NEITHER)",
+ // },
+ // json: true
+ // })
}
}
}
diff --git a/src/server/index.ts b/src/server/index.ts
index 4c2e09661..0d0b65b22 100644
--- a/src/server/index.ts
+++ b/src/server/index.ts
@@ -4,6 +4,7 @@ import * as webpack from 'webpack'
import * as wdm from 'webpack-dev-middleware';
import * as whm from 'webpack-hot-middleware';
import * as path from 'path'
+import * as formidable from 'formidable'
import * as passport from 'passport';
import { MessageStore, Message, SetFieldArgs, GetFieldArgs, Transferable } from "./Message";
import { Client } from './Client';
@@ -74,6 +75,27 @@ app.post("/signup", postSignup);
app.get("/login", getLogin);
app.post("/login", postLogin);
+// IMAGE UPLOADING HANDLER
+app.post("/upload", (req, res, err) => {
+ let form = new formidable.IncomingForm()
+ form.uploadDir = __dirname + "/public/files/"
+ form.keepExtensions = true
+ // let path = req.body.path;
+ console.log("upload")
+ form.parse(req, (err, fields, files) => {
+ console.log("parsing")
+ let names: any[] = [];
+ for (const name in files) {
+ let file = files[name];
+ names.push(`/files/` + path.basename(file.path));
+ }
+ res.send(names);
+ });
+})
+
+app.use(express.static(__dirname + '/public'));
+app.use('/images', express.static(__dirname + '/public'))
+
let FieldStore: ObservableMap<FieldId, Field> = new ObservableMap();
// define a route handler for the default home page