gistfile1.coffee

# Place all the behaviors and hooks related to the matching controller here.
# All this logic will automatically be available in application.js.
# You can use CoffeeScript in this file: http://jashkenas.github.com/coffee-script
$.morpheus = require("morpheus")
$.sugare = require("sugar")

class PHIntroList

PHIntroList.prototype.setPageView = (pageviewEl) ->
  @pageView = pageviewEl

PHIntroList.prototype.getParentElement =  () ->
  @parentElement

PHIntroList.prototype.setParentElement = (element) ->
  @parentElement = element

selectedList = undefined


getListElements = () ->
  unless getListElements.elements?
    console.log "Lists: "+lists
    getListElements.elements = lists

  return getListElements.elements

fadeItemIn = (element) ->
  if selectedList
    fadeItemOut(selectedList)

  # Animate the main element.
  $.morpheus(element, {
    duration: 500,
    color: '#000000'
  })
  
  # Moving to siblings
  sibling = element.nextElementSibling
  while (sibling isnt null)
    $.morpheus(sibling, {
      duration: 500,
      opacity: 1
    })
    sibling = sibling.nextElementSibling

  selectedList = element

fadeItemOut = (element) ->
  $.morpheus(element, {
    duration: 200,
    color: '#ababab'
  })
  
  # Moving to siblings
  sibling = element.nextElementSibling
  while (sibling isnt null)
    $.morpheus(sibling, {
      duration: 200,
      opacity: 0
    })
    sibling = sibling.nextElementSibling
  

createBindingEvents = () ->
  lists = document.getElementById("highlight-container").children[0].getElementsByTagName("li")
  pageviews = document.getElementById('navcontrol').children[0].getElementsByTagName('li')
 
  for list, idx in lists
    console.log list
    item = new PHIntroList()
    item.setPageView(list)
    item.setParentElement(lists[idx + 1])
    list.addEventListener "click", -> fadeItemIn(item)

# Must call at the end.
$.domReady createBindingEvents