Skip to content

Commit

Permalink
Merge pull request #8064 from umbraco/v8/bugfix/7964-fix-validation-i…
Browse files Browse the repository at this point in the history 
…ndication-in-variant-picker

UI: Corrected validation indication in variant-picker
  • Loading branch information
Warren Buckley authored May 5, 2020
2 parents 3e65d21 + d761658 commit a2fe48d
Show file tree
Hide file tree
Showing 3 changed files with 38 additions and 23 deletions.
50 changes: 31 additions & 19 deletions ...Web.UI.Client/src/common/directives/components/editor/umbeditorcontentheader.directive.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -47,17 +47,37 @@
scope.vm.defaultVariant = null;
scope.vm.errorsOnOtherVariants = false;// indicating wether to show that other variants, than the current, have errors.

function updateVaraintErrors() {
scope.content.variants.forEach( function (variant) {
variant.hasError = scope.variantHasError(variant);

});
checkErrorsOnOtherVariants();
}

function checkErrorsOnOtherVariants() {
var check = false;
scope.content.variants.forEach( function (variant) {
if (variant.active !== true && scope.variantHasError(variant)) {
if (variant.active !== true && variant.hasError) {
check = true;
}
});
scope.vm.errorsOnOtherVariants = check;
}

function onVariantValidation(valid, errors, allErrors, culture, segment) {

// only want to react to property errors:
if(errors.findIndex(error => {return error.propertyAlias !== null;}) === -1) {
// we dont have any errors for properties, meaning we will back out.
return;
}

// If error coming back is invariant, we will assign the error to the default variant by picking the defaultVariant language.
if(culture === "invariant") {
culture = scope.vm.defaultVariant.language.culture;
}

var index = scope.vm.variantsWithError.findIndex((item) => item.culture === culture && item.segment === segment)
if(valid === true) {
if (index !== -1) {
Expand All @@ -68,7 +88,7 @@
scope.vm.variantsWithError.push({"culture": culture, "segment": segment});
}
}
checkErrorsOnOtherVariants();
scope.$evalAsync(updateVaraintErrors);
}

function onInit() {
Expand All @@ -88,8 +108,8 @@

scope.vm.hasVariants = (scope.vm.hasCulture || scope.vm.hasSegments);
scope.vm.hasSubVariants = (scope.vm.hasCulture && scope.vm.hasSegments);
checkErrorsOnOtherVariants();

updateVaraintErrors();

scope.vm.variantMenu = [];
if (scope.vm.hasCulture) {
Expand All @@ -112,22 +132,22 @@
});
});
}



scope.editor.variantApps.forEach( (app) => {
if (app.alias === "umbContent") {
app.anchors = scope.editor.content.tabs;
}
});

scope.content.variants.forEach( function (variant) {

// if we are looking for the variant with default language then we also want to check for invariant variant.
if (variant.language && variant.language.culture === scope.vm.defaultVariant.language.culture && variant.segment === null) {
unsubscribe.push(serverValidationManager.subscribe(null, "invariant", null, onVariantValidation, null));
}
unsubscribe.push(serverValidationManager.subscribe(null, variant.language !== null ? variant.language.culture : null, null, onVariantValidation, variant.segment));
});

unsubscribe.push(serverValidationManager.subscribe(null, null, null, onVariantValidation, null));



}

scope.goBack = function () {
Expand Down Expand Up @@ -174,14 +194,6 @@
* @param {any} culture
*/
scope.variantHasError = function(variant) {
if(variant.language) {
// if we are looking for the variant with default language then we also want to check for invariant variant.
if (variant.language.culture === scope.vm.defaultVariant.language.culture && variant.segment === null) {
if(scope.vm.variantsWithError.find((item) => item.culture === "invariant" && item.segment === null) !== undefined) {
return true;
}
}
}
if(scope.vm.variantsWithError.find((item) => (!variant.language || item.culture === variant.language.culture) && item.segment === variant.segment) !== undefined) {
return true;
}
Expand Down
7 changes: 5 additions & 2 deletions src/Umbraco.Web.UI.Client/src/common/services/servervalidationmgr.service.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -356,7 +356,7 @@ function serverValidationManager($timeout) {
var cbs = this.getFieldCallbacks(fieldName);
//call each callback for this error
for (var cb in cbs) {
executeCallback(this, errorsForCallback, cbs[cb].callback, null);
executeCallback(this, errorsForCallback, cbs[cb].callback, null, null);
}
},

Expand Down Expand Up @@ -456,7 +456,10 @@ function serverValidationManager($timeout) {
callbacks[cb].callback.apply(this, [
true, //pass in a value indicating it is VALID
[], //pass in empty collection
[]]); //pass in empty collection
[],
null,
null]
);
}
},

Expand Down
4 changes: 2 additions & 2 deletions src/Umbraco.Web.UI.Client/src/views/components/editor/umb-editor-content-header.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -53,7 +53,7 @@
<umb-dropdown-item
ng-repeat-start="entry in vm.variantMenu track by entry.key"
class="umb-variant-switcher__item"
ng-class="{'--current': entry.variant === editor.content, '--active': entry.variant.active && vm.dropdownOpen, '--error': variantHasError(entry.variant), '--state-notCreated':entry.variant.state==='NotCreated' && entry.variant.name == null, '--state-draft':entry.variant.state==='Draft' || (entry.variant.state==='NotCreated' && entry.variant.name != null)}"
ng-class="{'--current': entry.variant === editor.content, '--active': entry.variant.active && vm.dropdownOpen, '--error': entry.variant.active !== true && entry.variant.hasError, '--state-notCreated':entry.variant.state==='NotCreated' && entry.variant.name == null, '--state-draft':entry.variant.state==='Draft' || (entry.variant.state==='NotCreated' && entry.variant.name != null)}"
>
<button type="button" ng-if="entry.subVariants && entry.subVariants.length > 0" class="umb-variant-switcher__item-expand-button umb-outline" ng-click="entry.open = !entry.open">
<i class="icon icon-navigation-down" ng-if="entry.open"></i>
Expand All @@ -73,7 +73,7 @@
<umb-dropdown-item
ng-repeat="subVariant in entry.subVariants track by $index"
class="umb-variant-switcher__item"
ng-class="{'--current': subVariant === editor.content, '--active': subVariant.active && vm.dropdownOpen, '--error': variantHasError(subVariant), '--state-notCreated':subVariant.state==='NotCreated', '--state-draft':subVariant.state==='Draft'}"
ng-class="{'--current': subVariant === editor.content, '--active': subVariant.active && vm.dropdownOpen, '--error': subVariant.active !== true && subVariant.hasError, '--state-notCreated':subVariant.state==='NotCreated', '--state-draft':subVariant.state==='Draft'}"
>
<button type="button" class="umb-variant-switcher__name-wrapper umb-outline" ng-click="selectVariant($event, subVariant)" prevent-default>
<span class="umb-variant-switcher__name" ng-bind="subVariant.segment"></span>
Expand Down

0 comments on commit a2fe48d

Please sign in to comment.