Watch for ceil and floor changes, fix for slider in tabs, tabs.html example

dist/rzslider.min.css

-/*! angularjs-slider - v0.1.2 - (c) Rafal Zajac <rzajac@gmail.com>, https://github.com/rzajac/angularjs-slider.git - 2013-12-16 */
+/*! angularjs-slider - v0.1.2 - (c) Rafal Zajac <rzajac@gmail.com>, https://github.com/rzajac/angularjs-slider.git - 2014-02-07 */
 rzslider{position:relative;display:inline-block;width:100%;height:2px;margin:30px 0 15px 0;vertical-align:middle}rzslider span{position:absolute;display:inline-block;white-space:nowrap}rzslider span.base{width:100%;height:100%;padding:0}rzslider span.bar{z-index:0;width:100%;height:100%;background:#fff}rzslider span.bar.selection{z-index:1;width:0;background:#67b700}rzslider span.pointer{top:-15px;z-index:2;width:32px;height:32px;cursor:pointer;background-color:#fff;-webkit-border-radius:16px;-moz-border-radius:16px;border-radius:16px}rzslider span.pointer:after{position:absolute;top:12px;left:12px;width:8px;height:8px;background:#71818e;-webkit-border-radius:4px;-moz-border-radius:4px;border-radius:4px;content:''}rzslider span.pointer:hover:after{background-color:#67b700}rzslider span.pointer.active:after{background-color:#67b700}rzslider span.bubble{top:-32px;padding:1px 3px 1px 3px;color:#67b700;cursor:default}rzslider span.bubble.selection{top:15px}rzslider span.bubble.limit{color:#67b700}
\ No newline at end of file

rzslider.js

@@ -4,7 +4,7 @@
  * (c) Rafal Zajac <rzajac@gmail.com>
  * http://github.com/rzajac/angularjs-slider
  *
- * Version: v0.1.2
+ * Version: v0.1.3
  *
  * Licensed under the MIT license
  */
@@ -215,10 +215,10 @@ function throttle(func, wait, options) {
       });
 
       // Recalculate slider view dimensions
-      this.scope.$on('reCalcViewDimensions', angular.bind(this, this.resetSlider));
+      this.scope.$on('reCalcViewDimensions', angular.bind(this, this.calcViewDimensions));
 
       // Recalculate stuff if view port dimensions have changed
-      angular.element(window).on('resize', angular.bind(this, this.resetSlider));
+      angular.element(window).on('resize', angular.bind(this, this.calcViewDimensions));
 
       this.initRun = true;
 
@@ -245,6 +245,16 @@ function throttle(func, wait, options) {
         self.updateCmbLabel();
       }, 350, { leading: false });
 
+      this.scope.$on('rzSliderForceRender', function()
+      {
+        self.resetLabelsValue();
+        thrLow();
+        thrHigh();
+        self.resetSlider();
+      });
+
+      // Watchers
+
       this.scope.$watch('rzSliderModel', function(newValue, oldValue)
       {
         if(newValue === oldValue) return;
@@ -257,37 +267,42 @@ function throttle(func, wait, options) {
         thrHigh();
       });
 
-
-      this.scope.$watch('rzSliderFloor', function(newValue, oldValue){
+      this.scope.$watch('rzSliderFloor', function(newValue, oldValue)
+      {
         if(newValue === oldValue) return;
         self.resetSlider();
       });
 
-      this.scope.$watch('rzSliderCeil', function(newValue, oldValue){
+      this.scope.$watch('rzSliderCeil', function(newValue, oldValue)
+      {
         if(newValue === oldValue) return;
         self.resetSlider();
       });
-
-      this.scope.$watch('rzSliderForceRender', function(newValue, oldValue){
-        self.resetLabelsWidth();
-        thrLow();
-        thrHigh();
-        self.resetSlider();
-      });
-
     },
 
-    resetSlider: function() {
+    /**
+     * Resets slider
+     *
+     * @returns {undefined}
+     */
+    resetSlider: function()
+    {
       this.setMinAndMax();
       this.calcViewDimensions();
       this.updateCeilLab();
       this.updateFloorLab();
     },
 
-     resetLabelsWidth: function() {
+    /**
+     * Reset label values
+     *
+     * @return {undefined}
+     */
+    resetLabelsValue: function()
+    {
       this.minLab.rzsv = undefined;
       this.maxLab.rzsv = undefined;
-     },
+    },
 
     /**
      * Initialize slider handles positions and labels
@@ -313,7 +328,7 @@ function throttle(func, wait, options) {
      *
      * @param {number|string} value
      * @param {jqLite} label
-     * @param {bool} useCustomTr
+     * @param {bool?} useCustomTr
      * @returns {undefined}
      */
     translateFn: function(value, label, useCustomTr)