fix(speedDial): non-fab clicks no longer close immediately

src/components/fabSpeedDial/demoBasicUsage/index.html

@@ -43,10 +43,9 @@
       <div layout="column" layout-align="start center">
         <b>Open/Closed</b>
 
-        <md-radio-group ng-model="demo.isOpen">
-          <md-radio-button ng-value="true">Open</md-radio-button>
-          <md-radio-button ng-value="false">Closed</md-radio-button>
-        </md-radio-group>
+        <md-checkbox ng-model="demo.isOpen">
+          Open
+        </md-checkbox>
       </div>
 
       <div layout="column" layout-align="start center">

src/components/fabSpeedDial/fabController.js

@@ -142,8 +142,12 @@
 
     function enableKeyboard() {
       $element.on('keydown', keyPressed);
-      angular.element(document).on('click', checkForOutsideClick);
-      angular.element(document).on('touchend', checkForOutsideClick);
+
+      // On the next tick, setup a check for outside clicks; we do this on the next tick to avoid
+      // clicks/touches that result in the isOpen attribute changing (e.g. a bound radio button)
+      $mdUtil.nextTick(function() {
+        angular.element(document).on('click touchend', checkForOutsideClick);
+      });
 
       // TODO: On desktop, we should be able to reset the indexes so you cannot tab through, but
       // this breaks accessibility, especially on mobile, since you have no arrow keys to press
@@ -152,8 +156,7 @@
 
     function disableKeyboard() {
       $element.off('keydown', keyPressed);
-      angular.element(document).off('click', checkForOutsideClick);
-      angular.element(document).off('touchend', checkForOutsideClick);
+      angular.element(document).off('click touchend', checkForOutsideClick);
     }
 
     function checkForOutsideClick(event) {

src/components/fabSpeedDial/fabSpeedDial.js

@@ -148,21 +148,27 @@
           var newPosition, axis;
           var styles = item.style;
 
+          // Make sure to account for differences in the dimensions of the trigger verses the items
+          // so that we can properly center everything; this helps hide the item's shadows behind
+          // the trigger.
+          var triggerItemHeightOffset = (triggerElement.clientHeight - item.clientHeight) / 2;
+          var triggerItemWidthOffset = (triggerElement.clientWidth - item.clientWidth) / 2;
+
           switch (ctrl.direction) {
             case 'up':
-              newPosition = item.scrollHeight * (index + 1);
+              newPosition = (item.scrollHeight * (index + 1) + triggerItemHeightOffset);
               axis = 'Y';
               break;
             case 'down':
-              newPosition = -item.scrollHeight * (index + 1);
+              newPosition = -(item.scrollHeight * (index + 1) + triggerItemHeightOffset);
               axis = 'Y';
               break;
             case 'left':
-              newPosition = item.scrollWidth * (index + 1);
+              newPosition = (item.scrollWidth * (index + 1) + triggerItemWidthOffset);
               axis = 'X';
               break;
             case 'right':
-              newPosition = -item.scrollWidth * (index + 1);
+              newPosition = -(item.scrollWidth * (index + 1) + triggerItemWidthOffset);
               axis = 'X';
               break;
           }