aboutsummaryrefslogtreecommitdiff
path: root/src/client
diff options
context:
space:
mode:
authorbobzel <zzzman@gmail.com>2020-09-01 03:58:41 -0400
committerbobzel <zzzman@gmail.com>2020-09-01 03:58:41 -0400
commita4555fb8d5cd64482dd8431aad03878cb173f688 (patch)
tree6ba1302ec929e9545adea7201eac057bcf8f14ae /src/client
parent96e12a1d34b617ae7d047fa0215a2eec9ad85a61 (diff)
fixed following link to a doc that is in a hidden tab to show that tab. fixed linear view to hit content bounds accurately. fixed editing of text in tabs somewhat. fixed place ment of link anchor boxes for topMost views.
Diffstat (limited to 'src/client')
-rw-r--r--src/client/util/DocumentManager.ts2
-rw-r--r--src/client/views/GlobalKeyHandler.ts1
-rw-r--r--src/client/views/MainView.scss1
-rw-r--r--src/client/views/MainView.tsx4
-rw-r--r--src/client/views/collections/CollectionLinearView.scss2
-rw-r--r--src/client/views/collections/CollectionLinearView.tsx12
-rw-r--r--src/client/views/collections/TabDocView.scss4
-rw-r--r--src/client/views/collections/TabDocView.tsx22
-rw-r--r--src/client/views/linking/LinkMenu.scss2
-rw-r--r--src/client/views/linking/LinkMenu.tsx4
-rw-r--r--src/client/views/nodes/DocumentLinksButton.tsx7
-rw-r--r--src/client/views/nodes/DocumentView.tsx5
-rw-r--r--src/client/views/search/SearchBox.tsx6
13 files changed, 41 insertions, 31 deletions
diff --git a/src/client/util/DocumentManager.ts b/src/client/util/DocumentManager.ts
index f085f615c..9e55c5a44 100644
--- a/src/client/util/DocumentManager.ts
+++ b/src/client/util/DocumentManager.ts
@@ -160,6 +160,8 @@ export class DocumentManager {
docView.props.Document.hidden = !docView.props.Document.hidden;
}
else {
+ const contView = docContext && getFirstDocView(docContext, originatingDoc);
+ contView && contView.topMost && contView.select(false);
docView.select(false);
docView.props.Document.hidden && (docView.props.Document.hidden = undefined);
docView.props.focus(docView.props.Document, willZoom, undefined, focusAndFinish);
diff --git a/src/client/views/GlobalKeyHandler.ts b/src/client/views/GlobalKeyHandler.ts
index 076be3ad6..a52eb649d 100644
--- a/src/client/views/GlobalKeyHandler.ts
+++ b/src/client/views/GlobalKeyHandler.ts
@@ -196,7 +196,6 @@ export class KeyManager {
break;
case "f":
SearchBox.Instance._searchFullDB = "My Stuff";
- SearchBox.Instance.newsearchstring = "";
SearchBox.Instance.enter(undefined);
break;
case "o":
diff --git a/src/client/views/MainView.scss b/src/client/views/MainView.scss
index 93cc47215..9ca8f348d 100644
--- a/src/client/views/MainView.scss
+++ b/src/client/views/MainView.scss
@@ -31,6 +31,7 @@
bottom: 10px;
left: calc(100% + 5px);
z-index: 1;
+ pointer-events: none;
}
.mainView-snapLines {
diff --git a/src/client/views/MainView.tsx b/src/client/views/MainView.tsx
index 4eccbaeb1..01df10aa0 100644
--- a/src/client/views/MainView.tsx
+++ b/src/client/views/MainView.tsx
@@ -370,6 +370,7 @@ export class MainView extends React.Component {
@action
selectMenu = (button: Doc) => {
const title = StrCast(Doc.GetProto(button).title);
+ const closed = !this._flyoutWidth;
this.closeFlyout();
if (this._panelContent !== title || !this._flyoutWidth) {
switch (this._panelContent = title) {
@@ -378,12 +379,11 @@ export class MainView extends React.Component {
break;
case "Catalog":
SearchBox.Instance._searchFullDB = "My Stuff";
- SearchBox.Instance.newsearchstring = "";
SearchBox.Instance.enter(undefined);
break;
default:
this._sidebarContent.proto = button.target as any;
- this.expandFlyout();
+ closed && this.expandFlyout();
button._backgroundColor = "lightgrey";
button.color = "black";
this._lastButton = button;
diff --git a/src/client/views/collections/CollectionLinearView.scss b/src/client/views/collections/CollectionLinearView.scss
index f5c4299a9..ca72b98a5 100644
--- a/src/client/views/collections/CollectionLinearView.scss
+++ b/src/client/views/collections/CollectionLinearView.scss
@@ -4,10 +4,12 @@
.collectionLinearView-outer {
overflow: visible;
height: 100%;
+ pointer-events: none;
.collectionLinearView {
display: flex;
height: 100%;
+ align-items: center;
>span {
background: $dark-color;
diff --git a/src/client/views/collections/CollectionLinearView.tsx b/src/client/views/collections/CollectionLinearView.tsx
index 866d7245a..9eaa02bf8 100644
--- a/src/client/views/collections/CollectionLinearView.tsx
+++ b/src/client/views/collections/CollectionLinearView.tsx
@@ -17,6 +17,7 @@ import { DocumentLinksButton } from '../nodes/DocumentLinksButton';
import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
import { LinkDescriptionPopup } from '../nodes/LinkDescriptionPopup';
import { Tooltip } from '@material-ui/core';
+import { all } from 'bluebird';
type LinearDocument = makeInterface<[typeof documentSchema,]>;
@@ -113,12 +114,7 @@ export class CollectionLinearView extends CollectionSubView(LinearDocument) {
const backgroundColor = StrCast(this.props.Document.backgroundColor, "black");
const color = StrCast(this.props.Document.color, "white");
- const menuOpener = <label htmlFor={`${guid}`} style={{
- background: backgroundColor === color ? "black" : backgroundColor,
- // width: "18px", height: "18px", fontSize: "12.5px",
- // transition: this.props.Document.linearViewIsExpanded ? "transform 0.2s" : "transform 0.5s",
- // transform: this.props.Document.linearViewIsExpanded ? "" : "rotate(45deg)"
- }}
+ const menuOpener = <label htmlFor={`${guid}`} style={{ pointerEvents: "all", cursor: "default", background: backgroundColor === color ? "black" : backgroundColor, }}
onPointerDown={e => e.stopPropagation()} >
<p>{BoolCast(this.props.Document.linearViewIsExpanded) ? "–" : "+"}</p>
</label>;
@@ -140,6 +136,7 @@ export class CollectionLinearView extends CollectionSubView(LinearDocument) {
const scalable = pair.layout.onClick || pair.layout.onDragStart;
return <div className={`collectionLinearView-docBtn` + (scalable ? "-scalable" : "")} key={pair.layout[Id]} ref={dref}
style={{
+ pointerEvents: "all",
width: scalable ? (nested ? pair.layout[WidthSym]() : this.dimension() - deltaSize) : undefined,
height: nested && pair.layout.linearViewIsExpanded ? pair.layout[HeightSym]() : this.dimension() - deltaSize,
}} >
@@ -194,9 +191,6 @@ export class CollectionLinearView extends CollectionSubView(LinearDocument) {
</span>
</Tooltip>
- {/* <FontAwesomeIcon icon="times-circle" size="lg" style={{ color: "red" }}
- onClick={this.exitLongLinks} /> */}
-
</span> : null}
</div>
</div>;
diff --git a/src/client/views/collections/TabDocView.scss b/src/client/views/collections/TabDocView.scss
index 9a4b5cbd1..fdb801e03 100644
--- a/src/client/views/collections/TabDocView.scss
+++ b/src/client/views/collections/TabDocView.scss
@@ -1,4 +1,6 @@
-
+input.lm_title:focus {
+ max-width: max-content !important;
+}
.miniMap {
position: absolute;
overflow: hidden;
diff --git a/src/client/views/collections/TabDocView.tsx b/src/client/views/collections/TabDocView.tsx
index 31e3fbed6..3cb57f086 100644
--- a/src/client/views/collections/TabDocView.tsx
+++ b/src/client/views/collections/TabDocView.tsx
@@ -54,21 +54,29 @@ export class TabDocView extends React.Component<TabDocViewProps> {
tab.contentItem.config.fixed && (tab.contentItem.parent.config.fixed = true);
tab.DashDoc = doc;
+ const titleEle = tab.titleElement[0];
CollectionDockingView.Instance.tabMap.add(tab);
- tab.titleElement[0].onchange = (e: any) => {
- tab.titleElement[0].size = e.currentTarget.value.length + 1;
+ titleEle.onchange = (e: any) => {
+ titleEle.size = e.currentTarget.value.length + 3;
Doc.GetProto(doc).title = e.currentTarget.value;
};
- tab.titleElement[0].size = StrCast(doc.title).length + 1;
- tab.titleElement[0].value = doc.title;
- tab.titleElement[0].style["max-width"] = "100px";
+ titleEle.size = StrCast(doc.title).length + 3;
+ titleEle.value = doc.title;
+ titleEle.style["max-width"] = "100px";
const gearSpan = document.createElement("span");
gearSpan.className = "collectionDockingView-gear";
gearSpan.style.position = "relative";
gearSpan.style.paddingLeft = "0px";
gearSpan.style.paddingRight = "12px";
const stack = tab.contentItem.parent;
- tab.element[0].onclick = (e: any) => e.target.className !== "lm_close_tab" && this.view && SelectionManager.SelectDoc(this.view!, false);
+ tab.element[0].onclick = (e: any) => {
+ if (e.target.className !== "lm_close_tab" && this.view) {
+ SelectionManager.SelectDoc(this.view, false);
+ if (Date.now() - titleEle.lastClick < 1000) titleEle.select();
+ titleEle.lastClick = Date.now();
+ (document.activeElement !== titleEle) && titleEle.focus();
+ }
+ };
// shifts the focus to this tab when another tab is dragged over it
tab.element[0].onmouseenter = (e: MouseEvent) => {
if (SnappingManager.GetIsDragging() && tab.contentItem !== tab.header.parent.getActiveContentItem()) {
@@ -83,7 +91,7 @@ export class TabDocView extends React.Component<TabDocViewProps> {
}, returnFalse, emptyFunction);
};
- tab._disposers.selectionDisposer = reaction(() => SelectionManager.SelectedDocuments().some(v => v.props.Document === doc),
+ tab._disposers.selectionDisposer = reaction(() => SelectionManager.SelectedDocuments().some(v => v.topMost && v.props.Document === doc),
(selected) => {
selected && tab.contentItem !== tab.header.parent.getActiveContentItem() && UndoManager.RunInBatch(() => tab.header.parent.setActiveContentItem(tab.contentItem), "tab switch");
}
diff --git a/src/client/views/linking/LinkMenu.scss b/src/client/views/linking/LinkMenu.scss
index 4dc25031d..0e03b46db 100644
--- a/src/client/views/linking/LinkMenu.scss
+++ b/src/client/views/linking/LinkMenu.scss
@@ -4,8 +4,6 @@
width: auto;
height: auto;
position: absolute;
- top: 0;
- left: 0;
z-index: 999;
.linkMenu-list {
diff --git a/src/client/views/linking/LinkMenu.tsx b/src/client/views/linking/LinkMenu.tsx
index 31d08edae..f5a1ae8e7 100644
--- a/src/client/views/linking/LinkMenu.tsx
+++ b/src/client/views/linking/LinkMenu.tsx
@@ -91,9 +91,9 @@ export class LinkMenu extends React.Component<Props> {
render() {
const sourceDoc = this.props.docView.props.Document;
const groups: Map<string, Doc[]> = LinkManager.Instance.getRelatedGroupedLinks(sourceDoc);
- return <div className="linkMenu" ref={this._linkMenuRef} >
+ return <div className="linkMenu" style={{ left: this.position.x, top: this.props.docView.topMost ? undefined : this.position.b + 15, bottom: this.props.docView.topMost ? 20 : undefined }} ref={this._linkMenuRef} >
{!this._editingLink ?
- <div className="linkMenu-list" style={{ left: this.position.x, top: this.position.b + 15 }}>
+ <div className="linkMenu-list" >
{this.renderAllGroups(groups)}
</div> :
<div className="linkMenu-listEditor" style={{ left: this.position.x, top: this.position.b + 15 }}>
diff --git a/src/client/views/nodes/DocumentLinksButton.tsx b/src/client/views/nodes/DocumentLinksButton.tsx
index 318f7b7e9..1d346894c 100644
--- a/src/client/views/nodes/DocumentLinksButton.tsx
+++ b/src/client/views/nodes/DocumentLinksButton.tsx
@@ -25,7 +25,7 @@ export const Flyout = higflyout.default;
interface DocumentLinksButtonProps {
View: DocumentView;
- Offset?: number[];
+ Offset?: (number | undefined)[];
AlwaysOn?: boolean;
InMenu?: boolean;
StartLink?: boolean;
@@ -242,7 +242,10 @@ export class DocumentLinksButton extends React.Component<DocumentLinksButtonProp
id={"link-icon"}
src={`/assets/${"link.png"}`} />;
- const linkButton = <div ref={this._linkButton} style={{ minWidth: 20, minHeight: 20, position: "absolute", left: this.props.Offset?.[0] }}>
+ const linkButton = <div className="documentLinksButton-cont" ref={this._linkButton} style={{
+ minWidth: 20, minHeight: 20, position: "absolute",
+ left: this.props.Offset?.[0], top: this.props.Offset?.[1], right: this.props.Offset?.[2], bottom: this.props.Offset?.[3]
+ }}>
<div className={"documentLinksButton"} style={{
backgroundColor: this.props.InMenu ? "" : "#add8e6",
color: this.props.InMenu ? "white" : "black",
diff --git a/src/client/views/nodes/DocumentView.tsx b/src/client/views/nodes/DocumentView.tsx
index 3651f0d5f..2f2a324c8 100644
--- a/src/client/views/nodes/DocumentView.tsx
+++ b/src/client/views/nodes/DocumentView.tsx
@@ -359,7 +359,8 @@ export class DocumentView extends DocComponent<DocumentViewProps, Document>(Docu
if ((this.layoutDoc.onDragStart || this.props.Document.rootDocument) && !(e.ctrlKey || e.button > 0)) { // onDragStart implies a button doc that we don't want to select when clicking. RootDocument & isTemplaetForField implies we're clicking on part of a template instance and we want to select the whole template, not the part
stopPropagate = false; // don't stop propagation for field templates -- want the selection to propagate up to the root document of the template
} else {
- SelectionManager.SelectDoc(this, e.ctrlKey || e.shiftKey);
+ this.select(e.ctrlKey || e.shiftKey);
+ //SelectionManager.SelectDoc(this, e.ctrlKey || e.shiftKey);
}
preventDefault = false;
}
@@ -855,7 +856,7 @@ export class DocumentView extends DocComponent<DocumentViewProps, Document>(Docu
return this.isSelected(outsideReaction) || (this.props.Document.rootDocument && this.props.rootSelected?.(outsideReaction)) || false;
}
childScaling = () => (this.layoutDoc._fitWidth ? this.props.PanelWidth() / this.nativeWidth : this.props.ContentScaling());
- @computed.struct get linkOffset() { return [-15, 0]; }
+ @computed.struct get linkOffset() { return this.topMost ? [0, undefined, undefined, 10] : [-15, undefined, undefined, undefined]; }
@computed get contents() {
const pos = this.props.relative ? "relative " : "absolute";
TraceMobx();
diff --git a/src/client/views/search/SearchBox.tsx b/src/client/views/search/SearchBox.tsx
index d08cc7f5b..c04b1da10 100644
--- a/src/client/views/search/SearchBox.tsx
+++ b/src/client/views/search/SearchBox.tsx
@@ -102,7 +102,7 @@ export class SearchBox extends ViewBoxBaseComponent<FieldViewProps, SearchBoxDoc
this._curRequest = undefined;
this._maxSearchIndex = 0;
}
- })
+ });
enter = action((e: React.KeyboardEvent | undefined) => {
if (!e || e.key === "Enter") {
@@ -378,7 +378,7 @@ export class SearchBox extends ViewBoxBaseComponent<FieldViewProps, SearchBoxDoc
Doc.ClearSearchMatches();
});
close && (this.open = this._searchbarOpen = false);
- })
+ });
@action.bound
closeResults() {
@@ -483,7 +483,7 @@ export class SearchBox extends ViewBoxBaseComponent<FieldViewProps, SearchBoxDoc
collectionView.props.Document._searchFilterDocs = docsForFilter?.length ? new List<Doc>(docsForFilter) : undefined;
collectionView.props.Document._docFilters = docsForFilter?.length && docFilters?.length ? new List<string>(docFilters) : undefined;
}
- })
+ });
render() {
const myDashboards = DocListCast(CurrentUserUtils.MyDashboards.data);