bug(ui): GmWindow was not holding its size after moving it
This commit is contained in:
@@ -21,19 +21,12 @@ const emit = defineEmits<{
|
|||||||
const windowEl = ref<HTMLDivElement | null>(null);
|
const windowEl = ref<HTMLDivElement | null>(null);
|
||||||
const x = ref(props.initialX);
|
const x = ref(props.initialX);
|
||||||
const y = ref(props.initialY);
|
const y = ref(props.initialY);
|
||||||
const w = ref(props.initialWidth);
|
|
||||||
const h = ref(props.initialHeight);
|
|
||||||
const isDragging = ref(false);
|
const isDragging = ref(false);
|
||||||
let dragOffsetX = 0;
|
let dragOffsetX = 0;
|
||||||
let dragOffsetY = 0;
|
let dragOffsetY = 0;
|
||||||
|
|
||||||
function onTitleMouseDown(e: MouseEvent) {
|
function onTitleMouseDown(e: MouseEvent) {
|
||||||
if ((e.target as HTMLElement).closest("button")) return;
|
if ((e.target as HTMLElement).closest("button")) return;
|
||||||
// Snapshot current rendered size so resize isn't lost on drag
|
|
||||||
if (windowEl.value) {
|
|
||||||
w.value = windowEl.value.offsetWidth;
|
|
||||||
h.value = windowEl.value.offsetHeight;
|
|
||||||
}
|
|
||||||
isDragging.value = true;
|
isDragging.value = true;
|
||||||
dragOffsetX = e.clientX - x.value;
|
dragOffsetX = e.clientX - x.value;
|
||||||
dragOffsetY = e.clientY - y.value;
|
dragOffsetY = e.clientY - y.value;
|
||||||
@@ -53,6 +46,12 @@ function onMouseUp() {
|
|||||||
onMounted(() => {
|
onMounted(() => {
|
||||||
window.addEventListener("mousemove", onMouseMove);
|
window.addEventListener("mousemove", onMouseMove);
|
||||||
window.addEventListener("mouseup", onMouseUp);
|
window.addEventListener("mouseup", onMouseUp);
|
||||||
|
// Set initial size imperatively so Vue's reactive style binding never
|
||||||
|
// touches width/height — the browser's CSS resize handle owns them.
|
||||||
|
if (windowEl.value) {
|
||||||
|
windowEl.value.style.width = `${props.initialWidth}px`;
|
||||||
|
windowEl.value.style.height = `${props.initialHeight}px`;
|
||||||
|
}
|
||||||
});
|
});
|
||||||
|
|
||||||
onUnmounted(() => {
|
onUnmounted(() => {
|
||||||
@@ -68,8 +67,6 @@ onUnmounted(() => {
|
|||||||
:style="{
|
:style="{
|
||||||
left: `${x}px`,
|
left: `${x}px`,
|
||||||
top: `${y}px`,
|
top: `${y}px`,
|
||||||
width: `${w}px`,
|
|
||||||
height: `${h}px`,
|
|
||||||
cursor: isDragging ? 'grabbing' : 'default',
|
cursor: isDragging ? 'grabbing' : 'default',
|
||||||
zIndex: 200,
|
zIndex: 200,
|
||||||
}"
|
}"
|
||||||
|
|||||||
Reference in New Issue
Block a user