fix #47

jquery was still present for function detection and browser to finish
later

bower.json

@@ -1,6 +1,6 @@
 {
   "name": "ng-slider",
-  "version": "2.0.7",
+  "version": "2.0.8",
   "author": {
     "name": "Julien Valéry",
     "email": "[email protected]"

package.json

@@ -1,7 +1,7 @@
 {
   "name": "ng-slider",
   "description": "AngularJS directive slider control.",
-  "version": "2.0.7",
+  "version": "2.0.8",
   "author": {
     "name": "Julien Valéry",
     "email": "[email protected]"

src/core/model/draggable.factory.js

@@ -153,19 +153,24 @@
       if( this.is.drag ){
         this.is.drag = false;
 
+        var browser = utils.browser();
+
         if( this.outer && this.outer.get(0) ) {
 
-          if( $.browser.mozilla ){
+          if( browser === 'mozilla' ){
             this.outer.css({ overflow: "hidden" });
           } else {
             this.outer.css({ overflow: "visible" });
           }
 
-          if( $.browser.msie && $.browser.version == '6.0' ){
-            this.outer.css({ height: "100%" });
-          } else {
-            this.outer.css({ height: "auto" });
-          }
+          // TODO finish browser detection and this case, remove following line
+          this.outer.css({ height: "auto" });
+          // if( browser === 'ie' && $.browser.version == '6.0' ){
+          //   this.outer.css({ height: "100%" });
+          // } else {
+          //   this.outer.css({ height: "auto" });
+          // }
+
         }
 
         this.onmouseup( evt );

src/core/model/slider.factory.js

@@ -16,10 +16,10 @@
 
       this.settings.interval = this.settings.to-this.settings.from;
 
-      if( this.settings.calculate && $.isFunction( this.settings.calculate ) )
+      if( this.settings.calculate && angular.isFunction( this.settings.calculate ) )
         this.nice = this.settings.calculate;
 
-      if( this.settings.onstatechange && $.isFunction( this.settings.onstatechange ) )
+      if( this.settings.onstatechange && angular.isFunction( this.settings.onstatechange ) )
         this.onstatechange = this.settings.onstatechange;
 
       this.is = { init: false };

src/core/utils/utils.factory.js

@@ -1,7 +1,7 @@
 (function(angular){
   'use strict';
 
-  angular.module('ngSlider').factory('utils', function() {
+  angular.module('ngSlider').factory('utils', ['$window', function(win) {
     return {
       offset: function(elm) { 
         // try {return elm.offset();} catch(e) {} 
@@ -14,9 +14,20 @@
         _x = rawDom.getBoundingClientRect().left + scrollX; 
         _y = rawDom.getBoundingClientRect().top + scrollY; 
         return { left: _x, top:_y };
+      },
+      browser: function() {
+        // TODO finish browser detection and this case
+        var userAgent = win.navigator.userAgent;        
+        var browsers = {mozilla: /mozilla/i, chrome: /chrome/i, safari: /safari/i, firefox: /firefox/i, ie: /internet explorer/i};
+        for(var key in browsers) {
+          if (browsers[key].test(userAgent)) {
+            return key;
+          }
+        }
+        return 'unknown';
       }
     };
-  });
+  }]);  
 })(angular);
 
 

src/ng-slider.html

@@ -40,6 +40,15 @@
 		</div>
 		</br>
 		</br>
+		<div>
+		<input ng-model="data.quote.coverages.coverageA"  type="text" id="{{id}}" slider options="coverageASliderOptions" ng-disabled="disabled" />
+		</br>
+		</br>
+		<div>
+			Current value is: {{data.quote.coverages.coverageA}}
+		</div>
+		</br>
+		</br>
 		<div>	
 			<input ng-model="value2"  type="text" id="mySlider3" slider options="options" />		
 		</div>
@@ -75,6 +84,24 @@
 			$scope.value4 = "999;1700";			 
 			$scope.value5 = 20;
 			$scope.value6 = "10;53";
+		    $scope.data = {
+		        quote: {
+		            coverages: {
+		                coverageA: 20000
+		            }
+		        }
+		    };
+
+	        $scope.defaultAmount=190000;
+
+			$scope.coverageASliderOptions = {
+				from: $scope.defaultAmount,
+				to: $scope.defaultAmount+ ($scope.defaultAmount* 0.20),
+				step: 500,
+				calculate: function(value) {
+					return $filter('currency')(value, '$', 0);
+				}
+			};
 
 			$scope.disable = function() {
 				$scope.disabled = !$scope.disabled;