// ==UserScript==
// @name         Hejto
// @namespace    http://tampermonkey.net/
// @version      0.1
// @description  try to take over the world!
// @author       You
// @match        https://www.hejto.pl/*
// @icon         https://www.google.com/s2/favicons?sz=64&domain=hejto.pl
// @run-at       document-start
// @grant        GM_addStyle
// ==/UserScript==

// Nie wyświetlaj formularzy odpowiedzi zanim nie zostanie kliknięty przycisk Odpowiedz
GM_addStyle('div.p-3 > form {display: none}')
// Zmiana wyglądu postów i odpowiedzi
GM_addStyle('article {background-color: rgb(41 41 41) !important; padding-left: 10px !important; margin-left: 10px !important;}')
GM_addStyle('article > * {background-color: rgb(41 41 41) !important; padding-left: 10px !important; margin-left: 10px !important;}')
GM_addStyle('.basic-text {color: white !important; font-size: 12px !important;}')
// Zmniejszenie boxów z postem
GM_addStyle('article > div > div .items-start {align-items: flex-start !important; border-bottom: 1px solid #504f4f !important; padding-bottom: 10px !important;}')
GM_addStyle('article > div {padding: 6px !important;}')
// Ukryj przyciski Odpowiedz
GM_addStyle('article > div > div > div > div  button.self-end {padding-top: 5px !important; padding-bottom: 0px !important; font-size: 12px !important; opacity: 20% !important;}')

// Dodaj przycisk na górnej belce
function add_button(link, napis, css) {
    var button = document.createElement("a");
    button.href = link;
    button.text = napis;
    button.style = css;

    var bar = document.getElementsByClassName("flex-grow")[0];
    bar.appendChild(button);
}

// Wyświetlaj formularz odpowiedzi po wciśnięciu przycisku Odpowiedz
function button_odp_click(element) {
    element.target.closest('article').getElementsByTagName("form")[0].style = "display: block";
}

// Pokazywanie i ukrywanie przycisków Odpowiedz po najechaniu myszką
function post_mouseover(element) {
    var buttons = element.target.closest('div').getElementsByTagName("button");
    for(let i=0; i < buttons.length; i++) {
        if(buttons[i].textContent == "Odpowiedz") {
            buttons[i].style = "opacity: 100% !important;";
        }
    }
}

function post_mouseout(element) {
    var buttons = element.target.closest('div').getElementsByTagName("button");
    for(let i=0; i < buttons.length; i++) {
        if(buttons[i].textContent == "Odpowiedz") {
            buttons[i].style = "opacity: 20% !important;";
        }
    }
}

// Dodaj wszystkie dodatkowe przyciski na górnej belce
function after_loading() {
    var buton_style =
        "font-weight: bold;" +
        "background-color: rgb(41 41 41);" +
        "color: white;" +
        "margin-left: 10px;" +
        "margin-right: 10px;" +
        "padding: 10px 10px 10px 10px;";
    add_button("", "", "visibility: hidden; margin-left: 20px;");
    add_button("https://www.hejto.pl/", "Gorące", buton_style);
    add_button("https://www.hejto.pl/najnowsze", "Najnowsze", buton_style);
    add_button("https://www.hejto.pl/najnowsze/typ/artykuly", "Artykuły", buton_style);

    // Mouseover dla boxów z odpowiedziami
    var box = document.querySelectorAll('.relative > div:not([class])');
    for(let i=0; i < box.length; i++) {
        box[i].addEventListener("mouseover", post_mouseover);
        box[i].addEventListener("mouseout", post_mouseout);
    }
}

// Wygląd postów i odpowiedzi, odświeżany co 1 sekundę

window.setInterval(function(){
    // Przyciski odpowiedzi
    var odp = document.querySelectorAll("article > div > div > div button")
    for(let i=0; i < odp.length; i++) {
        if(odp[i].textContent == "Odpowiedz") {
            //odp[i].style = "padding-top: 5px; padding-bottom: 0px; font-size: 12px; visibility: hidden;";
            odp[i].addEventListener("click", button_odp_click);
        }
    }
}, 500);

(function() {
    'use strict';
    // Dodaj przyciski na górnej belce po załadowaniu strony
    window.addEventListener('load', after_loading)
})();