From 189eeefbb3e7f3d96d1d140beff74fcffe305786 Mon Sep 17 00:00:00 2001 From: Tyler Schicke Date: Fri, 3 May 2019 20:28:22 -0400 Subject: Added debugging support and added removing of unused keys in Solr --- package.json | 3 ++- 1 file changed, 2 insertions(+), 1 deletion(-) (limited to 'package.json') diff --git a/package.json b/package.json index 1eb546a80..fd794d062 100644 --- a/package.json +++ b/package.json @@ -5,6 +5,7 @@ "main": "index.js", "scripts": { "start": "ts-node-dev -- src/server/index.ts", + "debug": "ts-node-dev --inspect -- src/server/index.ts", "build": "webpack --env production", "test": "mocha -r ts-node/register test/**/*.ts", "tsc": "tsc" @@ -171,4 +172,4 @@ "uuid": "^3.3.2", "xoauth2": "^1.2.0" } -} +} \ No newline at end of file -- cgit v1.2.3-70-g09d2 From e19fdbba4cf672aee5bfb59b91b6162431d146d3 Mon Sep 17 00:00:00 2001 From: ab Date: Sat, 4 May 2019 18:48:01 -0400 Subject: queries semi work --- package.json | 3 ++- src/debug/Test.tsx | 19 ++++++++++++++++++- src/server/Search.ts | 25 +++++++++++++++++++++++++ src/server/index.ts | 3 +++ 4 files changed, 48 insertions(+), 2 deletions(-) (limited to 'package.json') diff --git a/package.json b/package.json index fd794d062..3393eacc6 100644 --- a/package.json +++ b/package.json @@ -167,9 +167,10 @@ "serializr": "^1.5.1", "socket.io": "^2.2.0", "socket.io-client": "^2.2.0", + "solr-node": "^1.1.3", "typescript-collections": "^1.3.2", "url-loader": "^1.1.2", "uuid": "^3.3.2", "xoauth2": "^1.2.0" } -} \ No newline at end of file +} diff --git a/src/debug/Test.tsx b/src/debug/Test.tsx index 47cfac2c1..7d72a1ba0 100644 --- a/src/debug/Test.tsx +++ b/src/debug/Test.tsx @@ -3,6 +3,9 @@ import * as ReactDOM from 'react-dom'; import { serialize, deserialize, map } from 'serializr'; import { URLField, Doc, createSchema, makeInterface, makeStrictInterface, List, ListSpec } from '../fields/NewDoc'; import { SerializationHelper } from '../client/util/SerializationHelper'; +import { Search } from '../server/Search'; +import { restProperty } from 'babel-types'; +import * as rp from 'request-promise'; const schema1 = createSchema({ hello: "number", @@ -76,8 +79,22 @@ class Test extends React.Component { // console.log(SerializationHelper.Serialize(l)); } + onEnter = async (e: any) => { + var key = e.keyCode || e.which; + if (key === 13) { + var query = e.target.value; + await rp.get('http://localhost:1050/search', { + qs: { + query + } + }); + } + } + render() { - return ; + return
+ +
; } } diff --git a/src/server/Search.ts b/src/server/Search.ts index 9e462f0ae..4911edd1d 100644 --- a/src/server/Search.ts +++ b/src/server/Search.ts @@ -5,6 +5,31 @@ import { thisExpression } from 'babel-types'; export class Search { public static Instance = new Search(); private url = 'http://localhost:8983/solr/'; + private client: any; + + constructor() { + console.log("Search Instantiated!"); + var SolrNode = require('solr-node'); + this.client = new SolrNode({ + host: 'localhost', + port: '8983', + core: 'dash', + protocol: 'http' + }); + var strQuery = this.client.query().q('text:test'); + + console.log(strQuery); + + // Search documents using strQuery + // client.search(strQuery, (err: any, result: any) => { + // if (err) { + // console.log(err); + // return; + // } + // console.log('Response:', result.response); + // }); + } + public async updateDocument(document: any) { console.log("UPDATE: ", JSON.stringify(document)); diff --git a/src/server/index.ts b/src/server/index.ts index f90724152..f2bcd3f00 100644 --- a/src/server/index.ts +++ b/src/server/index.ts @@ -122,11 +122,14 @@ app.get("/pull", (req, res) => res.redirect("/"); })); +// SEARCH + // GETTERS app.get("/search", async (req, res) => { let query = req.query.query || "hello"; let results = await Search.Instance.search(query); + console.log(results); res.send(results); }); -- cgit v1.2.3-70-g09d2 From 4c10e9949525d4e76f5bc2c74eb3951a238b2083 Mon Sep 17 00:00:00 2001 From: Tyler Schicke Date: Mon, 6 May 2019 00:14:41 -0400 Subject: vulnerability upgrade --- package.json | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) (limited to 'package.json') diff --git a/package.json b/package.json index 1eb546a80..943451c3b 100644 --- a/package.json +++ b/package.json @@ -34,7 +34,7 @@ "webpack": "^4.29.6", "webpack-cli": "^3.2.3", "webpack-dev-middleware": "^3.6.1", - "webpack-dev-server": "^3.2.1", + "webpack-dev-server": "^3.3.1", "webpack-hot-middleware": "^2.24.3" }, "dependencies": { @@ -125,7 +125,7 @@ "mobx-react-devtools": "^6.1.1", "mongodb": "^3.1.13", "mongoose": "^5.4.18", - "node-sass": "^4.11.0", + "node-sass": "^4.12.0", "nodemailer": "^5.1.1", "nodemon": "^1.18.10", "normalize.css": "^8.0.1", -- cgit v1.2.3-70-g09d2 From 873e2b9381a12ad0b2e6303f6a308d5d47e1f14f Mon Sep 17 00:00:00 2001 From: Tyler Schicke Date: Mon, 20 May 2019 04:31:11 -0400 Subject: Added downsizing images --- package.json | 2 ++ src/server/downsize.ts | 40 ++++++++++++++++++++++++++++++++++++++ src/server/index.ts | 33 ++++++++++++++++++++++++++++--- src/server/public/files/.gitignore | 3 ++- 4 files changed, 74 insertions(+), 4 deletions(-) create mode 100644 src/server/downsize.ts (limited to 'package.json') diff --git a/package.json b/package.json index 147f59c25..0d0e6ff3e 100644 --- a/package.json +++ b/package.json @@ -88,6 +88,7 @@ "@types/react-table": "^6.7.22", "@types/request": "^2.48.1", "@types/request-promise": "^4.1.42", + "@types/sharp": "^0.22.2", "@types/socket.io": "^2.1.2", "@types/socket.io-client": "^1.4.32", "@types/typescript": "^2.0.0", @@ -165,6 +166,7 @@ "request": "^2.88.0", "request-promise": "^4.2.4", "serializr": "^1.5.1", + "sharp": "^0.22.1", "socket.io": "^2.2.0", "socket.io-client": "^2.2.0", "solr-node": "^1.1.3", diff --git a/src/server/downsize.ts b/src/server/downsize.ts new file mode 100644 index 000000000..ed68fbecc --- /dev/null +++ b/src/server/downsize.ts @@ -0,0 +1,40 @@ +import * as sharp from 'sharp'; +import * as fs from 'fs'; + +const folder = "./src/server/public/files/"; +const pngTypes = ["png", "PNG"]; +const jpgTypes = ["jpg", "JPG", "jpeg", "JPEG"]; +const smallResizer = sharp().resize(100); +fs.readdir(folder, async (err, files) => { + if (err) { + console.log(err); + return; + } + // files.forEach(file => { + // if (file.includes("_s") || file.includes("_m") || file.includes("_l")) { + // fs.unlink(folder + file, () => { }); + // } + // }); + for (const file of files) { + const filesplit = file.split("."); + let resizers = [ + { resizer: sharp().resize(100, undefined, { withoutEnlargement: true }), suffix: "_s" }, + { resizer: sharp().resize(400, undefined, { withoutEnlargement: true }), suffix: "_m" }, + { resizer: sharp().resize(900, undefined, { withoutEnlargement: true }), suffix: "_l" }, + ]; + if (pngTypes.some(type => file.endsWith(type))) { + resizers.forEach(element => { + element.resizer = element.resizer.png(); + }); + } else if (jpgTypes.some(type => file.endsWith(type))) { + resizers.forEach(element => { + element.resizer = element.resizer.jpeg(); + }); + } else { + continue; + } + resizers.forEach(resizer => { + fs.createReadStream(folder + file).pipe(resizer.resizer).pipe(fs.createWriteStream(folder + filesplit[0] + resizer.suffix + "." + filesplit[1])); + }); + } +}); \ No newline at end of file diff --git a/src/server/index.ts b/src/server/index.ts index d19c65e0a..af99b116a 100644 --- a/src/server/index.ts +++ b/src/server/index.ts @@ -6,6 +6,7 @@ import * as session from 'express-session'; import * as expressValidator from 'express-validator'; import * as formidable from 'formidable'; import * as fs from 'fs'; +import * as sharp from 'sharp'; import * as mobileDetect from 'mobile-detect'; import { ObservableMap } from 'mobx'; import * as passport from 'passport'; @@ -166,13 +167,15 @@ addSecureRoute( RouteStore.getCurrUser ); +const pngTypes = [".png", ".PNG"]; +const jpgTypes = [".jpg", ".JPG", ".jpeg", ".JPEG"]; +const uploadDir = __dirname + "/public/files/"; // SETTERS - addSecureRoute( Method.POST, (user, res, req) => { let form = new formidable.IncomingForm(); - form.uploadDir = __dirname + "/public/files/"; + form.uploadDir = uploadDir; form.keepExtensions = true; // let path = req.body.path; console.log("upload"); @@ -180,7 +183,31 @@ addSecureRoute( console.log("parsing"); let names: string[] = []; for (const name in files) { - names.push(`/files/` + path.basename(files[name].path)); + const file = path.basename(files[name].path); + const ext = path.extname(file); + let resizers = [ + { resizer: sharp().resize(100, undefined, { withoutEnlargement: true }), suffix: "_s" }, + { resizer: sharp().resize(400, undefined, { withoutEnlargement: true }), suffix: "_m" }, + { resizer: sharp().resize(900, undefined, { withoutEnlargement: true }), suffix: "_l" }, + ]; + let isImage = false; + if (pngTypes.includes(ext)) { + resizers.forEach(element => { + element.resizer = element.resizer.png(); + }); + isImage = true; + } else if (jpgTypes.includes(ext)) { + resizers.forEach(element => { + element.resizer = element.resizer.jpeg(); + }); + isImage = true; + } + if (isImage) { + resizers.forEach(resizer => { + fs.createReadStream(uploadDir + file).pipe(resizer.resizer).pipe(fs.createWriteStream(uploadDir + file.substring(0, file.length - ext.length) + resizer.suffix + ext)); + }); + } + names.push(`/files/` + file); } res.send(names); }); diff --git a/src/server/public/files/.gitignore b/src/server/public/files/.gitignore index f59ec20aa..c96a04f00 100644 --- a/src/server/public/files/.gitignore +++ b/src/server/public/files/.gitignore @@ -1 +1,2 @@ -* \ No newline at end of file +* +!.gitignore \ No newline at end of file -- cgit v1.2.3-70-g09d2 From 99bbb42cfa5718f543213f7a64463bd31c73d781 Mon Sep 17 00:00:00 2001 From: Tyler Schicke Date: Mon, 20 May 2019 14:36:43 -0400 Subject: Added route to save data uri as image --- package.json | 1 + src/server/RouteStore.ts | 1 + src/server/index.ts | 40 ++++++++++++++++++++++++++++++++++++++++ 3 files changed, 42 insertions(+) (limited to 'package.json') diff --git a/package.json b/package.json index 0d0e6ff3e..40402b44c 100644 --- a/package.json +++ b/package.json @@ -118,6 +118,7 @@ "golden-layout": "^1.5.9", "html-to-image": "^0.1.0", "i": "^0.3.6", + "image-data-uri": "^2.0.0", "jsonwebtoken": "^8.5.0", "jsx-to-string": "^1.4.0", "lodash": "^4.17.11", diff --git a/src/server/RouteStore.ts b/src/server/RouteStore.ts index fdf5b6a5c..c4af5cdaa 100644 --- a/src/server/RouteStore.ts +++ b/src/server/RouteStore.ts @@ -11,6 +11,7 @@ export enum RouteStore { // UPLOAD AND STATIC FILE SERVING public = "/public", upload = "/upload", + dataUriToImage = "/uploadURI", images = "/images", // USER AND WORKSPACES diff --git a/src/server/index.ts b/src/server/index.ts index af99b116a..a12751fe3 100644 --- a/src/server/index.ts +++ b/src/server/index.ts @@ -7,6 +7,7 @@ import * as expressValidator from 'express-validator'; import * as formidable from 'formidable'; import * as fs from 'fs'; import * as sharp from 'sharp'; +const imageDataUri = require('image-data-uri'); import * as mobileDetect from 'mobile-detect'; import { ObservableMap } from 'mobx'; import * as passport from 'passport'; @@ -216,6 +217,45 @@ addSecureRoute( RouteStore.upload ); +addSecureRoute( + Method.POST, + (user, res, req) => { + const uri = req.query.uri; + const filename = req.query.name; + if (!uri || !filename) { + res.status(400).send("incorrect parameters specified"); + return; + } + imageDataUri.outputFile(uri, uploadDir + filename).then((savedName: string) => { + const ext = path.extname(savedName); + let resizers = [ + { resizer: sharp().resize(100, undefined, { withoutEnlargement: true }), suffix: "_s" }, + { resizer: sharp().resize(400, undefined, { withoutEnlargement: true }), suffix: "_m" }, + { resizer: sharp().resize(900, undefined, { withoutEnlargement: true }), suffix: "_l" }, + ]; + let isImage = false; + if (pngTypes.includes(ext)) { + resizers.forEach(element => { + element.resizer = element.resizer.png(); + }); + isImage = true; + } else if (jpgTypes.includes(ext)) { + resizers.forEach(element => { + element.resizer = element.resizer.jpeg(); + }); + isImage = true; + } + if (isImage) { + resizers.forEach(resizer => { + fs.createReadStream(savedName).pipe(resizer.resizer).pipe(fs.createWriteStream(uploadDir + filename + resizer.suffix + ext)); + }); + } + res.send("/files/" + filename + ext); + }); + }, + undefined, + RouteStore.dataUriToImage +); // AUTHENTICATION // Sign Up -- cgit v1.2.3-70-g09d2 From 7cde8383e45ccf8293ec9cba2beddc64bceda2aa Mon Sep 17 00:00:00 2001 From: Tyler Schicke Date: Mon, 20 May 2019 17:08:40 -0400 Subject: Added update search script Added debug current file launch config Made database not ignore requests before it is initialized. --- .vscode/launch.json | 24 +++++---- package.json | 1 + src/server/database.ts | 124 +++++++++++++++++++++++++++++---------------- src/server/updateSearch.ts | 101 ++++++++++++++++++++++++++++++++++++ 4 files changed, 196 insertions(+), 54 deletions(-) create mode 100644 src/server/updateSearch.ts (limited to 'package.json') diff --git a/.vscode/launch.json b/.vscode/launch.json index 452acc823..d245be2ad 100644 --- a/.vscode/launch.json +++ b/.vscode/launch.json @@ -31,6 +31,20 @@ "localRoot": "${workspaceFolder}", "remoteRoot": "." }, + { + "type": "node", + "request": "launch", + "name": "Current TS File", + "runtimeExecutable": "npx", + "runtimeArgs": [ + "ts-node-dev", + "--nolazy", + "--inspect", + "--", + "${relativeFile}" + ], + "port": 9229 + }, { "type": "node", "request": "launch", @@ -65,15 +79,5 @@ "internalConsoleOptions": "openOnSessionStart", "protocol": "inspector" }, - { - "type": "node", - "request": "launch", - "name": "Launch via NPM", - "runtimeExecutable": "npm", - "runtimeArgs": [ - "start" - ], - "port": 9229 - } ] } \ No newline at end of file diff --git a/package.json b/package.json index 40402b44c..790535728 100644 --- a/package.json +++ b/package.json @@ -133,6 +133,7 @@ "nodemon": "^1.18.10", "normalize.css": "^8.0.1", "npm": "^6.9.0", + "p-limit": "^2.2.0", "passport": "^0.4.0", "passport-local": "^1.0.0", "prosemirror-commands": "^1.0.7", diff --git a/src/server/database.ts b/src/server/database.ts index 69005d2d3..70b3efced 100644 --- a/src/server/database.ts +++ b/src/server/database.ts @@ -8,9 +8,13 @@ export class Database { private url = 'mongodb://localhost:27017/Dash'; private currentWrites: { [id: string]: Promise } = {}; private db?: mongodb.Db; + private onConnect: (() => void)[] = []; constructor() { - this.MongoClient.connect(this.url, (err, client) => this.db = client.db()); + this.MongoClient.connect(this.url, (err, client) => { + this.db = client.db(); + this.onConnect.forEach(fn => fn()); + }); } public update(id: string, value: any, callback: () => void, upsert = true, collectionName = Database.DocumentsCollection) { @@ -32,66 +36,98 @@ export class Database { }; newProm = prom ? prom.then(run) : run(); this.currentWrites[id] = newProm; + } else { + this.onConnect.push(() => this.update(id, value, callback, upsert, collectionName)); } } public delete(id: string, collectionName = Database.DocumentsCollection) { - this.db && this.db.collection(collectionName).remove({ id: id }); + if (this.db) { + this.db.collection(collectionName).remove({ id: id }); + } else { + this.onConnect.push(() => this.delete(id, collectionName)); + } } public deleteAll(collectionName = Database.DocumentsCollection): Promise { - return new Promise(res => - this.db && this.db.collection(collectionName).deleteMany({}, res)); + return new Promise(res => { + if (this.db) { + this.db.collection(collectionName).deleteMany({}, res); + } else { + this.onConnect.push(() => this.db && this.db.collection(collectionName).deleteMany({}, res)); + } + }); } public insert(value: any, collectionName = Database.DocumentsCollection) { - if (!this.db) { return; } - if ("id" in value) { - value._id = value.id; - delete value.id; - } - const id = value._id; - const collection = this.db.collection(collectionName); - const prom = this.currentWrites[id]; - let newProm: Promise; - const run = (): Promise => { - return new Promise(resolve => { - collection.insertOne(value, (err, res) => { - if (this.currentWrites[id] === newProm) { - delete this.currentWrites[id]; - } - resolve(); + if (this.db) { + if ("id" in value) { + value._id = value.id; + delete value.id; + } + const id = value._id; + const collection = this.db.collection(collectionName); + const prom = this.currentWrites[id]; + let newProm: Promise; + const run = (): Promise => { + return new Promise(resolve => { + collection.insertOne(value, (err, res) => { + if (this.currentWrites[id] === newProm) { + delete this.currentWrites[id]; + } + resolve(); + }); }); - }); - }; - newProm = prom ? prom.then(run) : run(); - this.currentWrites[id] = newProm; + }; + newProm = prom ? prom.then(run) : run(); + this.currentWrites[id] = newProm; + } else { + this.onConnect.push(() => this.insert(value, collectionName)); + } } public getDocument(id: string, fn: (result?: Transferable) => void, collectionName = Database.DocumentsCollection) { - this.db && this.db.collection(collectionName).findOne({ _id: id }, (err, result) => { - if (result) { - result.id = result._id; - delete result._id; - fn(result); - } else { - fn(undefined); - } - }); + if (this.db) { + this.db.collection(collectionName).findOne({ _id: id }, (err, result) => { + if (result) { + result.id = result._id; + delete result._id; + fn(result); + } else { + fn(undefined); + } + }); + } else { + this.onConnect.push(() => this.getDocument(id, fn, collectionName)); + } } public getDocuments(ids: string[], fn: (result: Transferable[]) => void, collectionName = Database.DocumentsCollection) { - this.db && this.db.collection(collectionName).find({ _id: { "$in": ids } }).toArray((err, docs) => { - if (err) { - console.log(err.message); - console.log(err.errmsg); - } - fn(docs.map(doc => { - doc.id = doc._id; - delete doc._id; - return doc; - })); - }); + if (this.db) { + this.db.collection(collectionName).find({ _id: { "$in": ids } }).toArray((err, docs) => { + if (err) { + console.log(err.message); + console.log(err.errmsg); + } + fn(docs.map(doc => { + doc.id = doc._id; + delete doc._id; + return doc; + })); + }); + } else { + this.onConnect.push(() => this.getDocuments(ids, fn, collectionName)); + } + } + + public query(query: any): Promise { + if (this.db) { + return Promise.resolve(this.db.collection('newDocuments').find(query)); + } else { + return new Promise(res => { + this.onConnect.push(() => res(this.query(query))); + }); + } } public print() { diff --git a/src/server/updateSearch.ts b/src/server/updateSearch.ts new file mode 100644 index 000000000..da33e3747 --- /dev/null +++ b/src/server/updateSearch.ts @@ -0,0 +1,101 @@ +import { Database } from "./database"; +import { Cursor } from "mongodb"; +import { Search } from "./Search"; +import pLimit from 'p-limit'; + +const suffixMap: { [type: string]: (string | [string, string | ((json: any) => any)]) } = { + "number": "_n", + "string": "_t", + // "boolean": "_b", + "image": ["_t", "url"], + "video": ["_t", "url"], + "pdf": ["_t", "url"], + "audio": ["_t", "url"], + "web": ["_t", "url"], + "date": ["_d", value => new Date(value.date).toISOString()], + "proxy": ["_i", "fieldId"], + "list": ["_l", list => { + const results = []; + for (const value of list.fields) { + const term = ToSearchTerm(value); + if (term) { + results.push(term.value); + } + } + return results.length ? results : null; + }] +}; + +function ToSearchTerm(val: any): { suffix: string, value: any } | undefined { + if (val === null || val === undefined) { + return; + } + const type = val.__type || typeof val; + let suffix = suffixMap[type]; + if (!suffix) { + return; + } + + if (Array.isArray(suffix)) { + const accessor = suffix[1]; + if (typeof accessor === "function") { + val = accessor(val); + } else { + val = val[accessor]; + } + suffix = suffix[0]; + } + + return { suffix, value: val }; +} + +function getSuffix(value: string | [string, any]): string { + return typeof value === "string" ? value : value[0]; +} + +const limit = pLimit(5); +async function update() { + // await new Promise(res => setTimeout(res, 5)); + console.log("update"); + await Search.Instance.clear(); + const cursor = await Database.Instance.query({}); + console.log("Cleared"); + const updates: any[] = []; + let numDocs = 0; + function updateDoc(doc: any) { + numDocs++; + if ((numDocs % 50) === 0) { + console.log("updateDoc " + numDocs); + } + console.log("doc " + numDocs); + if (doc.__type !== "Doc") { + return; + } + const fields = doc.fields; + if (!fields) { + return; + } + const update: any = { id: doc._id }; + let dynfield = false; + for (const key in fields) { + const value = fields[key]; + const term = ToSearchTerm(value); + if (term !== undefined) { + let { suffix, value } = term; + update[key + suffix] = value; + dynfield = true; + } + } + if (dynfield) { + updates.push(update); + console.log(updates.length); + } + } + await cursor.forEach(updateDoc); + await Promise.all(updates.map(update => { + return limit(() => Search.Instance.updateDocument(update)); + })); + cursor.close(); +} + +update(); \ No newline at end of file -- cgit v1.2.3-70-g09d2 From cfb7fdb1a7b2db263502677e57ee882a6fe23f13 Mon Sep 17 00:00:00 2001 From: Tyler Schicke Date: Tue, 21 May 2019 12:29:28 -0400 Subject: Made cursors disappear after 1 second --- package.json | 1 + src/client/views/collections/CollectionSubView.tsx | 6 ++---- .../collectionFreeForm/CollectionFreeFormRemoteCursors.tsx | 5 ++++- src/new_fields/CursorField.ts | 9 ++++++--- 4 files changed, 13 insertions(+), 8 deletions(-) (limited to 'package.json') diff --git a/package.json b/package.json index 790535728..aa4abb0a5 100644 --- a/package.json +++ b/package.json @@ -126,6 +126,7 @@ "mobx": "^5.9.0", "mobx-react": "^5.3.5", "mobx-react-devtools": "^6.1.1", + "mobx-utils": "^5.4.0", "mongodb": "^3.1.13", "mongoose": "^5.4.18", "node-sass": "^4.12.0", diff --git a/src/client/views/collections/CollectionSubView.tsx b/src/client/views/collections/CollectionSubView.tsx index 864fdfa4b..7800b35df 100644 --- a/src/client/views/collections/CollectionSubView.tsx +++ b/src/client/views/collections/CollectionSubView.tsx @@ -16,9 +16,7 @@ import { listSpec } from "../../../new_fields/Schema"; import { Cast, PromiseValue, FieldValue, ListSpec } from "../../../new_fields/Types"; import { List } from "../../../new_fields/List"; import { DocServer } from "../../DocServer"; -import { ObjectField } from "../../../new_fields/ObjectField"; -import CursorField, { CursorPosition, CursorMetadata } from "../../../new_fields/CursorField"; -import { url } from "inspector"; +import CursorField from "../../../new_fields/CursorField"; export interface CollectionViewProps extends FieldViewProps { addDocument: (document: Doc, allowDuplicates?: boolean) => boolean; @@ -72,7 +70,7 @@ export function CollectionSubView(schemaCtor: (doc: Doc) => T) { if (cursors.length > 0 && (ind = cursors.findIndex(entry => entry.data.metadata.id === id)) > -1) { cursors[ind].setPosition(pos); } else { - let entry = new CursorField({ metadata: { id: id, identifier: email }, position: pos }); + let entry = new CursorField({ metadata: { id: id, identifier: email, timestamp: Date.now() }, position: pos }); cursors.push(entry); } } diff --git a/src/client/views/collections/collectionFreeForm/CollectionFreeFormRemoteCursors.tsx b/src/client/views/collections/collectionFreeForm/CollectionFreeFormRemoteCursors.tsx index 642118d75..2838b7905 100644 --- a/src/client/views/collections/collectionFreeForm/CollectionFreeFormRemoteCursors.tsx +++ b/src/client/views/collections/collectionFreeForm/CollectionFreeFormRemoteCursors.tsx @@ -9,6 +9,7 @@ import CursorField from "../../../../new_fields/CursorField"; import { List } from "../../../../new_fields/List"; import { Cast } from "../../../../new_fields/Types"; import { listSpec } from "../../../../new_fields/Schema"; +import * as mobxUtils from 'mobx-utils'; @observer export class CollectionFreeFormRemoteCursors extends React.Component { @@ -23,7 +24,9 @@ export class CollectionFreeFormRemoteCursors extends React.Component cursor.data.metadata.id !== id); + const now = mobxUtils.now(); + // const now = Date.now(); + return (cursors || []).filter(cursor => cursor.data.metadata.id !== id && (now - cursor.data.metadata.timestamp) < 1000); } private crosshairs?: HTMLCanvasElement; diff --git a/src/new_fields/CursorField.ts b/src/new_fields/CursorField.ts index 1be1ec3e0..fd86031a8 100644 --- a/src/new_fields/CursorField.ts +++ b/src/new_fields/CursorField.ts @@ -1,7 +1,7 @@ import { ObjectField } from "./ObjectField"; import { observable } from "mobx"; import { Deserializable } from "../client/util/SerializationHelper"; -import { serializable, createSimpleSchema, object } from "serializr"; +import { serializable, createSimpleSchema, object, date } from "serializr"; import { OnUpdate, ToScriptString, Copy } from "./FieldSymbols"; export type CursorPosition = { @@ -11,7 +11,8 @@ export type CursorPosition = { export type CursorMetadata = { id: string, - identifier: string + identifier: string, + timestamp: number }; export type CursorData = { @@ -26,7 +27,8 @@ const PositionSchema = createSimpleSchema({ const MetadataSchema = createSimpleSchema({ id: true, - identifier: true + identifier: true, + timestamp: true }); const CursorSchema = createSimpleSchema({ @@ -47,6 +49,7 @@ export default class CursorField extends ObjectField { setPosition(position: CursorPosition) { this.data.position = position; + this.data.metadata.timestamp = Date.now(); this[OnUpdate](); } -- cgit v1.2.3-70-g09d2 From 05771afc1687f18bd645991d9a853637cc85e16f Mon Sep 17 00:00:00 2001 From: Tyler Schicke Date: Thu, 23 May 2019 02:46:37 -0400 Subject: Enabled https --- package.json | 1 + src/client/DocServer.ts | 2 +- src/server/index.ts | 14 ++++++++++---- src/server/server.cert | 21 +++++++++++++++++++++ src/server/server.key | 28 ++++++++++++++++++++++++++++ 5 files changed, 61 insertions(+), 5 deletions(-) create mode 100644 src/server/server.cert create mode 100644 src/server/server.key (limited to 'package.json') diff --git a/package.json b/package.json index aa4abb0a5..8e8d93747 100644 --- a/package.json +++ b/package.json @@ -117,6 +117,7 @@ "formidable": "^1.2.1", "golden-layout": "^1.5.9", "html-to-image": "^0.1.0", + "https": "^1.0.0", "i": "^0.3.6", "image-data-uri": "^2.0.0", "jsonwebtoken": "^8.5.0", diff --git a/src/client/DocServer.ts b/src/client/DocServer.ts index cbcf751ee..b1b5ae529 100644 --- a/src/client/DocServer.ts +++ b/src/client/DocServer.ts @@ -8,7 +8,7 @@ import { Id, HandleUpdate } from '../new_fields/FieldSymbols'; export namespace DocServer { const _cache: { [id: string]: RefField | Promise> } = {}; - const _socket = OpenSocket(`${window.location.protocol}//${window.location.hostname}:4321`); + const _socket = OpenSocket(`${window.location.origin}`); const GUID: string = Utils.GenerateGuid(); export function makeReadOnly() { diff --git a/src/server/index.ts b/src/server/index.ts index fd66c90b4..e39dfcc14 100644 --- a/src/server/index.ts +++ b/src/server/index.ts @@ -2,6 +2,7 @@ import * as bodyParser from 'body-parser'; import { exec } from 'child_process'; import * as cookieParser from 'cookie-parser'; import * as express from 'express'; +import * as https from 'https'; import * as session from 'express-session'; import * as expressValidator from 'express-validator'; import * as formidable from 'formidable'; @@ -172,6 +173,8 @@ const pngTypes = [".png", ".PNG"]; const jpgTypes = [".jpg", ".JPG", ".jpeg", ".JPEG"]; const uploadDir = __dirname + "/public/files/"; // SETTERS +//TODO This should be a secured route, but iPhones don't seem to deal well with out authentication, +// so in order for the image upload from phones to work, we can make this authenticated app.post( RouteStore.upload, (req, res) => { @@ -289,10 +292,13 @@ app.use(wdm(compiler, { publicPath: config.output.publicPath })); app.use(whm(compiler)); // start the Express server -app.listen(port, () => +const httpsServer = https.createServer({ + key: fs.readFileSync(__dirname + '/server.key'), + cert: fs.readFileSync(__dirname + '/server.cert') +}, app).listen(port, () => console.log(`server started at http://localhost:${port}`)); -const server = io(); +const server = io(httpsServer); interface Map { [key: string]: Client; } @@ -441,5 +447,5 @@ function CreateField(newValue: any) { Database.Instance.insert(newValue, "newDocuments"); } -server.listen(serverPort); -console.log(`listening on port ${serverPort}`); \ No newline at end of file +// server.listen(serverPort); +// console.log(`listening on port ${serverPort}`); \ No newline at end of file diff --git a/src/server/server.cert b/src/server/server.cert new file mode 100644 index 000000000..e1610914c --- /dev/null +++ b/src/server/server.cert @@ -0,0 +1,21 @@ +-----BEGIN CERTIFICATE----- +MIIDfzCCAmegAwIBAgIJAJzroap7RHCoMA0GCSqGSIb3DQEBCwUAMFYxCzAJBgNV +BAYTAlVTMRUwEwYDVQQIDAxSaG9kZSBJc2xhbmQxEzARBgNVBAcMClByb3ZpZGVu +Y2UxGzAZBgNVBAoMEkJyb3duIEdyYXBoaWNzIExhYjAeFw0xOTA1MjMwNjMxMDla +Fw0xOTA2MjIwNjMxMDlaMFYxCzAJBgNVBAYTAlVTMRUwEwYDVQQIDAxSaG9kZSBJ +c2xhbmQxEzARBgNVBAcMClByb3ZpZGVuY2UxGzAZBgNVBAoMEkJyb3duIEdyYXBo +aWNzIExhYjCCASIwDQYJKoZIhvcNAQEBBQADggEPADCCAQoCggEBAMZK+dfIICO/ +w2E28yd98HFMiUNqKVWq5wEncvtaCk3zT/xSRvPrdQo8wvkgGqmjdbbi9hH1wu4u +79MZTLIaSfU4JtVlchWyqT0Tp+y74KPEFAtIlV/PpHFYkG9728DumaBGg7x+a40j +8aCLKhy4ij97IVXdn43sVCOQJNfwuxuHz2ofgjg90T/HOP2Jt5mEOygkCjPQmU45 +iR2iwVDu0DFKgD+EsosJdZk5n8yBdMTKFNoIgWpo9IJRzQ3ROqq1npcXI7rSQ3MB +b+Hw3AkUIXfB18dfLZ+7WKzS0KEm5NM0H+C/bkzRo2D26BLYZQrzFZkk1diTevex +Ws7e+4khn+8CAwEAAaNQME4wHQYDVR0OBBYEFAYSFlBF7Z0zQHVzLspbaIpGvTp1 +MB8GA1UdIwQYMBaAFAYSFlBF7Z0zQHVzLspbaIpGvTp1MAwGA1UdEwQFMAMBAf8w +DQYJKoZIhvcNAQELBQADggEBAI2P2nl4Xn2BUwCOpFwCuyqB3/LTTmlz3qqdOfBj +glxw6UqiLTiEQUe/q1ssthDE71NbtuVRSggzdJcoIdjMQrtG+eN79Ao22ZzhGnAj +S/MTeybZmO+1Y7yV3RSEjXCmpxIGKueQsCYAdeoTpMny7BEtr09ZROccxDPcLI2H +K91FtuCZbG7Inx10X4/PVnp9Yr1GW6zWxMkEXLPXko0o8gIf9Kj7njNEF0RPsHd9 +L3tJny4y92huYSs2aPJWeEtRit0nXIu86qXfoomMFBCsFLbGhqtwCpqogeL+QS+1 +bv0MKJk82jMpG/oLxbWwesBk2tb8R4knL2WlX32HegawoHs= +-----END CERTIFICATE----- diff --git a/src/server/server.key b/src/server/server.key new file mode 100644 index 000000000..c8a4f2745 --- /dev/null +++ b/src/server/server.key @@ -0,0 +1,28 @@ +-----BEGIN PRIVATE KEY----- +MIIEvgIBADANBgkqhkiG9w0BAQEFAASCBKgwggSkAgEAAoIBAQDGSvnXyCAjv8Nh +NvMnffBxTIlDailVqucBJ3L7WgpN80/8Ukbz63UKPML5IBqpo3W24vYR9cLuLu/T +GUyyGkn1OCbVZXIVsqk9E6fsu+CjxBQLSJVfz6RxWJBve9vA7pmgRoO8fmuNI/Gg +iyocuIo/eyFV3Z+N7FQjkCTX8Lsbh89qH4I4PdE/xzj9ibeZhDsoJAoz0JlOOYkd +osFQ7tAxSoA/hLKLCXWZOZ/MgXTEyhTaCIFqaPSCUc0N0TqqtZ6XFyO60kNzAW/h +8NwJFCF3wdfHXy2fu1is0tChJuTTNB/gv25M0aNg9ugS2GUK8xWZJNXYk3r3sVrO +3vuJIZ/vAgMBAAECggEAXvm+XUoviq/oxwFoyXua1MmR3UZV8gBfkL/yZM2lrdxi +bTqDXYVjk7mysVxdKO9wDF78+XE7IpY8rGGryIqq7dctUny6fgYK5YQqpEsAt6/M +4fKsCS4NV3TSCXPLt8cQsiHUK05p+TpEG19MlmEVZn51Ywk5yOJvEnGSFBPrqq0z +IRYksRThVeoFqy6J3BS26UqDVEwlhYAPk5bg9j/RaeyEmhEXzcjfnXuYdhqhMhzW +sS6O4DM/QYs9DTn31kJ2ycgyVaQ/LYNRhp9yIDVSCCJyaInBbV6PV8DdNdr8oXOH +4G95OtNGTuk9N6BMLDgj1KCEFUjE8bQD0TgMqljV0QKBgQD4aF+qinyAg8xwLsLl +SKw4amPtlipC1YrOZ17Vtq7bU0WFSfLrKJAyDkvkf5L9OIWWsQNzLbq6enomlurm +wgjjQyaNVEvQhuJ0P9ewu6CVSC3kT7jnTrQFEnIDSgY+Mt4dyp1HhDqxp4kdMOdf +DUjyXWhyXpkokq+YXSsyM84q/QKBgQDMWnycVF/vjBy/RbbYO0rZDOl8z6F2WIl/ +wDYVi4fwe1KVWo2J/95dJd9g5DkHqkuyGBQs5Thq05QBBNhsFG87I2ghHCSC7OIz +ME4sbkouXq4TpAvoiSvCZo5/Whgypuycx5Gn3aSWVStXOyZgyiLF2NcEvoaT4Qss +w9hfcIU4WwKBgQDvrbVwlYKfdYvSSiweksoo/O5CFXvdVLFDihXE2ylH0cboXnuW +TmMjCQxNApLO5LRwu4b6oQrkVrx5c3BfCqUMsoQGJWmpYBwr0lXI3qCIqUYuXoWo +GRY1NqDvb4MqjGYoFJFAqeL/+wifM8pquiTCRUI75+6baT0oI+1D2Rx5+QKBgQCQ +gDO5P5iPBR6Wyi8e+95TWOQJ07AyxSyFX19fIMlBbZLZ9aw8NugAKfWox/jjyLG5 +/3jUvkmEkJQJnGmFE3YL9V9+ei3/Po488B13IY3m+CBT1x5skgKVdnuw5f5SYuLR +gfUnJH1rqFH7XuImcwjfqhNxUWBMVUfXoazw39n0HQKBgDXGubSFovavDSTAhh1t +soMP+3yO+Ny/+Mv47cMfblqN7dItC58VcEX2IHd9Z9QgMNQ4BDCqRRDK4O1N7RLO +bq6qV9WPyNwsDAZJLH2h9Y3gpDvUNFo+Kq/7V4ZTqaJC1YOjDKTXRnoZIwAje+5x +iNk2xg38zIscD1Ff+tTCOnYA +-----END PRIVATE KEY----- -- cgit v1.2.3-70-g09d2 From e90059327d8910f46b9f2fb48716eb9267a060b5 Mon Sep 17 00:00:00 2001 From: Tyler Schicke Date: Thu, 23 May 2019 03:24:03 -0400 Subject: Revert "Enabled https" This reverts commit 05771afc1687f18bd645991d9a853637cc85e16f. --- package.json | 1 - src/client/DocServer.ts | 2 +- src/server/index.ts | 14 ++++---------- src/server/server.cert | 21 --------------------- src/server/server.key | 28 ---------------------------- 5 files changed, 5 insertions(+), 61 deletions(-) delete mode 100644 src/server/server.cert delete mode 100644 src/server/server.key (limited to 'package.json') diff --git a/package.json b/package.json index 8e8d93747..aa4abb0a5 100644 --- a/package.json +++ b/package.json @@ -117,7 +117,6 @@ "formidable": "^1.2.1", "golden-layout": "^1.5.9", "html-to-image": "^0.1.0", - "https": "^1.0.0", "i": "^0.3.6", "image-data-uri": "^2.0.0", "jsonwebtoken": "^8.5.0", diff --git a/src/client/DocServer.ts b/src/client/DocServer.ts index b1b5ae529..cbcf751ee 100644 --- a/src/client/DocServer.ts +++ b/src/client/DocServer.ts @@ -8,7 +8,7 @@ import { Id, HandleUpdate } from '../new_fields/FieldSymbols'; export namespace DocServer { const _cache: { [id: string]: RefField | Promise> } = {}; - const _socket = OpenSocket(`${window.location.origin}`); + const _socket = OpenSocket(`${window.location.protocol}//${window.location.hostname}:4321`); const GUID: string = Utils.GenerateGuid(); export function makeReadOnly() { diff --git a/src/server/index.ts b/src/server/index.ts index e39dfcc14..fd66c90b4 100644 --- a/src/server/index.ts +++ b/src/server/index.ts @@ -2,7 +2,6 @@ import * as bodyParser from 'body-parser'; import { exec } from 'child_process'; import * as cookieParser from 'cookie-parser'; import * as express from 'express'; -import * as https from 'https'; import * as session from 'express-session'; import * as expressValidator from 'express-validator'; import * as formidable from 'formidable'; @@ -173,8 +172,6 @@ const pngTypes = [".png", ".PNG"]; const jpgTypes = [".jpg", ".JPG", ".jpeg", ".JPEG"]; const uploadDir = __dirname + "/public/files/"; // SETTERS -//TODO This should be a secured route, but iPhones don't seem to deal well with out authentication, -// so in order for the image upload from phones to work, we can make this authenticated app.post( RouteStore.upload, (req, res) => { @@ -292,13 +289,10 @@ app.use(wdm(compiler, { publicPath: config.output.publicPath })); app.use(whm(compiler)); // start the Express server -const httpsServer = https.createServer({ - key: fs.readFileSync(__dirname + '/server.key'), - cert: fs.readFileSync(__dirname + '/server.cert') -}, app).listen(port, () => +app.listen(port, () => console.log(`server started at http://localhost:${port}`)); -const server = io(httpsServer); +const server = io(); interface Map { [key: string]: Client; } @@ -447,5 +441,5 @@ function CreateField(newValue: any) { Database.Instance.insert(newValue, "newDocuments"); } -// server.listen(serverPort); -// console.log(`listening on port ${serverPort}`); \ No newline at end of file +server.listen(serverPort); +console.log(`listening on port ${serverPort}`); \ No newline at end of file diff --git a/src/server/server.cert b/src/server/server.cert deleted file mode 100644 index e1610914c..000000000 --- a/src/server/server.cert +++ /dev/null @@ -1,21 +0,0 @@ ------BEGIN CERTIFICATE----- -MIIDfzCCAmegAwIBAgIJAJzroap7RHCoMA0GCSqGSIb3DQEBCwUAMFYxCzAJBgNV -BAYTAlVTMRUwEwYDVQQIDAxSaG9kZSBJc2xhbmQxEzARBgNVBAcMClByb3ZpZGVu -Y2UxGzAZBgNVBAoMEkJyb3duIEdyYXBoaWNzIExhYjAeFw0xOTA1MjMwNjMxMDla -Fw0xOTA2MjIwNjMxMDlaMFYxCzAJBgNVBAYTAlVTMRUwEwYDVQQIDAxSaG9kZSBJ -c2xhbmQxEzARBgNVBAcMClByb3ZpZGVuY2UxGzAZBgNVBAoMEkJyb3duIEdyYXBo -aWNzIExhYjCCASIwDQYJKoZIhvcNAQEBBQADggEPADCCAQoCggEBAMZK+dfIICO/ -w2E28yd98HFMiUNqKVWq5wEncvtaCk3zT/xSRvPrdQo8wvkgGqmjdbbi9hH1wu4u -79MZTLIaSfU4JtVlchWyqT0Tp+y74KPEFAtIlV/PpHFYkG9728DumaBGg7x+a40j -8aCLKhy4ij97IVXdn43sVCOQJNfwuxuHz2ofgjg90T/HOP2Jt5mEOygkCjPQmU45 -iR2iwVDu0DFKgD+EsosJdZk5n8yBdMTKFNoIgWpo9IJRzQ3ROqq1npcXI7rSQ3MB -b+Hw3AkUIXfB18dfLZ+7WKzS0KEm5NM0H+C/bkzRo2D26BLYZQrzFZkk1diTevex -Ws7e+4khn+8CAwEAAaNQME4wHQYDVR0OBBYEFAYSFlBF7Z0zQHVzLspbaIpGvTp1 -MB8GA1UdIwQYMBaAFAYSFlBF7Z0zQHVzLspbaIpGvTp1MAwGA1UdEwQFMAMBAf8w -DQYJKoZIhvcNAQELBQADggEBAI2P2nl4Xn2BUwCOpFwCuyqB3/LTTmlz3qqdOfBj -glxw6UqiLTiEQUe/q1ssthDE71NbtuVRSggzdJcoIdjMQrtG+eN79Ao22ZzhGnAj -S/MTeybZmO+1Y7yV3RSEjXCmpxIGKueQsCYAdeoTpMny7BEtr09ZROccxDPcLI2H -K91FtuCZbG7Inx10X4/PVnp9Yr1GW6zWxMkEXLPXko0o8gIf9Kj7njNEF0RPsHd9 -L3tJny4y92huYSs2aPJWeEtRit0nXIu86qXfoomMFBCsFLbGhqtwCpqogeL+QS+1 -bv0MKJk82jMpG/oLxbWwesBk2tb8R4knL2WlX32HegawoHs= ------END CERTIFICATE----- diff --git a/src/server/server.key b/src/server/server.key deleted file mode 100644 index c8a4f2745..000000000 --- a/src/server/server.key +++ /dev/null @@ -1,28 +0,0 @@ ------BEGIN PRIVATE KEY----- -MIIEvgIBADANBgkqhkiG9w0BAQEFAASCBKgwggSkAgEAAoIBAQDGSvnXyCAjv8Nh -NvMnffBxTIlDailVqucBJ3L7WgpN80/8Ukbz63UKPML5IBqpo3W24vYR9cLuLu/T -GUyyGkn1OCbVZXIVsqk9E6fsu+CjxBQLSJVfz6RxWJBve9vA7pmgRoO8fmuNI/Gg -iyocuIo/eyFV3Z+N7FQjkCTX8Lsbh89qH4I4PdE/xzj9ibeZhDsoJAoz0JlOOYkd -osFQ7tAxSoA/hLKLCXWZOZ/MgXTEyhTaCIFqaPSCUc0N0TqqtZ6XFyO60kNzAW/h -8NwJFCF3wdfHXy2fu1is0tChJuTTNB/gv25M0aNg9ugS2GUK8xWZJNXYk3r3sVrO -3vuJIZ/vAgMBAAECggEAXvm+XUoviq/oxwFoyXua1MmR3UZV8gBfkL/yZM2lrdxi -bTqDXYVjk7mysVxdKO9wDF78+XE7IpY8rGGryIqq7dctUny6fgYK5YQqpEsAt6/M -4fKsCS4NV3TSCXPLt8cQsiHUK05p+TpEG19MlmEVZn51Ywk5yOJvEnGSFBPrqq0z -IRYksRThVeoFqy6J3BS26UqDVEwlhYAPk5bg9j/RaeyEmhEXzcjfnXuYdhqhMhzW -sS6O4DM/QYs9DTn31kJ2ycgyVaQ/LYNRhp9yIDVSCCJyaInBbV6PV8DdNdr8oXOH -4G95OtNGTuk9N6BMLDgj1KCEFUjE8bQD0TgMqljV0QKBgQD4aF+qinyAg8xwLsLl -SKw4amPtlipC1YrOZ17Vtq7bU0WFSfLrKJAyDkvkf5L9OIWWsQNzLbq6enomlurm -wgjjQyaNVEvQhuJ0P9ewu6CVSC3kT7jnTrQFEnIDSgY+Mt4dyp1HhDqxp4kdMOdf -DUjyXWhyXpkokq+YXSsyM84q/QKBgQDMWnycVF/vjBy/RbbYO0rZDOl8z6F2WIl/ -wDYVi4fwe1KVWo2J/95dJd9g5DkHqkuyGBQs5Thq05QBBNhsFG87I2ghHCSC7OIz -ME4sbkouXq4TpAvoiSvCZo5/Whgypuycx5Gn3aSWVStXOyZgyiLF2NcEvoaT4Qss -w9hfcIU4WwKBgQDvrbVwlYKfdYvSSiweksoo/O5CFXvdVLFDihXE2ylH0cboXnuW -TmMjCQxNApLO5LRwu4b6oQrkVrx5c3BfCqUMsoQGJWmpYBwr0lXI3qCIqUYuXoWo -GRY1NqDvb4MqjGYoFJFAqeL/+wifM8pquiTCRUI75+6baT0oI+1D2Rx5+QKBgQCQ -gDO5P5iPBR6Wyi8e+95TWOQJ07AyxSyFX19fIMlBbZLZ9aw8NugAKfWox/jjyLG5 -/3jUvkmEkJQJnGmFE3YL9V9+ei3/Po488B13IY3m+CBT1x5skgKVdnuw5f5SYuLR -gfUnJH1rqFH7XuImcwjfqhNxUWBMVUfXoazw39n0HQKBgDXGubSFovavDSTAhh1t -soMP+3yO+Ny/+Mv47cMfblqN7dItC58VcEX2IHd9Z9QgMNQ4BDCqRRDK4O1N7RLO -bq6qV9WPyNwsDAZJLH2h9Y3gpDvUNFo+Kq/7V4ZTqaJC1YOjDKTXRnoZIwAje+5x -iNk2xg38zIscD1Ff+tTCOnYA ------END PRIVATE KEY----- -- cgit v1.2.3-70-g09d2 From 01d172a91d9a140129d2dd938c3289d7a0d25f16 Mon Sep 17 00:00:00 2001 From: Bob Zeleznik Date: Fri, 24 May 2019 14:10:32 -0400 Subject: cleaned up nativewidth/height for Image and Video and some PDF stuff. --- package.json | 1 + src/client/documents/Documents.ts | 12 +++- .../CollectionFreeFormLinkView.tsx | 4 +- .../CollectionFreeFormLinksView.tsx | 7 ++- .../collectionFreeForm/CollectionFreeFormView.tsx | 5 +- src/client/views/nodes/ImageBox.tsx | 15 +---- src/client/views/nodes/PDFBox.scss | 4 ++ src/client/views/nodes/PDFBox.tsx | 2 +- src/client/views/nodes/VideoBox.tsx | 68 +++++++--------------- 9 files changed, 53 insertions(+), 65 deletions(-) (limited to 'package.json') diff --git a/package.json b/package.json index aa4abb0a5..d5abc808e 100644 --- a/package.json +++ b/package.json @@ -167,6 +167,7 @@ "react-split-pane": "^0.1.85", "react-table": "^6.9.2", "request": "^2.88.0", + "request-image-size": "^2.1.0", "request-promise": "^4.2.4", "serializr": "^1.5.1", "sharp": "^0.22.1", diff --git a/src/client/documents/Documents.ts b/src/client/documents/Documents.ts index ae190a989..1f4b76384 100644 --- a/src/client/documents/Documents.ts +++ b/src/client/documents/Documents.ts @@ -34,6 +34,7 @@ import { StrokeData, InkField } from "../../new_fields/InkField"; import { dropActionType } from "../util/DragManager"; import { DateField } from "../../new_fields/DateField"; import { UndoManager } from "../util/UndoManager"; +var requestImageSize = require('request-image-size'); export interface DocumentOptions { x?: number; @@ -216,7 +217,16 @@ export namespace Docs { } export function ImageDocument(url: string, options: DocumentOptions = {}) { - return CreateInstance(imageProto, new ImageField(new URL(url)), options); + let inst = CreateInstance(imageProto, new ImageField(new URL(url)), options); + requestImageSize(url) + .then((size: any) => { + if (!inst.proto!.nativeWidth) { + inst.proto!.nativeWidth = size.width; + } + inst.proto!.nativeHeight = Number(inst.proto!.nativeWidth!) * size.height / size.width; + }) + .catch((err: any) => console.log(err)); + return inst; // let doc = SetInstanceOptions(GetImagePrototype(), { ...options, layoutKeys: [KeyStore.Data, KeyStore.Annotations, KeyStore.Caption] }, // [new URL(url), ImageField]); // doc.SetText(KeyStore.Caption, "my caption..."); diff --git a/src/client/views/collections/collectionFreeForm/CollectionFreeFormLinkView.tsx b/src/client/views/collections/collectionFreeForm/CollectionFreeFormLinkView.tsx index d6097b9a3..61de83f57 100644 --- a/src/client/views/collections/collectionFreeForm/CollectionFreeFormLinkView.tsx +++ b/src/client/views/collections/collectionFreeForm/CollectionFreeFormLinkView.tsx @@ -46,11 +46,11 @@ export class CollectionFreeFormLinkView extends React.Component - - ); diff --git a/src/client/views/collections/collectionFreeForm/CollectionFreeFormLinksView.tsx b/src/client/views/collections/collectionFreeForm/CollectionFreeFormLinksView.tsx index c5f7ad0d1..85556fb90 100644 --- a/src/client/views/collections/collectionFreeForm/CollectionFreeFormLinksView.tsx +++ b/src/client/views/collections/collectionFreeForm/CollectionFreeFormLinksView.tsx @@ -113,8 +113,11 @@ export class CollectionFreeFormLinksView extends React.Component ); + return connections.map(c => { + let x = c.l.reduce((p, l) => p + l[Id], ""); + return ; + }); } render() { diff --git a/src/client/views/collections/collectionFreeForm/CollectionFreeFormView.tsx b/src/client/views/collections/collectionFreeForm/CollectionFreeFormView.tsx index 8be0766eb..d1c4fb72d 100644 --- a/src/client/views/collections/collectionFreeForm/CollectionFreeFormView.tsx +++ b/src/client/views/collections/collectionFreeForm/CollectionFreeFormView.tsx @@ -323,7 +323,10 @@ export class CollectionFreeFormView extends CollectionSubView(PanZoomDocument) { super.setCursorPosition(this.getTransform().transformPoint(e.clientX, e.clientY)); } - private childViews = () => [...this.views, ]; + private childViews = () => [ + , + ...this.views + ]; render() { const containerName = `collectionfreeformview${this.isAnnotationOverlay ? "-overlay" : "-container"}`; const easing = () => this.props.Document.panTransformType === "Ease"; diff --git a/src/client/views/nodes/ImageBox.tsx b/src/client/views/nodes/ImageBox.tsx index cc0dc8220..128f3c6f8 100644 --- a/src/client/views/nodes/ImageBox.tsx +++ b/src/client/views/nodes/ImageBox.tsx @@ -12,7 +12,7 @@ import React = require("react"); import { createSchema, makeInterface, listSpec } from '../../../new_fields/Schema'; import { DocComponent } from '../DocComponent'; import { positionSchema } from './DocumentView'; -import { FieldValue, Cast, StrCast } from '../../../new_fields/Types'; +import { FieldValue, Cast, StrCast, PromiseValue } from '../../../new_fields/Types'; import { ImageField } from '../../../new_fields/URLField'; import { List } from '../../../new_fields/List'; import { InkingControl } from '../InkingControl'; @@ -21,6 +21,7 @@ import { faImage } from '@fortawesome/free-solid-svg-icons'; import { library } from '@fortawesome/fontawesome-svg-core'; var path = require('path'); + library.add(faImage); @@ -43,15 +44,6 @@ export class ImageBox extends DocComponent(ImageD @observable private _isOpen: boolean = false; private dropDisposer?: DragManager.DragDropDisposer; - @action - onLoad = (target: any) => { - var h = this._imgRef.current!.naturalHeight; - var w = this._imgRef.current!.naturalWidth; - if (this._photoIndex === 0 && (this.props as any).id !== "isExpander" && (!this.Document.nativeWidth || !this.Document.nativeHeight || Math.abs(this.Document.nativeWidth / this.Document.nativeHeight - w / h) > 0.05)) { - Doc.SetOnPrototype(this.Document, "nativeHeight", FieldValue(this.Document.nativeWidth, 0) * h / w); - this.Document.height = FieldValue(this.Document.width, 0) * h / w; - } - } protected createDropTarget = (ele: HTMLDivElement) => { @@ -217,8 +209,7 @@ export class ImageBox extends DocComponent(ImageD // style={{ objectFit: (this._photoIndex === 0 ? undefined : "contain") }} width={nativeWidth} ref={this._imgRef} - onError={this.onError} - onLoad={this.onLoad} /> + onError={this.onError} /> {paths.length > 1 ? this.dots(paths) : (null)} {/* {this.lightbox(paths)} */} ); diff --git a/src/client/views/nodes/PDFBox.scss b/src/client/views/nodes/PDFBox.scss index 3760e378a..449408a61 100644 --- a/src/client/views/nodes/PDFBox.scss +++ b/src/client/views/nodes/PDFBox.scss @@ -17,6 +17,10 @@ z-index: 25; pointer-events: all; } +.pdfBox-thumbnail { + position: absolute; + width: 100%; +} .pdfButton { pointer-events: all; width: 100px; diff --git a/src/client/views/nodes/PDFBox.tsx b/src/client/views/nodes/PDFBox.tsx index 733bc920f..aa29a7170 100644 --- a/src/client/views/nodes/PDFBox.tsx +++ b/src/client/views/nodes/PDFBox.tsx @@ -375,7 +375,7 @@ export class PDFBox extends DocComponent(PdfDocumen // else if (this._largeRetryCount < 10) this._curSuffix = "_l"; if (field instanceof ImageField) path = this.choosePath(field.url); // } - return ; + return ; } return (null); } diff --git a/src/client/views/nodes/VideoBox.tsx b/src/client/views/nodes/VideoBox.tsx index ab57b4b04..35ecf12f6 100644 --- a/src/client/views/nodes/VideoBox.tsx +++ b/src/client/views/nodes/VideoBox.tsx @@ -10,10 +10,10 @@ import { makeInterface } from "../../../new_fields/Schema"; import { pageSchema } from "./ImageBox"; import { Cast, FieldValue, NumCast } from "../../../new_fields/Types"; import { VideoField } from "../../../new_fields/URLField"; -import Measure from "react-measure"; import "./VideoBox.scss"; import { RouteStore } from "../../../server/RouteStore"; import { DocServer } from "../../DocServer"; +import { actionFieldDecorator } from "mobx/lib/internal"; type VideoDocument = makeInterface<[typeof positionSchema, typeof pageSchema]>; const VideoDocument = makeInterface(positionSchema, pageSchema); @@ -22,30 +22,23 @@ const VideoDocument = makeInterface(positionSchema, pageSchema); export class VideoBox extends DocComponent(VideoDocument) { private _reactionDisposer?: IReactionDisposer; private _videoRef: HTMLVideoElement | null = null; - private _loaded: boolean = false; @observable _playTimer?: NodeJS.Timeout = undefined; @observable _fullScreen = false; @observable public Playing: boolean = false; public static LayoutString() { return FieldView.LayoutString(VideoBox); } - public get player(): HTMLVideoElement | undefined { - if (this._videoRef) { - return this._videoRef; - } + public get player(): HTMLVideoElement | null { + return this._videoRef; } - @action - setScaling = (r: any) => { - if (this._loaded) { - // bcz: the nativeHeight should really be set when the document is imported. - var nativeWidth = FieldValue(this.Document.nativeWidth, 0); - var nativeHeight = FieldValue(this.Document.nativeHeight, 0); - var newNativeHeight = nativeWidth * r.offset.height / r.offset.width; - if (!nativeHeight && newNativeHeight !== nativeHeight && !isNaN(newNativeHeight)) { - this.Document.height = newNativeHeight / nativeWidth * FieldValue(this.Document.width, 0); - this.Document.nativeHeight = newNativeHeight; - } - } else { - this._loaded = true; + + videoLoad = () => { + let aspect = this.player!.videoWidth / this.player!.videoHeight; + var nativeWidth = FieldValue(this.Document.nativeWidth, 0); + var nativeHeight = FieldValue(this.Document.nativeHeight, 0); + if (!nativeWidth || !nativeHeight) { + if (!this.Document.nativeWidth) this.Document.nativeWidth = this.player!.videoWidth; + this.Document.nativeHeight = this.Document.nativeWidth / aspect; + this.Document.height = FieldValue(this.Document.width, 0) / aspect; } } @@ -88,22 +81,12 @@ export class VideoBox extends DocComponent(VideoD if (vref) { vref.onfullscreenchange = action((e) => this._fullScreen = vref.webkitDisplayingFullscreen); if (this._reactionDisposer) this._reactionDisposer(); - this._reactionDisposer = reaction(() => this.props.Document.curPage, () => { - if (!this.Playing) { - vref.currentTime = NumCast(this.props.Document.curPage, 0); - } - }, { fireImmediately: true }); + this._reactionDisposer = reaction(() => this.props.Document.curPage, () => + !this.Playing && (vref.currentTime = this.Document.curPage || 0) + , { fireImmediately: true }); } } - videoContent(path: string) { - let style = "videoBox-cont" + (this._fullScreen ? "-fullScreen" : ""); - return ; - } - getMp4ForVideo(videoId: string = "JN5beCVArMs") { return new Promise(async (resolve, reject) => { const videoInfoRequestConfig = { @@ -111,7 +94,6 @@ export class VideoBox extends DocComponent(VideoD connection: 'keep-alive', "user-agent": 'Mozilla/5.0 (Windows NT 10.0; WOW64; rv:43.0) Gecko/20100101 Firefox/46.0', }, - }; try { let responseSchema: any = {}; @@ -145,9 +127,6 @@ export class VideoBox extends DocComponent(VideoD render() { let field = Cast(this.Document[this.props.fieldKey], VideoField); - if (!field) { - return
Loading
; - } // this.getMp4ForVideo().then((mp4) => { // console.log(mp4); @@ -155,15 +134,12 @@ export class VideoBox extends DocComponent(VideoD // console.log("") // }); // // - let content = this.videoContent(field.url.href); - return NumCast(this.props.Document.nativeHeight) ? - content : - - {({ measureRef }) => -
- {content} -
- } -
; + + let style = "videoBox-cont" + (this._fullScreen ? "-fullScreen" : ""); + return !field ?
Loading
: + ; } } \ No newline at end of file -- cgit v1.2.3-70-g09d2 From e4a298e8e5410af8654e0e2aafd6e21c212ecee1 Mon Sep 17 00:00:00 2001 From: bob Date: Tue, 28 May 2019 14:36:02 -0400 Subject: added pasting of img url's with ctrl-b, switched stacking view to a masonry view like pinterest. fixed template overlays. --- package.json | 1 + src/client/documents/Documents.ts | 3 +- src/client/views/Templates.tsx | 10 ++- .../views/collections/CollectionStackingView.scss | 7 ++ .../views/collections/CollectionStackingView.tsx | 62 ++++++++++++--- .../collectionFreeForm/CollectionFreeFormView.scss | 7 ++ .../collections/collectionFreeForm/MarqueeView.tsx | 88 ++++++++++++---------- src/client/views/nodes/ImageBox.tsx | 2 +- 8 files changed, 122 insertions(+), 58 deletions(-) (limited to 'package.json') diff --git a/package.json b/package.json index d5abc808e..df0767b50 100644 --- a/package.json +++ b/package.json @@ -119,6 +119,7 @@ "html-to-image": "^0.1.0", "i": "^0.3.6", "image-data-uri": "^2.0.0", + "imagesloaded": "^4.1.4", "jsonwebtoken": "^8.5.0", "jsx-to-string": "^1.4.0", "lodash": "^4.17.11", diff --git a/src/client/documents/Documents.ts b/src/client/documents/Documents.ts index 1f4b76384..4bc0df31f 100644 --- a/src/client/documents/Documents.ts +++ b/src/client/documents/Documents.ts @@ -34,6 +34,7 @@ import { StrokeData, InkField } from "../../new_fields/InkField"; import { dropActionType } from "../util/DragManager"; import { DateField } from "../../new_fields/DateField"; import { UndoManager } from "../util/UndoManager"; +import { RouteStore } from "../../server/RouteStore"; var requestImageSize = require('request-image-size'); export interface DocumentOptions { @@ -218,7 +219,7 @@ export namespace Docs { export function ImageDocument(url: string, options: DocumentOptions = {}) { let inst = CreateInstance(imageProto, new ImageField(new URL(url)), options); - requestImageSize(url) + requestImageSize(window.origin + RouteStore.corsProxy + "/" + url) .then((size: any) => { if (!inst.proto!.nativeWidth) { inst.proto!.nativeWidth = size.width; diff --git a/src/client/views/Templates.tsx b/src/client/views/Templates.tsx index 5a99b3d90..303f3f3b8 100644 --- a/src/client/views/Templates.tsx +++ b/src/client/views/Templates.tsx @@ -56,10 +56,12 @@ export namespace Templates { ` ); export const Title = new Template("Title", TemplatePosition.InnerTop, - `
{layout}
-
- {props.Document.title} -
` ); + `
+
{layout}
+
+ {props.Document.title} +
+
` ); export const Bullet = new Template("Bullet", TemplatePosition.InnerTop, `
diff --git a/src/client/views/collections/CollectionStackingView.scss b/src/client/views/collections/CollectionStackingView.scss index 803e680e5..6043a813d 100644 --- a/src/client/views/collections/CollectionStackingView.scss +++ b/src/client/views/collections/CollectionStackingView.scss @@ -31,6 +31,13 @@ align-items: center; } + .collectionStackingview-masonryGrid { + display:grid; + width:100%; + height:100%; + position: absolute; + } + .collectionStackingView-description { font-size: 100%; margin-bottom: 1vw; diff --git a/src/client/views/collections/CollectionStackingView.tsx b/src/client/views/collections/CollectionStackingView.tsx index a1cb73123..a29648d5b 100644 --- a/src/client/views/collections/CollectionStackingView.tsx +++ b/src/client/views/collections/CollectionStackingView.tsx @@ -1,36 +1,76 @@ import React = require("react"); import { observer } from "mobx-react"; -import { CollectionSubView } from "./CollectionSubView"; -import Measure from "react-measure"; -import { Doc, WidthSym, HeightSym } from "../../../new_fields/Doc"; +import { CollectionSubView, CollectionViewProps, SubCollectionViewProps } from "./CollectionSubView"; +import { Doc, WidthSym, HeightSym, DocListCast } from "../../../new_fields/Doc"; import { DocumentView } from "../nodes/DocumentView"; import { Transform } from "../../util/Transform"; import { emptyFunction, returnOne } from "../../../Utils"; import "./CollectionStackingView.scss"; -import { runInAction, action, observable, computed } from "mobx"; -import { StrCast } from "../../../new_fields/Types"; +import { action, reaction } from "mobx"; +import { StrCast, NumCast } from "../../../new_fields/Types"; +import { Id } from "../../../new_fields/FieldSymbols"; + + @observer export class CollectionStackingView extends CollectionSubView(doc => doc) { getPreviewTransform = (): Transform => this.props.ScreenToLocalTransform(); + constructor(props: SubCollectionViewProps) { + super(props); + // reaction(() => [this.props.PanelHeight() + this.props.PanelWidth(), + // (this.props.ContainingCollectionView && this.props.ContainingCollectionView.props.Document[this.props.ContainingCollectionView.props.fieldKey])], () => { + // if (this.props.ContainingCollectionView) { + // let allItems = DocListCast(this.props.ContainingCollectionView.props.Document[this.props.ContainingCollectionView.props.fieldKey]); + // for (let x = 0; x < allItems.length; x++) { + // resizeGridItem(allItems[x]); + // } + // } + // } + // ); + } + @action moveDocument = (doc: Doc, targetCollection: Doc, addDocument: (document: Doc) => boolean): boolean => { this.props.removeDocument(doc); addDocument(doc); return true; } - render() { const docs = this.childDocs; + let gridGap = 10; + let gridSize = 20; + let itemWidth = NumCast(this.props.Document.itemWidth, 250); + let leftMargin = 20; + let topMargin = 20; + let itemCols = Math.ceil(itemWidth / (gridSize + gridGap)); + let cells = Math.floor((this.props.PanelWidth() - leftMargin) / (itemCols * (gridSize + gridGap))); return ( -
e.stopPropagation()}> -
{StrCast(this.props.Document.documentText, StrCast(this.props.Document.title, "stacking collection"))}
-
+
e.stopPropagation()}> +
{docs.map(d => { - return (
+ let colSpan = Math.ceil((itemWidth + gridGap) / (gridSize + gridGap)); + let rowSpan = Math.ceil((itemWidth / d[WidthSym]() * d[HeightSym]() + gridGap) / (gridSize + gridGap)); + return (
.jsx-parser { + z-index:0; + } //nested freeform views // .collectionfreeformview-container { @@ -52,6 +55,10 @@ position: inherit; height: 100%; } + + >.jsx-parser { + z-index:0; + } .formattedTextBox-cont { background: $light-color-secondary; diff --git a/src/client/views/collections/collectionFreeForm/MarqueeView.tsx b/src/client/views/collections/collectionFreeForm/MarqueeView.tsx index 973ebfbdd..64d5301c9 100644 --- a/src/client/views/collections/collectionFreeForm/MarqueeView.tsx +++ b/src/client/views/collections/collectionFreeForm/MarqueeView.tsx @@ -83,56 +83,62 @@ export class MarqueeView extends React.Component }); })(); } else if (e.key === "b" && e.ctrlKey) { - //heuristically converts pasted text into a table. - // assumes each entry is separated by a tab - // skips all rows until it gets to a row with more than one entry - // assumes that 1st row has header entry for each column - // assumes subsequent rows have entries for each column header OR - // any row that has only one column is a section header-- this header is then added as a column to subsequent rows until the next header - // assumes each cell is a string or a number e.preventDefault(); - (async () => { - let text: string = await navigator.clipboard.readText(); + navigator.clipboard.readText().then(text => { let ns = text.split("\n").filter(t => t.trim() !== "\r" && t.trim() !== ""); - while (ns.length > 0 && ns[0].split("\t").length < 2) { - ns.splice(0, 1); - } - if (ns.length > 0) { - let columns = ns[0].split("\t"); - let docList: Doc[] = []; - let groupAttr: string | number = ""; - let rowProto = new Doc(); - rowProto.title = rowProto.Id; - rowProto.width = 200; - rowProto.isPrototype = true; - for (let i = 1; i < ns.length - 1; i++) { - let values = ns[i].split("\t"); - if (values.length === 1 && columns.length > 1) { - groupAttr = values[0]; - continue; - } - let docDataProto = Doc.MakeDelegate(rowProto); - docDataProto.isPrototype = true; - columns.forEach((col, i) => docDataProto[columns[i]] = (values.length > i ? ((values[i].indexOf(Number(values[i]).toString()) !== -1) ? Number(values[i]) : values[i]) : undefined)); - if (groupAttr) { - docDataProto._group = groupAttr; - } - docDataProto.title = i.toString(); - let doc = Doc.MakeDelegate(docDataProto); - doc.width = 200; - docList.push(doc); - } - let newCol = Docs.SchemaDocument([...(groupAttr ? ["_group"] : []), ...columns.filter(c => c)], docList, { x: x, y: y, title: "droppedTable", width: 300, height: 100 }); - - this.props.addDocument(newCol, false); + if (ns.length === 1 && text.startsWith("http")) { + this.props.addDocument(Docs.ImageDocument(text, { width: 300, x: x, y: y }), false);// paste an image from its URL in the paste buffer + } else { + this.pasteTable(ns, x, y); } - })(); + }); } else { let newBox = Docs.TextDocument({ width: 200, height: 100, x: x, y: y, title: "-typed text-" }); this.props.addLiveTextDocument(newBox); } e.stopPropagation(); } + //heuristically converts pasted text into a table. + // assumes each entry is separated by a tab + // skips all rows until it gets to a row with more than one entry + // assumes that 1st row has header entry for each column + // assumes subsequent rows have entries for each column header OR + // any row that has only one column is a section header-- this header is then added as a column to subsequent rows until the next header + // assumes each cell is a string or a number + pasteTable(ns: string[], x: number, y: number) { + while (ns.length > 0 && ns[0].split("\t").length < 2) { + ns.splice(0, 1); + } + if (ns.length > 0) { + let columns = ns[0].split("\t"); + let docList: Doc[] = []; + let groupAttr: string | number = ""; + let rowProto = new Doc(); + rowProto.title = rowProto.Id; + rowProto.width = 200; + rowProto.isPrototype = true; + for (let i = 1; i < ns.length - 1; i++) { + let values = ns[i].split("\t"); + if (values.length === 1 && columns.length > 1) { + groupAttr = values[0]; + continue; + } + let docDataProto = Doc.MakeDelegate(rowProto); + docDataProto.isPrototype = true; + columns.forEach((col, i) => docDataProto[columns[i]] = (values.length > i ? ((values[i].indexOf(Number(values[i]).toString()) !== -1) ? Number(values[i]) : values[i]) : undefined)); + if (groupAttr) { + docDataProto._group = groupAttr; + } + docDataProto.title = i.toString(); + let doc = Doc.MakeDelegate(docDataProto); + doc.width = 200; + docList.push(doc); + } + let newCol = Docs.SchemaDocument([...(groupAttr ? ["_group"] : []), ...columns.filter(c => c)], docList, { x: x, y: y, title: "droppedTable", width: 300, height: 100 }); + + this.props.addDocument(newCol, false); + } + } @action onPointerDown = (e: React.PointerEvent): void => { this._downX = this._lastX = e.pageX; diff --git a/src/client/views/nodes/ImageBox.tsx b/src/client/views/nodes/ImageBox.tsx index 128f3c6f8..d70068295 100644 --- a/src/client/views/nodes/ImageBox.tsx +++ b/src/client/views/nodes/ImageBox.tsx @@ -86,8 +86,8 @@ export class ImageBox extends DocComponent(ImageD onPointerDown = (e: React.PointerEvent): void => { if (e.shiftKey && e.ctrlKey) - e.stopPropagation(); + e.stopPropagation(); // if (Date.now() - this._lastTap < 300) { // if (e.buttons === 1) { // this._downX = e.clientX; -- cgit v1.2.3-70-g09d2