Commit | Line | Data |
---|---|---|
02dd48b0 TO |
1 | (function(angular, $, _) { |
2 | ||
3 | // example: <div crm-mailing-ab-slider ng-model="abtest.ab.group_percentage"></div> | |
4 | angular.module('crmMailingAB').directive('crmMailingAbSlider', function() { | |
5 | return { | |
6 | require: '?ngModel', | |
7 | scope: {}, | |
8 | templateUrl: '~/crmMailingAB/Slider.html', | |
9 | link: function(scope, element, attrs, ngModel) { | |
10 | var TEST_MIN = 1, TEST_MAX = 50; | |
11 | var sliders = $('.slider-test,.slider-win', element); | |
12 | var sliderTests = $('.slider-test', element); | |
13 | var sliderWin = $('.slider-win', element); | |
14 | ||
15 | scope.ts = CRM.ts(null); | |
16 | scope.testValue = 0; | |
17 | scope.winValue = 100; | |
18 | ||
19 | // set the base value (following a GUI event) | |
20 | function setValue(value) { | |
21 | value = Math.min(TEST_MAX, Math.max(TEST_MIN, value)); | |
22 | scope.$apply(function() { | |
23 | ngModel.$setViewValue(value); | |
24 | scope.testValue = value; | |
25 | scope.winValue = 100 - (2 * scope.testValue); | |
26 | sliderTests.slider('value', scope.testValue); | |
27 | sliderWin.slider('value', scope.winValue); | |
28 | }); | |
29 | } | |
30 | ||
31 | sliders.slider({ | |
32 | min: 0, | |
33 | max: 100, | |
34 | range: 'min', | |
35 | step: 1 | |
36 | }); | |
37 | sliderTests.slider({ | |
38 | slide: function slideTest(event, ui) { | |
39 | event.preventDefault(); | |
40 | setValue(ui.value); | |
41 | } | |
42 | }); | |
43 | sliderWin.slider({ | |
44 | slide: function slideWinner(event, ui) { | |
45 | event.preventDefault(); | |
46 | setValue(Math.round((100 - ui.value) / 2)); | |
47 | } | |
48 | }); | |
49 | ||
50 | ngModel.$render = function() { | |
51 | scope.testValue = ngModel.$viewValue; | |
52 | scope.winValue = 100 - (2 * scope.testValue); | |
53 | sliderTests.slider('value', scope.testValue); | |
54 | sliderWin.slider('value', scope.winValue); | |
55 | }; | |
56 | } | |
57 | }; | |
58 | }); | |
59 | ||
60 | })(angular, CRM.$, CRM._); |