Kemono.Party - User Filter

Block specified user in artists page and posts page.

Per 25-07-2023. Zie de nieuwste versie.

Voor het installeren van scripts heb je een extensie nodig, zoals Tampermonkey, Greasemonkey of Violentmonkey.

Voor het installeren van scripts heb je een extensie nodig, zoals Tampermonkey of Violentmonkey.

Voor het installeren van scripts heb je een extensie nodig, zoals Tampermonkey of Violentmonkey.

Voor het installeren van scripts heb je een extensie nodig, zoals Tampermonkey of Userscripts.

Voor het installeren van scripts heb je een extensie nodig, zoals {tampermonkey_link:Tampermonkey}.

Voor het installeren van scripts heb je een gebruikersscriptbeheerder nodig.

(Ik heb al een user script manager, laat me het downloaden!)

Voor het installeren van gebruikersstijlen heb je een extensie nodig, zoals {stylus_link:Stylus}.

Voor het installeren van gebruikersstijlen heb je een extensie nodig, zoals {stylus_link:Stylus}.

Voor het installeren van gebruikersstijlen heb je een extensie nodig, zoals {stylus_link:Stylus}.

Voor het installeren van gebruikersstijlen heb je een gebruikersstijlbeheerder nodig.

Voor het installeren van gebruikersstijlen heb je een gebruikersstijlbeheerder nodig.

Voor het installeren van gebruikersstijlen heb je een gebruikersstijlbeheerder nodig.

(Ik heb al een beheerder - laat me doorgaan met de installatie!)

// ==UserScript==
// @name         Kemono.Party - User Filter
// @description  Block specified user in artists page and posts page.
// @version      1.0
// @match        https://kemono.su/posts*
// @match        https://kemono.su/artists*
// @match        https://kemono.party/posts*
// @match        https://kemono.party/artists*
// @namespace    none
// @grant        GM_setValue
// @grant        GM_getValue
// @license      MIT
// ==/UserScript==
/* jshint esversion: 6 */

let blacklists = GM_getValue('blacklists', []);
let filter_enabled = GM_getValue('filter_enabled', true);

addStyle();
addFilterButton();
addBlockButton();

function addFilterButton() {
  let ptop = document.querySelector('#paginator-top');
  let menu = ptop.querySelector('menu');
  if (menu) addFilterButtonTo(menu);
  else {
    new MutationObserver(() => {
      let menu = ptop.querySelector('menu');
      addFilterButtonTo(menu);
    }).observe(ptop, {childList: true, subtree: false});
  }
}

function addFilterButtonTo(menu) {
  let btn_switch = document.createElement('a');
  btn_switch.classList.add('filter-switch');
  btn_switch.innerHTML = '<b>Filter</b>';
  if (filter_enabled) menu.closest('section').classList.add('filter-enabled');
  else btn_switch.classList.add('pagination-button-disabled');
  menu.insertBefore(btn_switch, menu.firstChild);
  btn_switch.onclick = () => {
    filter_enabled = !filter_enabled;
    menu.closest('section').classList.toggle('filter-enabled');
    btn_switch.classList.toggle('pagination-button-disabled');
    GM_setValue('filter_enabled', filter_enabled);
  };
}

function addBlockButton() {
  let items = document.querySelector('.card-list__items');
  if (items) {
    new MutationObserver(ms => {
      ms[0].addedNodes.forEach(card => {
        let service = card.href.split('/')[3];
        let user = card.href.split('/').pop();
        addBlockButtonTo(card, service, user);
      });
    }).observe(items, {childList: true, subtree: false});
  }
  let posts = document.querySelectorAll('article.post-card');
  posts.forEach(post => {
    let service = post.dataset.service;
    let user = post.dataset.user;
    addBlockButtonTo(post, service, user, true);
  });
}

function addBlockButtonTo(target, service, user, post) {
  let blocked = blacklists.indexOf(service + '_' + user) >= 0;
  if (blocked) target.dataset.blocked = true;
  let btn_block = document.createElement('label');
  btn_block.classList.add('btn-block');
  btn_block.innerHTML = `<b></b>`;
  (target.querySelector('footer') || target).appendChild(btn_block);
  btn_block.onclick = e => {
    e.preventDefault();
    btn_block.closest('a').blur();
    blockUser(service, user, target.dataset.blocked, post ? false : target);
  };
  if (post) {
    btn_block.onmouseover = () => hintUser(service, user, target.dataset.blocked, true);
    btn_block.onmouseout = () => hintUser(service, user);
  }
}

function blockUser(service, user, blocked, target) {
  console.log(blocked ? 'unblock' : 'block', service, user);
  if (target) {
    blocked ? target.removeAttribute('data-blocked') : target.setAttribute('data-blocked', true);
  } else {
    let user_posts = document.querySelectorAll(`article.post-card[data-service="${service}"][data-user="${user}"]`);
    user_posts.forEach(user_post => blocked ? user_post.removeAttribute('data-blocked') : user_post.setAttribute('data-blocked', true));
  }
  let user_id = service + '_' + user;
  if (!blocked && blacklists.indexOf(user_id) < 0) blacklists.push(user_id);
  GM_setValue('blacklists', blocked ? blacklists.filter(id => id !== user_id) : blacklists);
}

function hintUser(service, user, blocked, hint) {
  let user_posts = document.querySelectorAll(`article.post-card[data-service="${service}"][data-user="${user}"]`);
  user_posts.forEach(user_post => {
    if (hint) {
      user_post.setAttribute(blocked ? 'data-hint-unblock' : 'data-hint-block', true);
    } else {
      user_post.removeAttribute('data-hint-block');
      user_post.removeAttribute('data-hint-unblock');
    }
  });
}

function addStyle() {
  let css = `
menu > a.filter-switch {color: orange;}
.filter-enabled [data-blocked] {display: none;}
.user-card, .post-card > a {transition: box-shadow .25s ease, opacity .25s ease;}
.user-card[data-blocked], .post-card[data-blocked] > a {opacity: 0.75; box-shadow: 0 0 5px 3px orangered;}
.post-card[data-hint-block] > a {box-shadow: 0 0 5px 3px orange;}
.post-card[data-hint-unblock][data-blocked] > a {opacity: 1; box-shadow: 0 0 5px 3px orange;}
.user-card:not([data-blocked]):not(:hover) .btn-block,
.post-card:not([data-blocked]) footer:not(:hover) .btn-block {display: none;}
.btn-block {padding: 10px; position: absolute; right: -5px; bottom: -5px;}
.btn-block > b {color: white; background-color: orangered; border: 1px solid black; border-radius: 4px; padding: 0 4px;}
.btn-block > b::before {content: 'Block User'}
[data-blocked] .btn-block > b::before {content: 'Blocked';}
[data-blocked] .btn-block:hover > b {background-color: lightgreen;}
[data-blocked] .btn-block:hover > b::before {content: 'Unblock';}
`;
  document.head.insertAdjacentHTML('beforeend', `<style>${css}</style>`);
}