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

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

@ -20,10 +20,10 @@ 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);
document.addEventListener('turbo:load', initAnnouncements); document.addEventListener('turbo:load', initAnnouncements);
document.addEventListener('turbo:load', initLocales); document.addEventListener('turbo:load', initLocales);
document.addEventListener('turbo:load', initFront); document.addEventListener('turbo:load', initFront);

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

@ -12,7 +12,7 @@ export function questionboxAllHandler(event: Event): void {
body: { body: {
rcpt: 'followers', rcpt: 'followers',
question: document.querySelector<HTMLInputElement>('textarea[name=qb-all-question]').value, question: document.querySelector<HTMLInputElement>('textarea[name=qb-all-question]').value,
anonymousQuestion: 'false' anonymousQuestion: 'false'
}, },
contentType: 'application/json' contentType: 'application/json'
}) })
@ -23,7 +23,7 @@ export function questionboxAllHandler(event: Event): void {
document.querySelector<HTMLInputElement>('textarea[name=qb-all-question]').value = ''; document.querySelector<HTMLInputElement>('textarea[name=qb-all-question]').value = '';
window['$']('#modal-ask-followers').modal('hide'); window['$']('#modal-ask-followers').modal('hide');
} }
showNotification(data.message, data.success); showNotification(data.message, data.success);
}) })
.catch(err => { .catch(err => {
@ -40,4 +40,8 @@ export function questionboxAllInputHandler(event: KeyboardEvent): void {
if (event.keyCode == 13 && (event.ctrlKey || event.metaKey)) { if (event.keyCode == 13 && (event.ctrlKey || event.metaKey)) {
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();
}

18
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);
}