angular dropdown directive

dropdown.js.coffee

'use strict';

app.directive 'dropdown', ['$document', ($document) ->
  restrict: "CA"
  scope: false
  link: (scope, element, attrs) ->
    scope.isOpen = false
    closeDropdown = (event) ->
      if event && event.isDefaultPrevented()
        return

      element.removeClass("open")
      scope.isOpen = false

    escapeKeyBind = (event) ->
      if event.which is 27
        element.removeClass("open")
        scope.isOpen = false

    scope.$watch 'isOpen', (value) ->
      if value
        $document.bind('click', closeDropdown);
        $document.bind('keydown', escapeKeyBind);
      else
        $document.unbind('click', closeDropdown);
        $document.unbind('keydown', escapeKeyBind);
]

app.directive 'dropdownToggle', () ->
  restrict: "CA"
  require: '?^dropdown'
  scope: false
  link: (scope, element, attrs) ->

    scope.toggleDropdown = (event) ->
      event.preventDefault()
      if not element.parent().hasClass("open")
        element.parent().addClass("open")
        scope.isOpen = true
      else
        element.parent().removeClass("open")
        scope.isOpen = false
      scope.$apply()

    element.bind "click", scope.toggleDropdown