aboutsummaryrefslogtreecommitdiff
diff options
context:
space:
mode:
Diffstat
-rw-r--r--src/client/views/MarqueeAnnotator.tsx9
-rw-r--r--src/client/views/StyleProvider.tsx3
-rw-r--r--src/client/views/collections/TabDocView.tsx17
-rw-r--r--src/client/views/nodes/CollectionFreeFormDocumentView.tsx5
-rw-r--r--src/client/views/nodes/DocumentView.tsx2
-rw-r--r--src/client/views/nodes/ImageBox.tsx5
6 files changed, 20 insertions, 21 deletions
diff --git a/src/client/views/MarqueeAnnotator.tsx b/src/client/views/MarqueeAnnotator.tsx
index ce0e58d90..c0dd62a05 100644
--- a/src/client/views/MarqueeAnnotator.tsx
+++ b/src/client/views/MarqueeAnnotator.tsx
@@ -34,6 +34,7 @@ export interface MarqueeAnnotatorProps {
finishMarquee: (x?: number, y?: number, PointerEvent?: PointerEvent) => void;
anchorMenuClick?: () => undefined | ((anchor: Doc) => void);
anchorMenuCrop?: (anchor: Doc | undefined, addCrop: boolean) => Doc | undefined;
+ highlightDragSrcColor?: string;
}
@observer
export class MarqueeAnnotator extends React.Component<MarqueeAnnotatorProps> {
@@ -64,8 +65,8 @@ export class MarqueeAnnotator extends React.Component<MarqueeAnnotatorProps> {
doc.addEventListener('pointermove', this.onSelectMove);
doc.addEventListener('pointerup', this.onSelectEnd);
- AnchorMenu.Instance.OnCrop = (e: PointerEvent) => this.props.anchorMenuCrop?.(this.highlight('rgba(173, 216, 230, 0.75)', true), true);
- AnchorMenu.Instance.OnClick = (e: PointerEvent) => this.props.anchorMenuClick?.()?.(this.highlight('rgba(173, 216, 230, 0.75)', true));
+ AnchorMenu.Instance.OnCrop = (e: PointerEvent) => this.props.anchorMenuCrop?.(this.highlight('', true), true);
+ AnchorMenu.Instance.OnClick = (e: PointerEvent) => this.props.anchorMenuClick?.()?.(this.highlight(this.props.highlightDragSrcColor ?? 'rgba(173, 216, 230, 0.75)', true));
AnchorMenu.Instance.OnAudio = unimplementedFunction;
AnchorMenu.Instance.Highlight = this.highlight;
AnchorMenu.Instance.GetAnchor = (savedAnnotations?: ObservableMap<number, HTMLDivElement[]>) => this.highlight('rgba(173, 216, 230, 0.75)', true, savedAnnotations);
@@ -79,7 +80,7 @@ export class MarqueeAnnotator extends React.Component<MarqueeAnnotatorProps> {
e.preventDefault();
e.stopPropagation();
const sourceAnchorCreator = () => {
- const annoDoc = this.highlight('rgba(173, 216, 230, 0.75)', true); // hyperlink color
+ const annoDoc = this.highlight(this.props.highlightDragSrcColor ?? 'rgba(173, 216, 230, 0.75)', true); // hyperlink color
annoDoc && this.props.addDocument(annoDoc);
return annoDoc;
};
@@ -107,7 +108,7 @@ export class MarqueeAnnotator extends React.Component<MarqueeAnnotatorProps> {
e.stopPropagation();
var cropRegion: Doc | undefined;
const sourceAnchorCreator = () => {
- cropRegion = this.highlight('rgba(173, 216, 230, 0.75)', true); // hyperlink color
+ cropRegion = this.highlight('', true); // hyperlink color
cropRegion && this.props.addDocument(cropRegion);
return cropRegion;
};
diff --git a/src/client/views/StyleProvider.tsx b/src/client/views/StyleProvider.tsx
index 5abf4bde2..a268707e0 100644
--- a/src/client/views/StyleProvider.tsx
+++ b/src/client/views/StyleProvider.tsx
@@ -253,7 +253,6 @@ export function DefaultStyleProvider(doc: Opt<Doc>, props: Opt<DocumentViewProps
if (!doc || opacity() === 0) return undefined; // if it's not visible, then no shadow)
if (doc.boxShadow === 'standard') return Shadows.STANDARD_SHADOW;
if (doc?.isLinkButton && ![DocumentType.LINK, DocumentType.INK].includes(doc.type as any)) return StrCast(doc?._linkButtonShadow, 'lightblue 0em 0em 1em');
-
switch (doc?.type) {
case DocumentType.COL:
return StrCast(
@@ -288,7 +287,7 @@ export function DefaultStyleProvider(doc: Opt<Doc>, props: Opt<DocumentViewProps
return undefined;
case StyleProp.Decorations:
if (props?.ContainingCollectionDoc?._viewType === CollectionViewType.Freeform || doc?.x !== undefined || doc?.y !== undefined) {
- return doc && isBackground() && !Doc.IsSystem(doc) && (props?.renderDepth || 0) > 0 ? (
+ return doc && doc.pointerEvents === 'none' && isBackground() && !Doc.IsSystem(doc) && (props?.renderDepth || 0) > 0 ? (
<div className="styleProvider-lock" onClick={() => toggleLockedPosition(doc)}>
<FontAwesomeIcon icon={isBackground() ? 'lock' : 'unlock'} style={{ color: isBackground() ? 'red' : undefined }} size="lg" />
</div>
diff --git a/src/client/views/collections/TabDocView.tsx b/src/client/views/collections/TabDocView.tsx
index 31ed5a83b..e0c422f94 100644
--- a/src/client/views/collections/TabDocView.tsx
+++ b/src/client/views/collections/TabDocView.tsx
@@ -55,6 +55,11 @@ export class TabDocView extends React.Component<TabDocViewProps> {
@computed get layoutDoc() {
return this._document && Doc.Layout(this._document);
}
+ @computed get tabBorderColor() {
+ const highlight = DefaultStyleProvider(this._document, undefined, StyleProp.Highlighting);
+ if (highlight?.highlightIndex >= Doc.DocBrushStatus.highlighted) return highlight.highlightColor;
+ return 'transparent';
+ }
@computed get tabColor() {
let tabColor = StrCast(this._document?._backgroundColor, StrCast(this._document?.backgroundColor, DefaultStyleProvider(this._document, undefined, StyleProp.BackgroundColor)));
if (tabColor === 'transparent') return 'black';
@@ -147,17 +152,15 @@ export class TabDocView extends React.Component<TabDocViewProps> {
ReactDOM.createRoot(closeWrap).render(closeIcon);
tab.reactComponents = [iconWrap, closeWrap];
tab.element[0].prepend(iconWrap);
- tab._disposers.layerDisposer = reaction(
- () => ({ layer: tab.DashDoc.activeLayer, color: this.tabColor }),
- ({ layer, color }) => {
- // console.log("TabDocView: " + this.tabColor);
- // console.log("lightOrDark: " + lightOrDark(this.tabColor));
+ tab._disposers.color = reaction(
+ () => ({ color: this.tabColor, borderColor: this.tabBorderColor }),
+ coloring => {
const textColor = lightOrDark(this.tabColor); //not working with StyleProp.Color
titleEle.style.color = textColor;
- titleEle.style.backgroundColor = 'transparent';
+ titleEle.style.backgroundColor = coloring.borderColor;
iconWrap.style.color = textColor;
closeWrap.style.color = textColor;
- tab.element[0].style.background = !layer ? color : 'dimgrey';
+ tab.element[0].style.background = coloring.color;
},
{ fireImmediately: true }
);
diff --git a/src/client/views/nodes/CollectionFreeFormDocumentView.tsx b/src/client/views/nodes/CollectionFreeFormDocumentView.tsx
index 260c98816..570039550 100644
--- a/src/client/views/nodes/CollectionFreeFormDocumentView.tsx
+++ b/src/client/views/nodes/CollectionFreeFormDocumentView.tsx
@@ -24,7 +24,6 @@ export interface CollectionFreeFormDocumentViewProps extends DocumentViewProps {
sizeProvider?: (doc: Doc, replica: string) => { width: number; height: number } | undefined;
renderCutoffProvider: (doc: Doc) => boolean;
zIndex?: number;
- highlight?: boolean;
rotation: number;
dataTransition?: string;
replica: string;
@@ -75,9 +74,6 @@ export class CollectionFreeFormDocumentView extends DocComponent<CollectionFreeF
get Color() {
return this.dataProvider?.color ?? Cast(this.Document._color, 'string', null);
}
- get Highlight() {
- return this.dataProvider?.highlight;
- }
@computed get dataProvider() {
return this.props.dataProvider?.(this.props.Document, this.props.replica);
}
@@ -238,7 +234,6 @@ export class CollectionFreeFormDocumentView extends DocComponent<CollectionFreeF
<div
className={'collectionFreeFormDocumentView-container'}
style={{
- outline: this.Highlight ? 'orange solid 2px' : '',
width: this.panelWidth(),
height: this.panelHeight(),
transform: this.transform,
diff --git a/src/client/views/nodes/DocumentView.tsx b/src/client/views/nodes/DocumentView.tsx
index 9dc4b36cf..4ee871ba2 100644
--- a/src/client/views/nodes/DocumentView.tsx
+++ b/src/client/views/nodes/DocumentView.tsx
@@ -1383,7 +1383,7 @@ export class DocumentViewInternal extends DocComponent<DocumentViewInternalProps
const borderPath = this.props.styleProvider?.(this.props.Document, this.props, StyleProp.BorderPath) || { path: undefined };
const boxShadow =
this.props.treeViewDoc || !highlighting
- ? null
+ ? this.boxShadow
: highlighting && this.borderRounding && highlighting.highlightStyle !== 'dashed'
? `0 0 0 ${highlighting.highlightIndex}px ${highlighting.highlightColor}`
: this.boxShadow || (this.props.Document.isTemplateForField ? 'black 0.2vw 0.2vw 0.8vw' : undefined);
diff --git a/src/client/views/nodes/ImageBox.tsx b/src/client/views/nodes/ImageBox.tsx
index 461d6984d..08c0065d1 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 { ImageField } from '../../../fields/URLField';
import { TraceMobx } from '../../../fields/util';
-import { emptyFunction, OmitKeys, returnFalse, returnOne, setupMoveUpEvents, Utils } from '../../../Utils';
+import { emptyFunction, OmitKeys, returnEmptyString, returnFalse, returnOne, setupMoveUpEvents, Utils } from '../../../Utils';
import { GooglePhotos } from '../../apis/google_docs/GooglePhotosClientUtils';
import { CognitiveServices, Confidence, Service, Tag } from '../../cognitive_services/CognitiveServices';
import { DocUtils } from '../../documents/Documents';
@@ -137,7 +137,6 @@ export class ImageBox extends ViewBoxAnnotatableComponent<ViewBoxAnnotatableProp
crop = (region: Doc | undefined, addCrop?: boolean) => {
if (!region) return;
const cropping = Doc.MakeCopy(region, true);
- Doc.GetProto(region).backgroundColor = 'transparent';
Doc.GetProto(region).lockedPosition = true;
Doc.GetProto(region).title = 'region:' + this.rootDoc.title;
Doc.GetProto(region).isPushpin = true;
@@ -427,8 +426,10 @@ export class ImageBox extends ViewBoxAnnotatableComponent<ViewBoxAnnotatableProp
addDocument={this.addDocument}
finishMarquee={this.finishMarquee}
savedAnnotations={this.savedAnnotations}
+ selectionText={returnEmptyString}
annotationLayer={this._annotationLayer.current}
mainCont={this._mainCont.current}
+ highlightDragSrcColor={''}
anchorMenuCrop={this.crop}
/>
)}
generated by cgit v1.2.3-70-g09d2 (git 2.46.0) at 2025-10-06 12:35:29 +0000