Skip to content

Commit 65a8c72

Browse files
author
Vinogradov Victor
committed
scrolling for rect works
1 parent a041355 commit 65a8c72

File tree

3 files changed

+35
-34
lines changed

3 files changed

+35
-34
lines changed

‎build/codex-editor.js

Lines changed: 17 additions & 15 deletions
Original file line numberDiff line numberDiff line change
@@ -16703,9 +16703,10 @@ var __WEBPACK_AMD_DEFINE_FACTORY__, __WEBPACK_AMD_DEFINE_ARRAY__, __WEBPACK_AMD_
1670316703
overlay.appendChild(overlayTopScrollZone);
1670416704
overlay.appendChild(overlayBottomScrollZone);
1670516705
document.body.appendChild(overlay);
16706-
var scrollSpeed = 2;
16706+
var scrollSpeed = 5;
1670716707
var mousedown = false;
16708-
var inScrollZone = false;
16708+
var inScrollZone = null;
16709+
var sideMoveRect = null;
1670916710
var startX = 0;
1671016711
var startY = 0;
1671116712
var options = {
@@ -16729,23 +16730,23 @@ var __WEBPACK_AMD_DEFINE_FACTORY__, __WEBPACK_AMD_DEFINE_ARRAY__, __WEBPACK_AMD_
1672916730
}
1673016731

1673116732
overlayBottomScrollZone.addEventListener('mouseenter', function (event) {
16732-
inScrollZone = true;
16733+
inScrollZone = 'bot';
1673316734
scrollVertical(scrollSpeed);
1673416735
});
1673516736
overlayTopScrollZone.addEventListener('mouseenter', function (event) {
16736-
inScrollZone = true;
16737+
inScrollZone = 'top';
1673716738
scrollVertical(-scrollSpeed);
1673816739
});
1673916740
overlayBottomScrollZone.addEventListener('mouseleave', function (event) {
16740-
inScrollZone = false;
16741+
inScrollZone = null;
1674116742
});
1674216743
overlayTopScrollZone.addEventListener('mouseleave', function (event) {
16743-
inScrollZone = false;
16744+
inScrollZone = null;
1674416745
});
1674516746
document.body.addEventListener('mousedown', function (event) {
1674616747
mousedown = true;
16747-
startX = event.clientX;
16748-
startY = event.clientY;
16748+
startX = event.pageX;
16749+
startY = event.pageY;
1674916750
overlayRectangle.style.left = "".concat(startX, "px");
1675016751
overlayRectangle.style.top = "".concat(startY, "px");
1675116752
overlayRectangle.style.bottom = "calc(100% - ".concat(startY, "px");
@@ -16757,19 +16758,21 @@ var __WEBPACK_AMD_DEFINE_FACTORY__, __WEBPACK_AMD_DEFINE_ARRAY__, __WEBPACK_AMD_
1675716758
event.preventDefault(); // Depending on the position of the mouse relative to the starting point,
1675816759
// change the distance from the desired edge of the screen*/
1675916760

16760-
if (event.clientY >= startY) {
16761-
overlayRectangle.style.top = "".concat(startY, "px");
16761+
if (event.pageY >= startY) {
16762+
sideMoveRect = 'down';
16763+
overlayRectangle.style.top = "".concat(startY - window.pageYOffset, "px");
1676216764
overlayRectangle.style.bottom = "calc(100% - ".concat(event.clientY, "px");
1676316765
} else {
16764-
overlayRectangle.style.bottom = "calc(100% - ".concat(startY, "px");
16766+
sideMoveRect = 'up';
16767+
overlayRectangle.style.bottom = "calc(100% - ".concat(startY - window.pageYOffset, "px");
1676516768
overlayRectangle.style.top = "".concat(event.clientY, "px");
1676616769
}
1676716770

16768-
if (event.clientX >= startX) {
16769-
overlayRectangle.style.left = "".concat(startX, "px");
16771+
if (event.pageX >= startX) {
16772+
overlayRectangle.style.left = "".concat(startX - window.pageXOffset, "px");
1677016773
overlayRectangle.style.right = "calc(100% - ".concat(event.clientX, "px");
1677116774
} else {
16772-
overlayRectangle.style.right = "calc(100% - ".concat(startX, "px");
16775+
overlayRectangle.style.right = "calc(100% - ".concat(startX - window.pageXOffset, "px");
1677316776
overlayRectangle.style.left = "".concat(event.clientX, "px");
1677416777
}
1677516778
}
@@ -16780,7 +16783,6 @@ var __WEBPACK_AMD_DEFINE_FACTORY__, __WEBPACK_AMD_DEFINE_ARRAY__, __WEBPACK_AMD_
1678016783
startX = 0;
1678116784
startY = 0;
1678216785
}, false);
16783-
window.addEventListener('scroll', function () {});
1678416786
}
1678516787
/**
1678616788
* Clear selection from Blocks

‎build/codex-editor.js.map

Lines changed: 1 addition & 1 deletion
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎src/components/modules/blockSelection.ts

Lines changed: 17 additions & 18 deletions
Original file line numberDiff line numberDiff line change
@@ -63,9 +63,10 @@ export default class BlockSelection extends Module {
6363
overlay.appendChild(overlayBottomScrollZone);
6464
document.body.appendChild(overlay);
6565

66-
const scrollSpeed = 2;
66+
const scrollSpeed = 5;
6767
let mousedown = false;
68-
let inScrollZone = false;
68+
let inScrollZone = null;
69+
let sideMoveRect = null;
6970
let startX = 0;
7071
let startY = 0;
7172

@@ -90,27 +91,27 @@ export default class BlockSelection extends Module {
9091
}
9192

9293
overlayBottomScrollZone.addEventListener('mouseenter', (event) => {
93-
inScrollZone = true;
94+
inScrollZone = 'bot';
9495
scrollVertical(scrollSpeed);
9596
});
9697

9798
overlayTopScrollZone.addEventListener('mouseenter', (event) => {
98-
inScrollZone = true;
99+
inScrollZone = 'top';
99100
scrollVertical(-scrollSpeed);
100101
});
101102

102103
overlayBottomScrollZone.addEventListener('mouseleave', (event) => {
103-
inScrollZone = false;
104+
inScrollZone = null;
104105
});
105106

106107
overlayTopScrollZone.addEventListener('mouseleave', (event) => {
107-
inScrollZone = false;
108+
inScrollZone = null;
108109
});
109110

110111
document.body.addEventListener('mousedown', (event) => {
111112
mousedown = true;
112-
startX = event.clientX;
113-
startY = event.clientY;
113+
startX = event.pageX;
114+
startY = event.pageY;
114115

115116
overlayRectangle.style.left = `${startX}px`;
116117
overlayRectangle.style.top = `${startY}px`;
@@ -126,19 +127,21 @@ export default class BlockSelection extends Module {
126127

127128
// Depending on the position of the mouse relative to the starting point,
128129
// change the distance from the desired edge of the screen*/
129-
if (event.clientY >= startY) {
130-
overlayRectangle.style.top = `${startY}px`;
130+
if (event.pageY >= startY) {
131+
sideMoveRect = 'down';
132+
overlayRectangle.style.top = `${startY - window.pageYOffset}px`;
131133
overlayRectangle.style.bottom = `calc(100% - ${event.clientY}px`;
132134
} else {
133-
overlayRectangle.style.bottom = `calc(100% - ${startY}px`;
135+
sideMoveRect = 'up';
136+
overlayRectangle.style.bottom = `calc(100% - ${startY - window.pageYOffset}px`;
134137
overlayRectangle.style.top = `${event.clientY}px`;
135138
}
136139

137-
if (event.clientX >= startX) {
138-
overlayRectangle.style.left = `${startX}px`;
140+
if (event.pageX >= startX) {
141+
overlayRectangle.style.left = `${startX - window.pageXOffset}px`;
139142
overlayRectangle.style.right = `calc(100% - ${event.clientX}px`;
140143
} else {
141-
overlayRectangle.style.right = `calc(100% - ${startX}px`;
144+
overlayRectangle.style.right = `calc(100% - ${startX - window.pageXOffset}px`;
142145
overlayRectangle.style.left = `${event.clientX}px`;
143146
}
144147
}
@@ -152,10 +155,6 @@ export default class BlockSelection extends Module {
152155
startY = 0;
153156
}, false);
154157

155-
window.addEventListener('scroll', () => {
156-
157-
});
158-
159158
}
160159

161160
/**

0 commit comments

Comments
 (0)