mirror of
https://github.com/philomena-dev/philomena.git
synced 2024-11-27 13:47:58 +01:00
Merge pull request #308 from philomena-dev/misc-ts
convert misc scripts to ts
This commit is contained in:
commit
dd9091e866
1 changed files with 32 additions and 23 deletions
|
@ -3,36 +3,43 @@
|
|||
*/
|
||||
|
||||
import store from './utils/store';
|
||||
import { $, $$ } from './utils/dom';
|
||||
import { $, $$, hideEl, showEl } from './utils/dom';
|
||||
import { assertNotNull, assertType } from './utils/assert';
|
||||
import '../types/ujs';
|
||||
|
||||
let touchMoved = false;
|
||||
|
||||
function formResult({target, detail}) {
|
||||
|
||||
const elements = {
|
||||
function formResult({target, detail}: FetchcompleteEvent) {
|
||||
const elements: Record<string, string> = {
|
||||
'#description-form': '.image-description',
|
||||
'#uploader-form': '.image_uploader'
|
||||
};
|
||||
|
||||
function showResult(resultEl, formEl, response) {
|
||||
function showResult(formEl: HTMLFormElement, resultEl: HTMLElement, response: string) {
|
||||
resultEl.innerHTML = response;
|
||||
resultEl.classList.remove('hidden');
|
||||
formEl.classList.add('hidden');
|
||||
formEl.querySelector('input[type="submit"],button').disabled = false;
|
||||
hideEl(formEl);
|
||||
showEl(resultEl);
|
||||
|
||||
$$<HTMLInputElement | HTMLButtonElement>('input[type="submit"],button', formEl).forEach(button => {
|
||||
button.disabled = false;
|
||||
});
|
||||
}
|
||||
|
||||
for (const element in elements) {
|
||||
if (target.matches(element)) detail.text().then(text => showResult($(elements[element]), target, text));
|
||||
}
|
||||
for (const [ formSelector, resultSelector ] of Object.entries(elements)) {
|
||||
if (target.matches(formSelector)) {
|
||||
const form = assertType(target, HTMLFormElement);
|
||||
const result = assertNotNull($<HTMLElement>(resultSelector));
|
||||
|
||||
detail.text().then(text => showResult(form, result, text));
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
function revealSpoiler(event) {
|
||||
|
||||
const { target } = event;
|
||||
function revealSpoiler(event: MouseEvent | TouchEvent) {
|
||||
const target = assertNotNull(event.target) as HTMLElement;
|
||||
const spoiler = target.closest('.spoiler');
|
||||
let imgspoiler = target.closest('.spoiler .imgspoiler, .spoiler-revealed .imgspoiler');
|
||||
const showContainer = target.closest('.image-show-container');
|
||||
let imgspoiler = target.closest('.spoiler .imgspoiler, .spoiler-revealed .imgspoiler');
|
||||
|
||||
// Prevent reveal if touchend came after touchmove event
|
||||
if (touchMoved) {
|
||||
|
@ -42,7 +49,8 @@ function revealSpoiler(event) {
|
|||
|
||||
if (spoiler) {
|
||||
if (showContainer) {
|
||||
const imageShow = showContainer.querySelector('.image-show');
|
||||
const imageShow = assertNotNull(showContainer.querySelector('.image-show'));
|
||||
|
||||
if (!imageShow.classList.contains('hidden') && imageShow.classList.contains('spoiler-pending')) {
|
||||
imageShow.classList.remove('spoiler-pending');
|
||||
return;
|
||||
|
@ -62,19 +70,22 @@ function revealSpoiler(event) {
|
|||
if (imgspoiler) {
|
||||
imgspoiler.classList.remove('imgspoiler');
|
||||
imgspoiler.classList.add('imgspoiler-revealed');
|
||||
|
||||
if (event.type === 'touchend' && !event.defaultPrevented) {
|
||||
event.preventDefault();
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
function setupEvents() {
|
||||
const extrameta = $('#extrameta');
|
||||
export function setupEvents() {
|
||||
const extrameta = $<HTMLElement>('#extrameta');
|
||||
|
||||
if (extrameta && store.get('hide_uploader')) {
|
||||
hideEl(extrameta);
|
||||
}
|
||||
|
||||
if (store.get('hide_uploader') && extrameta) extrameta.classList.add('hidden');
|
||||
if (store.get('hide_score')) {
|
||||
$$('.upvotes,.score,.downvotes').forEach(s => s.classList.add('hidden'));
|
||||
$$<HTMLElement>('.upvotes,.score,.downvotes').forEach(s => hideEl(s));
|
||||
}
|
||||
|
||||
document.addEventListener('fetchcomplete', formResult);
|
||||
|
@ -82,5 +93,3 @@ function setupEvents() {
|
|||
document.addEventListener('touchend', revealSpoiler);
|
||||
document.addEventListener('touchmove', () => touchMoved = true);
|
||||
}
|
||||
|
||||
export { setupEvents };
|
Loading…
Reference in a new issue