aboutsummaryrefslogtreecommitdiff
diff options
context:
space:
mode:
Diffstat
-rw-r--r--src/client/documents/Documents.ts23
-rw-r--r--src/client/util/SearchUtil.ts4
-rw-r--r--src/client/views/SearchBox.scss70
-rw-r--r--src/client/views/SearchBox.tsx24
-rw-r--r--src/client/views/SearchItem.tsx109
-rw-r--r--src/client/views/ViewItem.tsx18
-rw-r--r--src/client/views/collections/collectionFreeForm/CollectionFreeFormLinksView.scss2
-rw-r--r--src/client/views/collections/collectionFreeForm/CollectionFreeFormLinksView.tsx2
8 files changed, 182 insertions, 70 deletions
diff --git a/src/client/documents/Documents.ts b/src/client/documents/Documents.ts
index ab61b915c..2da4c8d88 100644
--- a/src/client/documents/Documents.ts
+++ b/src/client/documents/Documents.ts
@@ -41,6 +41,7 @@ var path = require('path');
export interface DocumentOptions {
x?: number;
y?: number;
+ type?: string;
ink?: InkField;
width?: number;
height?: number;
@@ -73,7 +74,7 @@ export namespace DocUtils {
let protoSrc = source.proto ? source.proto : source;
let protoTarg = target.proto ? target.proto : target;
UndoManager.RunInBatch(() => {
- let linkDoc = Docs.TextDocument({ width: 100, height: 30, borderRounding: -1 });
+ let linkDoc = Docs.TextDocument({ width: 100, height: 30, borderRounding: -1, type: "link" });
//let linkDoc = new Doc;
linkDoc.proto!.title = "-link name-";
linkDoc.proto!.linkDescription = "";
@@ -154,54 +155,54 @@ export namespace Docs {
function CreateImagePrototype(): Doc {
let imageProto = setupPrototypeOptions(imageProtoId, "IMAGE_PROTO", CollectionView.LayoutString("annotations"),
- { x: 0, y: 0, nativeWidth: 600, width: 300, backgroundLayout: ImageBox.LayoutString(), curPage: 0 });
+ { x: 0, y: 0, nativeWidth: 600, width: 300, backgroundLayout: ImageBox.LayoutString(), curPage: 0, type: "image" });
return imageProto;
}
function CreateHistogramPrototype(): Doc {
let histoProto = setupPrototypeOptions(histoProtoId, "HISTO PROTO", CollectionView.LayoutString("annotations"),
- { x: 0, y: 0, width: 300, height: 300, backgroundColor: "black", backgroundLayout: HistogramBox.LayoutString() });
+ { x: 0, y: 0, width: 300, height: 300, backgroundColor: "black", backgroundLayout: HistogramBox.LayoutString(), type: "histogram" });
return histoProto;
}
function CreateIconPrototype(): Doc {
let iconProto = setupPrototypeOptions(iconProtoId, "ICON_PROTO", IconBox.LayoutString(),
- { x: 0, y: 0, width: Number(MINIMIZED_ICON_SIZE), height: Number(MINIMIZED_ICON_SIZE) });
+ { x: 0, y: 0, width: Number(MINIMIZED_ICON_SIZE), height: Number(MINIMIZED_ICON_SIZE), type: "icon" });
return iconProto;
}
function CreateTextPrototype(): Doc {
let textProto = setupPrototypeOptions(textProtoId, "TEXT_PROTO", FormattedTextBox.LayoutString(),
- { x: 0, y: 0, width: 300, height: 150, backgroundColor: "#f1efeb" });
+ { x: 0, y: 0, width: 300, height: 150, backgroundColor: "#f1efeb", type: "text" });
return textProto;
}
function CreatePdfPrototype(): Doc {
let pdfProto = setupPrototypeOptions(pdfProtoId, "PDF_PROTO", CollectionPDFView.LayoutString("annotations"),
- { x: 0, y: 0, nativeWidth: 1200, width: 300, backgroundLayout: PDFBox.LayoutString(), curPage: 1 });
+ { x: 0, y: 0, nativeWidth: 1200, width: 300, backgroundLayout: PDFBox.LayoutString(), curPage: 1, type: "pdf" });
return pdfProto;
}
function CreateWebPrototype(): Doc {
let webProto = setupPrototypeOptions(webProtoId, "WEB_PROTO", WebBox.LayoutString(),
- { x: 0, y: 0, width: 300, height: 300 });
+ { x: 0, y: 0, width: 300, height: 300, type: "web" });
return webProto;
}
function CreateCollectionPrototype(): Doc {
let collProto = setupPrototypeOptions(collProtoId, "COLLECTION_PROTO", CollectionView.LayoutString("data"),
- { panX: 0, panY: 0, scale: 1, width: 500, height: 500 });
+ { panX: 0, panY: 0, scale: 1, width: 500, height: 500, type: "collection" });
return collProto;
}
function CreateKVPPrototype(): Doc {
let kvpProto = setupPrototypeOptions(kvpProtoId, "KVP_PROTO", KeyValueBox.LayoutString(),
- { x: 0, y: 0, width: 300, height: 150 });
+ { x: 0, y: 0, width: 300, height: 150, type: "kvp" });
return kvpProto;
}
function CreateVideoPrototype(): Doc {
let videoProto = setupPrototypeOptions(videoProtoId, "VIDEO_PROTO", CollectionVideoView.LayoutString("annotations"),
- { x: 0, y: 0, nativeWidth: 600, width: 300, backgroundLayout: VideoBox.LayoutString(), curPage: 0 });
+ { x: 0, y: 0, nativeWidth: 600, width: 300, backgroundLayout: VideoBox.LayoutString(), curPage: 0, type: "video" });
return videoProto;
}
function CreateAudioPrototype(): Doc {
let audioProto = setupPrototypeOptions(audioProtoId, "AUDIO_PROTO", AudioBox.LayoutString(),
- { x: 0, y: 0, width: 300, height: 150 });
+ { x: 0, y: 0, width: 300, height: 150, type: "audio" });
return audioProto;
}
diff --git a/src/client/util/SearchUtil.ts b/src/client/util/SearchUtil.ts
index 28ec8ca14..27d27a3b8 100644
--- a/src/client/util/SearchUtil.ts
+++ b/src/client/util/SearchUtil.ts
@@ -23,4 +23,8 @@ export namespace SearchUtil {
return Search(`proto_i:"${protoId}"`, true);
// return Search(`{!join from=id to=proto_i}id:${protoId}`, true);
}
+
+ export async function GetViewsOfDocument(doc: Doc): Promise<Doc[]> {
+ return Search(`proto_i:"${doc[Id]}"`, true);
+ }
} \ No newline at end of file
diff --git a/src/client/views/SearchBox.scss b/src/client/views/SearchBox.scss
index b38e6091d..22b198739 100644
--- a/src/client/views/SearchBox.scss
+++ b/src/client/views/SearchBox.scss
@@ -48,7 +48,6 @@
.filter-form {
background: $dark-color;
height: 400px;
- width: 400px;
position: relative;
right: 1px;
color: $light-color;
@@ -71,15 +70,14 @@
top: 300px;
display: flex;
flex-direction: column;
+ margin-right: 72px;
.search-item {
+ pointer-events: auto;
width: 500px;
- height: 50px;
background: $light-color-secondary;
- display: flex;
justify-content: space-between;
align-items: center;
- transition: all 0.1s;
border-width: 0.11px;
border-style: none;
border-color: $intermediate-color;
@@ -89,6 +87,18 @@
font-size: 13px;
}
+ .search-info {
+ display: flex;
+ justify-content: flex-end;
+ width: 100%;
+ }
+
+ .main-search-info {
+ display: flex;
+ flex-direction: row;
+ width: 100%;
+ }
+
.search-item:hover {
transition: all 0.1s;
background: $lighter-alt-accent;
@@ -98,5 +108,57 @@
text-transform: uppercase;
text-align: left;
width: 8vw;
+ font-weight: bold;
+ }
+
+ .more-search-info {
+ text-align: left;
+ }
+
+ .link-count {
+ height: 25px;
+ width: 25px;
+ border-radius: 50%;
+ background: $dark-color;
+ color: $light-color-secondary;
+ display: flex;
+ justify-content: center;
+ align-items: center;
+ margin-right: 10px;
+ }
+
+ .search-type {
+ width: 25PX;
+ height: 25PX;
+ display: flex;
+ justify-content: center;
+ align-items: center;
+ }
+
+
+ .searchBox-instances {
+ display: inline-block;
+ background: $dark-color;
+ width: 100px;
+ opacity: 1;
+ // width: 0px; this is real
+ // visibility: hidden;
+ // opacity: 0; THIS IS REAL
+ // transition: all 0.2s ease;
+ color: $light-color;
+ }
+
+ .search-overview {
+ display: flex;
+ // float: left;
+ justify-content: flex-end;
+ }
+
+ .search-overview:hover {
+ .searchBox-instances {
+ // visibility: visible;
+ opacity: 1;
+ width: 100px;
+ }
}
} \ No newline at end of file
diff --git a/src/client/views/SearchBox.tsx b/src/client/views/SearchBox.tsx
index 63d2065e2..51fcb4596 100644
--- a/src/client/views/SearchBox.tsx
+++ b/src/client/views/SearchBox.tsx
@@ -22,6 +22,7 @@ import { SetupDrag } from '../util/DragManager';
import { Docs } from '../documents/Documents';
import { RouteStore } from '../../server/RouteStore';
import { NumCast } from '../../new_fields/Types';
+import { SearchUtil } from '../util/SearchUtil';
library.add(faSearch);
library.add(faObjectGroup);
@@ -169,6 +170,18 @@ export class SearchBox extends React.Component {
return Docs.FreeformDocument(docs, { width: 400, height: 400, panX: 175, panY: 175, backgroundColor: "grey", title: `Search Docs: "${this.searchString}"` });
}
+ @action
+ getViews = async (doc: Doc) => {
+ console.log("getting view")
+ const results = await SearchUtil.GetViewsOfDocument(doc);
+ let toReturn: Doc[] = [];
+ await runInAction(() => {
+ toReturn = results;
+ });
+ return toReturn;
+ }
+
+
// Useful queries:
// Delegates of a document: {!join from=id to=proto_i}id:{protoId}
// Documents in a collection: {!join from=data_l to=id}id:{collectionProtoId}
@@ -183,12 +196,19 @@ export class SearchBox extends React.Component {
<input value={this.searchString} onChange={this.onChange} type="text" placeholder="Search..."
className="searchBox-barChild searchBox-input" onKeyPress={this.enter}
style={{ width: this._resultsOpen ? "500px" : undefined }} />
- {/* <button className="searchBox-barChild searchBox-filter" onClick={this.toggleFilterDisplay}>Filter</button> */}
+ <button className="searchBox-barChild searchBox-filter" onClick={this.toggleFilterDisplay}>Filter</button>
{/* <FontAwesomeIcon icon="search" size="lg" className="searchBox-barChild searchBox-submit" /> */}
</div>
{this._resultsOpen ? (
<div className="searchBox-results">
- {this._results.map(result => <SearchItem doc={result} key={result[Id]} />)}
+ {this._results.map(result => {
+ this.getViews(result).then((res: Doc[]) => {
+ console.log("found")
+ return <SearchItem doc={result} views={res} key={result[Id]} />
+ })
+ })}
+ {/* {this._results.map(result => <SearchItem doc={result} views = {this.getViews(result)} key={result[Id]} />)} */}
+ {/*views = {this.getViews(result)}*/}
</div>
) : null}
</div>
diff --git a/src/client/views/SearchItem.tsx b/src/client/views/SearchItem.tsx
index cf440535d..e82aa0719 100644
--- a/src/client/views/SearchItem.tsx
+++ b/src/client/views/SearchItem.tsx
@@ -2,26 +2,31 @@ import React = require("react");
import { Doc } from "../../new_fields/Doc";
import { DocumentManager } from "../util/DocumentManager";
import { library } from '@fortawesome/fontawesome-svg-core';
-import { faCaretUp, faFilePdf, faFilm, faImage, faObjectGroup, faStickyNote } from '@fortawesome/free-solid-svg-icons';
+import { faCaretUp, faFilePdf, faFilm, faImage, faObjectGroup, faStickyNote, faMusic, faLink, faChartBar, faGlobeAsia } from '@fortawesome/free-solid-svg-icons';
import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
import { Cast } from "../../new_fields/Types";
import { FieldView, FieldViewProps } from './nodes/FieldView';
-import { computed, observable } from "mobx";
+import { computed, observable, action, runInAction } from "mobx";
import { IconField } from "../../new_fields/IconField";
import { listSpec } from "../../new_fields/Schema";
import { Transform } from "../util/Transform";
import { ObjectField } from "../../new_fields/ObjectField";
import { RichTextField } from "../../new_fields/RichTextField";
import { SetupDrag } from "../util/DragManager";
+import { SearchUtil } from "../util/SearchUtil";
+import { Id } from "../../new_fields/FieldSymbols";
+import { ViewItem } from "./ViewItem";
export interface SearchProps {
doc: Doc;
+ views: Doc[];
}
export interface SearchItemProps {
doc: Doc;
- subitems: FieldViewProps;
+ views: Doc[];
+ // subitems: FieldViewProps;
}
library.add(faCaretUp);
@@ -29,15 +34,31 @@ library.add(faObjectGroup);
library.add(faStickyNote);
library.add(faFilePdf);
library.add(faFilm);
+library.add(faMusic);
+library.add(faLink);
+library.add(faChartBar);
+library.add(faGlobeAsia);
export class SearchItem extends React.Component<SearchItemProps> {
@observable _selected: boolean = false;
+ @observable
+ private _instances: Doc[] = [];
+
+ // @action
+ // getViews = async () => {
+ // const results = await SearchUtil.GetViewsOfDocument(this.props.doc);
+ // runInAction(() => {
+ // this._instances = results;
+ // });
+ // }
+
onClick = () => {
DocumentManager.Instance.jumpToDocument(this.props.doc);
}
+ //something wrong with this
containingCollection(): string {
let docView = DocumentManager.Instance.getDocumentView(this.props.doc);
if (docView) {
@@ -51,6 +72,7 @@ export class SearchItem extends React.Component<SearchItemProps> {
return "None";
}
+ //also probably with this rip
containingCollectionView() {
let docView = DocumentManager.Instance.getDocumentView(this.props.doc);
if (docView) {
@@ -64,17 +86,18 @@ export class SearchItem extends React.Component<SearchItemProps> {
}
public DocumentIcon() {
- let layoutresult = Cast(this.props.doc.layout, "string", "");
-
- //TODO: images showing up as collections because the layout is collectionview
- console.log(layoutresult)
-
- let button = layoutresult.indexOf("PDFBox") !== -1 ? faFilePdf :
- layoutresult.indexOf("ImageBox") !== -1 ? faImage :
- layoutresult.indexOf("Formatted") !== -1 ? faStickyNote :
- layoutresult.indexOf("Video") !== -1 ? faFilm :
- layoutresult.indexOf("Collection") !== -1 ? faObjectGroup :
- faCaretUp;
+ let layoutresult = Cast(this.props.doc.type, "string", "");
+
+ let button = layoutresult.indexOf("pdf") !== -1 ? faFilePdf :
+ layoutresult.indexOf("image") !== -1 ? faImage :
+ layoutresult.indexOf("text") !== -1 ? faStickyNote :
+ layoutresult.indexOf("video") !== -1 ? faFilm :
+ layoutresult.indexOf("collection") !== -1 ? faObjectGroup :
+ layoutresult.indexOf("audio") !== -1 ? faMusic :
+ layoutresult.indexOf("link") !== -1 ? faLink :
+ layoutresult.indexOf("histogram") !== -1 ? faChartBar :
+ layoutresult.indexOf("web") !== -1 ? faGlobeAsia :
+ faCaretUp;
return <FontAwesomeIcon icon={button} size="2x" />;
}
@@ -91,59 +114,43 @@ export class SearchItem extends React.Component<SearchItemProps> {
select = () => {
// console.log('moused');
- // console.log("before:", this.props.doc[Id], this._selected)
+ // console.log("before:", this.props.doc, this._selected)
this._selected = !this._selected;
- // console.log("after:", this.props.doc[Id], this._selected)
+ // console.log("after:", this.props.doc, this._selected)
}
linkCount = () => {
+ console.log("counting")
let linkToSize = Cast(this.props.doc.linkedToDocs, listSpec(Doc), []).length;
let linkFromSize = Cast(this.props.doc.linkedFromDocs, listSpec(Doc), []).length;
let linkCount = linkToSize + linkFromSize;
- console.log(linkCount)
return linkCount;
}
- //taken from collectionschemaview, counld show doc preview to the left of the results. not sure if this should go in here
- // get previewDocument(): Doc | undefined {
- // const children = Cast(this.props.doc[this.props.subitems.fieldKey], listSpec(Doc), []);
- // const selected = children.length > this._selectedIndex ? FieldValue(children[this._selectedIndex]) : undefined;
- // return selected ? (this.previewScript ? FieldValue(Cast(selected[this.previewScript], Doc)) : selected) : undefined;
- // }
-
- // get previewRegionHeight() { return 200; }
- // get previewRegionWidth() { return 300; }
- // private previewDocNativeWidth = () => Cast(this.previewDocument!.nativeWidth, "number", this.previewRegionWidth);
- // private previewDocNativeHeight = () => Cast(this.previewDocument!.nativeHeight, "number", this.previewRegionHeight);
- // private previewContentScaling = () => {
- // let wscale = this.previewRegionWidth / (this.previewDocNativeWidth() ? this.previewDocNativeWidth() : this.previewRegionWidth);
- // if (wscale * this.previewDocNativeHeight() > this.previewRegionHeight) {
- // return this.previewRegionHeight / (this.previewDocNativeHeight() ? this.previewDocNativeHeight() : this.previewRegionHeight);
- // }
- // return wscale;
- // }
- // private previewPanelWidth = () => this.previewDocNativeWidth() * this.previewContentScaling();
- // private previewPanelHeight = () => this.previewDocNativeHeight() * this.previewContentScaling();
- // get previewPanelCenteringOffset() { return (this.previewRegionWidth - this.previewDocNativeWidth() * this.previewContentScaling()) / 2; }
- // getPreviewTransform = (): Transform => this.props.ScreenToLocalTransform().translate(
- // - this.borderWidth - this.DIVIDER_WIDTH - this.tableWidth - this.previewPanelCenteringOffset,
- // - this.borderWidth).scale(1 / this.previewContentScaling())
-
-
render() {
return (
- <div>
- <div className="search-item" onMouseOver={this.select} onMouseOut={this.select} ref={this.collectionRef} id="result" onClick={this.onClick} onPointerDown={SetupDrag(this.collectionRef, this.startDocDrag)} >
- <div className="search-title" id="result" >title: {this.props.doc.title}</div>
- <div className="search-info">
- <div className="link-count">{this.linkCount()}</div>
- <div className="search-type" >{this.DocumentIcon()}</div>
+ <div className="search-overview" onMouseOver={this.select} onMouseOut={this.select}>
+ <div className="searchBox-instances">
+ {this.props.views.map(result => <ViewItem doc={result} key={result[Id]} />)}
+ </div>
+ <div className="search-item" ref={this.collectionRef} id="result" onClick={this.onClick} onPointerDown={SetupDrag(this.collectionRef, this.startDocDrag)} >
+ <div className="main-search-info">
+ <div className="search-title" id="result" >{this.props.doc.title}</div>
+ <div className="search-info">
+ <div className="link-count">{this.linkCount()}</div>
+ <div className="search-type" >{this.DocumentIcon()}</div>
+ </div>
+ </div>
+ <div className="more-search-info">
+ <div className="found">Where Found: (i.e. title, body, etc)</div>
+ {/* <div className="containing-collection">Collection: {this.containingCollection()}</div> */}
</div>
</div>
- <div className="expanded-result" style={this._selected ? { display: "flex" } : { display: "none" }}>
+
+ {/* <div className="expanded-result" style={this._selected ? { display: "flex" } : { display: "none" }}>
<div className="collection-label">Collection: {this.containingCollection()}</div>
<div className="preview"></div>
- </div>
+ </div> */}
</div>
);
}
diff --git a/src/client/views/ViewItem.tsx b/src/client/views/ViewItem.tsx
new file mode 100644
index 000000000..85f436b44
--- /dev/null
+++ b/src/client/views/ViewItem.tsx
@@ -0,0 +1,18 @@
+import { Doc } from "../../new_fields/Doc";
+import React = require("react");
+import "./SearchBox.scss";
+
+export interface ViewitemProps {
+ doc: Doc;
+ // subitems: FieldViewProps;
+}
+
+export class ViewItem extends React.Component<ViewitemProps> {
+
+ render() {
+ return (
+ <div>{this.props.doc.title}</div>
+
+ );
+ }
+} \ No newline at end of file
diff --git a/src/client/views/collections/collectionFreeForm/CollectionFreeFormLinksView.scss b/src/client/views/collections/collectionFreeForm/CollectionFreeFormLinksView.scss
index 30e158603..a80e09fa8 100644
--- a/src/client/views/collections/collectionFreeForm/CollectionFreeFormLinksView.scss
+++ b/src/client/views/collections/collectionFreeForm/CollectionFreeFormLinksView.scss
@@ -1,4 +1,4 @@
-.collectionfreeformlinksview-svgCanvas{
+p.collectionfreeformlinksview-svgCanvas{
transform: translate(-10000px,-10000px);
position: absolute;
top: 0;
diff --git a/src/client/views/collections/collectionFreeForm/CollectionFreeFormLinksView.tsx b/src/client/views/collections/collectionFreeForm/CollectionFreeFormLinksView.tsx
index a43c5f241..2df66ce54 100644
--- a/src/client/views/collections/collectionFreeForm/CollectionFreeFormLinksView.tsx
+++ b/src/client/views/collections/collectionFreeForm/CollectionFreeFormLinksView.tsx
@@ -110,7 +110,7 @@ export class CollectionFreeFormLinksView extends React.Component<CollectionViewP
}
return match || found;
}, false)) {
- console.log("A" + possiblePair.a[Id] + " B" + possiblePair.b[Id] + " L" + connection.l[Id]);
+ //console.log("A" + possiblePair.a[Id] + " B" + possiblePair.b[Id] + " L" + connection.l[Id]);
drawnPairs.push({ a: possiblePair.a, b: possiblePair.b, l: [connection.l] })
}
});
generated by cgit v1.2.3-70-g09d2 (git 2.46.0) at 2025-10-14 18:28:13 +0000