1
Fork 0
tildes-reextended/source/ts/scripts/user-labels/handlers.ts

95 lines
2.7 KiB
TypeScript

import {
log,
isValidHexColor,
UserLabel,
querySelector,
getCSSCustomPropertyValue
} from '../../utilities';
import {findLabelByID} from '../user-labels';
import {themeColors} from '../../theme-colors';
import {
getLabelForm,
setLabelFormColor,
setLabelFormPriority,
setLabelFormUserID,
setLabelFormUsername,
setLabelFormText,
setLabelFormTitle,
showLabelForm,
updatePreview
} from './label-form';
export function addLabelHandler(
event: MouseEvent,
element: HTMLSpanElement
): void {
const labelForm = getLabelForm();
labelForm.removeAttribute('data-trx-user-label-id');
setLabelFormTitle('Add New Label');
setLabelFormUsername(element.getAttribute('data-trx-username')!);
setLabelFormPriority(0);
setLabelFormColor(getCSSCustomPropertyValue(themeColors.backgroundSecondary));
setLabelFormText('');
showLabelForm(element);
updatePreview();
}
export async function editLabelHandler(
event: MouseEvent,
element: HTMLSpanElement
): Promise<void> {
setLabelFormTitle('Edit Existing Label');
const labelID = Number(element.getAttribute('data-trx-user-label-id')!);
const label: UserLabel | undefined = await findLabelByID(labelID);
if (typeof label === 'undefined') {
log(`Tried to find label with ID that doesn't exist: ${labelID}`, true);
return;
}
setLabelFormUserID(label.id);
setLabelFormUsername(label.username.toLowerCase());
setLabelFormPriority(label.priority);
setLabelFormColor(label.color);
setLabelFormText(label.text);
showLabelForm(element);
updatePreview();
}
export function labelColorInputHandler(): void {
const labelColorInput: HTMLInputElement = querySelector(
'#trx-user-label-form-color > input'
);
let color: string = labelColorInput.value.toLowerCase();
if (!color.startsWith('#') && !color.startsWith('t') && color.length > 0) {
color = `#${color}`;
labelColorInput.value = color;
}
if (color !== 'transparent' && !isValidHexColor(color)) {
log('Invalid color input, must be a valid 3/4/6/8-character hex color.');
labelColorInput.classList.add('trx-invalid');
return;
}
labelColorInput.classList.remove('trx-invalid');
updatePreview(color);
}
export function labelTextInputHandler(): void {
const labelTextInput: HTMLInputElement = querySelector(
'#trx-user-label-input > input'
);
updatePreview(undefined, labelTextInput.value);
}
export function presetColorSelectHandler(): void {
const labelColorInput: HTMLInputElement = querySelector(
'#trx-user-label-form-color > input'
);
const presetColorSelect: HTMLSelectElement = querySelector(
'#trx-user-label-form-color > select'
);
labelColorInput.value = presetColorSelect.value;
updatePreview(presetColorSelect.value);
}