FreakU
/
Retrospring
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Merge pull request #730 from Retrospring/hocus-pocus-there's-pizza-on-your-focus 

auto-focus text field in ask modal
This commit is contained in:
Georg Gadinger 2022-10-11 22:53:12 +02:00 committed by GitHub
parent 59b619324c 4b8490a2d1
commit 96d3216d39
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
3 changed files with 20 additions and 12 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
app/javascript/packs/application.ts
View File

@ -20,7 +20,7 @@ document.addEventListener('DOMContentLoaded', initInbox);
document.addEventListener('DOMContentLoaded', initUser); document.addEventListener('DOMContentLoaded', initUser);
document.addEventListener('turbo:load', initSettings); document.addEventListener('turbo:load', initSettings);
document.addEventListener('DOMContentLoaded', initLists); document.addEventListener('DOMContentLoaded', initLists);
document.addEventListener('DOMContentLoaded', initQuestionbox); document.addEventListener('turbo:load', initQuestionbox);
document.addEventListener('DOMContentLoaded', initQuestion); document.addEventListener('DOMContentLoaded', initQuestion);
document.addEventListener('DOMContentLoaded', initModeration); document.addEventListener('DOMContentLoaded', initModeration);
document.addEventListener('DOMContentLoaded', initMemes); document.addEventListener('DOMContentLoaded', initMemes);

4
app/javascript/retrospring/features/questionbox/all.ts
View File

@ -41,3 +41,7 @@ export function questionboxAllInputHandler(event: KeyboardEvent): void {
document.querySelector<HTMLButtonElement>(`button[name=qb-all-ask]`).click(); document.querySelector<HTMLButtonElement>(`button[name=qb-all-ask]`).click();
} }
} }
export function questionboxAllModalAutofocus(): void {
document.querySelector<HTMLInputElement>('textarea[name=qb-all-question]').focus();
}

16
app/javascript/retrospring/features/questionbox/index.ts
View File

@ -1,13 +1,17 @@
import registerEvents from 'utilities/registerEvents'; import registerEvents from 'utilities/registerEvents';
import { questionboxAllHandler, questionboxAllInputHandler } from './all'; import { questionboxAllHandler, questionboxAllInputHandler, questionboxAllModalAutofocus } from './all';
import { questionboxPromoteHandler, questionboxUserHandler, questionboxUserInputHandler } from './user'; import { questionboxPromoteHandler, questionboxUserHandler, questionboxUserInputHandler } from './user';
export default (): void => { export default (): void => {
registerEvents([ registerEvents([
{ type: 'click', target: '[name=qb-ask]', handler: questionboxUserHandler, global: true }, { type: 'click', target: document.querySelectorAll('[name=qb-ask]'), handler: questionboxUserHandler },
{ type: 'click', target: '#new-question', handler: questionboxPromoteHandler, global: true }, { type: 'click', target: document.querySelector('#new-question'), handler: questionboxPromoteHandler },
{ type: 'click', target: '[name=qb-all-ask]', handler: questionboxAllHandler, global: true }, { type: 'click', target: document.querySelectorAll('[name=qb-all-ask]'), handler: questionboxAllHandler },
{ type: 'keydown', target: '[name=qb-question]', handler: questionboxUserInputHandler, global: true }, { type: 'keydown', target: document.querySelectorAll('[name=qb-question]'), handler: questionboxUserInputHandler },
{ type: 'keydown', target: '[name=qb-all-question]', handler: questionboxAllInputHandler, global: true } { type: 'keydown', target: document.querySelectorAll('[name=qb-all-question]'), handler: questionboxAllInputHandler }
]); ]);
// unfortunately Bootstrap 4 relies on jQuery's event model, so I can't use registerEvents here :(
// TODO: when upgrading to Bootstrap 5 replace this with a normal DOM event
$('#modal-ask-followers').on('shown.bs.modal', questionboxAllModalAutofocus);
} }