aboutsummaryrefslogtreecommitdiff
diff options
context:
space:
mode:
authorSam Wilkins <abdullah_ahmed@brown.edu>2019-03-09 23:00:41 -0500
committerSam Wilkins <abdullah_ahmed@brown.edu>2019-03-09 23:00:41 -0500
commit81c0a8373fd5cb051531762243e200f11f8c7297 (patch)
tree5436511d43ec2d77133160ad193155ab1ae4ac8e
parentf9f0fd90791562c295f8d9b237596cbabb086b79 (diff)
editable workspace titles now supported, added 'display' prop to EditableView
-rw-r--r--src/client/views/EditableView.tsx5
-rw-r--r--src/client/views/collections/CollectionSchemaView.tsx6
-rw-r--r--src/client/views/collections/CollectionTreeView.tsx5
-rw-r--r--src/server/authentication/controllers/WorkspacesMenu.tsx32
4 files changed, 33 insertions, 15 deletions
diff --git a/src/client/views/EditableView.tsx b/src/client/views/EditableView.tsx
index 84b1b91c3..55a49863d 100644
--- a/src/client/views/EditableView.tsx
+++ b/src/client/views/EditableView.tsx
@@ -20,6 +20,7 @@ export interface EditableProps {
*/
contents: any;
height: number
+ display: string;
}
/**
@@ -46,10 +47,10 @@ export class EditableView extends React.Component<EditableProps> {
render() {
if (this.editing) {
return <input defaultValue={this.props.GetValue()} onKeyDown={this.onKeyDown} autoFocus onBlur={action(() => this.editing = false)}
- style={{ display: "inline" }}></input>
+ style={{ display: this.props.display }}></input>
} else {
return (
- <div className="editableView-container-editing" style={{ display: "inline", height: "100%", maxHeight: `${this.props.height}` }}
+ <div className="editableView-container-editing" style={{ display: this.props.display, height: "100%", maxHeight: `${this.props.height}` }}
onClick={action(() => this.editing = true)}>
{this.props.contents}
</div>
diff --git a/src/client/views/collections/CollectionSchemaView.tsx b/src/client/views/collections/CollectionSchemaView.tsx
index 49f95c014..2868e1322 100644
--- a/src/client/views/collections/CollectionSchemaView.tsx
+++ b/src/client/views/collections/CollectionSchemaView.tsx
@@ -50,7 +50,9 @@ export class CollectionSchemaView extends CollectionViewBase {
let onItemDown = setupDrag(reference, () => props.doc);
return (
<div onPointerDown={onItemDown} key={props.doc.Id} ref={reference}>
- <EditableView contents={contents}
+ <EditableView
+ display={"inline"}
+ contents={contents}
height={36} GetValue={() => {
let field = props.doc.Get(props.fieldKey);
if (field && field instanceof Field) {
@@ -59,7 +61,7 @@ export class CollectionSchemaView extends CollectionViewBase {
return field || "";
}}
SetValue={(value: string) => {
- let script = CompileScript(value, undefined, true);
+ let script = CompileScript(value);
if (!script.compiled) {
return false;
}
diff --git a/src/client/views/collections/CollectionTreeView.tsx b/src/client/views/collections/CollectionTreeView.tsx
index 8b06d9ac4..9c31bdae2 100644
--- a/src/client/views/collections/CollectionTreeView.tsx
+++ b/src/client/views/collections/CollectionTreeView.tsx
@@ -69,7 +69,9 @@ class TreeView extends React.Component<TreeViewProps> {
return <div key={this.props.document.Id}></div>;
}
- return <div className="docContainer"> <EditableView contents={title.Data}
+ return <div className="docContainer"> <EditableView
+ display={"inline"}
+ contents={title.Data}
height={36} GetValue={() => {
let title = this.props.document.GetT<TextField>(KeyStore.Title, TextField);
if (title && title !== "<Waiting>")
@@ -159,6 +161,7 @@ export class CollectionTreeView extends CollectionViewBase {
<div id="body" className="collectionTreeView-dropTarget" onDrop={(e: React.DragEvent) => this.onDrop(e, {})} ref={this.createDropTarget} style={{ borderWidth: `${COLLECTION_BORDER_WIDTH}px` }}>
<h3>
<EditableView contents={titleStr}
+ display={"inline"}
height={72} GetValue={() => {
return this.props.Document.Title;
}} SetValue={(value: string) => {
diff --git a/src/server/authentication/controllers/WorkspacesMenu.tsx b/src/server/authentication/controllers/WorkspacesMenu.tsx
index 70c37774c..ffef2e11c 100644
--- a/src/server/authentication/controllers/WorkspacesMenu.tsx
+++ b/src/server/authentication/controllers/WorkspacesMenu.tsx
@@ -7,6 +7,8 @@ import './WorkspacesMenu.css'
import { Document } from '../../../fields/Document';
import { Server } from '../../../client/Server';
import { Field } from '../../../fields/Field';
+import { EditableView } from '../../../client/views/EditableView';
+import { KeyStore } from '../../../fields/KeyStore';
export interface WorkspaceMenuProps {
active: Document;
@@ -67,19 +69,29 @@ export class WorkspacesMenu extends React.Component<WorkspaceMenuProps> {
}}
onClick={this.addNewWorkspace}
/>
- {this.props.allWorkspaces.map(s =>
- <li className={"ids"}
+ {this.props.allWorkspaces.map((s, i) =>
+ <div
key={s.Id}
- style={{
- listStyleType: "none",
- color: s.Id === this.props.active.Id ? "darkblue" : "black",
- cursor: "grab"
- }}
- onClick={() => {
+ onContextMenu={(e) => {
+ e.preventDefault();
this.props.open(s);
- console.log(this.props.allWorkspaces.length);
}}
- >{s.Title}</li>
+ style={{
+ marginTop: 10
+ }}
+ >
+ <span>{i + 1} - </span>
+ <EditableView
+ display={"inline"}
+ GetValue={() => { return s.Title }}
+ SetValue={(title: string): boolean => {
+ s.SetText(KeyStore.Title, title);
+ return true;
+ }}
+ contents={s.Title}
+ height={20}
+ />
+ </div>
)}
</div>
);