fix(topbar): disallow scope.apply when topbar is not sticky

.gitignore

@@ -22,3 +22,4 @@ bower_components
 npm-debug.log
 
 template/**/*.js
+.idea

src/dropdownToggle/dropdownToggle.js

@@ -46,12 +46,30 @@ angular.module('mm.foundation.dropdownToggle', [ 'mm.foundation.position', 'mm.f
         if (!elementWasOpen && !element.hasClass('disabled') && !element.prop('disabled')) {
           dropdown.css('display', 'block'); // We display the element so that offsetParent is populated
           dropdown.addClass('f-open-dropdown');
-
+
+          var options = element.attr('data-options') ? element.attr('data-options').split(';') : [];
+          var align = null;
+
+          for (var i = 0; i < options.length; i++) {
+            var split = options[i].split(':');
+            if (split[0] === 'align') {
+              align = split[1];
+            }
+          }
           var offset = $position.offset(element);
           var parentOffset = $position.offset(angular.element(dropdown[0].offsetParent));
           var dropdownWidth = dropdown.prop('offsetWidth');
+          var dropdownHeight = dropdown.prop('offsetHeight');
+          var top = offset.top - parentOffset.top + offset.height;
+
+          switch (align) {
+            case 'top-left':
+              top -= dropdownHeight / 2;
+              break;
+          }
+
           var css = {
-            top: offset.top - parentOffset.top + offset.height + 'px'
+            top: top + 'px'
           };
 
           if (controller.small()) {
@@ -67,6 +85,14 @@ angular.module('mm.foundation.dropdownToggle', [ 'mm.foundation.position', 'mm.f
                 left = rightThreshold;
                 dropdown.removeClass('left').addClass('right');
             }
+            switch (align) {
+              case 'left':
+                left -= dropdownWidth;
+                break;
+              case 'top-left':
+                left -= dropdownWidth;
+                break;
+            }
             css.left = left + 'px';
             css.position = null;
             css['max-width'] = null;

src/topbar/test/topbar.spec.js

@@ -158,4 +158,43 @@ describe('topbar directive', function() {
       expect(containerElement.hasClass('fixed')).toBe(false);
     });
   });
+
+  describe('onScroll', function() {
+    var scope, elm;
+
+    beforeEach(inject(function($compile, $rootScope) {
+      elm = $compile('<top-bar></top-bar>')($rootScope);
+      $rootScope.$digest();
+      scope = elm.isolateScope();
+      scope.$apply = jasmine.createSpy('$apply');
+    }));
+
+    describe('when both stickyTopbar and isSticky are true', function() {
+      it('does not invoke scope.$apply', function() {
+        scope.stickyTopbar = true;
+        scope.isSticky = jasmine.createSpy('isSticky').andReturn(true);
+        angular.element($window).triggerHandler('scroll');
+        expect(scope.$apply).toHaveBeenCalled();
+      });
+    });
+
+    describe('when either stickyTopbar or isSticky is false', function() {
+      it('does not invoke scope.$apply', function () {
+        scope.stickyTopbar = false;
+        scope.isSticky = jasmine.createSpy('isSticky').andReturn(false);
+        angular.element($window).triggerHandler('scroll');
+        expect(scope.$apply).not.toHaveBeenCalled();
+
+        scope.stickyTopbar = true;
+        scope.isSticky = jasmine.createSpy('isSticky').andReturn(false);
+        angular.element($window).triggerHandler('scroll');
+        expect(scope.$apply).not.toHaveBeenCalled();
+
+        scope.stickyTopbar = false;
+        scope.isSticky = jasmine.createSpy('isSticky').andReturn(true);
+        angular.element($window).triggerHandler('scroll');
+        expect(scope.$apply).not.toHaveBeenCalled();
+      });
+    });
+  });
 });

src/topbar/topbar.js

@@ -147,7 +147,7 @@ angular.module("mm.foundation.topbar", ['mm.foundation.mediaQueries'])
 
         var updateStickyPositioning = function() {
           if (!scope.stickyTopbar || !scope.isSticky()) {
-            return;
+            return false;
           }
 
           var distance = stickyoffset;
@@ -159,6 +159,7 @@ angular.module("mm.foundation.topbar", ['mm.foundation.mediaQueries'])
             topbarContainer.removeClass('fixed');
             body.css('padding-top', '');
           }
+          return true;
         };
 
         var onResize = function() {
@@ -181,8 +182,10 @@ angular.module("mm.foundation.topbar", ['mm.foundation.mediaQueries'])
         };
 
         var onScroll = function() {
-          updateStickyPositioning();
-          scope.$apply();
+          var updated = updateStickyPositioning();
+          if (updated === true) {
+            scope.$apply();
+          }
         };
 
         scope.toggle = function(on) {