mirror of
https://github.com/philomena-dev/philomena.git
synced 2024-11-27 21:47:59 +01:00
convert tags.js to ts
This commit is contained in:
parent
90b4ee8915
commit
13735e7d4e
3 changed files with 26 additions and 17 deletions
|
@ -1,7 +1,7 @@
|
|||
import { $ } from './utils/dom';
|
||||
import { inputDuplicatorCreator } from './input-duplicator';
|
||||
|
||||
export interface SourcesEvent extends CustomEvent<Response> {
|
||||
export interface TagSourceEvent extends CustomEvent<Response> {
|
||||
target: HTMLElement,
|
||||
}
|
||||
|
||||
|
@ -17,7 +17,7 @@ function setupInputs() {
|
|||
function imageSourcesCreator() {
|
||||
setupInputs();
|
||||
|
||||
document.addEventListener('fetchcomplete', (({ target, detail }: SourcesEvent) => {
|
||||
document.addEventListener('fetchcomplete', (({ target, detail }: TagSourceEvent) => {
|
||||
const sourceSauce = $<HTMLElement>('.js-sourcesauce');
|
||||
|
||||
if (sourceSauce && target && target.matches('#source-form')) {
|
||||
|
|
|
@ -2,23 +2,28 @@
|
|||
* Tags Dropdown
|
||||
*/
|
||||
|
||||
import { showEl, hideEl } from './utils/dom';
|
||||
import { $$, showEl, hideEl } from './utils/dom';
|
||||
import { assertNotUndefined } from './utils/assert';
|
||||
import { TagSourceEvent } from './sources';
|
||||
|
||||
function addTag(tagId, list) {
|
||||
type TagDropdownActionFunction = () => void;
|
||||
type TagDropdownActionList = Record<string, TagDropdownActionFunction>;
|
||||
|
||||
function addTag(tagId: number, list: number[]) {
|
||||
list.push(tagId);
|
||||
}
|
||||
|
||||
function removeTag(tagId, list) {
|
||||
function removeTag(tagId: number, list: number[]) {
|
||||
list.splice(list.indexOf(tagId), 1);
|
||||
}
|
||||
|
||||
function createTagDropdown(tag) {
|
||||
function createTagDropdown(tag: HTMLSpanElement) {
|
||||
const { userIsSignedIn, userCanEditFilter, watchedTagList, spoileredTagList, hiddenTagList } = window.booru;
|
||||
const [ unwatch, watch, unspoiler, spoiler, unhide, hide, signIn, filter ] = [].slice.call(tag.querySelectorAll('.tag__dropdown__link'));
|
||||
const [ unwatched, watched, spoilered, hidden ] = [].slice.call(tag.querySelectorAll('.tag__state'));
|
||||
const tagId = parseInt(tag.dataset.tagId, 10);
|
||||
const [ unwatch, watch, unspoiler, spoiler, unhide, hide, signIn, filter ] = $$<HTMLElement>('.tag__dropdown__link');
|
||||
const [ unwatched, watched, spoilered, hidden ] = $$<HTMLSpanElement>('.tag__state');
|
||||
const tagId = parseInt(assertNotUndefined(tag.dataset.tagId), 10);
|
||||
|
||||
const actions = {
|
||||
const actions: TagDropdownActionList = {
|
||||
unwatch() { hideEl(unwatch, watched); showEl(watch, unwatched); removeTag(tagId, watchedTagList); },
|
||||
watch() { hideEl(watch, unwatched); showEl(unwatch, watched); addTag(tagId, watchedTagList); },
|
||||
|
||||
|
@ -51,11 +56,15 @@ function createTagDropdown(tag) {
|
|||
if (userIsSignedIn &&
|
||||
!userCanEditFilter) showEl(filter);
|
||||
|
||||
tag.addEventListener('fetchcomplete', event => actions[event.target.dataset.tagAction]());
|
||||
tag.addEventListener('fetchcomplete', ((event: TagSourceEvent) => {
|
||||
const act = event.target.dataset.tagAction;
|
||||
|
||||
if (act && actions[act]) {
|
||||
actions[act]()
|
||||
}
|
||||
}) as EventListener);
|
||||
}
|
||||
|
||||
function initTagDropdown() {
|
||||
[].forEach.call(document.querySelectorAll('.tag.dropdown'), createTagDropdown);
|
||||
export function initTagDropdown() {
|
||||
[].forEach.call($$<HTMLSpanElement>('.tag.dropdown'), createTagDropdown);
|
||||
}
|
||||
|
||||
export { initTagDropdown };
|
|
@ -6,7 +6,7 @@ import { $, $$ } from './utils/dom';
|
|||
import store from './utils/store';
|
||||
import { initTagDropdown } from './tags';
|
||||
import { setupTagsInput, reloadTagsInput } from './tagsinput';
|
||||
import { SourcesEvent } from './sources';
|
||||
import { TagSourceEvent } from './sources';
|
||||
|
||||
type TagInputActionFunction = (tagInput: HTMLTextAreaElement | null) => void
|
||||
type TagInputActionList = {
|
||||
|
@ -49,7 +49,7 @@ function setupTags() {
|
|||
});
|
||||
}
|
||||
|
||||
function updateTagSauce({target, detail}: SourcesEvent) {
|
||||
function updateTagSauce({target, detail}: TagSourceEvent) {
|
||||
const tagSauce = $<HTMLDivElement>('.js-tagsauce');
|
||||
|
||||
if (tagSauce && target.matches('#tags-form')) {
|
||||
|
|
Loading…
Reference in a new issue