App.ApplicationView = Ember.Component.extend
  didRender: ->
    # Side menu collapsing
    side_menu = @$('.side-menu')
    side_menu.addClass('closed').click -> side_menu.toggleClass('active').addClass('clicked').toggleClass('closed')
    controller = @get('controller')
    main_section = @$('.main-section')
    #main_section.swipe
      #swipe: (event, direction, distance, duration, fingerCount) ->
        #if fingerCount is 2
          #if direction is "right"
            #side_menu.addClass('active clicked').removeClass('closed')
          #else if direction is "left"
            #side_menu.removeClass('active').addClass('closed')
        ##else if fingerCount is 2 and direction is "down"
          ##controller.transitionToRoute "settings"
      #fingers: 'all'

    document.addEventListener "backbutton", =>
      # close side menu if open
      if side_menu.hasClass('active')
        side_menu.click()
      else
        # close the app when on the index route
        if @controller.currentPath is 'index'
          navigator.app.exitApp()
        else
          # go to index route otherwise
          @controller.transitionToRoute 'index'
    document.addEventListener "menubutton", -> side_menu.click()

    #ios7 detection
    if window.device and window.device.platform and window.device.platform.toLowerCase() is "ios" and parseFloat(window.device.version) >= 7.0
      controller.set 'ios7', true
      body = $('body')
      body.addClass 'ios7'
      body.append $('<div></div>').addClass("ios7-menu-panel")
