WykopObserve - Biblioteka dla UserScript

Biblioteka dla UserScript przygotowana dla serwisu wykop.pl.

Wcześniej stworzyłem dodatek "Siwa Broda", dodający brodę długości i rodzaju odzwierciedlającego staż na wykopie autora wpisu czy komentarza.

Biblioteka powstała poprzez wyciągniecie z dodatku Siwa Broda modułu, którym można zrobić iterację po wszystkich elementach jak komentarze, wpisy, sub-komentarze i kilka innych elementów. Co ważne, biblioteka obsługuje dynamiecznie doładującą się treść przy infinite scroll na tagach albo automatycznie uaktualniająca się lista komentarzy do wpisu.

Jak użyć

Wystarczy utworzyć nowy skrypt w jednym z "Monkey Addons"(GreaseMonkey, TamperMonkey, ViolentMonkey, FireMonkey), z taką treścią:

// ==UserScript==
// @name        Wykop UserScript
// @description Wykop UserScript.
// @version     1.0
// @author      author
// @include     https://www.wykop.pl/*
// @require     https://greasyfork.org/scripts/437595-wykopobserve/code/WykopObserve.js?version=1002287
// @run-at      document-end
// ==/UserScript==

(async function () {
 
wykopObserve(filter, function (elements, attrs) {
 
}, options);

})()

Istotna jest linijka: // @require wykopObserve.js - dzięki niej można użyć w UserSkrypcie funkcji wykopObserve.

Funkcja wykopObserve przyjmuje trzy parametry: tablicę filter, funkcję callback i obiekt options - jak na przykładzie.

Funkcja callback wykonuje się na ustalonych w parametrze filter typach elementów, jak wpis, komentarz itp.

Parametry wykopObserve

• filter:Array (wymagany) - zawiera wybrane elementy z listy places
• callback:function (wymagany) - funkcja która ma się wykonać w każdym miejscu na stronie, który jest zawarty w filter.
• options:Object (niewymagany) - zawiera:
  • once:boolean (niewymagany) - czy wykonać callback tylko raz dla danego elementu.

once - To jest jedna jedyna dostępna opcja na ten moment.

Funkcję wykopObserve można używać wielokrotnie z różnymi filtrami, on potrafi rozróżnić odrębne wywołanie i rozpoznaje czy dla danego wywołania wykopObserve callback na danym elemencie został wykonany pierwszy czy kolejny raz.

Funkcja refresh

Funkcja wykopObserve zwraca obiekt, zawierający funkcję refresh, którą można użyć żeby wykonać siłowo ponowne wykonanie callback na wszystkich wybranych rodzajach elementów, wbrew ustawieniu opcji once:

const {refresh} = wykopObserve(filters, callback, options);
// (...)
refresh();

Parametry funkcji callback

callback posiada atrybuty:

• elements:Object - zawiera:
  • profileEl:HTMLElement - element HTML o selektorze .profile
  • liEl:HTMLElement - element HTML o selektorze li, zawierający .profile
  • contentEl:HTMLElement - element HTML o selektorze .profile
• attrs:Object zawiera:
  • place:string - nazwa typu elementu, na którym wykonywany jest callback - zgodna z filters
  • isFirstTime:boolean - ma wartość true, jeśli callback na tym konkretnym elemencie wykonuje się pierwszy raz, przy każdym kolejnym ma wartość false`
  • nick:string - nazwa użytkownika autora posta
  • authorSex:["male","female",null] - płeć autora posta

Rodzaje elementów dozwolonych w tablicy filter

Tablica filter skadać się musi ze stringów takiego rodzaju:

Komentarze, wpisy i subkomentarze. nazwane dla porządku Comment i SubComment

• "mikroblog-page-comment" - wpis na stronie wykop.pl/mikroblog
• "mikroblog-page-sub-comment" - komentarz do wpisu na stronie wykop.pl/mikroblog
• "link-page-comment" - komentarz na stronie wykop.pl/link (na stronie znaleziska)
• "link-page-sub-comment" - subkomentarz na stronie wykop.pl/link (na stronie znaleziska)
• "wpis-page-comment" - wpis na stronie wykop.pl/wpis (strona pojedynczego wpisu)
• "wpis-page-sub-comment" - komentarz do wpisu na stronie wykop.pl/wpis (strona pojedynczego wpisu)
• "tag-page-comment" - wpis na stronie wykop.pl/tag
• "tag-page-sub-comment" - komentarz do wpisu na stronie wykop.pl/tag
• "moj-page-comment" - wpis na stronie wykop.pl/moj
• "moj-page-sub-comment" - komentarz do wpisu na stronie wykop.pl/moj
• "glowna-page-comment" - wpis na głównej stronie wykop.pl
• "ludzie-page-link-sub-comment" - komentarz do znaleziska, widoczny na stronie wykop.pl/ludzie
• "ludzie-page-wpis-comment" - wpis, widoczny na stronie wykop.pl/ludzie
• "ludzie-page-wpis-sub-comment" - komentarz do wpisu, widoczny na stronie wykop.pl/ludzie

Nietypowe elementy

• "header-profile-element" - element z awatarem zalogowanego użytkownika (mi było przydatne dodatku Siwa Broda)
• "link-page-author-element" - element nazwą i awatarem osoby, która dodała znalezisko (też przydatne dododatku Siwa Broda)
• "other" - każdy inny, nietypowy element HTML o selektorze .profile, na dowolnej podstronie, np. stronie wykop.pl/dodatki/pokaz (stronie konkretnego dodatku).

Elementy przy polu wpisywania wpisu lub komentarza

Elementy przy polu wpisywania wpisu lub komentarza, z rozróżnieniem na poszczególne podstrony wykop.pl:

• "mikroblog-page-write-element"
• "link-page-write-element"
• "wpis-page-write-element"
• "tag-page-write-element"
• "ludzie-page-write-element"
• "moj-page-write-element"

Obiekt filterGroups

Obiekt filterGroups jest zwracany przez wykopObserve.js i jest dostępny w UserScript z linijką // @require wykopObserve.js.

Obiektu filterGroups można użyć w parametrze filter funkcji wykopObserve.

Posiada pola z tablicami:

• all - wszystkie możliwe filtry, nie licząc "other"
• mikroblogLinkWpisGlownaTagMojComment - - każdy filtr Comment ze strony mikroblog, link, wpis, glowna, tag, moj
• mikroblogLinkWpisTagSubMojComment - każdy filtr SubComment ze strony mikroblog, link, wpis, tag, moj
• mikroblogLinkWpisGlownaTagMojCommentOrSubComment - każdy filtr Comment i SubComment ze strony mikroblog, link, wpis, glowna, tag, moj
• ludziePageCommentOrSubComment - każdy filtr Comment i SubComment ze strony ludzie
• writeElement - każdy filtr writeElement

Przykładowe użycie obiektu filterGroups:

wykopObserve([
  filterGroups.mikroblogLinkWpisGlownaTagCommentOrSubComment
  filterGroups.writeElement
], callback, options);

Dzięki temu nie trzeba spisywać wszystkich filtrów z osobna.

Parametr filter się spłaszcza (jest potraktowane arr.flat(Infinity)), więc można użyć tablicy w tablicy, w tablicy...

Nieprawidłowe filtry są logowane w formie warning w konsoli przeglądarki jako np. [WykopObserve] faulty filters: "glowna-page-commentx". - warto sprawdzić log, żeby uniknąć literówek itp.

Funkcja getAdjacentEls

Funkcja getAdjacentEls jest zwracana przez wykopObserve.js i jest dostępny w UserScript z linijką // @require wykopObserve.js.

Prosta funkcja, zwraca elementy sąsiadujące z przekazanym w parametrze elementem - w zasadzie wszystkie dzieci rodzica.

wykopObserve(filter, function (elements, attrs) {
  const adjacentEls = getAdjacentEls(elements.liEl);
  // (...)
}, options);

Np. dodatek "Poczytaj mi mamo" mógłby skorzystać z tej funkcji.

String loginUser

String loginUser jest zwracany przez wykopObserve.js i jest dostępny w UserScript z linijką // @require wykopObserve.js.

Zmienna posiadająca nazwę zalogowanego użytkownika.

wykopObserve(filter, function (elements, attrs) {
  if (loginUser === attrs.nick) {
    // (...)
  };
}, options);

UserScript-y wykorzystujące bibliotekę wykopObserve

• Siwa Broda - Siwa broda pod awatarem. Tym dłuższa, im dłuższy staż na wykopie. Dodatek autorstwa look997 (mój).
• Notatkowator 2020 - Szybki podgląd notek. Moja reedycja dodatku Notatkowator 2000, oryginalnie autorstwa piokom123. Działa lepiej niż oryginał.
• Blokator obrazów od różowych pasków - Nazwa mówi sama za siebie. Na głównej, tagach, mikroblogu, mój wykop, stronie użytkownika - blokuje każdy wpis różowego paska, który ma obrazek.

Spokojnie można przepisać np. dodatek "Poczytaj mi mamo", jak i wiele innych, z użyciem biblioteki WykopObserve. Także mam nadzieję, że bibliteka ułatwi realizację nowych pomysłów. Wykopowicz z pomysłem, po prostu będzie miał z główy problem wykrywania wpisów, komentarzy itd., może od razu przejść do rzeczy.

Kandydaci

Przejrzałem dodatki na stronie wykop.pl/dodatki. Są tam dodatki, które mogą być przepisane pod bibliotekę WykopObserve:

• ZielonkaBloker
• Czyściciel Mirko
• Wykopowy Przypominacz
• BronskyTrolluje!
• Czarna lista plusujących
• MikroMirror
• WykopGif
• Mirko Filter
• Zgłaszanie za brak #polityka jednym kliknięciem
• Wykop videos - youtube videos z glownej wyswietlone w jednym miejscu
• Hidder
• Wykop Embed Helper
• Skocz do czasu na youtube
• Dość nocnej
• Gruszkozgłaszacz
• CancerRemover
• Nocna Zmiana? Nie słyszałem o niej.
• Chciałbym być marynarzem, chciałbym pamiętać komentarze - cytatonaprawiacz
• WykopBingo!
• Poczytaj mi, mamo
• Krawężnik
• ObrazekZeSchowka
• codeFormatter
• AnkietoRozbudowywacz
• Taguj to gówno
• Mirkoukrywacz
• Zawołaj osoby, które chciały być zawołane
• Zawołaj plusujących
• Dobre strony wykopu
• @92GRUSZKA ALL CAPS
• Skocz do czasu na youtube
• CebulaDealsTrollRemoval
• Mirkoblocker
• Mirrorek+
• Pokazywanie obrazków po kliknięciu na link w komentarzu
• Naprawiacz pasków
• Pokazywarka wykopo i zakopowiczów +
• Ukrywacz zer
• Obiektywny wykop
• Ukrywanie wątków w komentarzach
• Wykop - obserwowanie
• Wykop CanComment
• SFW v1.1.0
• Tagowyłapywacz
• Usuwanie komentarzy z żartem 'usuń konto'
• Głosuj wszystkie komentarze!
• Pokaż wszystkie spoilery w mikroblogu
• Sprawdzacz czarnolisto
• Ukryj wpisy na mirko
• Mirko zwin
• Pokaż długość filmu YT na wykop.pl (2015.08)
• Przewijanie obserwowanego znaleziska do nieprzeczytanych komentarzy
• Wykop Rozwijacz