Bump client dependencies

example-2.0/client/controllers.js

@@ -1,78 +1,75 @@
 angular.module('app', ['angularFileUpload'])
 
   // The example of the full functionality
-  .controller('TestController',function ($scope, $fileUploader) {
+  .controller('TestController',function ($scope, FileUploader) {
     'use strict';
 
     // create a uploader with options
-    var uploader = $scope.uploader = $fileUploader.create({
+
+    var uploader = $scope.uploader = new FileUploader({
       scope: $scope,                          // to automatically update the html. Default: $rootScope
       url: '/api/containers/container1/upload',
       formData: [
         { key: 'value' }
-      ],
-      filters: [
-        function (item) {                    // first user filter
-          console.info('filter1');
-          return true;
-        }
       ]
     });
 
     // ADDING FILTERS
-
-    uploader.filters.push(function (item) { // second user filter
-      console.info('filter2');
-      return true;
+    uploader.filters.push({
+        name: 'filterName',
+        fn: function (item, options) { // second user filter
+            console.info('filter2');
+            return true;
+        }
     });
 
     // REGISTER HANDLERS
-
-    uploader.bind('afteraddingfile', function (event, item) {
+    // --------------------
+    uploader.onAfterAddingFile = function(item) {
       console.info('After adding a file', item);
-    });
-
-    uploader.bind('whenaddingfilefailed', function (event, item) {
-      console.info('When adding a file failed', item);
-    });
-
-    uploader.bind('afteraddingall', function (event, items) {
+    };
+    // --------------------
+    uploader.onAfterAddingAll = function(items) {
       console.info('After adding all files', items);
-    });
-
-    uploader.bind('beforeupload', function (event, item) {
+    };
+    // --------------------
+    uploader.onWhenAddingFileFailed = function(item, filter, options) {
+      console.info('When adding a file failed', item);
+    };
+    // --------------------
+    uploader.onBeforeUploadItem = function(item) {
       console.info('Before upload', item);
-    });
-
-    uploader.bind('progress', function (event, item, progress) {
+    };
+    // --------------------
+    uploader.onProgressItem = function(item, progress) {
       console.info('Progress: ' + progress, item);
-    });
-
-    uploader.bind('success', function (event, xhr, item, response) {
-      console.info('Success', xhr, item, response);
-      $scope.$broadcast('uploadCompleted', item);
-    });
-
-    uploader.bind('cancel', function (event, xhr, item) {
-      console.info('Cancel', xhr, item);
-    });
-
-    uploader.bind('error', function (event, xhr, item, response) {
-      console.info('Error', xhr, item, response);
-    });
-
-    uploader.bind('complete', function (event, xhr, item, response) {
-      console.info('Complete', xhr, item, response);
-    });
-
-    uploader.bind('progressall', function (event, progress) {
+    };
+    // --------------------
+    uploader.onProgressAll = function(progress) {
       console.info('Total progress: ' + progress);
-    });
-
-    uploader.bind('completeall', function (event, items) {
-      console.info('Complete all', items);
-    });
-
+    };
+    // --------------------
+    uploader.onSuccessItem = function(item, response, status, headers) {
+      console.info('Success', response, status, headers);
+      $scope.$broadcast('uploadCompleted', item);
+    };
+    // --------------------
+    uploader.onErrorItem = function(item, response, status, headers) {
+      console.info('Error', response, status, headers);
+    };
+    // --------------------
+    uploader.onCancelItem = function(item, response, status, headers) {
+      console.info('Cancel', response, status);
+    };
+    // --------------------
+    uploader.onCompleteItem = function(item, response, status, headers) {
+      console.info('Complete', response, status, headers);
+    };
+    // --------------------
+    uploader.onCompleteAll = function() {
+      console.info('Complete all');
+    };
+    // --------------------
   }
 ).controller('FilesController', function ($scope, $http) {
 

example-2.0/client/index.html

@@ -12,8 +12,8 @@
     <script src="//netdna.bootstrapcdn.com/bootstrap/3.0.0/js/bootstrap.min.js"></script>
 
     <!--<script src="../bower_components/angular/angular.js"></script>-->
-    <script src="http://code.angularjs.org/1.2.9/angular.min.js"></script>
-    <script src="angular-file-upload.js"></script>
+    <script src="http://code.angularjs.org/1.4.4/angular.min.js"></script>
+    <script src="angular-file-upload.min.js"></script>
     <script src="controllers.js"></script>
 
     <style>
@@ -21,7 +21,7 @@
             border: dotted 3px lightgray;
         }
 
-        .ng-file-over {
+        .nv-file-over {
             border: dotted 3px red;
         }
 
@@ -37,8 +37,8 @@
 
 </head>
 
-<!-- 1. ng-file-drop | ng-file-drop="options" -->
-<body ng-controller="TestController" ng-file-drop>
+<!-- 1. nv-file-drop | nv-file-drop="options" -->
+<body ng-controller="TestController" nv-file-drop uploader="uploader">
 
 <div class="container">
 
@@ -50,31 +50,34 @@
         </div>
     </div>
 
-    <div class="row">
+
+<div class="row">
 
         <div class="col-md-3">
 
+        <img ng-src="{{image}}"> </img>
+
             <h3>Select files</h3>
 
             <div ng-show="uploader.isHTML5">
-                <!-- 3. ng-file-over | ng-file-over="className" -->
-                <div class="well my-drop-zone" ng-file-over>
+                <!-- 3. nv-file-over | nv-file-over="className" -->
+                <div class="well my-drop-zone" nv-file-over uploader="uploader">
                     Base drop zone
                 </div>
 
-                <!-- Example: ng-file-drop | ng-file-drop="options" -->
-                <div class="well my-drop-zone" ng-file-drop="{ url: '/foo' }"
-                     ng-file-over="another-file-over-class">
+                <!-- Example: nv-file-drop | nv-file-drop="options" -->
+                <div class="well my-drop-zone" nv-file-drop="{ url: '/foo' } "
+                     nv-file-over="another-file-over-class" uploader="uploader">
                     Another drop zone with its own settings
                 </div>
             </div>
 
-            <!-- 2. ng-file-select | ng-file-select="options" -->
+            <!-- 2. nv-file-select | nv-file-select="options" -->
             Multiple
-            <input ng-file-select type="file" multiple/><br/>
+            <input nv-file-select uploader="uploader" type="file" multiple/><br/>
 
             Single
-            <input ng-file-select type="file"/>
+            <input nv-file-select uploader="uploader" type="file"/>
         </div>
 
         <div class="col-md-9" style="margin-bottom: 40px">
@@ -196,6 +199,9 @@
 
     </div>
 
+
+</div>
+
 </div>
 
 </body>