From 1bac657c8c24b4ac9f555fdf281c8708a6aba41e Mon Sep 17 00:00:00 2001
From: Jason Williams <jaswilli@gmail.com>
Date: Wed, 18 Feb 2015 17:11:02 +0000
Subject: [PATCH] Run listener callbacks in Ember run-loops

Closes #4871
---
 core/client/views/application.js | 72 +++++++++++++++++---------------
 1 file changed, 39 insertions(+), 33 deletions(-)

diff --git a/core/client/views/application.js b/core/client/views/application.js
index 14b7ca39b8..83278e7c13 100644
--- a/core/client/views/application.js
+++ b/core/client/views/application.js
@@ -1,37 +1,53 @@
 import mobileQuery from 'ghost/utils/mobile';
-import bind from 'ghost/utils/bind';
 
 var ApplicationView = Ember.View.extend({
     elementId: 'container',
 
-    setupGlobalMobileNav: function () {
+    didInsertElement: function () {
         // #### Navigating within the sidebar closes it.
         var self = this;
+
         $('body').on('click tap', '.js-nav-item', function () {
-            if (mobileQuery.matches) {
-                self.set('controller.showGlobalMobileNav', false);
-            }
+            Ember.run(function () {
+                if (mobileQuery.matches) {
+                    self.set('controller.showGlobalMobileNav', false);
+                }
+            });
         });
 
         // #### Close the nav if mobile and clicking outside of the nav or not the burger toggle
         $('.js-nav-cover').on('click tap', function () {
-            var isOpen = self.get('controller.showGlobalMobileNav');
-            if (isOpen) {
-                self.set('controller.showGlobalMobileNav', false);
-            }
+            Ember.run(function () {
+                var isOpen = self.get('controller.showGlobalMobileNav');
+
+                if (isOpen) {
+                    self.set('controller.showGlobalMobileNav', false);
+                }
+            });
         });
 
-        // #### Listen to the viewport and change user-menu dropdown triangle classes accordingly
-        mobileQuery.addListener(this.swapUserMenuDropdownTriangleClasses);
-        this.swapUserMenuDropdownTriangleClasses(mobileQuery);
-    }.on('didInsertElement'),
-
-    swapUserMenuDropdownTriangleClasses: function (mq) {
-        if (mq.matches) {
-            $('.js-user-menu-dropdown-menu').removeClass('dropdown-triangle-top-right ').addClass('dropdown-triangle-bottom');
-        } else {
-            $('.js-user-menu-dropdown-menu').removeClass('dropdown-triangle-bottom').addClass('dropdown-triangle-top-right');
+        function swapUserMenuDropdownTriangleClasses(mq) {
+            if (mq.matches) {
+                $('.js-user-menu-dropdown-menu').removeClass('dropdown-triangle-top-right ').addClass('dropdown-triangle-bottom');
+            } else {
+                $('.js-user-menu-dropdown-menu').removeClass('dropdown-triangle-bottom').addClass('dropdown-triangle-top-right');
+            }
         }
+
+        // #### Listen to the viewport and change user-menu dropdown triangle classes accordingly
+        this.set('swapUserMenuDropdownTriangleClasses', Ember.run.bind(this, swapUserMenuDropdownTriangleClasses));
+
+        mobileQuery.addListener(this.get('swapUserMenuDropdownTriangleClasses'));
+        swapUserMenuDropdownTriangleClasses(mobileQuery);
+
+        this.set('closeGlobalMobileNavOnDesktop', Ember.run.bind(this, function closeGlobalMobileNavOnDesktop(mq) {
+            if (!mq.matches) {
+                // Is desktop sized
+                this.set('controller.showGlobalMobileNav', false);
+            }
+        }));
+
+        mobileQuery.addListener(this.get('closeGlobalMobileNavOnDesktop'));
     },
 
     showGlobalMobileNavObserver: function () {
@@ -42,20 +58,10 @@ var ApplicationView = Ember.View.extend({
         }
     }.observes('controller.showGlobalMobileNav'),
 
-    setupCloseNavOnDesktop: function () {
-        this.set('closeGlobalMobileNavOnDesktop', bind(function closeGlobalMobileNavOnDesktop(mq) {
-            if (!mq.matches) {
-                // Is desktop sized
-                this.set('controller.showGlobalMobileNav', false);
-            }
-        }, this));
-
-        mobileQuery.addListener(this.closeGlobalMobileNavOnDesktop);
-    }.on('didInsertElement'),
-
-    removeCloseNavOnDesktop: function () {
-        mobileQuery.removeListener(this.closeGlobalMobileNavOnDesktop);
-    }.on('willDestroyElement'),
+    willDestroyElement: function () {
+        mobileQuery.removeListener(this.get('closeGlobalMobileNavOnDesktop'));
+        mobileQuery.removeListener(this.get('swapUserMenuDropdownTriangleClasses'));
+    },
 
     toggleSettingsMenuBodyClass: function () {
         $('body').toggleClass('settings-menu-expanded', this.get('controller.showSettingsMenu'));