From 85113d1aaa8b789f4327923bc039147dc2308b4f Mon Sep 17 00:00:00 2001 From: Tomas Kikutis Date: Wed, 25 Oct 2023 10:28:22 +0200 Subject: [PATCH 1/3] focus first input when opening authoring --- .../directives/AuthoringHeaderDirective.ts | 14 ++++++++++++-- 1 file changed, 12 insertions(+), 2 deletions(-) diff --git a/scripts/apps/authoring/authoring/directives/AuthoringHeaderDirective.ts b/scripts/apps/authoring/authoring/directives/AuthoringHeaderDirective.ts index 86edbf4d83..78aef839dd 100644 --- a/scripts/apps/authoring/authoring/directives/AuthoringHeaderDirective.ts +++ b/scripts/apps/authoring/authoring/directives/AuthoringHeaderDirective.ts @@ -293,12 +293,22 @@ export function AuthoringHeaderDirective( scope.$apply(); }; - // If correction set focus to the ednote to encourage user to fill it in defer(() => { if (scope.action === 'correct') { elem.find('#ednote').focus(); } else { - elem.find('#slugline').focus(); + const sorted = [...elem[0].querySelectorAll('input, textarea, [contenteditable]')] + .map((el) => { + return { + input: el, + order: parseInt(el.closest('[order]').getAttribute('order'), 10), + }; + }) + .sort((a, b) => a.order - b.order); + + if (sorted.length > 0) { + sorted[0].input.focus(); + } } }); }, From 0f7f229de66cad709ece1acbdebb6cb64df74bf4 Mon Sep 17 00:00:00 2001 From: Tomas Kikutis Date: Fri, 27 Oct 2023 12:59:08 +0200 Subject: [PATCH 2/3] take null into account --- .../authoring/directives/AuthoringHeaderDirective.ts | 5 ++++- 1 file changed, 4 insertions(+), 1 deletion(-) diff --git a/scripts/apps/authoring/authoring/directives/AuthoringHeaderDirective.ts b/scripts/apps/authoring/authoring/directives/AuthoringHeaderDirective.ts index 78aef839dd..4adb87f0c9 100644 --- a/scripts/apps/authoring/authoring/directives/AuthoringHeaderDirective.ts +++ b/scripts/apps/authoring/authoring/directives/AuthoringHeaderDirective.ts @@ -299,11 +299,14 @@ export function AuthoringHeaderDirective( } else { const sorted = [...elem[0].querySelectorAll('input, textarea, [contenteditable]')] .map((el) => { + const orderEl = el.closest('[order]'); + return { input: el, - order: parseInt(el.closest('[order]').getAttribute('order'), 10), + order: orderEl == null ? null : parseInt(orderEl.getAttribute('order'), 10), }; }) + .filter(({order}) => order != null) .sort((a, b) => a.order - b.order); if (sorted.length > 0) { From 917960ce73a17339a494ef437ee3fc67b51ffb98 Mon Sep 17 00:00:00 2001 From: Tomas Kikutis Date: Tue, 7 Nov 2023 12:12:22 +0100 Subject: [PATCH 3/3] Use interval to approximately determine when fields have loaded. --- .../directives/AuthoringHeaderDirective.ts | 66 +++++++++++++------ 1 file changed, 47 insertions(+), 19 deletions(-) diff --git a/scripts/apps/authoring/authoring/directives/AuthoringHeaderDirective.ts b/scripts/apps/authoring/authoring/directives/AuthoringHeaderDirective.ts index 4adb87f0c9..547a5f5fa9 100644 --- a/scripts/apps/authoring/authoring/directives/AuthoringHeaderDirective.ts +++ b/scripts/apps/authoring/authoring/directives/AuthoringHeaderDirective.ts @@ -1,6 +1,6 @@ import { isNull, isUndefined, find, filter, keys, findIndex, - defer, sortBy, map, forEach, startsWith, flatMap} from 'lodash'; + sortBy, map, forEach, startsWith, flatMap} from 'lodash'; import {FIELD_KEY_SEPARATOR} from 'core/editor3/helpers/fieldsMeta'; import {AuthoringWorkspaceService} from '../services/AuthoringWorkspaceService'; import {appConfig, extensions} from 'appConfig'; @@ -293,27 +293,55 @@ export function AuthoringHeaderDirective( scope.$apply(); }; - defer(() => { - if (scope.action === 'correct') { - elem.find('#ednote').focus(); + const loadingStartTimestamp = Date.now(); + let lastElementCount = null; + + /** + * Use interval to approximately determine when fields have loaded. + */ + const interval = setInterval(() => { + if (Date.now() - loadingStartTimestamp > 5000) { + // stop trying after 5s + // there might not be inputs in authoring header configured + clearInterval(interval); } else { - const sorted = [...elem[0].querySelectorAll('input, textarea, [contenteditable]')] - .map((el) => { - const orderEl = el.closest('[order]'); - - return { - input: el, - order: orderEl == null ? null : parseInt(orderEl.getAttribute('order'), 10), - }; - }) - .filter(({order}) => order != null) - .sort((a, b) => a.order - b.order); - - if (sorted.length > 0) { - sorted[0].input.focus(); + const elements = [...elem[0].querySelectorAll('input, textarea, [contenteditable]')]; + + if (elements.length < 1) { + return; + } else if (lastElementCount == null) { + lastElementCount = elements.length; + + return; + } else if (lastElementCount !== elements.length) { + lastElementCount = elements.length; + + return; + } else { + clearInterval(interval); + } + + if (scope.action === 'correct') { + elem.find('#ednote').focus(); + } else { + const sorted = elements + .map((el) => { + const orderEl = el.closest('[order]'); + + return { + input: el, + order: orderEl == null ? null : parseInt(orderEl.getAttribute('order'), 10), + }; + }) + .filter(({order}) => order != null) + .sort((a, b) => a.order - b.order); + + if (sorted.length > 0) { + sorted[0].input.focus(); + } } } - }); + }, 100); }, }; }