This repository was archived by the owner on Jun 5, 2025. It is now read-only.
forked from sebastianha/angular-bootstrap-checkbox
-
Notifications
You must be signed in to change notification settings - Fork 1
Expand file tree
/
Copy pathangular-bootstrap-checkbox.js
More file actions
92 lines (85 loc) · 3.2 KB
/
angular-bootstrap-checkbox.js
File metadata and controls
92 lines (85 loc) · 3.2 KB
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
"use strict";
angular.module("ui.checkbox", []).directive("checkbox", function() {
return {
scope: {
triState: '='
},
require: "ngModel",
restrict: "E",
replace: "true",
template: "<button type=\"button\" ng-style=\"stylebtn\" class=\"btn btn-default\" ng-class=\"{'btn-xxs btn-checkbox': size==='default', 'btn-sm': size==='large', 'btn-lg': size==='largest'}\">" +
"<span class=\"glyphicon btn-checkbox-icon\" ng-class=\"{'glyphicon-ok': checked===true, 'glyphicon-minus': checked===0}\"></span>" +
"</button>",
link: function(scope, elem, attrs, modelCtrl) {
// Default state
scope.checked = false;
scope.size = "default";
// Default Button Styling
scope.stylebtn = {};
// Default Checkmark Styling
scope.styleicon = {};
// If size is undefined, Checkbox has normal size (Bootstrap 'xs')
if(attrs.large !== undefined) {
scope.size = "large";
/*scope.stylebtn = {"padding-top": "2px", "padding-bottom": "2px", "height": "30px"};
scope.styleicon = {"width": "8px", "left": "-5px", "font-size": "17px"};*/
}
if(attrs.larger !== undefined) {
scope.size = "larger";
/*scope.stylebtn = {"padding-top": "2px", "padding-bottom": "2px", "height": "34px"};
scope.styleicon = {"width": "8px", "left": "-8px", "font-size": "22px"};*/
}
if(attrs.largest !== undefined) {
scope.size = "largest";
/*scope.stylebtn = {"padding-top": "2px", "padding-bottom": "2px", "height": "45px"};
scope.styleicon = {"width": "11px", "left": "-11px", "font-size": "30px"};*/
}
var trueValue = true;
var falseValue = false;
var triState = {'false': 0, '0': true, 'true': false};
// If defined set true value
if(attrs.ngTrueValue !== undefined) {
trueValue = attrs.ngTrueValue;
}
// If defined set false value
if(attrs.ngFalseValue !== undefined) {
falseValue = attrs.ngFalseValue;
}
// Check if name attribute is set and if so add it to the DOM element
if(scope.name !== undefined) {
elem.name = scope.name;
}
// Update element when model changes
scope.$watch(function() {
if (!scope.triState) {
if(modelCtrl.$modelValue === trueValue || modelCtrl.$modelValue === true) {
modelCtrl.$setViewValue(trueValue);
} else {
modelCtrl.$setViewValue(falseValue);
}
}
return modelCtrl.$modelValue;
}, function() {
//scope.checked = modelCtrl.$modelValue === trueValue;
scope.checked = modelCtrl.$modelValue;
}, true);
// On click swap value and trigger onChange function
elem.bind("click", function() {
if (!_.isUndefined(attrs.preventClick)) {
return;
}
scope.$apply(function() {
if (scope.triState) {
modelCtrl.$setViewValue(triState[''+modelCtrl.$modelValue]);
} else {
if(modelCtrl.$modelValue === falseValue) {
modelCtrl.$setViewValue(trueValue);
} else {
modelCtrl.$setViewValue(falseValue);
}
}
});
});
}
};
});