From 7da76d2538ebde21d7a878b5096d5a673e5d6375 Mon Sep 17 00:00:00 2001 From: Bob Zeleznik Date: Fri, 10 May 2019 23:01:08 -0400 Subject: added summary screen grab icon as a template view of a text document. converted Cast(...ListSpec(Doc)) pattern to DocListCast --- .../views/collections/CollectionTreeView.tsx | 22 ++++++++++++---------- 1 file changed, 12 insertions(+), 10 deletions(-) (limited to 'src/client/views/collections/CollectionTreeView.tsx') diff --git a/src/client/views/collections/CollectionTreeView.tsx b/src/client/views/collections/CollectionTreeView.tsx index 33787f06b..78c84cc89 100644 --- a/src/client/views/collections/CollectionTreeView.tsx +++ b/src/client/views/collections/CollectionTreeView.tsx @@ -18,9 +18,7 @@ import { Main } from '../Main'; import { CurrentUserUtils } from '../../../server/authentication/models/current_user_utils'; import { CollectionDockingView } from './CollectionDockingView'; import { DocumentManager } from '../../util/DocumentManager'; -import { Utils } from '../../../Utils'; import { List } from '../../../new_fields/List'; -import { indexOf } from 'typescript-collections/dist/lib/arrays'; export interface TreeViewProps { @@ -155,16 +153,21 @@ class TreeView extends React.Component { let keys = Array.from(Object.keys(this.props.document)); if (this.props.document.proto instanceof Doc) { keys.push(...Array.from(Object.keys(this.props.document.proto))); + while (keys.indexOf("proto") !== -1) keys.splice(keys.indexOf("proto"), 1); } keys.map(key => { - let docList = Cast(this.props.document[key], listSpec(Doc)); - if (docList instanceof List && docList.length && docList[0] instanceof Doc) { + let docList = DocListCast(this.props.document[key]); + let doc = Cast(this.props.document[key], Doc); + if (doc instanceof Doc || docList.length) { if (!this._collapsed) { bulletType = BulletType.Collapsible; + let spacing = (key === "data") ? 0 : -10; contentElement.push(); } else bulletType = BulletType.Collapsed; @@ -179,7 +182,7 @@ class TreeView extends React.Component { ; } - public static GetChildElements(docs: (Doc | Promise)[], allowMinimized: boolean, remove: ((doc: Doc) => void), move: DragManager.MoveFunction, dropAction: dropActionType) { + public static GetChildElements(docs: Doc[], allowMinimized: boolean, remove: ((doc: Doc) => void), move: DragManager.MoveFunction, dropAction: dropActionType) { return docs.filter(child => child instanceof Doc && !child.excludeFromLibrary && (allowMinimized || !child.isMinimized)).filter(doc => FieldValue(doc)).map(child => ); } @@ -203,12 +206,11 @@ export class CollectionTreeView extends CollectionSubView(Document) { } } render() { - const children = this.children; let dropAction = StrCast(this.props.Document.dropAction, "alias") as dropActionType; - if (!children) { + if (!this.children) { return (null); } - let childElements = TreeView.GetChildElements(children, false, this.remove, this.props.moveDocument, dropAction); + let childElements = TreeView.GetChildElements(this.children, false, this.remove, this.props.moveDocument, dropAction); return (
Date: Sun, 12 May 2019 09:12:50 -0400 Subject: adjustments to treeview and ctrl-q pasting. --- src/client/views/DocumentDecorations.scss | 2 +- src/client/views/EditableView.scss | 17 ++++++++++++++++- src/client/views/EditableView.tsx | 7 ++++--- src/client/views/collections/CollectionTreeView.tsx | 14 ++++++++++++-- .../collections/collectionFreeForm/MarqueeView.tsx | 8 ++------ src/client/views/globalCssVariables.scss | 6 ++++-- 6 files changed, 39 insertions(+), 15 deletions(-) (limited to 'src/client/views/collections/CollectionTreeView.tsx') diff --git a/src/client/views/DocumentDecorations.scss b/src/client/views/DocumentDecorations.scss index 6a2e33836..ba9f32d7d 100644 --- a/src/client/views/DocumentDecorations.scss +++ b/src/client/views/DocumentDecorations.scss @@ -65,7 +65,7 @@ $linkGap : 3px; cursor: ew-resize; } .title{ - background: lightblue; + background: $alt-accent; grid-column-start: 3; grid-column-end: 4; pointer-events: auto; diff --git a/src/client/views/EditableView.scss b/src/client/views/EditableView.scss index ea401eaf9..dfa110f8d 100644 --- a/src/client/views/EditableView.scss +++ b/src/client/views/EditableView.scss @@ -1,5 +1,20 @@ -.editableView-container-editing { +.editableView-container-editing, .editableView-container-editing-oneLine { overflow-wrap: break-word; word-wrap: break-word; hyphens: auto; + overflow: hidden; +} +.editableView-container-editing-oneLine { + span { + white-space: nowrap; + overflow: hidden; + text-overflow: ellipsis; + display:block; + } + input { + display:block; + } +} +.editableView-input { + width: 100%; } \ No newline at end of file diff --git a/src/client/views/EditableView.tsx b/src/client/views/EditableView.tsx index 73467eb9d..78143ccda 100644 --- a/src/client/views/EditableView.tsx +++ b/src/client/views/EditableView.tsx @@ -24,6 +24,7 @@ export interface EditableProps { contents: any; height: number; display?: string; + oneLine?: boolean; } /** @@ -54,11 +55,11 @@ export class EditableView extends React.Component { render() { if (this.editing) { - return this.editing = false)} - style={{ display: this.props.display }}>; + return this.editing = false)} + style={{ display: this.props.display }} />; } else { return ( -
this.editing = true)} > {this.props.contents}
diff --git a/src/client/views/collections/CollectionTreeView.tsx b/src/client/views/collections/CollectionTreeView.tsx index 78c84cc89..9bd32a89f 100644 --- a/src/client/views/collections/CollectionTreeView.tsx +++ b/src/client/views/collections/CollectionTreeView.tsx @@ -93,6 +93,15 @@ class TreeView extends React.Component { return
{bullet ? : ""}
; } + @action + onMouseEnter = () => { + this._isOver = true; + } + @observable _isOver: boolean = false; + @action + onMouseLeave = () => { + this._isOver = false; + } /** * Renders the EditableView title element for placement into the tree. */ @@ -101,7 +110,8 @@ class TreeView extends React.Component { let onItemDown = SetupDrag(reference, () => this.props.document, this.props.moveDocument, this.props.dropAction); let editableView = (titleString: string) => ( StrCast(this.props.document.title)} @@ -118,7 +128,7 @@ class TreeView extends React.Component {
); return ( -
{editableView(StrCast(this.props.document.title))} diff --git a/src/client/views/collections/collectionFreeForm/MarqueeView.tsx b/src/client/views/collections/collectionFreeForm/MarqueeView.tsx index 9ace0272a..718a75770 100644 --- a/src/client/views/collections/collectionFreeForm/MarqueeView.tsx +++ b/src/client/views/collections/collectionFreeForm/MarqueeView.tsx @@ -59,13 +59,9 @@ export class MarqueeView extends React.Component if (e.key === "q" && e.ctrlKey) { e.preventDefault(); (async () => { - let text = await navigator.clipboard.readText(); - let ns = text.split("\n").filter(t => t != "\r"); + let text: string = await navigator.clipboard.readText(); + let ns = text.split("\n").filter(t => t.trim() != "\r" && t.trim() != ""); for (let i = 0; i < ns.length - 1; i++) { - if (ns[i].trim() === "") { - ns.splice(i, 1); - continue; - } while (!(ns[i].trim() === "" || ns[i].endsWith("-\r") || ns[i].endsWith("-") || ns[i].endsWith(";\r") || ns[i].endsWith(";") || ns[i].endsWith(".\r") || ns[i].endsWith(".") || diff --git a/src/client/views/globalCssVariables.scss b/src/client/views/globalCssVariables.scss index cb4d1ad87..838d4d9ac 100644 --- a/src/client/views/globalCssVariables.scss +++ b/src/client/views/globalCssVariables.scss @@ -2,10 +2,12 @@ // colors $light-color: #fcfbf7; $light-color-secondary:#f1efeb; -$main-accent: #61aaa3; +//$main-accent: #61aaa3; +$main-accent: #aaaaa3; // $alt-accent: #cdd5ec; // $alt-accent: #cdeceb; -$alt-accent: #59dff7; +//$alt-accent: #59dff7; +$alt-accent: #c2c2c5; $lighter-alt-accent: rgb(207, 220, 240); $intermediate-color: #9c9396; $dark-color: #121721; -- cgit v1.2.3-70-g09d2 From b9d32e8e07137484c57f3d1ab89090b27d56cfe6 Mon Sep 17 00:00:00 2001 From: Bob Zeleznik Date: Sun, 12 May 2019 21:52:04 -0400 Subject: finally fixed disappearing videobox and changed marquee div structure --- src/client/views/collections/CollectionTreeView.tsx | 5 +++++ src/client/views/collections/collectionFreeForm/MarqueeView.tsx | 8 ++++---- src/client/views/nodes/CollectionFreeFormDocumentView.tsx | 2 +- 3 files changed, 10 insertions(+), 5 deletions(-) (limited to 'src/client/views/collections/CollectionTreeView.tsx') diff --git a/src/client/views/collections/CollectionTreeView.tsx b/src/client/views/collections/CollectionTreeView.tsx index 9bd32a89f..d22418b2c 100644 --- a/src/client/views/collections/CollectionTreeView.tsx +++ b/src/client/views/collections/CollectionTreeView.tsx @@ -19,6 +19,7 @@ import { CurrentUserUtils } from '../../../server/authentication/models/current_ import { CollectionDockingView } from './CollectionDockingView'; import { DocumentManager } from '../../util/DocumentManager'; import { List } from '../../../new_fields/List'; +import { Docs } from '../../documents/Documents'; export interface TreeViewProps { @@ -141,6 +142,10 @@ class TreeView extends React.Component { if (!e.isPropagationStopped() && this.props.document[Id] !== CurrentUserUtils.MainDocId) { // need to test this because GoldenLayout causes a parallel hierarchy in the React DOM for its children and the main document view7 ContextMenu.Instance.addItem({ description: "Open as Workspace", event: undoBatch(() => Main.Instance.openWorkspace(this.props.document)) }); ContextMenu.Instance.addItem({ description: "Open Right", event: () => CollectionDockingView.Instance.AddRightSplit(this.props.document) }); + ContextMenu.Instance.addItem({ + description: "Open Fields", event: () => CollectionDockingView.Instance.AddRightSplit(Docs.KVPDocument(this.props.document, + { title: this.props.document.title + ".kvp", width: 300, height: 300 })) + }); if (DocumentManager.Instance.getDocumentViews(this.props.document).length) { ContextMenu.Instance.addItem({ description: "Focus", event: () => DocumentManager.Instance.getDocumentViews(this.props.document).map(view => view.props.focus(this.props.document)) }); } diff --git a/src/client/views/collections/collectionFreeForm/MarqueeView.tsx b/src/client/views/collections/collectionFreeForm/MarqueeView.tsx index 611ee7fd6..080c484f4 100644 --- a/src/client/views/collections/collectionFreeForm/MarqueeView.tsx +++ b/src/client/views/collections/collectionFreeForm/MarqueeView.tsx @@ -358,7 +358,7 @@ export class MarqueeView extends React.Component @computed get marqueeDiv() { let v = this.props.getContainerTransform().transformDirection(this._lastX - this._downX, this._lastY - this._downY); - return
+ return
; } @@ -366,11 +366,11 @@ export class MarqueeView extends React.Component render() { let p = this.props.getContainerTransform().transformPoint(this._downX < this._lastX ? this._downX : this._lastX, this._downY < this._lastY ? this._downY : this._lastY); return
-
-
+
+ {!this._visible ? null : this.marqueeDiv} +
{this.props.children}
- {!this._visible ? null : this.marqueeDiv}
; } diff --git a/src/client/views/nodes/CollectionFreeFormDocumentView.tsx b/src/client/views/nodes/CollectionFreeFormDocumentView.tsx index 39d216da0..817a23ce8 100644 --- a/src/client/views/nodes/CollectionFreeFormDocumentView.tsx +++ b/src/client/views/nodes/CollectionFreeFormDocumentView.tsx @@ -228,7 +228,7 @@ export class CollectionFreeFormDocumentView extends DocComponent fadeUp */ ? Math.max(0.1, Math.min(1, 2 - (w < fadeDown ? fadeDown / w : w / fadeUp))) : 1; + zoomFade = w < fadeDown /* || w > fadeUp */ ? Math.max(0.1, Math.min(1, 2 - (w < fadeDown ? Math.sqrt(Math.sqrt(fadeDown / w)) : w / fadeUp))) : 1; return (
Date: Wed, 15 May 2019 09:10:41 -0400 Subject: set hover highlight for search results --- src/client/views/SearchItem.tsx | 12 +++++++++++- src/client/views/collections/CollectionTreeView.tsx | 2 +- src/client/views/nodes/CollectionFreeFormDocumentView.tsx | 4 +++- src/new_fields/Doc.ts | 2 +- 4 files changed, 16 insertions(+), 4 deletions(-) (limited to 'src/client/views/collections/CollectionTreeView.tsx') diff --git a/src/client/views/SearchItem.tsx b/src/client/views/SearchItem.tsx index 0da0bdae8..01c7316d6 100644 --- a/src/client/views/SearchItem.tsx +++ b/src/client/views/SearchItem.tsx @@ -40,6 +40,14 @@ export class SearchItem extends React.Component { faCaretUp; return ; } + onPointerEnter = (e: React.PointerEvent) => { + this.props.doc.libraryBrush = true; + Doc.SetOnPrototype(this.props.doc, "protoBrush", true); + } + onPointerLeave = (e: React.PointerEvent) => { + this.props.doc.libraryBrush = false; + Doc.SetOnPrototype(this.props.doc, "protoBrush", false); + } collectionRef = React.createRef(); startDocDrag = () => { @@ -53,7 +61,9 @@ export class SearchItem extends React.Component { } render() { return ( -
+
title: {this.props.doc.title}
{/*
Type: {this.props.doc.layout}
*/} {/*
{SearchItem.DocumentIcon(this.layout)}
*/} diff --git a/src/client/views/collections/CollectionTreeView.tsx b/src/client/views/collections/CollectionTreeView.tsx index d22418b2c..70c09d97c 100644 --- a/src/client/views/collections/CollectionTreeView.tsx +++ b/src/client/views/collections/CollectionTreeView.tsx @@ -130,7 +130,7 @@ class TreeView extends React.Component {
); return (
{editableView(StrCast(this.props.document.title))} {openRight} diff --git a/src/client/views/nodes/CollectionFreeFormDocumentView.tsx b/src/client/views/nodes/CollectionFreeFormDocumentView.tsx index fc1dc2b1e..925945b17 100644 --- a/src/client/views/nodes/CollectionFreeFormDocumentView.tsx +++ b/src/client/views/nodes/CollectionFreeFormDocumentView.tsx @@ -247,7 +247,9 @@ export class CollectionFreeFormDocumentView extends DocComponent; } export async function SetOnPrototype(doc: Doc, key: string, value: Field) { - const proto = Object.getOwnPropertyNames(doc).indexOf("isProto") == -1 ? doc.proto : doc; + const proto = Object.getOwnPropertyNames(doc).indexOf("isPrototype") == -1 ? doc.proto : doc; if (proto) { proto[key] = value; -- cgit v1.2.3-70-g09d2