aboutsummaryrefslogtreecommitdiff
path: root/src/client/views
diff options
context:
space:
mode:
Diffstat (limited to 'src/client/views')
-rw-r--r--src/client/views/DocumentDecorations.tsx4
-rw-r--r--src/client/views/collections/CollectionSubView.tsx17
-rw-r--r--src/client/views/collections/CollectionTreeView.scss1
-rw-r--r--src/client/views/collections/CollectionTreeView.tsx4
-rw-r--r--src/client/views/collections/collectionFreeForm/MarqueeView.tsx2
-rw-r--r--src/client/views/nodes/ContentFittingDocumentView.scss2
-rw-r--r--src/client/views/nodes/ContentFittingDocumentView.tsx21
-rw-r--r--src/client/views/nodes/ImageBox.tsx4
-rw-r--r--src/client/views/nodes/WebBox.tsx8
9 files changed, 39 insertions, 24 deletions
diff --git a/src/client/views/DocumentDecorations.tsx b/src/client/views/DocumentDecorations.tsx
index e5c6f0aa9..abad53b6d 100644
--- a/src/client/views/DocumentDecorations.tsx
+++ b/src/client/views/DocumentDecorations.tsx
@@ -647,8 +647,8 @@ export class DocumentDecorations extends React.Component<{}, { value: string }>
top: bounds.y - this._resizeBorderWidth / 2 - this._titleHeight,
}}>
{closeIcon}
- {titleArea}
- {SelectionManager.SelectedDocuments().length !== 1 || seldoc.Document.type === DocumentType.INK || minimal ? (null) :
+ {Object.keys(SelectionManager.SelectedDocuments()[0].props).includes("treeViewDoc") ? (null) : titleArea}
+ {SelectionManager.SelectedDocuments().length !== 1 || seldoc.Document.type === DocumentType.INK || minimal || Object.keys(SelectionManager.SelectedDocuments()[0].props).includes("treeViewDoc") ? (null) :
<Tooltip title={<div className="dash-tooltip">{`${seldoc.finalLayoutKey.includes("icon") ? "De" : ""}Iconify Document`}</div>} placement="top">
<div className="documentDecorations-iconifyButton" onPointerDown={this.onIconifyDown}>
<FontAwesomeIcon icon={seldoc.finalLayoutKey.includes("icon") ? "window-restore" : "window-minimize"} className="documentView-minimizedIcon" />
diff --git a/src/client/views/collections/CollectionSubView.tsx b/src/client/views/collections/CollectionSubView.tsx
index 81f3ddad2..aff7e8000 100644
--- a/src/client/views/collections/CollectionSubView.tsx
+++ b/src/client/views/collections/CollectionSubView.tsx
@@ -270,6 +270,7 @@ export function CollectionSubView<T, X>(schemaCtor: (doc: Doc) => T, moreProps?:
return;
}
+ console.log("Html = ", html);
if (html) {
if (FormattedTextBox.IsFragment(html)) {
const href = FormattedTextBox.GetHref(html);
@@ -353,14 +354,15 @@ export function CollectionSubView<T, X>(schemaCtor: (doc: Doc) => T, moreProps?:
if (uriList || text) {
if ((uriList || text).includes("www.youtube.com/watch") || text.includes("www.youtube.com/embed")) {
const url = (uriList || text).replace("youtube.com/watch?v=", "youtube.com/embed/").split("&")[0];
- this.addDocument(Docs.Create.VideoDocument(url, {
+ console.log("Video URI = ", uriList);
+ console.log("Add:" + this.addDocument(Docs.Create.VideoDocument(url, {
...options,
title: url,
_width: 400,
_height: 315,
_nativeWidth: 600,
_nativeHeight: 472.5
- }));
+ })));
return;
}
// let matches: RegExpExecArray | null;
@@ -381,27 +383,30 @@ export function CollectionSubView<T, X>(schemaCtor: (doc: Doc) => T, moreProps?:
// }
}
if (uriList) {
+ ;
+ console.log("Web URI = ", uriList);
const existingWebDoc = await Hypothesis.findWebDoc(uriList);
if (existingWebDoc) {
const alias = Doc.MakeAlias(existingWebDoc);
alias.x = options.x;
alias.y = options.y;
alias._nativeWidth = 850;
- alias._nativeHeight = 962;
+ alias._height = 512;
alias._width = 400;
this.addDocument(alias);
} else {
+ console.log("Adding ...");
const newDoc = Docs.Create.WebDocument(uriList, {
...options,
title: uriList.split("#annotations:")[0],
_width: 400,
- _height: 315,
+ _height: 512,
_nativeWidth: 850,
- _nativeHeight: 962,
useCors: true
});
+ console.log(" ... " + newDoc.title);
newDoc.data = new WebField(uriList.split("#annotations:")[0]); // clean hypothes.is URLs that reference a specific annotation (eg. https://en.wikipedia.org/wiki/Cartoon#annotations:t7qAeNbCEeqfG5972KR2Ig)
- this.addDocument(newDoc);
+ console.log(" ... " + this.addDocument(newDoc) + " " + newDoc.title);
}
return;
}
diff --git a/src/client/views/collections/CollectionTreeView.scss b/src/client/views/collections/CollectionTreeView.scss
index b0a791a21..e192f1760 100644
--- a/src/client/views/collections/CollectionTreeView.scss
+++ b/src/client/views/collections/CollectionTreeView.scss
@@ -109,6 +109,7 @@
.treeViewItem-border {
display: flex;
border-left: dashed 1px #00000042;
+ overflow: hidden;
}
.treeViewItem-header-editing,
diff --git a/src/client/views/collections/CollectionTreeView.tsx b/src/client/views/collections/CollectionTreeView.tsx
index 7b3e95404..6c3fb56e2 100644
--- a/src/client/views/collections/CollectionTreeView.tsx
+++ b/src/client/views/collections/CollectionTreeView.tsx
@@ -348,8 +348,8 @@ class TreeView extends React.Component<TreeViewProps> {
const panelWidth = StrCast(Doc.LayoutField(layoutDoc)).includes("FormattedTextBox") ? this.rtfWidth : this.docWidth;
return <div ref={this._dref} style={{ display: "inline-block", height: panelHeight() }} key={this.doc[Id]}>
<ContentFittingDocumentView
- Document={layoutDoc}
- DataDoc={this.dataDoc}
+ Document={this.doc}
+ DataDoc={undefined}
LibraryPath={emptyPath}
renderDepth={this.props.renderDepth + 1}
rootSelected={returnTrue}
diff --git a/src/client/views/collections/collectionFreeForm/MarqueeView.tsx b/src/client/views/collections/collectionFreeForm/MarqueeView.tsx
index d8e1bcc9c..deb7e68e8 100644
--- a/src/client/views/collections/collectionFreeForm/MarqueeView.tsx
+++ b/src/client/views/collections/collectionFreeForm/MarqueeView.tsx
@@ -76,7 +76,7 @@ export class MarqueeView extends React.Component<SubCollectionViewProps & Marque
const [x, y] = this.props.getTransform().transformPoint(this._downX, this._downY);
if (e.key === "?") {
cm.setDefaultItem("?", (str: string) => this.props.addDocTab(
- Docs.Create.WebDocument(`https://bing.com/search?q=${str}`, { _width: 200, x, y, _nativeHeight: 962, _nativeWidth: 850, isAnnotating: false, title: "bing", useCors: true }), "add:right"));
+ Docs.Create.WebDocument(`https://bing.com/search?q=${str}`, { _width: 400, x, y, _height: 512, _nativeWidth: 850, isAnnotating: false, title: "bing", useCors: true }), "add:right"));
cm.displayMenu(this._downX, this._downY);
e.stopPropagation();
diff --git a/src/client/views/nodes/ContentFittingDocumentView.scss b/src/client/views/nodes/ContentFittingDocumentView.scss
index 50562951a..679073d44 100644
--- a/src/client/views/nodes/ContentFittingDocumentView.scss
+++ b/src/client/views/nodes/ContentFittingDocumentView.scss
@@ -3,6 +3,8 @@
.contentFittingDocumentView {
position: relative;
display: flex;
+ width: 100%;
+ height: 100%;
.contentFittingDocumentView-previewDoc {
position: relative;
diff --git a/src/client/views/nodes/ContentFittingDocumentView.tsx b/src/client/views/nodes/ContentFittingDocumentView.tsx
index c0bcc0a6d..7cb27451f 100644
--- a/src/client/views/nodes/ContentFittingDocumentView.tsx
+++ b/src/client/views/nodes/ContentFittingDocumentView.tsx
@@ -6,7 +6,7 @@ import { Doc, HeightSym, Opt, WidthSym } from "../../../fields/Doc";
import { ScriptField } from "../../../fields/ScriptField";
import { Cast, NumCast, StrCast } from "../../../fields/Types";
import { TraceMobx } from "../../../fields/util";
-import { emptyFunction, returnVal } from "../../../Utils";
+import { emptyFunction, returnVal, OmitKeys } from "../../../Utils";
import { dropActionType } from "../../util/DragManager";
import { CollectionView } from "../collections/CollectionView";
import { DocumentView, DocumentViewProps } from "../nodes/DocumentView";
@@ -34,8 +34,9 @@ export class ContentFittingDocumentView extends React.Component<DocumentViewProp
(this.freezeDimensions && this.layoutDoc ? this.layoutDoc[HeightSym]() : this.props.PanelHeight())))
@computed get scaling() {
const wscale = this.props.PanelWidth() / this.nativeWidth();
+ const hscale = this.props.PanelHeight() / this.nativeHeight();
if (wscale * this.nativeHeight() > this.props.PanelHeight()) {
- return (this.props.PanelHeight() / this.nativeHeight()) || 1;
+ return hscale || 1;
}
return wscale || 1;
}
@@ -47,7 +48,10 @@ export class ContentFittingDocumentView extends React.Component<DocumentViewProp
@computed get panelWidth() { return this.nativeWidth() && !this.props.Document._fitWidth ? this.nativeWidth() * this.contentScaling() : this.props.PanelWidth(); }
@computed get panelHeight() { return this.nativeHeight() && !this.props.Document._fitWidth ? this.nativeHeight() * this.contentScaling() : this.props.PanelHeight(); }
- private getTransform = () => this.props.dontCenter ? this.props.ScreenToLocalTransform().scale(1 / this.contentScaling()) : this.props.ScreenToLocalTransform().translate(-this.centeringOffset, -this.centeringYOffset).scale(1 / this.contentScaling());
+ @computed get childXf() { return this.props.DataDoc ? 1 : 1 / this.contentScaling(); }
+ private getTransform = () => this.props.dontCenter ?
+ this.props.ScreenToLocalTransform().scale(this.childXf) :
+ this.props.ScreenToLocalTransform().translate(-this.centeringOffset, -this.centeringYOffset).scale(this.childXf);
private get centeringOffset() { return this.nativeWidth() && !this.props.Document._fitWidth ? (this.props.PanelWidth() - this.nativeWidth() * this.contentScaling()) / 2 : 0; }
private get centeringYOffset() { return Math.abs(this.centeringOffset) < 0.001 ? (this.props.PanelHeight() - this.nativeHeight() * this.contentScaling()) / 2 : 0; }
@@ -55,10 +59,7 @@ export class ContentFittingDocumentView extends React.Component<DocumentViewProp
render() {
TraceMobx();
- return (<div className="contentFittingDocumentView" style={{
- width: Math.abs(this.centeringYOffset) > 0.001 ? "auto" : this.props.PanelWidth(),
- height: Math.abs(this.centeringOffset) > 0.0001 ? "auto" : this.props.PanelHeight(),
- }}>
+ return (<div className="contentFittingDocumentView">
{!this.props.Document || !this.props.PanelWidth ? (null) : (
<div className="contentFittingDocumentView-previewDoc"
style={{
@@ -67,14 +68,14 @@ export class ContentFittingDocumentView extends React.Component<DocumentViewProp
height: Math.abs(this.centeringYOffset) > 0.001 ? `${100 * this.nativeHeight() / this.nativeWidth() * this.props.PanelWidth() / this.props.PanelHeight()}%` : this.props.PanelHeight(),
width: Math.abs(this.centeringOffset) > 0.001 ? `${100 * (this.props.PanelWidth() - this.centeringOffset * 2) / this.props.PanelWidth()}%` : this.props.PanelWidth()
}}>
- <DocumentView {...this.props}
+ <DocumentView {...OmitKeys(this.props, ["NativeWidth", "NativeHeight"]).omit}
Document={this.props.Document}
DataDoc={this.props.DataDoc}
LayoutTemplate={this.props.LayoutTemplate}
LayoutTemplateString={this.props.LayoutTemplateString}
LibraryPath={this.props.LibraryPath}
- NativeWidth={this.nativeWidth}
- NativeHeight={this.nativeHeight}
+ // NativeWidth={this.nativeWidth}
+ // NativeHeight={this.nativeHeight}
PanelWidth={this.PanelWidth}
PanelHeight={this.PanelHeight}
ContentScaling={this.contentScaling}
diff --git a/src/client/views/nodes/ImageBox.tsx b/src/client/views/nodes/ImageBox.tsx
index beb6ba6a8..ce056b80c 100644
--- a/src/client/views/nodes/ImageBox.tsx
+++ b/src/client/views/nodes/ImageBox.tsx
@@ -11,7 +11,7 @@ import { ComputedField } from '../../../fields/ScriptField';
import { Cast, NumCast, StrCast } from '../../../fields/Types';
import { AudioField, ImageField } from '../../../fields/URLField';
import { TraceMobx } from '../../../fields/util';
-import { emptyFunction, returnOne, returnZero, Utils } from '../../../Utils';
+import { emptyFunction, returnOne, returnZero, Utils, OmitKeys } from '../../../Utils';
import { GooglePhotos } from '../../apis/google_docs/GooglePhotosClientUtils';
import { CognitiveServices, Confidence, Service, Tag } from '../../cognitive_services/CognitiveServices';
import { Docs } from '../../documents/Documents';
@@ -419,7 +419,7 @@ export class ImageBox extends ViewBoxAnnotatableComponent<FieldViewProps, ImageD
pointerEvents: this.layoutDoc._isBackground ? "none" : undefined,
borderRadius: `${Number(StrCast(this.layoutDoc.borderRounding).replace("px", "")) / this.props.ContentScaling()}px`
}} >
- <CollectionFreeFormView {...this.props}
+ <CollectionFreeFormView {...OmitKeys(this.props, ["NativeWidth", "NativeHeight"]).omit}
forceScaling={true}
PanelHeight={this.props.PanelHeight}
PanelWidth={this.props.PanelWidth}
diff --git a/src/client/views/nodes/WebBox.tsx b/src/client/views/nodes/WebBox.tsx
index f841fa6e1..9620e241c 100644
--- a/src/client/views/nodes/WebBox.tsx
+++ b/src/client/views/nodes/WebBox.tsx
@@ -4,7 +4,7 @@ import { action, computed, IReactionDisposer, observable, reaction, runInAction
import { observer } from "mobx-react";
import { Dictionary } from "typescript-collections";
import * as WebRequest from 'web-request';
-import { Doc, DocListCast, Opt, AclAddonly, AclEdit, AclAdmin, DataSym } from "../../../fields/Doc";
+import { Doc, DocListCast, Opt, AclAddonly, AclEdit, AclAdmin, DataSym, HeightSym, WidthSym } from "../../../fields/Doc";
import { documentSchema } from "../../../fields/documentSchemas";
import { Id } from "../../../fields/FieldSymbols";
import { HtmlField } from "../../../fields/HtmlField";
@@ -68,6 +68,12 @@ export class WebBox extends ViewBoxAnnotatableComponent<FieldViewProps, WebDocum
private _iframeDragRef = React.createRef<HTMLDivElement>();
private _setPreviewCursor: undefined | ((x: number, y: number, drag: boolean) => void);
+ constructor(props: any) {
+ super(props);
+ this.dataDoc[this.fieldKey + "-nativeWidth"] = this.Document._nativeWidth = NumCast(this.dataDoc[this.props.fieldKey + "-nativeWidth"], NumCast(this.Document._nativeWidth, 850));
+ this.dataDoc[this.fieldKey + "-nativeHeight"] = this.Document._nativeHeight = NumCast(this.dataDoc[this.props.fieldKey + "-nativeHeight"], NumCast(this.Document._nativeHeight, this.Document[HeightSym]() / this.Document[WidthSym]() * 850));
+ }
+
iframeLoaded = action((e: any) => {
const iframe = this._iframeRef.current;
if (iframe && iframe.contentDocument) {
generated by cgit v1.2.3-70-g09d2 (git 2.46.0) at 2026-03-01 10:04:30 +0000