starting refactor

1 files changed, 244 insertions, 0 deletions

diff --git a/public/javascripts/main.bak.js b/public/javascripts/main.bak.js
new file mode 100644
index 0000000..895dd3f
--- /dev/null
+++ b/public/javascripts/main.bak.js
@@ -0,0 +1,244 @@
+/* global ga FLAGS USERS */
+
+require('flexibility')
+
+const fuzzy = require('fuzzy')
+// const getUsers = require('./getUsers')
+const getURLOfUser = require('./getURLOfUser')
+const removeDiacritics = require('diacritics').remove
+const getWeek = require('./getWeek')
+const easterEggs = require('./easterEggs')
+
+const searchNode = document.querySelector('#search')
+const inputNode = searchNode.querySelector('input[type="search"]')
+const autocompleteNode = document.querySelector('.autocomplete')
+const scheduleIframe = document.querySelector('#schedule')
+const prevButton = document.querySelectorAll('#week-selector button')[0]
+const nextButton = document.querySelectorAll('#week-selector button')[1]
+const currentWeekNode = document.querySelector('.current')
+const favNode = document.querySelector('.fav')
+
+if (FLAGS.indexOf('NO_FEATURE_DETECT') === -1) {
+  if (document.querySelector('#schedule').getClientRects()[0].bottom !==
+      document.body.getClientRects()[0].bottom) {
+    window.location = 'http://www.meetingpointmco.nl/Roosters-AL/doc/'
+  } else {
+    window.onerror = function () {
+      window.location = 'http://www.meetingpointmco.nl/Roosters-AL/doc/'
+    }
+  }
+} else {
+  console.log('feature detection is OFF')
+}
+
+let selectedResult = -1
+let selectedUser
+let results = []
+let offset = 0
+
+function getCurrentFav () {
+  if (!window.localStorage.getItem('fav')) return
+  const favCode = window.localStorage.getItem('fav').split(':')
+  const fav = USERS.filter(user => user.type === favCode[0] && user.index === Number(favCode[1]))
+  return fav[0]
+}
+
+function changeFav (isFav) {
+  if (!selectedUser) return
+  if (isFav) {
+    window.localStorage.setItem('fav', selectedUser.type + ':' + selectedUser.index)
+  } else {
+    window.localStorage.removeItem('fav')
+  }
+  updateFavNode()
+}
+
+function usersEqual (user1, user2) {
+  if (user1 == null || user2 == null) return false
+  return user1.type === user2.type && user1.index === user2.index
+}
+
+function updateFavNode () {
+  if (usersEqual(getCurrentFav(), selectedUser)) {
+    favNode.innerHTML = ''
+  } else {
+    favNode.innerHTML = '&#xE83A'
+  }
+}
+
+function updateWeekText () {
+  if (offset === 0) currentWeekNode.innerHTML = `Week ${getWeek() + offset}`
+  else currentWeekNode.innerHTML = `<strong>Week ${getWeek() + offset}</strong>`
+}
+
+updateWeekText()
+
+searchNode.addEventListener('keydown', function (e) {
+  if ((results.length !== 0) && (e.key === 'ArrowDown' || e.key === 'ArrowUp')) {
+    e.preventDefault()
+
+    if (document.querySelector('.selected')) document.querySelector('.selected').classList.remove('selected')
+
+    const change = e.key === 'ArrowDown' ? 1 : -1
+    selectedResult += change
+    if (selectedResult < -1) selectedResult = results.length - 1
+    else if (selectedResult > results.length - 1) selectedResult = -1
+
+    if (selectedResult !== -1) autocompleteNode.children[selectedResult].classList.add('selected')
+  }
+})
+
+let inputEventStr
+if (navigator.userAgent.indexOf('MSIE') !== -1 ||
+    navigator.appVersion.indexOf('Trident/') > 0) {
+  inputEventStr = 'textinput' // IE 6-11
+} else {
+  inputEventStr = 'input' // normal browsers
+}
+
+searchNode.addEventListener(inputEventStr, function (e) {
+  document.body.classList.remove('no-input')
+  autocompleteNode.innerHTML = ''
+  if (inputNode.value.trim() === '') return
+
+  selectedResult = -1
+  results = fuzzy.filter(removeDiacritics(inputNode.value), USERS, {
+    extract: function (el) { return removeDiacritics(el.value) }
+  }).slice(0, 7)
+
+  results.forEach(function (result) {
+    const resultNode = document.createElement('li')
+    resultNode.innerHTML = `${result.original.value}`
+    autocompleteNode.appendChild(resultNode)
+  })
+})
+
+searchNode.addEventListener('submit', submitForm)
+
+function submitForm (e) {
+  if (e) e.preventDefault()
+  if (results.length !== 0) {
+    const indexInResult = selectedResult === -1 ? 0 : selectedResult
+    selectedUser = USERS[results[indexInResult].index]
+  }
+  if (selectedUser == null) return
+
+  document.body.classList.add('searched')
+
+  updateFavNode()
+
+  inputNode.value = selectedUser.value
+  autocompleteNode.innerHTML = ''
+
+  inputNode.blur()
+
+  scheduleIframe.src = getURLOfUser(offset, selectedUser.type, selectedUser.index + 1)
+
+  let eventAction
+  switch (selectedUser.type) {
+    case 'c':
+      eventAction = 'Class'
+      break
+    case 't':
+      eventAction = 'Teacher'
+      break
+    case 'r':
+      eventAction = 'Room'
+      break
+    case 's':
+      eventAction = 'Student'
+      break
+  }
+  const eventLabel = selectedUser.value
+
+  ga(function () {
+    ga('send', { hitType: 'event', eventCategory: 'search', eventAction, eventLabel })
+  })
+}
+
+autocompleteNode.addEventListener('click', function (e) {
+  if (autocompleteNode.contains(e.target)) {
+    selectedResult = Array.prototype.indexOf.call(e.target.parentElement.childNodes, e.target)
+    submitForm()
+  }
+})
+
+prevButton.addEventListener('click', function () {
+  offset--
+  updateWeekText()
+  submitForm()
+})
+
+nextButton.addEventListener('click', function () {
+  offset++
+  updateWeekText()
+  submitForm()
+})
+
+inputNode.addEventListener('click', function () {
+  inputNode.select()
+})
+
+window.addEventListener('blur', function () {
+  // this will removed the selection without drawing focus on it (safari)
+  // this will removed selection even when focusing an iframe (chrome)
+  const oldValue = inputNode.value
+  inputNode.value = ''
+  inputNode.value = oldValue
+
+  // this will hide the keyboard (iOS safari)
+  document.activeElement.blur()
+})
+
+searchNode.addEventListener('blur', function (e) {
+  autocompleteNode.innerHTML = ''
+})
+
+favNode.addEventListener('click', function () {
+  if (usersEqual(getCurrentFav(), selectedUser)) {
+    changeFav(false)
+  } else {
+    changeFav(true)
+  }
+})
+
+const currentFav = getCurrentFav()
+
+if (currentFav) {
+  selectedUser = currentFav
+  inputNode.value = selectedUser.value
+  scheduleIframe.src = getURLOfUser(offset, selectedUser.type, selectedUser.index + 1)
+  updateFavNode()
+
+  let eventAction
+  switch (selectedUser.type) {
+    case 'c':
+      eventAction = 'Class'
+      break
+    case 't':
+      eventAction = 'Teacher'
+      break
+    case 'r':
+      eventAction = 'Room'
+      break
+    case 's':
+      eventAction = 'Student'
+      break
+  }
+  const eventLabel = selectedUser.value
+
+  ga(function () {
+    ga('send', { hitType: 'event', eventCategory: 'search fav', eventAction, eventLabel })
+  })
+} else if (inputNode.value === '') {
+  document.body.classList.add('no-input')
+  inputNode.focus()
+}
+
+if (scheduleIframe.src !== '') {
+  document.body.classList.add('searched')
+}
+
+document.body.style.opacity = '1'
+
+window.easterEggs = easterEggs