aboutsummaryrefslogtreecommitdiff
path: root/public/javascripts/scrollSnap.js
diff options
context:
space:
mode:
authorNoah Loomans <noahloomans@gmail.com>2017-01-08 11:48:13 +0100
committerNoah Loomans <noahloomans@gmail.com>2017-01-08 11:48:13 +0100
commit320c18af3ee9cbeaaae3d4796dd7f15a5ac90889 (patch)
treed63339d425a2a6a20c883d896b9ed492272d6085 /public/javascripts/scrollSnap.js
parent4e8da42863406764a659a7337e774ad216d356c9 (diff)
parentdea89e1ec600b302a8db33dd48080b901aee7c7e (diff)
Merge branch 'master' of github.com:nloomans/rooster-mml
Diffstat (limited to 'public/javascripts/scrollSnap.js')
-rw-r--r--public/javascripts/scrollSnap.js55
1 files changed, 55 insertions, 0 deletions
diff --git a/public/javascripts/scrollSnap.js b/public/javascripts/scrollSnap.js
new file mode 100644
index 0000000..167f0c1
--- /dev/null
+++ b/public/javascripts/scrollSnap.js
@@ -0,0 +1,55 @@
+require('smoothscroll-polyfill').polyfill()
+
+const self = {}
+const schedule = require('./schedule')
+
+self._nodes = {
+ search: document.querySelector('#search'),
+ weekSelector: document.querySelector('#week-selector')
+}
+
+self._timeoutID = null
+
+self._getScrollPosition = function () {
+ return (document.documentElement && document.documentElement.scrollTop) ||
+ document.body.scrollTop
+}
+
+self._handleDoneScrolling = function () {
+ const scrollPosition = self._getScrollPosition()
+ const weekSelectorHeight = self._nodes.weekSelector.clientHeight - self._nodes.search.clientHeight
+ if (scrollPosition < weekSelectorHeight && scrollPosition > 0) {
+ window.scroll({ top: weekSelectorHeight, left: 0, behavior: 'smooth' })
+ }
+}
+
+self._handleScroll = function () {
+ if (self._timeoutID != null) window.clearTimeout(self._timeoutID)
+ self._timeoutID = window.setTimeout(self._handleDoneScrolling, 500)
+
+ const scrollPosition = self._getScrollPosition()
+ const weekSelectorHeight = self._nodes.weekSelector.clientHeight - self._nodes.search.clientHeight
+ if (scrollPosition >= weekSelectorHeight) {
+ document.body.classList.add('week-selector-not-visible')
+ } else {
+ document.body.classList.remove('week-selector-not-visible')
+ }
+}
+
+self._handleWindowResize = function () {
+ const weekSelectorHeight = self._nodes.weekSelector.clientHeight - self._nodes.search.clientHeight
+ const extraPixelsNeeded = weekSelectorHeight - (document.body.clientHeight - window.innerHeight)
+ if (extraPixelsNeeded > 0) {
+ document.body.style.marginBottom = extraPixelsNeeded + 'px'
+ } else {
+ document.body.style.marginBottom = null
+ }
+}
+
+self.startListening = function () {
+ window.addEventListener('scroll', self._handleScroll)
+}
+
+schedule.on('load', self._handleWindowResize)
+window.addEventListener('resize', self._handleWindowResize)
+module.exports = self