mirror of
https://github.com/ckaczor/azuredatastudio.git
synced 2026-02-17 02:51:36 -05:00
Merge from vscode c58aaab8a1cc22a7139b761166a0d4f37d41e998 (#7880)
* Merge from vscode c58aaab8a1cc22a7139b761166a0d4f37d41e998 * fix pipelines * fix strict-null-checks * add missing files
This commit is contained in:
@@ -70,9 +70,10 @@
|
||||
let ctrlPressed = false;
|
||||
let altPressed = false;
|
||||
let hasLoadedImage = false;
|
||||
let consumeClick = false;
|
||||
|
||||
// Elements
|
||||
const container = /** @type {HTMLElement} */(document.querySelector('body'));
|
||||
const container = document.body;
|
||||
const image = document.createElement('img');
|
||||
|
||||
function updateScale(newScale) {
|
||||
@@ -88,9 +89,6 @@
|
||||
image.style.width = 'auto';
|
||||
vscode.setState(undefined);
|
||||
} else {
|
||||
const oldWidth = image.width;
|
||||
const oldHeight = image.height;
|
||||
|
||||
scale = clamp(newScale, MIN_SCALE, MAX_SCALE);
|
||||
if (scale >= PIXELATION_THRESHOLD) {
|
||||
image.classList.add('pixelated');
|
||||
@@ -98,25 +96,19 @@
|
||||
image.classList.remove('pixelated');
|
||||
}
|
||||
|
||||
const { scrollTop, scrollLeft } = image.parentElement;
|
||||
const dx = (scrollLeft + image.parentElement.clientWidth / 2) / image.parentElement.scrollWidth;
|
||||
const dy = (scrollTop + image.parentElement.clientHeight / 2) / image.parentElement.scrollHeight;
|
||||
const dx = (window.scrollX + container.clientWidth / 2) / container.scrollWidth;
|
||||
const dy = (window.scrollY + container.clientHeight / 2) / container.scrollHeight;
|
||||
|
||||
image.classList.remove('scale-to-fit');
|
||||
image.style.minWidth = `${(image.naturalWidth * scale)}px`;
|
||||
image.style.width = `${(image.naturalWidth * scale)}px`;
|
||||
|
||||
const newWidth = image.width;
|
||||
const scaleFactor = (newWidth - oldWidth) / oldWidth;
|
||||
const newScrollX = container.scrollWidth * dx - container.clientWidth / 2;
|
||||
const newScrollY = container.scrollHeight * dy - container.clientHeight / 2;
|
||||
|
||||
const newScrollLeft = ((oldWidth * scaleFactor * dx) + scrollLeft);
|
||||
const newScrollTop = ((oldHeight * scaleFactor * dy) + scrollTop);
|
||||
// scrollbar.setScrollPosition({
|
||||
// scrollLeft: newScrollLeft,
|
||||
// scrollTop: newScrollTop,
|
||||
// });
|
||||
window.scrollTo(newScrollX, newScrollY);
|
||||
|
||||
vscode.setState({ scale: scale, offsetX: newScrollLeft, offsetY: newScrollTop });
|
||||
vscode.setState({ scale: scale, offsetX: newScrollX, offsetY: newScrollY });
|
||||
}
|
||||
|
||||
vscode.postMessage({
|
||||
@@ -125,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;
|
||||
@@ -161,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;
|
||||
@@ -170,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();
|
||||
@@ -227,24 +255,19 @@
|
||||
});
|
||||
|
||||
container.classList.add('image');
|
||||
container.classList.add('zoom-in');
|
||||
|
||||
image.classList.add('scale-to-fit');
|
||||
|
||||
image.addEventListener('load', () => {
|
||||
document.querySelector('.loading').remove();
|
||||
hasLoadedImage = true;
|
||||
|
||||
if (!image) {
|
||||
return;
|
||||
}
|
||||
|
||||
vscode.postMessage({
|
||||
type: 'size',
|
||||
value: `${image.naturalWidth}x${image.naturalHeight}`,
|
||||
});
|
||||
|
||||
container.classList.add('ready');
|
||||
document.body.classList.remove('loading');
|
||||
document.body.classList.add('ready');
|
||||
document.body.append(image);
|
||||
|
||||
updateScale(scale);
|
||||
@@ -254,6 +277,12 @@
|
||||
}
|
||||
});
|
||||
|
||||
image.addEventListener('error', () => {
|
||||
hasLoadedImage = true;
|
||||
document.body.classList.add('error');
|
||||
document.body.classList.remove('loading');
|
||||
});
|
||||
|
||||
image.src = decodeURI(settings.src);
|
||||
|
||||
window.addEventListener('message', e => {
|
||||
@@ -261,6 +290,9 @@
|
||||
case 'setScale':
|
||||
updateScale(e.data.scale);
|
||||
break;
|
||||
case 'setActive':
|
||||
changeActive(e.data.value);
|
||||
break;
|
||||
}
|
||||
});
|
||||
}());
|
||||
|
||||
Reference in New Issue
Block a user