JSFiddle - React, Tailwind, and code Playground

by Oski Krawczyk

CoffeeScript

class Utilities

  createCookie: (name, value, days) ->
    expires = ""

    if days
      date = new Date
      date.setTime date.getTime() + days * 24 * 60 * 60 * 1000
      expires = "; expires=#{date.toGMTString()}"
    else
      expires = ""

    document.cookie = "#{name}=#{value + expires}; path=/"

  readCookie: (name) ->
    nameEQ = "#{name}="
    ca = document.cookie.split ";"
    i = 0
    while i < ca.length
      c = ca[i]
      while c.charAt(0) == " "
        c = c.substring(1, c.length)
      if c.indexOf(nameEQ) == 0
        return c.substring(nameEQ.length, c.length)
      i++

  eraseCookie: (name) ->
    createCookie name, "", -1

class Layout extends Utilities

  constructor: ->

    # cache elements
    @elements =
      window:    $(window)
      categories:
        trigger: $(".categories, #categories")
        cont:    $("#categories")
      body:      $(document.body)
      tabs:
        trigger: $(".tabNav a")
        cont:    $(".tabCont")
      featured:  $("#featured")
      sideCont:  $("#sidebar .sideCont")
      legend:
        cont:    $(".legend")
        close:   $(".legend .close")
      category:
        trigger: $(".categorySelector a")
      dropdown: $(".dropdown .iconWithDropdown")

    @setupDefaults()

  setupDefaults: =>
    @elements.body.tooltip
      selector:  "[data-toggle='tooltip']"
      animation: false
      container: "body"

    # attach events
    @elements.categories.trigger.on "mouseenter mouseleave", @toggleCategories
    @elements.category.trigger.on "click", @toggleCategoriesSelection
    @elements.tabs.trigger.on "click", @switchTabs
    @elements.legend.close.on "click", @closeLegend
    @elements.body.on "mouseenter mouseleave", ".score", @toggleStats
    @elements.window.on "scroll", @stickySidebar
    @elements.body.on "click", @toggleDropdown

    @stickySidebar()
    @closeLegend()

  toggleCategoriesSelection: (event) ->
    event.preventDefault()
    trigger    = $(event.currentTarget)
   ...