Line | |
---|
1 | angular.module('ui.knob', []).directive('knob', ['$timeout', function ($timeout) {
|
---|
2 | 'use strict';
|
---|
3 |
|
---|
4 | return {
|
---|
5 | restrict: 'EA',
|
---|
6 | replace: true,
|
---|
7 | template: '<input value="{{ knobData }}"/>',
|
---|
8 | scope: {
|
---|
9 | knobData: '=',
|
---|
10 | knobOptions: '&'
|
---|
11 | },
|
---|
12 | link: function ($scope, $element) {
|
---|
13 | var knobInit = $scope.knobOptions() || {};
|
---|
14 |
|
---|
15 | knobInit.release = function (newValue) {
|
---|
16 | $timeout(function () {
|
---|
17 | $scope.knobData = newValue;
|
---|
18 | $scope.$apply();
|
---|
19 | });
|
---|
20 | };
|
---|
21 |
|
---|
22 | $scope.IsAnimating = false;
|
---|
23 | $scope.$watch('knobData', function (newValue, oldValue) {
|
---|
24 | if (newValue != oldValue && $scope.IsAnimating == false) {
|
---|
25 | $scope.IsAnimating = true;
|
---|
26 | $($element).val(oldValue);
|
---|
27 | $($element).animate({
|
---|
28 | value: parseInt(newValue)
|
---|
29 | }, {
|
---|
30 | duration: 500,
|
---|
31 | easing: 'swing',
|
---|
32 | progress: function () {
|
---|
33 | $(this).val(Math.round(this.value)).change();
|
---|
34 | },
|
---|
35 | complete: function () {
|
---|
36 | $scope.IsAnimating = false;
|
---|
37 | }
|
---|
38 | });
|
---|
39 | }
|
---|
40 | });
|
---|
41 |
|
---|
42 | $($element).val($scope.knobData).knob(knobInit);
|
---|
43 | }
|
---|
44 | };
|
---|
45 | }]); |
---|
Note: See
TracBrowser
for help on using the repository browser.