aboutsummaryrefslogtreecommitdiff
path: root/src/client/util
diff options
context:
space:
mode:
Diffstat (limited to 'src/client/util')
-rw-r--r--src/client/util/Import & Export/DirectoryImportBox.scss0
-rw-r--r--src/client/util/Import & Export/DirectoryImportBox.tsx (renamed from src/client/util/Import & Export/ImportBox.tsx)71
-rw-r--r--src/client/util/Import & Export/ImageImporter.tsx67
-rw-r--r--src/client/util/request-image-size.js6
4 files changed, 63 insertions, 81 deletions
diff --git a/src/client/util/Import & Export/DirectoryImportBox.scss b/src/client/util/Import & Export/DirectoryImportBox.scss
new file mode 100644
index 000000000..e69de29bb
--- /dev/null
+++ b/src/client/util/Import & Export/DirectoryImportBox.scss
diff --git a/src/client/util/Import & Export/ImportBox.tsx b/src/client/util/Import & Export/DirectoryImportBox.tsx
index 630911710..2d77f6ae6 100644
--- a/src/client/util/Import & Export/ImportBox.tsx
+++ b/src/client/util/Import & Export/DirectoryImportBox.tsx
@@ -3,31 +3,42 @@ import React = require("react");
import { Doc } from "../../../new_fields/Doc";
import { DocServer } from "../../DocServer";
import { RouteStore } from "../../../server/RouteStore";
-import { action, observable } from "mobx";
+import { action, observable, runInAction } from "mobx";
import { FieldViewProps, FieldView } from "../../views/nodes/FieldView";
import Measure, { ContentRect } from "react-measure";
import { library } from '@fortawesome/fontawesome-svg-core';
import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
-import { faArrowUp } from '@fortawesome/free-solid-svg-icons';
+import { faArrowUp, faTag, faFileExcel } from '@fortawesome/free-solid-svg-icons';
import { Docs, DocumentOptions } from "../../documents/Documents";
+import { EditableView } from "../../views/EditableView";
-interface ImageImporterProps {
- addSchema: (imageDocs: Doc[]) => void;
-}
-
-export default class ImportBox extends React.Component<FieldViewProps> {
+export default class DirectoryImportBox extends React.Component<FieldViewProps> {
+ private selector = React.createRef<HTMLInputElement>();
@observable private top = 0;
@observable private left = 0;
private dimensions = 50;
+ @observable private key = "Key";
+ @observable private value = "Value";
+
+ public static LayoutString() { return FieldView.LayoutString(DirectoryImportBox); }
+
constructor(props: FieldViewProps) {
super(props);
- library.add(faArrowUp);
+ library.add(faArrowUp, faTag);
}
- public static LayoutString() { return FieldView.LayoutString(ImportBox); }
+ updateKey = (newKey: string) => {
+ runInAction(() => this.key = newKey);
+ console.log("KEY ", this.key);
+ return true;
+ }
- private selector = React.createRef<HTMLInputElement>();
+ updateValue = (newValue: string) => {
+ runInAction(() => this.value = newValue);
+ console.log("VALUE ", this.value);
+ return true;
+ }
handleSelection = async (e: React.ChangeEvent<HTMLInputElement>) => {
let promises: Promise<void>[] = [];
@@ -56,6 +67,7 @@ export default class ImportBox extends React.Component<FieldViewProps> {
}).then(async (res: Response) => {
(await res.json()).map(action((file: any) => {
let path = DocServer.prepend(file);
+ console.log(path);
let docPromise = Docs.getDocumentFromType(type, path, { nativeWidth: 300, width: 300, title: dropFileName });
docPromise.then(doc => doc && docs.push(doc));
}));
@@ -76,8 +88,8 @@ export default class ImportBox extends React.Component<FieldViewProps> {
}
componentDidMount() {
- this.selector.current!.setAttribute("directory", "true");
- this.selector.current!.setAttribute("webkitdirectory", "true");
+ this.selector.current!.setAttribute("directory", "");
+ this.selector.current!.setAttribute("webkitdirectory", "");
}
@action
@@ -93,6 +105,7 @@ export default class ImportBox extends React.Component<FieldViewProps> {
render() {
let dimensions = 50;
+ let keyValueStyle = { paddingLeft: 5, width: "50%" };
return (
<Measure offset onResize={this.preserveCentering}>
{({ measureRef }) =>
@@ -125,6 +138,40 @@ export default class ImportBox extends React.Component<FieldViewProps> {
<FontAwesomeIcon icon={faArrowUp} color="#FFFFFF" size={"2x"} />
</div>
</label>
+ <div style={{
+ position: "absolute",
+ top: 5,
+ right: 5,
+ borderRadius: "50%",
+ width: 25,
+ height: 25,
+ background: "black"
+ }} />
+ <div style={{
+ position: "absolute",
+ right: 9.5,
+ top: 11
+ }}>
+ <FontAwesomeIcon icon={faTag} color="#FFFFFF" size={"1x"} />
+ </div>
+ <div style={{ display: "flex", flexDirection: "row", borderBottom: "1px solid black", paddingBottom: 5 }} >
+ <div className={"key_container"} style={keyValueStyle}>
+ <EditableView
+ contents={this.key}
+ SetValue={this.updateKey}
+ GetValue={() => this.key}
+ oneLine={true}
+ />
+ </div>
+ <div className={"value_container"} style={keyValueStyle}>
+ <EditableView
+ contents={this.value}
+ SetValue={this.updateValue}
+ GetValue={() => this.value}
+ oneLine={true}
+ />
+ </div>
+ </div>
</div>
}
</Measure>
diff --git a/src/client/util/Import & Export/ImageImporter.tsx b/src/client/util/Import & Export/ImageImporter.tsx
deleted file mode 100644
index d664f6487..000000000
--- a/src/client/util/Import & Export/ImageImporter.tsx
+++ /dev/null
@@ -1,67 +0,0 @@
-import "fs";
-import React = require("react");
-import { Doc } from "../../../new_fields/Doc";
-import { DocServer } from "../../DocServer";
-import { RouteStore } from "../../../server/RouteStore";
-import { action } from "mobx";
-import { Docs } from "../../documents/Documents";
-import { FieldViewProps } from "../../views/nodes/FieldView";
-
-interface ImageImporterProps {
- addSchema: (imageDocs: Doc[]) => void;
-}
-
-export default class BulkImporter extends React.Component<FieldViewProps> {
- private selector = React.createRef<HTMLInputElement>();
-
- handleSelection = async (e: React.ChangeEvent<HTMLInputElement>) => {
- let promises: Promise<void>[] = [];
- let docs: Doc[] = [];
-
- let files = e.target.files;
- if (!files) return;
-
- for (let i = 0; i < files.length; i++) {
- let target = files.item(i);
-
- if (target === null) {
- continue;
- }
-
- let type = target.type;
- let formData = new FormData();
- formData.append('file', target);
- let dropFileName = target ? target.name : "-empty-";
-
- let prom = fetch(DocServer.prepend(RouteStore.upload), {
- method: 'POST',
- body: formData
- }).then(async (res: Response) => {
- (await res.json()).map(action((file: any) => {
- let path = window.location.origin + file;
- let docPromise = Docs.getDocumentFromType(type, path, { nativeWidth: 300, width: 300, title: dropFileName });
- docPromise.then(doc => doc && docs.push(doc));
- }));
- });
- promises.push(prom);
- }
-
- await Promise.all(promises);
-
- let parent = Docs.SchemaDocument(["title", "data"], docs, { width: 300, height: 300, title: "Bulk Import from Directory" });
- }
-
- componentDidMount() {
- this.selector.current!.setAttribute("directory", "true");
- this.selector.current!.setAttribute("webkitdirectory", "true");
- }
-
- render() {
- return (
- <div>
- <input ref={this.selector} name={"selector"} onChange={this.handleSelection} type="file" style={{ position: "absolute" }} />
- </div>
- );
- }
-
-} \ No newline at end of file
diff --git a/src/client/util/request-image-size.js b/src/client/util/request-image-size.js
index 0f9328872..27605d167 100644
--- a/src/client/util/request-image-size.js
+++ b/src/client/util/request-image-size.js
@@ -21,7 +21,9 @@ module.exports = function requestImageSize(options) {
if (options && typeof options === 'object') {
opts = Object.assign(options, opts);
} else if (options && typeof options === 'string') {
- opts = Object.assign({ uri: options }, opts);
+ opts = Object.assign({
+ uri: options
+ }, opts);
} else {
return Promise.reject(new Error('You should provide an URI string or a "request" options object.'));
}
@@ -70,4 +72,4 @@ module.exports = function requestImageSize(options) {
req.on('error', err => reject(err));
});
-};
+}; \ No newline at end of file