Skip to content

Commit

Permalink
Added position related things.
Browse files Browse the repository at this point in the history
- `Dom.offsetLeft`, `Dom.offsetTop`
- `Html.Event.layerX`, `Html.Event.layerY`
- `Html.Event.offsetX`, `Html.Event.offsetY`

Fixes #498
  • Loading branch information
gdotdesign committed Nov 16, 2024
1 parent 8a72288 commit f413d2f
Show file tree
Hide file tree
Showing 6 changed files with 79 additions and 25 deletions.
24 changes: 24 additions & 0 deletions core/source/Dom.mint
Original file line number Diff line number Diff line change
Expand Up @@ -590,4 +590,28 @@ module Dom {
) : Promise(Void) {
`#{element}.scrollTo({ behavior: 'smooth', left: #{left}, top: #{top} })`
}

/*
Returns the distance from the outer border of the element (including its
margin) to the left padding edge of the closest positioned ancestor element.
if let Just(div) = Document.getElementBySelector("div") {
Dom.offsetLeft(div)
}
*/
fun offsetLeft (element : Dom.Element) : Number {
`#{element}.offsetLeft || -1`
}

/*
Returns the distance from the outer border of the element (including its
margin) to the top padding edge of the closest positioned ancestor element.
if let Just(div) = Document.getElementBySelector("div") {
Dom.offsetTop(div)
}
*/
fun offsetTop (element : Dom.Element) : Number {
`#{element}.offsetTop || -1`
}
}
4 changes: 4 additions & 0 deletions core/source/Html/Event.mint
Original file line number Diff line number Diff line change
Expand Up @@ -42,6 +42,10 @@ type Html.Event {
clientY : Number,
screenX : Number,
screenY : Number,
offsetX : Number,
offsetY : Number,
layerX : Number,
layerY : Number,
pageX : Number,
pageY : Number,

Expand Down
18 changes: 18 additions & 0 deletions core/tests/tests/Dom.mint
Original file line number Diff line number Diff line change
Expand Up @@ -152,3 +152,21 @@ suite "Dom.getChildren" {
(element : Dom.Element) { Array.size(Dom.getChildren(element)) == 3 })
}
}

suite "Dom.offsetLeft" {
test "returns the offsetLeft value of the element" {
<div/>
|> Test.Html.start()
|> Test.Context.assert(
(element : Dom.Element) { Dom.offsetLeft(element) == 8 })
}
}

suite "Dom.offsetTop" {
test "returns the offsetTop value of the element" {
<div/>
|> Test.Html.start()
|> Test.Context.assert(
(element : Dom.Element) { Dom.offsetTop(element) == 8 })
}
}
8 changes: 8 additions & 0 deletions runtime/src/normalize_event.js
Original file line number Diff line number Diff line change
Expand Up @@ -102,6 +102,14 @@ export const normalizeEvent = (event) => {
return -1;
case "screenY":
return -1;
case "layerX":
return -1;
case "layerY":
return -1;
case "offsetX":
return -1;
case "offsetY":
return -1;

// onScroll
case "detail":
Expand Down
24 changes: 12 additions & 12 deletions src/assets/runtime.js

Large diffs are not rendered by default.

26 changes: 13 additions & 13 deletions src/assets/runtime_test.js

Large diffs are not rendered by default.

0 comments on commit f413d2f

Please sign in to comment.