jinql
/
blur-admin
mirror of https://github.com/akveo/blur-admin
1
0
Fork 0
Code Issues Releases Wiki Activity

refactor(sliders): draw template for slider before they created

pull/3/head
alex 2016-02-18 17:13:32 +03:00
parent 23d1277bb0
commit 9c34dc5b0c
3 changed files with 45 additions and 41 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

32
src/app/pages/ui/slider/slider.html
View File

@ -1,7 +1,7 @@
<div class="row">
<div class="col-md-12">
<div ba-panel ba-panel-title="Ion Range Slider" ba-panel-class="with-scroll">
<div>
<div class="slider-box">
<h5>Basic</h5>
<ion-slider type="single"
grid="false"
@ -9,10 +9,10 @@
max="100"
from="45"
disable="false"
timeout="2010">
timeout="150">
</ion-slider>
</div>
<div>
<div class="slider-box">
<h5>With prefix</h5>
<ion-slider type="single"
grid="true"
@ -21,10 +21,10 @@
prefix="$"
from="420"
disable="false"
timeout="2010">
timeout="150">
</ion-slider>
</div>
<div>
<div class="slider-box">
<h5>With postfix</h5>
<ion-slider type="single"
grid="true"
@ -33,10 +33,10 @@
postfix="°"
from="36"
disable="false"
timeout="2010">
timeout="150">
</ion-slider>
</div>
<div>
<div class="slider-box">
<h5>Two way range</h5>
<ion-slider type="double"
grid="true"
@ -45,10 +45,10 @@
from="420"
to="900"
disable="false"
timeout="2010">
timeout="150">
</ion-slider>
</div>
<div>
<div class="slider-box">
<h5>With Steps</h5>
<ion-slider type="single"
grid="true"
@ -57,10 +57,10 @@
from="300"
step="50"
disable="false"
timeout="2010">
timeout="150">
</ion-slider>
</div>
<div>
<div class="slider-box">
<h5>Decorating numbers</h5>
<ion-slider type="single"
grid="true"
@ -71,10 +71,10 @@
prettify-separator="."
prettify="true"
disable="false"
timeout="2010">
timeout="150">
</ion-slider>
</div>
<div>
<div class="slider-box">
<h5>Using custom values array</h5>
<ion-slider type="single"
grid="true"
@ -85,10 +85,10 @@
'July', 'August', 'September',
'October', 'November', 'December']"
disable="false"
timeout="2010">
timeout="150">
</ion-slider>
</div>
<div>
<div class="slider-box">
<h5>Disabled</h5>
<ion-slider type="single"
grid="false"
@ -96,7 +96,7 @@
max="100"
from="45"
disable="true"
timeout="2010">
timeout="150">
</ion-slider>
</div>
</div>

51
src/app/theme/directives/ionSlider.js
View File

@ -61,33 +61,34 @@
onFinish: $scope.onFinish,
values: $scope.values
});
$scope.$watch('min', function (value) {
$timeout(function () {
$element.data("ionRangeSlider").update({min: value});
});
}, true);
$scope.$watch('max', function (value) {
$timeout(function () {
$element.data("ionRangeSlider").update({max: value});
});
});
$scope.$watch('from', function (value) {
$timeout(function () {
$element.data("ionRangeSlider").update({from: value});
});
});
$scope.$watch('to', function (value) {
$timeout(function () {
$element.data("ionRangeSlider").update({to: value});
});
});
$scope.$watch('disable', function (value) {
$timeout(function () {
$element.data("ionRangeSlider").update({disable: value});
});
});
}, timeout);
})();
$scope.$watch('min', function (value) {
$timeout(function () {
$element.data("ionRangeSlider").update({min: value});
});
}, true);
$scope.$watch('max', function (value) {
$timeout(function () {
$element.data("ionRangeSlider").update({max: value});
});
});
$scope.$watch('from', function (value) {
$timeout(function () {
$element.data("ionRangeSlider").update({from: value});
});
});
$scope.$watch('to', function (value) {
$timeout(function () {
$element.data("ionRangeSlider").update({to: value});
});
});
$scope.$watch('disable', function (value) {
$timeout(function () {
$element.data("ionRangeSlider").update({disable: value});
});
});
}
};
}

3
src/sass/app/_slider.scss Normal file
View File

@ -0,0 +1,3 @@
.slider-box{
min-height: 86px;
}