Skip to content

Commit

Permalink
#10274 Variant sorting should take into account that there might not …
Browse files Browse the repository at this point in the history 
…be any language (#10278) (#10284)

Co-authored-by: Niels Lyngsø <nsl@umbraco.com>
Co-authored-by: Mads Rasmussen <madsr@hey.com>
  • Loading branch information
@nielslyngsoe @madsrasmussen
3 people authored May 19, 2021
1 parent 14558ae commit 017b56e
Show file tree
Hide file tree
Showing 2 changed files with 49 additions and 41 deletions.
75 changes: 41 additions & 34 deletions src/Umbraco.Web.UI.Client/src/common/directives/components/forms/umbfocuslock.directive.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -40,7 +40,9 @@

function getDomNodes(){
infiniteEditorsWrapper = document.querySelector('.umb-editors');
infiniteEditors = Array.from(infiniteEditorsWrapper.querySelectorAll('.umb-editor'));
if(infiniteEditorsWrapper) {
infiniteEditors = Array.from(infiniteEditorsWrapper.querySelectorAll('.umb-editor') || []);
}
}

function getFocusableElements(targetElm) {
Expand Down Expand Up @@ -84,22 +86,24 @@
var defaultFocusedElement = getAutoFocusElement(focusableElements);
var lastKnownElement;

// If an inifite editor is being closed then we reset the focus to the element that triggered the the overlay
// If an infinite editor is being closed then we reset the focus to the element that triggered the the overlay
if(closingEditor){
var lastItemIndex = $rootScope.lastKnownFocusableElements.length - 1;
var editorInfo = infiniteEditors[0].querySelector('.editor-info');

// If there is only one editor open, search for the "editor-info" inside it and set focus on it
// This is relevant when a property editor has been selected and the editor where we selected it from
// is closed taking us back to the first layer
// Otherwise set it to the last element in the lastKnownFocusedElements array
if(infiniteEditors.length === 1 && editorInfo !== null){
lastKnownElement = editorInfo;

// Clear the array
clearLastKnownFocusedElements();
if(infiniteEditors && infiniteEditors.length === 1){
var editorInfo = infiniteEditors[0].querySelector('.editor-info');
if(infiniteEditors && infiniteEditors.length === 1 && editorInfo !== null) {
lastKnownElement = editorInfo;

// Clear the array
clearLastKnownFocusedElements();
}
}
else {
var lastItemIndex = $rootScope.lastKnownFocusableElements.length - 1;
lastKnownElement = $rootScope.lastKnownFocusableElements[lastItemIndex];

// Remove the last item from the array so we always set the correct lastKnowFocus for each layer
Expand Down Expand Up @@ -149,20 +153,24 @@
}

function cleanupEventHandlers() {
var activeEditor = infiniteEditors[infiniteEditors.length - 1];
var inactiveEditors = infiniteEditors.filter(editor => editor !== activeEditor);

if(inactiveEditors.length > 0) {
for (var index = 0; index < inactiveEditors.length; index++) {
var inactiveEditor = inactiveEditors[index];

// Remove event handlers from inactive editors
inactiveEditor.removeEventListener('keydown', handleKeydown);
//if we're in infinite editing mode
if(infiniteEditors.length > 0) {
var activeEditor = infiniteEditors[infiniteEditors.length - 1];
var inactiveEditors = infiniteEditors.filter(editor => editor !== activeEditor);

if(inactiveEditors.length > 0) {
for (var index = 0; index < inactiveEditors.length; index++) {
var inactiveEditor = inactiveEditors[index];

// Remove event handlers from inactive editors
inactiveEditor.removeEventListener('keydown', handleKeydown);
}
}
else {
// Why is this one only begin called if there is no other infinite editors, wouldn't it make sense always to clean this up?
// Remove event handlers from the active editor
activeEditor.removeEventListener('keydown', handleKeydown);
}
}
else {
// Remove event handlers from the active editor
activeEditor.removeEventListener('keydown', handleKeydown);
}
}

Expand All @@ -173,10 +181,7 @@
// Fetch the DOM nodes we need
getDomNodes();

// Cleanup event handlers if we're in infinite editing mode
if(infiniteEditors.length > 0){
cleanupEventHandlers();
}
cleanupEventHandlers();

getFocusableElements(targetElm);

Expand Down Expand Up @@ -204,17 +209,19 @@
// Make sure to disconnect the observer so we potentially don't end up with having many active ones
disconnectObserver = true;

// Pass the correct editor in order to find the focusable elements
var newTarget = infiniteEditors[infiniteEditors.length - 2];
if(infiniteEditors && infiniteEditors.length > 1) {
// Pass the correct editor in order to find the focusable elements
var newTarget = infiniteEditors[infiniteEditors.length - 2];

if(infiniteEditors.length > 1){
// Setting closing till true will let us re-apply the last known focus to then opened layer that then becomes
// active
closingEditor = true;
if(infiniteEditors.length > 1) {
// Setting closing till true will let us re-apply the last known focus to then opened layer that then becomes
// active
closingEditor = true;

onInit(newTarget);
onInit(newTarget);

return;
return;
}
}

// Clear lastKnownFocusableElements
Expand Down
15 changes: 8 additions & 7 deletions src/Umbraco.Web.UI.Client/src/common/services/contenteditinghelper.service.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -789,10 +789,10 @@ function contentEditingHelper(fileManager, $q, $location, $routeParams, editorSt
*/
sortVariants: function (a, b) {
const statesOrder = {'PublishedPendingChanges':1, 'Published': 1, 'Draft': 2, 'NotCreated': 3};
const compareDefault = (a,b) => (!a.language.isDefault ? 1 : -1) - (!b.language.isDefault ? 1 : -1);
const compareDefault = (a,b) => (a.language && a.language.isDefault ? -1 : 1) - (b.language && b.language.isDefault ? -1 : 1);

// Make sure mandatory variants goes on top, unless they are published, cause then they already goes to the top and then we want to mix them with other published variants.
const compareMandatory = (a,b) => (a.state === 'PublishedPendingChanges' || a.state === 'Published') ? 0 : (!a.language.isMandatory ? 1 : -1) - (!b.language.isMandatory ? 1 : -1);
const compareMandatory = (a,b) => (a.state === 'PublishedPendingChanges' || a.state === 'Published') ? 0 : (a.language && a.language.isMandatory ? -1 : 1) - (b.language && b.language.isMandatory ? -1 : 1);
const compareState = (a, b) => (statesOrder[a.state] || 99) - (statesOrder[b.state] || 99);
const compareName = (a, b) => a.displayName.localeCompare(b.displayName);

Expand All @@ -813,17 +813,18 @@ function contentEditingHelper(fileManager, $q, $location, $routeParams, editorSt
*/
getSortedVariantsAndSegments: function (variantsAndSegments) {
const sortedVariants = variantsAndSegments.filter(variant => !variant.segment).sort(this.sortVariants);
let segments = variantsAndSegments.filter(variant => variant.segment);
let variantsWithSegments = variantsAndSegments.filter(variant => variant.segment);
let sortedAvailableVariants = [];

sortedVariants.forEach((variant) => {
const sortedMatchedSegments = segments.filter(segment => segment.language.culture === variant.language.culture).sort(this.sortVariants);
segments = segments.filter(segment => segment.language.culture !== variant.language.culture);
const sortedMatchedSegments = variantsWithSegments.filter(segment => segment.language && variant.language && segment.language.culture === variant.language.culture).sort(this.sortVariants);
// remove variants for this culture
variantsWithSegments = variantsWithSegments.filter(segment => !segment.language || segment.language && variant.language && segment.language.culture !== variant.language.culture);
sortedAvailableVariants = [...sortedAvailableVariants, ...[variant], ...sortedMatchedSegments];
})

// if we have segments without a parent language variant we need to add the remaining segments to the array
sortedAvailableVariants = [...sortedAvailableVariants, ...segments.sort(this.sortVariants)];
// if we have segments without a parent language variant we need to add the remaining variantsWithSegments to the array
sortedAvailableVariants = [...sortedAvailableVariants, ...variantsWithSegments.sort(this.sortVariants)];

return sortedAvailableVariants;
}
Expand Down

0 comments on commit 017b56e

Please sign in to comment.