From 5a720699f6a8b6c4b11cfde44e56f5136bd54407 Mon Sep 17 00:00:00 2001
From: Andrew <andrewtjoslin@gmail.com>
Date: Thu, 9 Oct 2014 11:39:09 -0600
Subject: [PATCH] amend(slideBox): always call on-slide-changed, even if no
 selected attr

---
 js/angular/directive/slideBox.js             | 33 +++++++++++---------
 test/unit/angular/directive/slideBox.unit.js | 18 +++++++++++
 2 files changed, 36 insertions(+), 15 deletions(-)

diff --git a/js/angular/directive/slideBox.js b/js/angular/directive/slideBox.js
index b538b3f47c..7e014bfee4 100644
--- a/js/angular/directive/slideBox.js
+++ b/js/angular/directive/slideBox.js
@@ -13,7 +13,7 @@
  *
  * @usage
  * ```html
- * <ion-slide-box on-slide-changed="slideHasChanged($index)" loop="shouldLoop" auto-play="3000">
+ * <ion-slide-box on-slide-changed="slideHasChanged($slideIndex)" loop="shouldLoop" auto-play="3000">
  *   <ion-slide>
  *     <div class="box blue"><h1>BLUE</h1></div>
  *   </ion-slide>
@@ -29,7 +29,7 @@
  * @param {expression=} selected A model bound to the selected slide index.
  * @param {boolean=} loop Whether the slide box should loop. Default false.
  * @param {number=} auto-play If a positive number, then every time the given number of milliseconds have passed, slideBox will go to the next slide. Set to a non-positive number to disable. Default: -1.
- * @param {expression=} on-slide-changed Expression called whenever the slide is changed.  Is passed an '$index' variable.
+ * @param {expression=} on-slide-changed Expression called whenever the slide is changed.  Is passed a '$slideIndex' variable.
  * @param {string=} delegate-handle The handle used to identify this slideBox with
  * {@link ionic.service:$ionicSlideBoxDelegate}.
  */
@@ -65,8 +65,8 @@ function($ionicSlideBoxDelegate, $window) {
     var deregister = $ionicSlideBoxDelegate._registerInstance(slideBoxCtrl, attr.delegateHandle);
     scope.$on('$destroy', deregister);
 
+    watchSelected();
     isDefined(attr.loop) && watchLoop();
-    isDefined(attr.selected) && watchSelected();
     isDefined(attr.autoPlay) && watchAutoPlay();
 
     var throttledReposition = ionic.animationFrameThrottle(repositionSlideBox);
@@ -91,23 +91,26 @@ function($ionicSlideBoxDelegate, $window) {
       });
     }
 
+    function watchSelected() {
+      scope.$watch('selectedIndex', function selectedAttrWatchAction(newIndex) {
+        if (slideBoxCtrl.isInRange(newIndex)) {
+          scope.onSlideChanged({
+            //DEPRECATED $index
+            $index: newIndex,
+            $slideIndex: newIndex
+          });
+          if (slideBoxCtrl.selected() !== newIndex) {
+            slideBoxCtrl.select(newIndex);
+          }
+        }
+      });
+    }
+
     function watchLoop() {
       var unwatchParent = scope.$parent.$watch(attr.loop, slideBoxCtrl.loop);
       scope.$on('$destroy', unwatchParent);
     }
 
-    function watchSelected() {
-      scope.$watch('selectedIndex', function selectedAttrWatchAction(newIndex, oldIndex) {
-        if (slideBoxCtrl.isInRange(newIndex) &&
-            slideBoxCtrl.selected() !== newIndex) {
-          slideBoxCtrl.select(newIndex);
-          scope.onSlideChanged({
-            $index: newIndex
-          });
-        }
-      });
-    }
-
     function watchAutoPlay() {
       var unwatchParent = scope.$parent.$watch(attr.autoPlay, slideBoxCtrl.autoPlay);
       scope.$on('$destroy', unwatchParent);
diff --git a/test/unit/angular/directive/slideBox.unit.js b/test/unit/angular/directive/slideBox.unit.js
index e61ec9393a..7b73c7711e 100644
--- a/test/unit/angular/directive/slideBox.unit.js
+++ b/test/unit/angular/directive/slideBox.unit.js
@@ -120,4 +120,22 @@ describe('ionSlideBox directive', function() {
     $interval.flush();
     expect(slideBoxCtrl.selected()).toBe(0);
   }));
+
+  it('should call onSlideChanged', inject(function($rootScope, $timeout) {
+    $rootScope.changed = jasmine.createSpy('slideChanged');
+    var el = makeSlideBox('<ion-slide-box on-slide-changed="changed($slideIndex)">' +
+                    '<ion-slide>A</ion-slide>' +
+                    '<ion-slide>B</ion-slide>' +
+                    '<ion-slide>C</ion-slide>' +
+                '</ion-slide-box>');
+
+    $rootScope.$apply();
+    var slideBoxCtrl = el.controller('ionSlideBox');
+    $timeout.flush();
+    expect($rootScope.changed).toHaveBeenCalledWith(0);
+
+    slideBoxCtrl.select(1);
+    $rootScope.$apply();
+    expect($rootScope.changed).toHaveBeenCalledWith(1);
+  }));
 });