diff options
author | MartinBrathen <martin.viklund.brathen@gmail.com> | 2019-10-15 00:55:16 +0300 |
---|---|---|
committer | Matt Bierner <matb@microsoft.com> | 2019-10-15 00:55:16 +0300 |
commit | 9048856bf3d89e2cbfac06353455b6e5cfcde8f2 (patch) | |
tree | 65159bb252f13ef8ab0662d67318de44bf2d3e36 | |
parent | 3d3202804b4644f58cfac014e39b77dd36a6d226 (diff) |
Fixed: Image preview should not zoom on first click if unfocused (#82074)
* Fixed a bug where first click on an unfocused image preview would zoom
* added two spaces
* removed unnecessary state variable
* User now has ability to enter zoom-out mode on first click
* removed some code that was not needed
* removed useless if statement
-rw-r--r-- | extensions/image-preview/media/main.js | 41 | ||||
-rw-r--r-- | extensions/image-preview/src/preview.ts | 1 |
2 files changed, 41 insertions, 1 deletions
diff --git a/extensions/image-preview/media/main.js b/extensions/image-preview/media/main.js index 34c9708df99..ce794d22932 100644 --- a/extensions/image-preview/media/main.js +++ b/extensions/image-preview/media/main.js @@ -70,6 +70,7 @@ let ctrlPressed = false; let altPressed = false; let hasLoadedImage = false; + let consumeClick = false; // Elements const container = document.body; @@ -116,6 +117,18 @@ }); } + function changeActive(value) { + if (value) { + container.classList.add('zoom-in'); + consumeClick = true; + } else { + ctrlPressed = false; + altPressed = false; + container.classList.remove('zoom-out'); + container.classList.remove('zoom-in'); + } + } + function firstZoom() { if (!image || !hasLoadedImage) { return; @@ -152,6 +165,18 @@ } }); + container.addEventListener('mousedown', (/** @type {MouseEvent} */ e) => { + if (!image || !hasLoadedImage) { + return; + } + + if (e.button !== 0) { + return; + } + + consumeClick = false; + }); + container.addEventListener('click', (/** @type {MouseEvent} */ e) => { if (!image || !hasLoadedImage) { return; @@ -161,6 +186,18 @@ return; } + ctrlPressed = e.ctrlKey; + altPressed = e.altKey; + + if (isMac ? altPressed : ctrlPressed) { + container.classList.remove('zoom-in'); + container.classList.add('zoom-out'); + } + + if (consumeClick) { + consumeClick = false; + return; + } // left click if (scale === 'fit') { firstZoom(); @@ -218,7 +255,6 @@ }); container.classList.add('image'); - container.classList.add('zoom-in'); image.classList.add('scale-to-fit'); @@ -254,6 +290,9 @@ case 'setScale': updateScale(e.data.scale); break; + case 'setActive': + changeActive(e.data.value); + break; } }); }()); diff --git a/extensions/image-preview/src/preview.ts b/extensions/image-preview/src/preview.ts index 2d5963adc1b..329c0b5e500 100644 --- a/extensions/image-preview/src/preview.ts +++ b/extensions/image-preview/src/preview.ts @@ -120,6 +120,7 @@ export class Preview extends Disposable { } this._previewState = PreviewState.Visible; } + this.webviewEditor.webview.postMessage({ type: 'setActive', value: this.webviewEditor.active }); } private getWebiewContents(): string { |