Port questionbox user functionality to TypeScript
This commit is contained in:
parent
41a7c89dae
commit
88d8cae815
|
@ -4,10 +4,12 @@ import initInbox from 'retrospring/features/inbox/index';
|
|||
import initUser from 'retrospring/features/user';
|
||||
import initSettings from 'retrospring/features/settings/index';
|
||||
import initLists from 'retrospring/features/lists';
|
||||
import initQuestionbox from 'retrospring/features/questionbox';
|
||||
|
||||
start();
|
||||
document.addEventListener('turbolinks:load', initAnswerbox);
|
||||
document.addEventListener('DOMContentLoaded', initInbox);
|
||||
document.addEventListener('DOMContentLoaded', initUser);
|
||||
document.addEventListener('turbolinks:load', initSettings);
|
||||
document.addEventListener('DOMContentLoaded', initLists);
|
||||
document.addEventListener('DOMContentLoaded', initLists);
|
||||
document.addEventListener('DOMContentLoaded', initQuestionbox);
|
|
@ -0,0 +1,17 @@
|
|||
import registerEvents from 'utilities/registerEvents';
|
||||
import { questionboxAllHandler, questionboxAllInputHandler } from './all';
|
||||
import { questionboxDestroyHandler } from './destroy';
|
||||
import { questionboxReportHandler } from './report';
|
||||
import { questionboxPromoteHandler, questionboxUserHandler, questionboxUserInputHandler } from './user';
|
||||
|
||||
export default (): void => {
|
||||
registerEvents([
|
||||
{ type: 'click', target: '[data-action=ab-question-report]', handler: questionboxReportHandler, global: true },
|
||||
{ type: 'click', target: '[name=qb-ask]', handler: questionboxUserHandler, global: true },
|
||||
{ type: 'click', target: '#new-question', handler: questionboxPromoteHandler, global: true },
|
||||
{ type: 'click', target: '[data-action=ab-question-destroy]', handler: questionboxDestroyHandler, global: true },
|
||||
{ type: 'click', target: '[name=qb-all-ask]', handler: questionboxAllHandler, global: true },
|
||||
{ type: 'keydown', target: '[name=qb-question]', handler: questionboxUserInputHandler, global: true },
|
||||
{ type: 'keydown', target: '[name=qb-all-question]', handler: questionboxAllInputHandler, global: true }
|
||||
]);
|
||||
}
|
|
@ -0,0 +1,59 @@
|
|||
import Rails from '@rails/ujs';
|
||||
import { showErrorNotification, showNotification } from 'utilities/notifications';
|
||||
import I18n from '../../../legacy/i18n';
|
||||
|
||||
export function questionboxUserHandler(event: Event) {
|
||||
const button = event.target as HTMLButtonElement;
|
||||
const promote = button.dataset.promote === "true";
|
||||
const anonymousQuestion = document.querySelector<HTMLInputElement>('input[name=qb-anonymous]')?.checked;
|
||||
|
||||
document.querySelector<HTMLInputElement>('textarea[name=qb-question]').readOnly = true;
|
||||
button.disabled = true;
|
||||
|
||||
Rails.ajax({
|
||||
url: '/ajax/ask',
|
||||
type: 'POST',
|
||||
data: new URLSearchParams({
|
||||
rcpt: document.querySelector<HTMLInputElement>('input[name=qb-to]').value,
|
||||
question: document.querySelector<HTMLInputElement>('textarea[name=qb-question]').value,
|
||||
anonymousQuestion: String(anonymousQuestion)
|
||||
}).toString(),
|
||||
success: (data) => {
|
||||
if (data.success) {
|
||||
document.querySelector<HTMLInputElement>('textarea[name=qb-question]').value = '';
|
||||
|
||||
if (promote) {
|
||||
const questionbox = document.querySelector('#question-box');
|
||||
questionbox.classList.toggle('d-none');
|
||||
|
||||
const promote = document.querySelector('#question-box-promote');
|
||||
promote.classList.toggle('d-none');
|
||||
}
|
||||
}
|
||||
|
||||
showNotification(data.message, data.success);
|
||||
},
|
||||
error: (data, status, xhr) => {
|
||||
console.log(data, status, xhr);
|
||||
showErrorNotification(I18n.translate('frontend.error.message'));
|
||||
},
|
||||
complete: () => {
|
||||
document.querySelector<HTMLInputElement>('textarea[name=qb-question]').readOnly = false;
|
||||
button.disabled = false;
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
export function questionboxPromoteHandler(event: Event) {
|
||||
const questionbox = document.querySelector('#question-box');
|
||||
questionbox.classList.toggle('d-none');
|
||||
|
||||
const promote = document.querySelector('#question-box-promote');
|
||||
promote.classList.toggle('d-none');
|
||||
}
|
||||
|
||||
export function questionboxUserInputHandler(event: KeyboardEvent) {
|
||||
if (event.keyCode == 13 && (event.ctrlKey || event.metaKey)) {
|
||||
document.querySelector<HTMLButtonElement>(`button[name=qb-ask]`).click();
|
||||
}
|
||||
}
|
Loading…
Reference in New Issue