140 lines
5.1 KiB
JavaScript
140 lines
5.1 KiB
JavaScript
(function () {
|
|
'use strict';
|
|
|
|
angular.module('ariaNg').directive('ngSetting', ['$timeout', 'ariaNgConstants', function ($timeout, ariaNgConstants) {
|
|
return {
|
|
restrict: 'E',
|
|
templateUrl: 'views/setting.html',
|
|
require: '?ngModel',
|
|
replace: true,
|
|
scope: {
|
|
option: '=',
|
|
ngModel: '=',
|
|
placeholder: '=?',
|
|
onChangeValue: '&'
|
|
},
|
|
link: function (scope, element, attrs, ngModel) {
|
|
var pendingSaveRequest = null;
|
|
var options = {
|
|
lazySaveTimeout: ariaNgConstants.lazySaveTimeout
|
|
};
|
|
|
|
angular.extend(options, attrs);
|
|
|
|
scope.optionStatus = (function () {
|
|
var value = 'ready';
|
|
|
|
return {
|
|
getValue: function () {
|
|
return value;
|
|
},
|
|
setReady: function () {
|
|
value = 'ready';
|
|
},
|
|
setPending: function () {
|
|
value = 'pending';
|
|
},
|
|
setSaving: function () {
|
|
value = 'pending';
|
|
},
|
|
setSuccess: function () {
|
|
value = 'success';
|
|
},
|
|
setFailed: function () {
|
|
value = 'failed';
|
|
},
|
|
setError: function () {
|
|
value = 'error';
|
|
},
|
|
getStatusFeedbackStyle: function () {
|
|
if (value == 'success') {
|
|
return 'has-success';
|
|
} else if (value == 'failed') {
|
|
return 'has-warning';
|
|
} else if (value == 'error') {
|
|
return 'has-error';
|
|
} else {
|
|
return '';
|
|
}
|
|
},
|
|
getStatusIcon: function () {
|
|
if (value == 'pending') {
|
|
return 'fa-hourglass-start';
|
|
} else if (value == 'saving') {
|
|
return 'fa-spin fa-pulse fa-spinner';
|
|
} else if (value == 'success') {
|
|
return 'fa-check';
|
|
} else if (value == 'failed') {
|
|
return 'fa-exclamation';
|
|
} else if (value == 'error') {
|
|
return 'fa-times';
|
|
} else {
|
|
return '';
|
|
}
|
|
},
|
|
isShowStatusIcon: function () {
|
|
return this.getStatusIcon() != '';
|
|
}
|
|
};
|
|
})();
|
|
|
|
scope.getTotalCount = function () {
|
|
if (!scope.optionValue && !angular.isString(scope.optionValue)) {
|
|
return 0;
|
|
}
|
|
|
|
return scope.optionValue.split(scope.option.split).length;
|
|
};
|
|
|
|
scope.changeValue = function (optionValue, lazySave) {
|
|
scope.optionValue = optionValue;
|
|
scope.optionStatus.setReady();
|
|
|
|
if (!scope.option || !scope.option.key || scope.option.readonly) {
|
|
return;
|
|
}
|
|
|
|
var data = {
|
|
key: scope.option.key,
|
|
value: optionValue,
|
|
optionStatus: scope.optionStatus
|
|
};
|
|
|
|
if (pendingSaveRequest) {
|
|
$timeout.cancel(pendingSaveRequest);
|
|
}
|
|
|
|
var invokeChange = function () {
|
|
scope.optionStatus.setSaving();
|
|
scope.onChangeValue(data);
|
|
};
|
|
|
|
if (scope.onChangeValue) {
|
|
if (lazySave) {
|
|
scope.optionStatus.setPending();
|
|
|
|
pendingSaveRequest = $timeout(function () {
|
|
invokeChange();
|
|
}, options.lazySaveTimeout);
|
|
} else {
|
|
invokeChange();
|
|
}
|
|
}
|
|
};
|
|
|
|
if (ngModel) {
|
|
scope.$watch(function () {
|
|
return ngModel.$viewValue;
|
|
}, function (value) {
|
|
scope.optionValue = value;
|
|
});
|
|
}
|
|
|
|
scope.$watch('option', function () {
|
|
element.find('[data-toggle="popover"]').popover();
|
|
});
|
|
}
|
|
};
|
|
}]);
|
|
})();
|