Skip to content

Commit 8aa3ac3

Browse files
vegegokuvegegoku
committed
fix #1007 Popovers Sometimes Appear in a Weird Spot
1 parent acaad45 commit 8aa3ac3

24 files changed

+1039
-473
lines changed

‎domino-ui/src/main/java/org/dominokit/domino/ui/layout/AppLayout.java‎

Lines changed: 25 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -113,12 +113,18 @@ public AppLayout() {
113113
.whenInitialized(() -> layout.addCss(dui_has_header));
114114
navBar = LazyChild.of(NavBar.create(), header);
115115
footer =
116-
LazyChild.of(section().addCss(dui_footer).setZIndexLayer(ZIndexLayer.Z_LAYER_2), body)
116+
LazyChild.of(
117+
section()
118+
.setAttribute("dui-reserve-bottom-space", "true")
119+
.addCss(dui_footer)
120+
.setZIndexLayer(ZIndexLayer.Z_LAYER_2),
121+
body)
117122
.whenInitialized(() -> layout.addCss(dui_has_footer));
118123
leftDrawerToggle = initLeftDrawerToggle(leftToggleIcon);
119124
leftDrawer =
120125
LazyChild.of(
121126
section()
127+
.setAttribute("dui-reserve-left-space", "true")
122128
.addCss(dui_left_drawer)
123129
.setZIndexLayer(ZIndexLayer.Z_LAYER_2)
124130
.addClickListener(Event::stopPropagation),
@@ -132,13 +138,21 @@ public AppLayout() {
132138
if (dui_left_open.isAppliedTo(layout)) {
133139
leftDrawerOpenHandlers.forEach(
134140
handler -> handler.apply(this, leftDrawer.get()));
141+
leftDrawer
142+
.get()
143+
.setAttribute(
144+
"dui-reserve-left-space", dui_left_open.isAppliedTo(layout));
135145
}
136146
})
137147
.onTransitionEnd(
138148
target -> {
139149
if (!dui_left_open.isAppliedTo(layout)) {
140150
leftDrawerCloseHandlers.forEach(
141151
handler -> handler.apply(this, leftDrawer.get()));
152+
leftDrawer
153+
.get()
154+
.setAttribute(
155+
"dui-reserve-left-space", dui_left_open.isAppliedTo(layout));
142156
}
143157
});
144158
});
@@ -149,6 +163,7 @@ public AppLayout() {
149163
rightDrawer =
150164
LazyChild.of(
151165
section()
166+
.setAttribute("dui-reserve-left-space", "false")
152167
.addCss(dui_right_drawer)
153168
.setZIndexLayer(ZIndexLayer.Z_LAYER_2)
154169
.addClickListener(Event::stopPropagation),
@@ -163,13 +178,21 @@ public AppLayout() {
163178
if (dui_right_open.isAppliedTo(layout)) {
164179
rightDrawerOpenHandlers.forEach(
165180
handler -> handler.apply(this, rightDrawer.get()));
181+
rightDrawer
182+
.get()
183+
.setAttribute(
184+
"dui-reserve-right-space", dui_right_open.isAppliedTo(layout));
166185
}
167186
})
168187
.onTransitionEnd(
169188
target -> {
170189
if (!dui_right_open.isAppliedTo(layout)) {
171190
rightDrawerCloseHandlers.forEach(
172191
handler -> handler.apply(this, rightDrawer.get()));
192+
rightDrawer
193+
.get()
194+
.setAttribute(
195+
"dui-reserve-right-space", dui_right_open.isAppliedTo(layout));
173196
}
174197
});
175198
});
@@ -896,9 +919,9 @@ public AppLayout removeRightDrawerCloseListener(ChildHandler<AppLayout, SectionE
896919
}
897920

898921
/**
922+
* @return The HTMLDivElement representing the layout.
899923
* @dominokit-site-ignore {@inheritDoc}
900924
* <p>Gets the HTMLDivElement representing the layout.
901-
* @return The HTMLDivElement representing the layout.
902925
*/
903926
@Override
904927
public HTMLDivElement element() {

‎domino-ui/src/main/java/org/dominokit/domino/ui/menu/direction/BestFitSideDropDirection.java‎

Lines changed: 19 additions & 36 deletions
Original file line numberDiff line numberDiff line change
@@ -15,62 +15,45 @@
1515
*/
1616
package org.dominokit.domino.ui.menu.direction;
1717

18-
import static elemental2.dom.DomGlobal.window;
1918
import static org.dominokit.domino.ui.style.SpacingCss.dui_flex_col_reverse;
20-
import static org.dominokit.domino.ui.utils.Domino.*;
2119

22-
import elemental2.dom.DOMRect;
2320
import elemental2.dom.Element;
2421

2522
/** BestFitSideDropDirection class. */
2623
public class BestFitSideDropDirection implements DropDirection {
2724

2825
/** {@inheritDoc} */
2926
@Override
30-
public void position(Element source, Element target) {
27+
public DropDirection position(Element source, Element target) {
3128
cleanup(source);
3229
dui_flex_col_reverse.remove(source);
33-
DOMRect targetRect = target.getBoundingClientRect();
34-
DOMRect sourceRect = source.getBoundingClientRect();
35-
int innerWidth = window.innerWidth;
36-
int innerHeight = window.innerHeight;
3730

38-
double sourceWidth = sourceRect.width;
39-
double sourceHeight = sourceRect.height;
40-
double rightSpace = innerWidth - targetRect.right - window.pageXOffset;
41-
double downSpace = innerHeight - targetRect.height;
42-
DropDirection currentPosition;
31+
SpaceChecker spaceChecker = SpaceChecker.of(source, target);
4332

44-
if (hasSpaceOnRightSide(sourceWidth, rightSpace)) {
45-
if (hasSpaceBelow(sourceHeight, downSpace)) {
46-
currentPosition = DropDirection.RIGHT_DOWN;
47-
} else {
48-
currentPosition = DropDirection.RIGHT_UP;
33+
if (spaceChecker.hasSpaceOnRight()) {
34+
if (spaceChecker.hasSpaceBelow()) {
35+
return RIGHT_DOWN.position(source, target);
36+
} else if (spaceChecker.hasSpaceAbove()) {
37+
return RIGHT_UP.position(source, target);
4938
}
50-
} else {
51-
if (hasSpaceBelow(sourceHeight, downSpace)) {
52-
currentPosition = DropDirection.LEFT_DOWN;
53-
} else {
54-
currentPosition = DropDirection.LEFT_UP;
39+
} else if (spaceChecker.hasSpaceOnLeft()) {
40+
if (spaceChecker.hasSpaceBelow()) {
41+
return LEFT_DOWN.position(source, target);
42+
} else if (spaceChecker.hasSpaceAbove()) {
43+
return LEFT_UP.position(source, target);
5544
}
5645
}
57-
currentPosition.position(source, target);
46+
47+
return MIDDLE_SCREEN.position(source, target);
5848
}
5949

6050
/** {@inheritDoc} */
6151
@Override
6252
public void cleanup(Element source) {
63-
DropDirection.RIGHT_DOWN.cleanup(source);
64-
DropDirection.RIGHT_UP.cleanup(source);
65-
DropDirection.LEFT_DOWN.cleanup(source);
66-
DropDirection.LEFT_UP.cleanup(source);
67-
}
68-
69-
private boolean hasSpaceBelow(double sourceHeight, double downSpace) {
70-
return downSpace > sourceHeight;
71-
}
72-
73-
private boolean hasSpaceOnRightSide(double sourceWidth, double rightSpace) {
74-
return rightSpace > sourceWidth;
53+
RIGHT_DOWN.cleanSelf(source);
54+
RIGHT_UP.cleanSelf(source);
55+
LEFT_DOWN.cleanSelf(source);
56+
LEFT_UP.cleanSelf(source);
57+
MIDDLE_SCREEN.cleanSelf(source);
7558
}
7659
}

‎domino-ui/src/main/java/org/dominokit/domino/ui/menu/direction/BestMiddleDownUpDropDirection.java‎

Lines changed: 11 additions & 26 deletions
Original file line numberDiff line numberDiff line change
@@ -15,51 +15,36 @@
1515
*/
1616
package org.dominokit.domino.ui.menu.direction;
1717

18-
import static elemental2.dom.DomGlobal.window;
1918
import static org.dominokit.domino.ui.style.SpacingCss.dui_flex_col_reverse;
20-
import static org.dominokit.domino.ui.utils.Domino.*;
2119

22-
import elemental2.dom.DOMRect;
2320
import elemental2.dom.Element;
2421

2522
/** BestMiddleDownUpDropDirection class. */
2623
public class BestMiddleDownUpDropDirection implements DropDirection {
2724

2825
/** {@inheritDoc} */
2926
@Override
30-
public void position(Element source, Element target) {
27+
public DropDirection position(Element source, Element target) {
28+
cleanup(source);
3129
dui_flex_col_reverse.remove(source);
3230
cleanup(source);
33-
DOMRect targetRect = target.getBoundingClientRect();
34-
DOMRect sourceRect = source.getBoundingClientRect();
35-
int innerHeight = window.innerHeight;
36-
37-
double sourceHeight = sourceRect.height;
38-
double downSpace = innerHeight - targetRect.bottom;
3931

40-
DropDirection currentPosition;
32+
SpaceChecker spaceChecker = SpaceChecker.of(source, target);
4133

42-
if (hasSpaceBelow(sourceHeight, downSpace)) {
43-
currentPosition = DropDirection.BOTTOM_MIDDLE;
34+
if (spaceChecker.hasSpaceBelow()) {
35+
return BOTTOM_MIDDLE.position(source, target);
36+
} else if (spaceChecker.hasSpaceAbove()) {
37+
return TOP_MIDDLE.position(source, target);
4438
} else {
45-
currentPosition = DropDirection.TOP_MIDDLE;
39+
return MIDDLE_SCREEN.position(source, target);
4640
}
47-
48-
currentPosition.position(source, target);
4941
}
5042

5143
/** {@inheritDoc} */
5244
@Override
5345
public void cleanup(Element source) {
54-
DropDirection.BOTTOM_MIDDLE.cleanup(source);
55-
DropDirection.TOP_MIDDLE.cleanup(source);
56-
}
57-
58-
private boolean hasSpaceBelow(double sourceHeight, double downSpace) {
59-
return downSpace > sourceHeight;
60-
}
61-
62-
private boolean hasSpaceOnRightSide(double sourceWidth, double rightSpace) {
63-
return rightSpace > sourceWidth;
46+
BOTTOM_MIDDLE.cleanSelf(source);
47+
TOP_MIDDLE.cleanSelf(source);
48+
MIDDLE_SCREEN.cleanSelf(source);
6449
}
6550
}

‎domino-ui/src/main/java/org/dominokit/domino/ui/menu/direction/BestMiddleSideDropDirection.java‎

Lines changed: 10 additions & 21 deletions
Original file line numberDiff line numberDiff line change
@@ -15,45 +15,34 @@
1515
*/
1616
package org.dominokit.domino.ui.menu.direction;
1717

18-
import static elemental2.dom.DomGlobal.window;
1918
import static org.dominokit.domino.ui.style.SpacingCss.dui_flex_col_reverse;
20-
import static org.dominokit.domino.ui.utils.Domino.*;
2119

22-
import elemental2.dom.DOMRect;
2320
import elemental2.dom.Element;
2421

2522
/** BestMiddleSideDropDirection class. */
2623
public class BestMiddleSideDropDirection implements DropDirection {
2724

2825
/** {@inheritDoc} */
2926
@Override
30-
public void position(Element source, Element target) {
27+
public DropDirection position(Element source, Element target) {
3128
dui_flex_col_reverse.remove(source);
3229
cleanup(source);
33-
DOMRect targetRect = target.getBoundingClientRect();
34-
DOMRect sourceRect = source.getBoundingClientRect();
35-
int innerWidth = window.innerWidth;
30+
SpaceChecker spaceChecker = SpaceChecker.of(source, target);
3631

37-
double sourceWidth = sourceRect.width;
38-
double rightSpace = innerWidth - targetRect.right - window.pageXOffset;
39-
DropDirection currentPosition;
40-
41-
if (hasSpaceOnRightSide(sourceWidth, rightSpace)) {
42-
currentPosition = DropDirection.RIGHT_MIDDLE;
32+
if (spaceChecker.hasSpaceOnRight()) {
33+
return RIGHT_MIDDLE.position(source, target);
34+
} else if (spaceChecker.hasSpaceOnLeft()) {
35+
return LEFT_MIDDLE.position(source, target);
4336
} else {
44-
currentPosition = DropDirection.LEFT_MIDDLE;
37+
return MIDDLE_SCREEN.position(source, target);
4538
}
46-
currentPosition.position(source, target);
4739
}
4840

4941
/** {@inheritDoc} */
5042
@Override
5143
public void cleanup(Element source) {
52-
DropDirection.RIGHT_MIDDLE.cleanup(source);
53-
DropDirection.LEFT_MIDDLE.cleanup(source);
54-
}
55-
56-
private boolean hasSpaceOnRightSide(double sourceWidth, double rightSpace) {
57-
return rightSpace > sourceWidth;
44+
RIGHT_MIDDLE.cleanSelf(source);
45+
LEFT_MIDDLE.cleanSelf(source);
46+
MIDDLE_SCREEN.cleanSelf(source);
5847
}
5948
}

‎domino-ui/src/main/java/org/dominokit/domino/ui/menu/direction/BestMiddleUpDownDropDirection.java‎

Lines changed: 10 additions & 27 deletions
Original file line numberDiff line numberDiff line change
@@ -15,52 +15,35 @@
1515
*/
1616
package org.dominokit.domino.ui.menu.direction;
1717

18-
import static elemental2.dom.DomGlobal.window;
1918
import static org.dominokit.domino.ui.style.SpacingCss.dui_flex_col_reverse;
20-
import static org.dominokit.domino.ui.utils.Domino.*;
2119

22-
import elemental2.dom.DOMRect;
2320
import elemental2.dom.Element;
2421

2522
/** BestMiddleUpDownDropDirection class. */
2623
public class BestMiddleUpDownDropDirection implements DropDirection {
2724

2825
/** {@inheritDoc} */
2926
@Override
30-
public void position(Element source, Element target) {
27+
public DropDirection position(Element source, Element target) {
3128
dui_flex_col_reverse.remove(source);
3229
cleanup(source);
33-
DOMRect targetRect = target.getBoundingClientRect();
34-
DOMRect sourceRect = source.getBoundingClientRect();
35-
int innerHeight = window.innerHeight;
3630

37-
double sourceHeight = sourceRect.height;
38-
double downSpace = innerHeight - targetRect.bottom;
39-
double spaceUp = downSpace - targetRect.height;
31+
SpaceChecker spaceChecker = SpaceChecker.of(source, target);
4032

41-
DropDirection currentPosition;
42-
43-
if (hasSpaceUp(sourceHeight, spaceUp)) {
44-
currentPosition = DropDirection.TOP_MIDDLE;
33+
if (spaceChecker.hasSpaceAbove()) {
34+
return TOP_MIDDLE.position(source, target);
35+
} else if (spaceChecker.hasSpaceBelow()) {
36+
return BOTTOM_MIDDLE.position(source, target);
4537
} else {
46-
currentPosition = DropDirection.BOTTOM_MIDDLE;
38+
return MIDDLE_SCREEN.position(source, target);
4739
}
48-
49-
currentPosition.position(source, target);
5040
}
5141

5242
/** {@inheritDoc} */
5343
@Override
5444
public void cleanup(Element source) {
55-
DropDirection.BOTTOM_MIDDLE.cleanup(source);
56-
DropDirection.TOP_MIDDLE.cleanup(source);
57-
}
58-
59-
private boolean hasSpaceUp(double sourceHeight, double spaceUp) {
60-
return spaceUp > sourceHeight;
61-
}
62-
63-
private boolean hasSpaceOnRightSide(double sourceWidth, double rightSpace) {
64-
return rightSpace > sourceWidth;
45+
BOTTOM_MIDDLE.cleanSelf(source);
46+
TOP_MIDDLE.cleanSelf(source);
47+
MIDDLE_SCREEN.cleanSelf(source);
6548
}
6649
}

0 commit comments

Comments
 (0)