Add scroll, scrollTo, scrollBy, scrollIntoView

We add [`Element.scroll]`[1], [`Element.scrollTo`][2],
[`Element.scrollBy`][3], and [`Element.scrollIntoView`][4].

[1]: https://developer.mozilla.org/en-US/docs/Web/API/Element/scroll
[2]: https://developer.mozilla.org/en-US/docs/Web/API/Element/scrollTo
[3]: https://developer.mozilla.org/en-US/docs/Web/API/Element/scrollBy
[4]: https://developer.mozilla.org/en-US/docs/Web/API/Element/scrollIntoView

Author: Shou

src/Web/DOM/Element.js

@@ -133,6 +133,42 @@ exports.setScrollLeft = function (scrollLeft) {
   };
 };
 
+exports._scroll = function (scrollToOptions) {
+  return function (node) {
+    return function () {
+      node.scroll(scrollToOptions);
+      return {};
+    };
+  };
+};
+
+exports._scrollTo = function (scrollToOptions) {
+  return function (node) {
+    return function () {
+      node.scrollTo(scrollToOptions);
+      return {};
+    };
+  };
+};
+
+exports._scrollBy = function (scrollToOptions) {
+  return function (node) {
+    return function () {
+      node.scrollBy(scrollToOptions);
+      return {};
+    };
+  };
+};
+
+exports._scrollIntoView = function (scrollIntoViewOptions) {
+  return function (node) {
+    return function () {
+      node.scrollIntoView(scrollIntoViewOptions);
+      return {};
+    };
+  };
+};
+
 exports.scrollWidth = function (el) {
   return function () {
     return el.scrollWidth;

src/Web/DOM/Element.purs

@@ -29,6 +29,13 @@ module Web.DOM.Element
   , setScrollTop
   , scrollLeft
   , setScrollLeft
+  , ScrollBehavior
+  , ScrollAlignment
+  , scroll
+  , scrollBy
+  , ScrollToOptions
+  , scrollIntoView
+  , ScrollIntoViewOptions
   , scrollWidth
   , scrollHeight
   , clientTop
@@ -121,6 +128,79 @@ foreign import setScrollTop :: Number -> Element -> Effect Unit
 foreign import scrollLeft :: Element -> Effect Number
 foreign import setScrollLeft :: Number -> Element -> Effect Unit
 
+data ScrollBehavior = Auto | Smooth
+
+stringScrollBehavior :: ScrollBehavior -> String
+stringScrollBehavior Auto = "Auto"
+stringScrollBehavior Smooth = "Smooth"
+
+type ScrollToOptions =
+  { top :: Number
+  , left :: Number
+  , behavior :: ScrollBehavior
+  }
+
+type ScrollToOptions_ =
+  { top :: Number
+  , left :: Number
+  , behavior :: String
+  }
+
+foreign import _scroll :: Element -> ScrollToOptions_ -> Effect Unit
+
+scroll :: Element -> ScrollToOptions -> Effect Unit
+scroll elem _opts = _scroll elem opts
+  where
+    opts = let { top,left, behavior } = _opts
+           in { top, left, behavior: stringScrollBehavior behavior }
+
+foreign import _scrollTo :: Element -> ScrollToOptions_ -> Effect Unit
+
+scrollTo :: Element -> ScrollToOptions -> Effect Unit
+scrollTo elem _opts = _scrollTo elem opts
+  where
+    opts = let { top,left, behavior } = _opts
+           in { top, left, behavior: stringScrollBehavior behavior }
+
+foreign import _scrollBy :: Element -> ScrollToOptions_ -> Effect Unit
+
+scrollBy :: Element -> ScrollToOptions -> Effect Unit
+scrollBy elem _opts = _scrollBy elem opts
+  where
+    opts = let { top,left, behavior } = _opts
+           in { top, left, behavior: stringScrollBehavior behavior }
+
+data ScrollAlignment = Start | Center | End | Nearest
+
+stringScrollAlignment :: ScrollAlignment -> String
+stringScrollAlignment Start = "Start"
+stringScrollAlignment Center = "Center"
+stringScrollAlignment End = "End"
+stringScrollAlignment Nearest = "Nearest"
+
+type ScrollIntoViewOptions =
+  { behavior :: ScrollBehavior
+  , block :: ScrollAlignment
+  , inline :: ScrollAlignment
+  }
+
+type ScrollIntoViewOptions_ =
+  { behavior :: String
+  , block :: String
+  , inline :: String
+  }
+
+foreign import _scrollIntoView :: Element -> ScrollIntoViewOptions_ -> Effect Unit
+
+scrollIntoView :: Element -> ScrollIntoViewOptions -> Effect Unit
+scrollIntoView elem _opts = _scrollIntoView elem opts
+  where
+    opts = let { behavior, block, inline } = _opts
+            in { behavior: stringScrollBehavior behavior
+               , block: stringScrollAlignment block
+               , inline: stringScrollAlignment inline
+               }
+
 foreign import scrollWidth :: Element -> Effect Number
 foreign import scrollHeight :: Element -> Effect Number
 foreign import clientTop :: Element -> Effect Number