From 9fc23e4207297cad48e04ac3ef0cb6846331ca8a Mon Sep 17 00:00:00 2001 From: madelinegr Date: Tue, 4 Jun 2019 11:56:02 -0400 Subject: changed search item --- src/client/views/SearchItem.tsx | 127 ++++++++++++++++++++++++++++++++-------- 1 file changed, 102 insertions(+), 25 deletions(-) (limited to 'src') diff --git a/src/client/views/SearchItem.tsx b/src/client/views/SearchItem.tsx index 01c7316d6..cf440535d 100644 --- a/src/client/views/SearchItem.tsx +++ b/src/client/views/SearchItem.tsx @@ -6,8 +6,12 @@ import { faCaretUp, faFilePdf, faFilm, faImage, faObjectGroup, faStickyNote } fr import { FontAwesomeIcon } from "@fortawesome/react-fontawesome"; import { Cast } from "../../new_fields/Types"; import { FieldView, FieldViewProps } from './nodes/FieldView'; -import { computed } from "mobx"; +import { computed, observable } 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"; @@ -15,38 +19,63 @@ export interface SearchProps { doc: Doc; } +export interface SearchItemProps { + doc: Doc; + subitems: FieldViewProps; +} + library.add(faCaretUp); library.add(faObjectGroup); library.add(faStickyNote); library.add(faFilePdf); library.add(faFilm); -export class SearchItem extends React.Component { +export class SearchItem extends React.Component { + + @observable _selected: boolean = false; onClick = () => { DocumentManager.Instance.jumpToDocument(this.props.doc); } - //needs help - // @computed get layout(): string { const field = Cast(this.props.doc[fieldKey], IconField); return field ? field.icon : "

Error loading icon data

"; } + containingCollection(): string { + let docView = DocumentManager.Instance.getDocumentView(this.props.doc); + if (docView) { + let containerView = docView.props.ContainingCollectionView; + if (containerView) { + let container = containerView.props.Document; + const field = Cast(container.title, RichTextField); + return field ? field.Data : "

Error loading icon data

"; + } + } + return "None"; + } + containingCollectionView() { + let docView = DocumentManager.Instance.getDocumentView(this.props.doc); + if (docView) { + let containerView = docView.props.ContainingCollectionView; + if (containerView) { + return containerView.props.Document; + } + } - public static DocumentIcon(layout: string) { - let button = layout.indexOf("PDFBox") !== -1 ? faFilePdf : - layout.indexOf("ImageBox") !== -1 ? faImage : - layout.indexOf("Formatted") !== -1 ? faStickyNote : - layout.indexOf("Video") !== -1 ? faFilm : - layout.indexOf("Collection") !== -1 ? faObjectGroup : - faCaretUp; - return ; - } - onPointerEnter = (e: React.PointerEvent) => { - this.props.doc.libraryBrush = true; - Doc.SetOnPrototype(this.props.doc, "protoBrush", true); + return this.props.doc; } - onPointerLeave = (e: React.PointerEvent) => { - this.props.doc.libraryBrush = false; - Doc.SetOnPrototype(this.props.doc, "protoBrush", false); + + 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; + return ; } collectionRef = React.createRef(); @@ -59,14 +88,62 @@ export class SearchItem extends React.Component { return Doc.MakeAlias(doc); } } + + select = () => { + // console.log('moused'); + // console.log("before:", this.props.doc[Id], this._selected) + this._selected = !this._selected; + // console.log("after:", this.props.doc[Id], this._selected) + } + + linkCount = () => { + 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 ( -
-
title: {this.props.doc.title}
- {/*
Type: {this.props.doc.layout}
*/} - {/*
{SearchItem.DocumentIcon(this.layout)}
*/} +
+
+
title: {this.props.doc.title}
+
+
{this.linkCount()}
+
{this.DocumentIcon()}
+
+
+
+
Collection: {this.containingCollection()}
+
+
); } -- cgit v1.2.3-70-g09d2