Javascript-форум - Цитировать сообщение свайпом

Javascript-форум (https://javascript.ru/forum/)

- Общие вопросы Javascript (https://javascript.ru/forum/misc/)

- - Цитировать сообщение свайпом (https://javascript.ru/forum/misc/85430-citirovat-soobshhenie-svajjpom.html)

Блоку .KIDE_msg_top имею ввиду

Цитата:

Сообщение от Ubivectel

хотелось бы свайп по блоку,

let touch_yy, touch_xx;
document.addEventListener("touchstart", (event) => {
    let target = event.target;
    if (target = target.closest('.KIDE_quote')) {
        touch_yy = event.changedTouches[event.changedTouches.length - 1].clientY;
        touch_xx = event.changedTouches[event.changedTouches.length - 1].clientX;
    }
})
document.addEventListener("touchend", (event) => {
    let target = event.target;
    if (target = target.closest('.KIDE_quote')) {
        let swap = (Math.abs(touch_yy - event.changedTouches[event.changedTouches.length - 1].clientY) > 30 || Math.abs(touch_xx - event.changedTouches[event.changedTouches.length - 1].clientX) > 30)
        if (swap) {
            target = target.closest('.KIDE_msg_top')
            let clon = target.cloneNode(true); // Делаем копию узла с потомками
            clon.querySelectorAll(".KIDE_quote").forEach(el => el.remove()); // Удаляем из копии все span.KIDE_msg
            let text = clon.textContent.trim(); // Берем текст из клона
            if (text.length > 60) text = text.slice(0, 60) + '...'
            kide.insertSmile(`[QUOTE]${text}[/QUOTE]\n`); // ставляем текст в инпут
        }
    }
})

Цитата:

Сообщение от рони (Сообщение 553059)

let touch_yy, touch_xx;
document.addEventListener("touchstart", (event) => {
    let target = event.target;
    if (target = target.closest('.KIDE_quote')) {
        touch_yy = event.changedTouches[event.changedTouches.length - 1].clientY;
        touch_xx = event.changedTouches[event.changedTouches.length - 1].clientX;
    }
})
document.addEventListener("touchend", (event) => {
    let target = event.target;
    if (target = target.closest('.KIDE_quote')) {
        let swap = (Math.abs(touch_yy - event.changedTouches[event.changedTouches.length - 1].clientY) > 30 || Math.abs(touch_xx - event.changedTouches[event.changedTouches.length - 1].clientX) > 30)
        if (swap) {
            target = target.closest('.KIDE_msg_top')
            let clon = target.cloneNode(true); // Делаем копию узла с потомками
            clon.querySelectorAll(".KIDE_quote").forEach(el => el.remove()); // Удаляем из копии все span.KIDE_msg
            let text = clon.textContent.trim(); // Берем текст из клона
            if (text.length > 60) text = text.slice(0, 60) + '...'
            kide.insertSmile(`\n`); // ставляем текст в инпут
        }
    }
})

Да, именно так и сделал, мало помалу вс е же учусь, многое уже сам делаю )

Ubivectel,
ок!:victory:

Что-то бы такое еще добавить:

if (end < start - offset) {
            console.log('Swipe right');
            swipeElement.classList.add('swiped');
            setTimeout(function () {
                swipeElement.classList.remove('swiped');
            }, 300);
        }

Что бы было не только функционально, но и красиво

Ubivectel,
как вариант...

let touch_yy, touch_xx;
document.addEventListener("touchstart", (event) => {
    let target = event.target;
    if (target = target.closest('.KIDE_quote')) {
        touch_yy = event.changedTouches[event.changedTouches.length - 1].clientY;
        touch_xx = event.changedTouches[event.changedTouches.length - 1].clientX;
    }
})
document.addEventListener("touchend", (event) => {
    let target = event.target;

    if (target = target.closest('.KIDE_quote')) {
        let swap = (Math.abs(touch_yy - event.changedTouches[event.changedTouches.length - 1].clientY) > 30 || Math.abs(touch_xx - event.changedTouches[event.changedTouches.length - 1].clientX) > 30)
        if (swap) {
            target = target.closest('.KIDE_msg_top');
            target.classList.add('swiped');
            setTimeout(function () {
                target.classList.remove('swiped');
            }, 300);
            let clon = target.cloneNode(true); // Делаем копию узла с потомками
            clon.querySelectorAll(".KIDE_quote").forEach(el => el.remove()); // Удаляем из копии все span.KIDE_msg
            let text = clon.textContent.trim(); // Берем текст из клона
            if (text.length > 60) text = text.slice(0, 60) + '...'
            kide.insertSmile(`[QUOTE]${text}[/QUOTE]\n`); // ставляем текст в инпут
        }
    }
})

Добавил, что-то пошло не так

Ubivectel,
css добавил?
.KIDE_msg_top.swiped{ ...}

Ну вот сейчас добавил css, но класс и в инспекторе не появляется, и цитаты не вставляются :(

Ubivectel,
}, 300);
время увеличить попробуй