diff options
| -rw-r--r-- | src/client/views/nodes/DocumentView.scss | 3 | ||||
| -rw-r--r-- | src/client/views/nodes/DocumentView.tsx | 2 | ||||
| -rw-r--r-- | src/client/views/nodes/ImageBox.scss | 8 | ||||
| -rw-r--r-- | src/client/views/nodes/ImageBox.tsx | 21 |
4 files changed, 23 insertions, 11 deletions
diff --git a/src/client/views/nodes/DocumentView.scss b/src/client/views/nodes/DocumentView.scss index 9490be98c..82195b9c1 100644 --- a/src/client/views/nodes/DocumentView.scss +++ b/src/client/views/nodes/DocumentView.scss @@ -273,8 +273,9 @@ .documentView-editorView-history { position: absolute; - left: 0; + right: 0; top: 0; + overflow-y: scroll; } .documentView-editorView { diff --git a/src/client/views/nodes/DocumentView.tsx b/src/client/views/nodes/DocumentView.tsx index f79eadde8..622eccc4f 100644 --- a/src/client/views/nodes/DocumentView.tsx +++ b/src/client/views/nodes/DocumentView.tsx @@ -750,7 +750,7 @@ export class DocumentViewInternal extends DocComponent<FieldViewProps & Document /> </div> {this._showAIEditor && ( - <div className="documentView-editorView-history" style={{ height: this.rph(), width: this.rpw() / 2 }}> + <div className="documentView-editorView-history" style={{ height: this.rph(), width: (this._props.PanelWidth() - this.rpw()) / 2 }}> {this._componentView?.componentAIViewHistory?.() ?? null} </div> )} diff --git a/src/client/views/nodes/ImageBox.scss b/src/client/views/nodes/ImageBox.scss index 9f1ac11ef..e083f52b4 100644 --- a/src/client/views/nodes/ImageBox.scss +++ b/src/client/views/nodes/ImageBox.scss @@ -144,17 +144,19 @@ display: flex; flex-direction: column; align-items: center; - padding: 5px; + padding: 5 0 0 5; gap: 5px; - overflow-y: scroll; .imageBox-aiView-img { width: 100%; + + &:hover { + filter: brightness(0.8); + } } } .imageBox-aiView { - overflow-y: scroll; text-align: center; font-weight: bold; align-content: center; diff --git a/src/client/views/nodes/ImageBox.tsx b/src/client/views/nodes/ImageBox.tsx index fc8b7bc27..09daea6bb 100644 --- a/src/client/views/nodes/ImageBox.tsx +++ b/src/client/views/nodes/ImageBox.tsx @@ -533,20 +533,26 @@ export class ImageBox extends ViewBoxAnnotatableComponent<FieldViewProps>() { @observable private _regenInput = ''; @observable private _canInteract = true; @observable private _regenerateLoading = false; - @observable private _prevImgUrls: string[] = []; + @observable private _prevImgs: { href: string; pathname: string }[] = []; componentAIViewHistory = () => { return ( <div className="imageBox-aiView-history"> - {this._prevImgUrls.map((url: string) => ( - <img className="imageBox-aiView-img" src={url} onClick={() => (this.dataDoc[this.fieldKey] = new ImageField(url))} /> + {this._prevImgs.map(img => ( + <img + className="imageBox-aiView-img" + src={img.href} + onClick={() => { + this.dataDoc[this.fieldKey] = new ImageField(img.pathname); + }} + /> ))} </div> ); }; componentAIView = () => { - const field = Cast(this.dataDoc[this.fieldKey], ImageField); + const field = this.dataDoc[this.fieldKey] instanceof ImageField ? Cast(this.dataDoc[this.fieldKey], ImageField, null) : new ImageField(String(this.dataDoc[this.fieldKey])); const showRegenerate = this.Document[DocData].ai; return ( <div className="imageBox-aiView"> @@ -575,8 +581,11 @@ export class ImageBox extends ViewBoxAnnotatableComponent<FieldViewProps>() { action(async () => { this._regenerateLoading = true; SmartDrawHandler.Instance.regenerate([this.Document], undefined, undefined, this._regenInput, true).then(newDocs => { - this._prevImgUrls.push(this.paths.lastElement()); - this.dataDoc[this.fieldKey] = new ImageField(newDocs[0]); + const url = newDocs[0]; + const imgField = new ImageField(url); + this._prevImgs.length === 0 && this._prevImgs.push({ href: this.paths.lastElement(), pathname: field.url.pathname }); + this.dataDoc[this.fieldKey] = imgField; + this._prevImgs.unshift({ href: this.paths.lastElement(), pathname: url }); this._regenerateLoading = false; this._regenInput = ''; }); |