aboutsummaryrefslogtreecommitdiff
path: root/src
diff options
context:
space:
mode:
Diffstat (limited to 'src')
-rw-r--r--src/client/views/pdf/PDFViewer.scss3
-rw-r--r--src/client/views/pdf/PDFViewer.tsx2
-rw-r--r--src/client/views/search/SearchItem.scss50
-rw-r--r--src/client/views/search/SearchItem.tsx53
4 files changed, 90 insertions, 18 deletions
diff --git a/src/client/views/pdf/PDFViewer.scss b/src/client/views/pdf/PDFViewer.scss
index 11d3d7e27..0fde764d0 100644
--- a/src/client/views/pdf/PDFViewer.scss
+++ b/src/client/views/pdf/PDFViewer.scss
@@ -41,6 +41,9 @@
}
}
}
+.pdfViewer-viewerCont {
+ width:100%;
+}
.page-cont {
.textLayer {
diff --git a/src/client/views/pdf/PDFViewer.tsx b/src/client/views/pdf/PDFViewer.tsx
index 9e9ddbd2d..6fab390d4 100644
--- a/src/client/views/pdf/PDFViewer.tsx
+++ b/src/client/views/pdf/PDFViewer.tsx
@@ -49,7 +49,7 @@ export class PDFViewer extends React.Component<IPDFViewerProps> {
render() {
return (
- <div ref={this._mainDiv}>
+ <div className="pdfViewer-viewerCont" ref={this._mainDiv}>
{!this._pdf ? (null) :
<Viewer pdf={this._pdf} loaded={this.props.loaded} scrollY={this.props.scrollY} parent={this.props.parent} mainCont={this._mainDiv} url={this.props.url} />}
</div>
diff --git a/src/client/views/search/SearchItem.scss b/src/client/views/search/SearchItem.scss
index 946680f0e..b3472ddec 100644
--- a/src/client/views/search/SearchItem.scss
+++ b/src/client/views/search/SearchItem.scss
@@ -5,6 +5,7 @@
flex-direction: row-reverse;
justify-content: flex-end;
height: 70px;
+ z-index: 0;
.search-item {
width: 500px;
@@ -13,6 +14,7 @@
border-bottom-style: solid;
padding: 10px;
height: 70px;
+ z-index: 0;
display: inline-block;
.main-search-info {
@@ -23,16 +25,17 @@
.search-title {
text-transform: uppercase;
text-align: left;
- width: 80%;
+ width: 100%;
font-weight: bold;
}
.search-info {
display: flex;
justify-content: flex-end;
- width: 40%;
.link-container.item {
+ margin-left: auto;
+ margin-right: auto;
height: 26px;
width: 26px;
border-radius: 13px;
@@ -41,7 +44,6 @@
display: flex;
justify-content: center;
align-items: center;
- right: 15px;
-webkit-transition: all 0.2s ease-in-out;
-moz-transition: all 0.2s ease-in-out;
-o-transition: all 0.2s ease-in-out;
@@ -84,19 +86,36 @@
.link-container.item:hover .link-extended {
opacity: 1;
}
+
+ .icon-icons {
+ width:50px
+ }
+ .icon-live {
+ width:175px;
+ }
- .icon {
-
+ .icon-icons, .icon-live {
+ height:50px;
+ margin:auto;
+ overflow: hidden;
.search-type {
- width: 25PX;
- height: 25PX;
- display: flex;
+ display: inline-block;
+ width:100%;
+ position: absolute;
justify-content: center;
align-items: center;
position: relative;
margin-right: 5px;
}
+ .pdfBox-cont {
+ overflow: hidden;
+
+ img {
+ width:100% !important;
+ height:auto !important;
+ }
+ }
.search-type:hover+.search-label {
opacity: 1;
}
@@ -114,6 +133,18 @@
transition: opacity 0.2s ease-in-out;
}
}
+
+ .icon-live:hover {
+ height:175px;
+ .pdfBox-cont {
+ img {
+ width:100% !important;
+ }
+ }
+ }
+ }
+ .search-info:hover {
+ width:60%;
}
}
}
@@ -146,4 +177,7 @@
// height: 100%
}
+}
+.search-overview:hover {
+ z-index: 1;
} \ No newline at end of file
diff --git a/src/client/views/search/SearchItem.tsx b/src/client/views/search/SearchItem.tsx
index b495975cb..d992d0fd1 100644
--- a/src/client/views/search/SearchItem.tsx
+++ b/src/client/views/search/SearchItem.tsx
@@ -2,10 +2,10 @@ import React = require("react");
import { library } from '@fortawesome/fontawesome-svg-core';
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, NumCast } from "../../../new_fields/Types";
+import { Cast, NumCast, StrCast } from "../../../new_fields/Types";
import { observable, runInAction, computed, action } from "mobx";
import { listSpec } from "../../../new_fields/Schema";
-import { Doc } from "../../../new_fields/Doc";
+import { Doc, WidthSym } from "../../../new_fields/Doc";
import { DocumentManager } from "../../util/DocumentManager";
import { SetupDrag } from "../../util/DragManager";
import { SearchUtil } from "../../util/SearchUtil";
@@ -20,6 +20,10 @@ import { DocumentView } from "../nodes/DocumentView";
import "./SelectorContextMenu.scss";
import { SearchBox } from "./SearchBox";
import { LinkManager } from "../../util/LinkManager";
+import { DocumentContentsView } from "../nodes/DocumentContentsView";
+import { ImageBox } from "../nodes/ImageBox";
+import { emptyFunction, returnFalse, returnOne } from "../../../Utils";
+import { Transform } from "../../util/Transform";
export interface SearchItemProps {
doc: Doc;
@@ -90,10 +94,40 @@ export class SearchItem extends React.Component<SearchItemProps> {
onClick = () => {
DocumentManager.Instance.jumpToDocument(this.props.doc, false);
}
+ @observable _useIcons = true;
+ @observable _displayDim = 50;
@computed
public get DocumentIcon() {
- let layoutresult = Cast(this.props.doc.type, "string", "");
+ let layoutresult = StrCast(this.props.doc.type);
+ if (!this._useIcons) {
+ let returnXDimension = () => this._useIcons ? 50 : 250;
+ let returnYDimension = () => this._displayDim;
+ let scale = () => returnXDimension() / NumCast(this.props.doc.nativeWidth, returnXDimension());
+ return <div
+ onPointerEnter={action(() => this._displayDim = this._useIcons ? 50 : 250)}
+ onPointerLeave={action(() => this._displayDim = this._useIcons ? 50 : 250)} >
+ <DocumentView
+ Document={this.props.doc}
+ addDocument={returnFalse}
+ removeDocument={returnFalse}
+ ScreenToLocalTransform={Transform.Identity}
+ addDocTab={returnFalse}
+ renderDepth={1}
+ PanelWidth={returnXDimension}
+ PanelHeight={returnYDimension}
+ focus={emptyFunction}
+ selectOnLoad={false}
+ parentActive={returnFalse}
+ whenActiveChanged={returnFalse}
+ bringToFront={emptyFunction}
+ zoomToScale={emptyFunction}
+ getScale={returnOne}
+ ContainingCollectionView={undefined}
+ ContentScaling={scale}
+ />
+ </div>
+ }
let button = layoutresult.indexOf(DocTypes.PDF) !== -1 ? faFilePdf :
layoutresult.indexOf(DocTypes.IMG) !== -1 ? faImage :
@@ -131,7 +165,8 @@ export class SearchItem extends React.Component<SearchItemProps> {
return num.toString() + " links";
}
- pointerDown = (e: React.PointerEvent) => { SearchBox.Instance.openSearch(e); };
+ @action
+ pointerDown = (e: React.PointerEvent) => { this._useIcons = !this._useIcons; SearchBox.Instance.openSearch(e); };
highlightDoc = (e: React.PointerEvent) => {
if (this.props.doc.type === DocTypes.LINK) {
@@ -176,15 +211,15 @@ export class SearchItem extends React.Component<SearchItemProps> {
}} >
<div className="main-search-info">
<div className="search-title" id="result" >{this.props.doc.title}</div>
- <div className="search-info">
+ <div className="search-info" style={{ width: this._useIcons ? "15%" : "400px" }}>
+ <div className={`icon-${this._useIcons ? "icons" : "live"}`}>
+ <div className="search-type" >{this.DocumentIcon}</div>
+ <div className="search-label">{this.props.doc.type}</div>
+ </div>
<div className="link-container item">
<div className="link-count">{this.linkCount}</div>
<div className="link-extended">{this.linkString}</div>
</div>
- <div className="icon">
- <div className="search-type" >{this.DocumentIcon}</div>
- <div className="search-label">{this.props.doc.type}</div>
- </div>
</div>
</div>
</div>
generated by cgit v1.2.3-70-g09d2 (git 2.46.0) at 2025-10-06 21:18:46 +0000