feat(UX): replace tables with datatables (#1460)

app/directives/ui/slider/slider.html

@@ -0,0 +1,3 @@
+<div>
+  <rzslider rz-slider-options="$ctrl.options" rz-slider-model="$ctrl.model"></rzslider>
+</div>

app/directives/ui/slider/slider.js

@@ -0,0 +1,12 @@
+angular.module('ui').component('slider', {
+  templateUrl: 'app/directives/ui/slider/slider.html',
+  controller: 'SliderController',
+  bindings: {
+    model: '=',
+    onChange: '&',
+    floor: '<',
+    ceil: '<',
+    step: '<',
+    precision: '<'
+  }
+});

app/directives/ui/slider/sliderController.js

@@ -0,0 +1,22 @@
+angular.module('ui')
+.controller('SliderController', function () {
+  var ctrl = this;
+
+  ctrl.options = {
+    floor: ctrl.floor,
+    ceil: ctrl.ceil,
+    step: ctrl.step,
+    precision: ctrl.precision,
+    showSelectionBar: true,
+    enforceStep: false,
+    translate: function(value, sliderId, label) {
+      if (label === 'floor' || value === 0) {
+        return 'unlimited';
+      }
+      return value;
+    },
+    onChange: function() {
+      ctrl.onChange();
+    }
+  };
+});