Allowed two-way binding of current side.

Removed Images
persianturtle · Jan 20, 2017 · fd73798 · fd73798
1 parent 46aaf19
commit fd73798
Show file tree

Hide file tree

Showing 41 changed files with 18 additions and 11 deletions.
diff --git a/.gitignore b/.gitignore
diff --git a/LICENSE b/LICENSE
diff --git a/README.md b/README.md
@@ -23,7 +23,7 @@ and add the `angular-3d-carousel` as a dependency.
 angular.module('app', ['angular-3d-carousel']);
 ```
 
-Then use the `<carousel sides="sides"></carousel>` directive where you would like to use it.
+Then use the `<carousel sides="vm.sides.all" current="vm.sides.current"></carousel>` directive where you would like to use it.
 
 Note: The `sides` attribute expects an array of objects. Currently, the each object should have the following properties:
   - image (path to image)

diff --git a/bower.json b/bower.json
diff --git a/bower_components/angular-touch/.bower.json b/bower_components/angular-touch/.bower.json
diff --git a/bower_components/angular-touch/LICENSE.md b/bower_components/angular-touch/LICENSE.md
diff --git a/bower_components/angular-touch/README.md b/bower_components/angular-touch/README.md
diff --git a/bower_components/angular-touch/angular-touch.js b/bower_components/angular-touch/angular-touch.js
diff --git a/bower_components/angular-touch/angular-touch.min.js b/bower_components/angular-touch/angular-touch.min.js
diff --git a/bower_components/angular-touch/angular-touch.min.js.map b/bower_components/angular-touch/angular-touch.min.js.map
diff --git a/bower_components/angular-touch/bower.json b/bower_components/angular-touch/bower.json
diff --git a/bower_components/angular-touch/index.js b/bower_components/angular-touch/index.js
diff --git a/bower_components/angular-touch/package.json b/bower_components/angular-touch/package.json
diff --git a/bower_components/angular/.bower.json b/bower_components/angular/.bower.json
diff --git a/bower_components/angular/LICENSE.md b/bower_components/angular/LICENSE.md
diff --git a/bower_components/angular/README.md b/bower_components/angular/README.md
diff --git a/bower_components/angular/angular-csp.css b/bower_components/angular/angular-csp.css
diff --git a/bower_components/angular/angular.js b/bower_components/angular/angular.js
diff --git a/bower_components/angular/angular.min.js b/bower_components/angular/angular.min.js
diff --git a/bower_components/angular/angular.min.js.gzip b/bower_components/angular/angular.min.js.gzip
diff --git a/bower_components/angular/angular.min.js.map b/bower_components/angular/angular.min.js.map
diff --git a/bower_components/angular/bower.json b/bower_components/angular/bower.json
diff --git a/bower_components/angular/index.js b/bower_components/angular/index.js
diff --git a/bower_components/angular/package.json b/bower_components/angular/package.json
diff --git a/bower_components/viewport-units-buggyfill/.bower.json b/bower_components/viewport-units-buggyfill/.bower.json
diff --git a/bower_components/viewport-units-buggyfill/LICENSE.txt b/bower_components/viewport-units-buggyfill/LICENSE.txt
diff --git a/bundle/app.js b/bundle/app.js
diff --git a/bundle/styles.css b/bundle/styles.css
diff --git a/css/carousel.css b/css/carousel.css
diff --git a/css/styles.css b/css/styles.css
diff --git a/dist/angular-3d-carousel.css b/dist/angular-3d-carousel.css
diff --git a/dist/angular-3d-carousel.js b/dist/angular-3d-carousel.js
@@ -24,7 +24,8 @@
         '</div>',
       replace: true,
       scope: {
-        sides: '='
+        sides: '=',
+        current: '='
       },
       link: function(scope, element, attributes) {
         var position;
@@ -174,7 +175,6 @@
             currentSide = Math.round(currentSide);
 
             alert('You got ' + scope.sides[currentSide].title);
-            scope.$broadcast('start', scope.sides[currentSide].title);
 
             scope.$apply(function() {
               scope.current = currentSide;

diff --git a/gulpfile.js b/gulpfile.js
diff --git a/img/guest.png b/img/guest.png
diff --git a/img/logo-amgen.png b/img/logo-amgen.png
diff --git a/img/logo-arenesp.png b/img/logo-arenesp.png
diff --git a/index.html b/index.html
@@ -13,7 +13,7 @@
 <body ng-controller="UiController as vm">
 
   <!-- Include the carousel directive -->
-  <carousel sides="vm.sides"></carousel>
+  <carousel sides="vm.sides.all" current="vm.sides.current"></carousel>
 
   <h1>Try spinning the 3d carousel.</h1>
 

diff --git a/js/app.js b/js/app.js
diff --git a/js/controllers/UiController.js b/js/controllers/UiController.js
@@ -11,10 +11,13 @@
   function UiController($scope) {
     var vm = this;
 
-    vm.sides = [];
+    vm.sides = {
+      all: [],
+      current: 0
+    };
 
     for (var i = 0; i < 8; i++) {
-      vm.sides.push({
+      vm.sides.all.push({
         image: 'img/guest.png',
         title: 'Side' + (i + 1),
         listItems: ['Attribute 1', 'Attribute 2', 'Attribute 3']
@@ -26,16 +29,20 @@
       decrease: decrease
     };
 
+    $scope.$watch('vm.sides.current', function() {
+      console.log('Current Index:', vm.sides.current);
+    });
+
     function increase() {
-      vm.sides.push({
+      vm.sides.all.push({
         image: 'img/guest.png',
-        title: 'Side' + (vm.sides.length + 1),
+        title: 'Side' + (vm.sides.all.length + 1),
         listItems: ['Attribute 1', 'Attribute 2', 'Attribute 3']
       });
     }
 
     function decrease() {
-      vm.sides.splice(vm.sides.length - 1, 1);
+      vm.sides.all.splice(vm.sides.all.length - 1, 1);
     }
   }
 

diff --git a/js/directives/carousel.js b/js/directives/carousel.js
@@ -24,7 +24,8 @@
         '</div>',
       replace: true,
       scope: {
-        sides: '='
+        sides: '=',
+        current: '='
       },
       link: function(scope, element, attributes) {
         var position;
@@ -174,7 +175,6 @@
             currentSide = Math.round(currentSide);
 
             alert('You got ' + scope.sides[currentSide].title);
-            scope.$broadcast('start', scope.sides[currentSide].title);
 
             scope.$apply(function() {
               scope.current = currentSide;

diff --git a/package.json b/package.json