ModalContainer.coffee

modal.coffee

class _Modal
  show: (options={}) ->
    return false unless options.modalContainerId?

    $modalContainer = $(options.modalContainerId)
    $modal = $modalContainer.children('.modal')
    $close = $modal.find('.close')

    $('html, body').addClass 'noscroll'
    $modalContainer.css
      display: 'block'
      WebkitTransform: 'none'
      MozTransform: 'none'

    _h = $modal.outerHeight()
    _h = -1*_h /2

    $modalContainer.addClass 'visible'
    $modal.css
      'margin-bottom': _h

    # Bind event for hide()
    $close.on 'click' (e) =>
      e.preventDefault()
      @hide(options)

    $('.overlay').on 'click' (e) =>
      e.preventDefault()
      @hide(options)

    return _h

  hide: (options={}) ->
    return false unless options.modalContainerId?

    $modalContainer = $(options.modalContainerId)
    $modal = $modalContainer.children('.modal')
    $modal.addClass 'rotation'

    $('html, body').removeClass 'noscroll'
    $modalContainer.removeClass 'visible'

    setTimeout =>
      $modalContainer.css
        display: 'none'
        WebkitTransform: 'translateZ(0px)'
        MozTransform: 'translateZ(0px)'
    , 200

    setTimeout =>
      $modal.removeClass 'rotation'
    , 300


Modal = new _Modal()


$ ->
  $('a.trigger-modal-link').on 'click' (e) ->
    e.preventDefault()
    Modal.show({modalContainerId: '#modal_for_demo'})