simplify controller + only show text when near limit + different text when exceeding limit

This commit is contained in:
Niels Lyngsø
2019-03-25 13:43:03 +01:00
parent 15d5c67cd3
commit 0cc6e51b7a
7 changed files with 31 additions and 57 deletions

View File

@@ -13,25 +13,11 @@ function textAreaController($scope) {
$scope.model.maxlength = false;
if ($scope.model.config && $scope.model.config.maxChars) {
$scope.model.maxlength = true;
if($scope.model.value == undefined) {
$scope.model.count = ($scope.model.config.maxChars * 1);
} else {
$scope.model.count = ($scope.model.config.maxChars * 1) - $scope.model.value.length;
}
}
$scope.model.change = function() {
if ($scope.model.config && $scope.model.config.maxChars) {
if($scope.model.value == undefined) {
$scope.model.count = ($scope.model.config.maxChars * 1);
} else {
$scope.model.count = ($scope.model.config.maxChars * 1) - $scope.model.value.length;
}
if($scope.model.count < 0) {
$scope.model.value = $scope.model.value.substring(0, ($scope.model.config.maxChars * 1));
$scope.model.count = 0;
}
}
$scope.model.change = function () {
$scope.model.count = $scope.model.value.length;
}
$scope.model.change();
}
angular.module('umbraco').controller("Umbraco.PropertyEditors.textAreaController", textAreaController);
angular.module('umbraco').controller("Umbraco.PropertyEditors.textAreaController", textAreaController);

View File

@@ -7,9 +7,12 @@
<span class="help-inline" ng-message="valServer">{{textareaFieldForm.textarea.errorMsg}}</span>
</span>
<div class="help" ng-if="model.maxlength">
<strong>{{model.count}}</strong>
<localize key="textbox_characters_left">characters left</localize>
<div class="help" ng-if="model.maxlength === true && model.count >= (model.config.maxChars*.8) && model.count <= model.config.maxChars">
<localize key="textbox_characters_left" tokens="[model.count, model.config.maxChars]">characters left</localize>
</div>
<div class="help text-error" ng-if="model.maxlength === true && model.count > model.config.maxChars">
<localize key="textbox_characters_exceed" tokens="[model.count, model.config.maxChars]">Maximum {0} characters ({1} too many)</localize>
</div>
</ng-form>
</div>

View File

@@ -4,39 +4,18 @@ function textboxController($scope) {
if (!$scope.model.config) {
$scope.model.config = {};
}
$scope.model.maxlength = false;
if ($scope.model.config && $scope.model.config.maxChars) {
$scope.model.maxlength = true;
}
if (!$scope.model.config.maxChars) {
// 500 is the maximum number that can be stored
// in the database, so set it to the max, even
// if no max is specified in the config
$scope.model.config.maxChars = 500;
}
if ($scope.model.maxlength) {
if ($scope.model.value === undefined) {
$scope.model.count = ($scope.model.config.maxChars * 1);
} else {
$scope.model.count = ($scope.model.config.maxChars * 1) - $scope.model.value.length;
}
}
$scope.model.change = function () {
if ($scope.model.config && $scope.model.config.maxChars) {
if ($scope.model.value === undefined) {
$scope.model.count = ($scope.model.config.maxChars * 1);
} else {
$scope.model.count = ($scope.model.config.maxChars * 1) - $scope.model.value.length;
}
if ($scope.model.count < 0) {
$scope.model.value = $scope.model.value.substring(0, ($scope.model.config.maxChars * 1));
$scope.model.count = 0;
}
}
$scope.model.count = $scope.model.value.length;
}
$scope.model.change();
}
angular.module('umbraco').controller("Umbraco.PropertyEditors.textboxController", textboxController);

View File

@@ -12,9 +12,12 @@
<span class="help-inline" ng-message="required"><localize key="general_required">Required</localize></span>
</span>
<div class="help" ng-if="model.maxlength">
<strong>{{model.count}}</strong>
<localize key="textbox_characters_left">characters left</localize>
<div class="help" ng-if="model.count >= (model.config.maxChars*.8) && model.count <= model.config.maxChars">
<localize key="textbox_characters_left" tokens="[model.count, model.config.maxChars]">characters left</localize>
</div>
<div class="help text-error" ng-if="model.count > model.config.maxChars">
<localize key="textbox_characters_exceed" tokens="[model.count, model.config.maxChars]">Maximum {0} characters ({1} too many)</localize>
</div>
</ng-form>
</div>