☰

Greasy Fork is available in English.

Wykop XS - Lista plusujących, animowane awatary, mikroczat

Wykop XS - Darmowy dostęp do Mikroczatu. Dodatkowe funkcje na wykopie: animowane avatary, przywrócenie listy plusujących wpisy i komentarze oraz przycisku Ulubione

Nainštalovať tento skript?
Autor skriptu navrhuje

Tiež sa vám môže páčiť Wykop XS 3.0.

Nainštalovať tento skript 
  1. // ==UserScript==
  2. // @name							Wykop XS - Lista plusujących, animowane awatary, mikroczat
  3. // @name:pl							Wykop XS - Lista plusujących, animowane awatary, mikroczat
  4. // @name:en							Wykop XS - Lista plusujących, animowane awatary, mikroczat
  5.  
  6. // @version							3.0.81
  7.  
  8. // @description 					Wykop XS - Darmowy dostęp do Mikroczatu. Dodatkowe funkcje na wykopie: animowane avatary, przywrócenie listy plusujących wpisy i komentarze oraz przycisku Ulubione
  9. // @description:en 					Wykop XS - Darmowy dostęp do Mikroczatu. Dodatkowe funkcje na wykopie: animowane avatary, przywrócenie listy plusujących wpisy i komentarze oraz przycisku Ulubione
  10.  
  11.  
  12. // Chcesz wesprzeć projekt Wykop X? Postaw kawkę:
  13. // @contributionURL					https://buycoffee.to/wykopx
  14.  
  15. // @author							Wykop X <wykopx@gmail.com>
  16.  
  17.  
  18.  
  19.  
  20.  
  21.  
  22.  
  23.  
  24.  
  25. // @match							https://wykop.pl/*
  26. // @supportURL						http://wykop.pl/tag/wykopx
  27. // @namespace						Violentmonkey Scripts
  28. // @compatible						chrome, firefox, opera, safari, edge
  29. // @license							No License
  30. // @icon							https://www.google.com/s2/favicons?sz=64&domain=wykop.pl
  31.  
  32.  
  33. // @require 						https://unpkg.com/localforage@1.10.0/dist/localforage.min.js
  34. // @require							https://cdn.jsdelivr.net/npm/dayjs@1.11.10/dayjs.min.js
  35. // @require							https://cdn.jsdelivr.net/npm/dayjs@1.11.10/locale/pl.js
  36. // @require							https://cdn.jsdelivr.net/npm/dayjs@1.11.10/plugin/relativeTime.js
  37.  
  38.  
  39.  
  40.  
  41.  
  42.  
  43. // ==/UserScript==
  44.  
  45.  
  46. 'use strict';
  47.  
  48. const currentVersion = "3.0.80";
  49. let dev = true;
  50.  
  51. const promoString = " - Wykop XS / #wykopx";
  52.  
  53.  
  54. const root = document.documentElement;
  55. const head = document.head;
  56. const body = document.body;
  57. const bodySection = body.querySelector("section");
  58.  
  59. dayjs.locale("pl");
  60. dayjs.extend(window.dayjs_plugin_relativeTime); 		//dayjs.extend(relativeTime); // https://day.js.org/docs/en/plugin/relative-time // https://www.jsdelivr.com/package/npm/dayjs?tab=files&path=plugin
  61.  
  62. const wykopxSettings = getComputedStyle(head);
  63. const settings = {};
  64.  
  65. const styleElement = document.createElement('style');
  66. styleElement.id = "wykopxs_mikroczat";
  67. let CSS = "";
  68.  
  69. function setSettingsValueFromCSSProperty(settingName, defaultValueForWykopXS = true, propertyValueInsteadOfBoolean = false)
  70. {
  71. 	if (propertyValueInsteadOfBoolean) settings[settingName] = wykopxSettings.getPropertyValue(`--${settingName}`) ? wykopxSettings.getPropertyValue(`--${settingName}`).trim() : defaultValueForWykopXS;
  72. 	else settings[settingName] = wykopxSettings.getPropertyValue(`--${settingName}`) ? wykopxSettings.getPropertyValue(`--${settingName}`).trim() === '1' : defaultValueForWykopXS;
  73. }
  74.  
  75. //setSettingsValueFromCSSProperty("WykopXSEnabled");
  76. //if (settings.WykopXSEnabled == false) return;
  77.  
  78.  
  79. /* WYKOP XS HEADER */
  80.  
  81.  
  82.  
  83.  
  84.  
  85.  
  86. /*  --- ZMIANA USTAWIEŃ ---
  87. jeśli chcesz zmienić domyślne ustawienia nie zmieniaj ich w tym kodzie.
  88. Zmień je w przeglądarce w następujący sposób:
  89.  
  90. 1. Wejdź na Wykop
  91. 2. Otwórz panel narzędzi deweloperskich klawiszem *F12* lub skrótem klawiaturowym *CTRL* + *SHIFT* + *C*
  92. 3. Przejdź na zakładkę "Aplikacja"
  93. 4. w panelu po lewej w sekcji "Pamięć" wybierz "Pamięć lokalna" i znajdź na liście https://wykop.pl
  94. 5. w głównym okienku pojawi się lista kilku wartości. Znajdź opcję "wykopx/settings/settings"
  95. 6. zmień wybraną opcję na true (aby ją włączyć) lub false (aby wyłączyć)
  96.  
  97.  
  98. Domyślne wartości wyglądają przykładowo tak:
  99.  
  100. {"entryVotersListExpandIfLessThan": 5, "votersFollow":true, "votersBlacklist":true, "votersBanned":true, "votersSuspended":true, "votersRemoved":true, "votersGenderF":false, "votersGenderM":false, "votersColorGreen":true, "votersColorOrange":false,"votersColorBurgundy":true}
  101.  
  102. */
  103.  
  104.  
  105.  
  106. // DEFAULT SETTINGS - nie zmieniaj wartości settings w kodzie.
  107. // Zmień je w sposób opisany powyżej
  108.  
  109. setSettingsValueFromCSSProperty("entryVotersListEnable");				// włącza pokazywanie listy plusujących z Wykop X Style
  110. setSettingsValueFromCSSProperty("entryVotersListExpandIfLessThan", 50, true);
  111. setSettingsValueFromCSSProperty("hideAds");								// blokuje wszystkie reklamy na wykopie
  112.  
  113.  
  114. // entryVotersListExpandIfLessThan - domyślnie Wykop pokazywał 5 osób, które zaplusowały. 
  115. // Możesz zmienić tę wartość na np. 10 albo 25. Jeśli wpis ma mniej plusów niż ta liczba, zostaną od razu wyświetleni wszyscy plusujący bez przycisku "+15 INNYCH"
  116.  
  117. settings.showAnimatedAvatars = true;					// pokazuje animowane avatary
  118.  
  119. if (settings.entryVotersListEnable)
  120. {
  121. 	// entryVotersListExpandIfLessThan - domyślnie Wykop pokazywał 5 osób, które zaplusowały.
  122. 	// Możesz zmienić tę wartość na np. 10 albo 25. Jeśli wpis ma mniej plusów niż ta liczba, zostaną od razu wyświetleni wszyscy plusujący bez przycisku "+15 INNYCH"
  123. 	if (!settings.entryVotersListExpandIfLessThan) settings.entryVotersListExpandIfLessThan = 20;
  124. 	settings.votersFollow = true;							// pokazuje 🔔 przed użytkownikami, których obserwujesz
  125. 	settings.votersBlacklist = true;						// pokazuje ⛔ przed użytkownikami, których blokujesz
  126. 	settings.votersBanned = true;							// pokazuje użytkowników z aktywnym banem w kolorze i z ikonką 🍌
  127. 	settings.votersSuspended = true;						// pokazuje ✖ przed kontami, które są w trakcie usuwania
  128. 	settings.votersRemoved = true;							// pokazuje ✖ przed kontami, które są usunięte
  129. 	settings.votersGenderF = false;							// pokazuje różową kropkę przed kobietami
  130. 	settings.votersGenderM = false;							// pokazuje niebieską kropkę przed mężczyznami
  131. 	settings.votersColorGreen = true;						// pokazuje zielonki w kolorze
  132. 	settings.votersColorOrange = false;						// pokazuje pomarańczowych użytkowników w kolorze
  133. 	settings.votersColorBurgundy = true;					// pokazuje użytkowników bordo w kolorze
  134. 	settings.votersFollowFirst = true;						// pokazuje użytkowników, których obserwujesz pierwszych na liście
  135. 	settings.votersBlackFirst = false;						// pokazuje plusy od moderacji pierwsze na liście (konta typu @wykop, @m__b, @a__s itd.)
  136. 	settings.votersBurgundyFirst = false;					// pokazuje użytkowników bordo pierwszych na liście
  137. 	settings.votersOrangeFirst = false;						// pokazuje zielonki pierwszych na liście
  138. 	settings.votersGreenFirst = false;						// pokazuje pomarańczki pierwszych na liście
  139. 	settings.votersBlacklistLast = false;					// pokazuje użytkowników, których zablokowałeś na końcu listy
  140. 	settings.votersRemovedLast = false;						// pokazuje usunięte konta na końcu listy
  141. 	settings.votersBannedLast = false;						// pokazuje zbanowanych na końcu listy
  142. 	settings.votersSuspendedLast = false;					// pokazuje konta w trakcie usuwania na końcu listy
  143. }
  144.  
  145. settings.hideShareButton = true;						// ukrywa przycisk "Udostępnij"
  146. settings.showFavouriteButton = true;					// pokazuje przycisk "Dodaj do ulubionych" (samą gwiazdkę)
  147. settings.showFavouriteButtonLabel = true;				// pokazuje oprócz gwiazdki także tekst "Ulubione"
  148. // settings.addCommentPlusWhenVotingOnEntry = false;		// gdy plusujesz wpis, dodaje komentarz "+1"
  149. // settings.addCommentPlusWhenVotingOnComment = false;		// gdy plusujesz komentarz, dodaje komentarz "+1"
  150.  
  151.  
  152.  
  153. settings.mikroczatShowLeftMenuButton = false;
  154. settings.mikroczatShowLeftMenuLink = true;
  155. settings.mikroczatShowTopNavButton = true;
  156. settings.mikroczatOpenMikroczatOnMiddleClick = false;
  157. settings.mikroczatOpenMikroczatOnCTRLLeftClick = true;
  158. settings.mikroczatOpenMikroczatOnCTRLMiddleClick = true;
  159.  
  160. (async function ()
  161. {
  162. 	// LOCALSTORAGE
  163. 	const localStorageSettings = localforage.createInstance({
  164. 		driver: localforage.LOCALSTORAGE,
  165. 		name: "wykopx",
  166. 		storeName: "settings",
  167. 	});
  168.  
  169. 	await localStorageSettings.getItem('settings').then(async (localSettings) =>
  170. 	{
  171. 		if (localSettings)
  172. 		{
  173. 			mergeSettings(localSettings, settings);
  174. 		}
  175. 		else
  176. 		{
  177. 			localStorageSettings.setItem('settings', settings);
  178. 		}
  179. 		await localStorageSettings.setItem('settings', settings);
  180. 	}).catch((err) =>
  181. 	{
  182. 		console.error('Error', err);
  183. 	});
  184. 	function mergeSettings(localSettings, defaultSettings)
  185. 	{
  186. 		for (let key in defaultSettings)
  187. 		{
  188. 			if (key in localSettings)
  189. 			{
  190. 				settings[key] = localSettings[key];
  191. 			}
  192.  
  193. 			else if (!(key in localSettings))
  194. 			{
  195. 				settings[key] = defaultSettings[key];
  196. 			}
  197.  
  198. 		}
  199. 	}
  200.  
  201.  
  202. 	function createNewNavBarButton(options)
  203. 	{
  204. 		let nav_ul;
  205.  
  206. 		if (options.position == "left") nav_ul = document.querySelector("body header div.left nav.main ul");
  207. 		else if (options.position == "center") nav_ul = document.querySelector("body header div.right nav aside"); // doodle
  208. 		else nav_ul = document.querySelector("body header div.right nav ul"); // brak na wersji mobilnej
  209.  
  210. 		if (nav_ul) 
  211. 		{
  212. 			let nav_ul_li;  // ! = nav_ul.querySelector(`li.wykopx_${options.class}_li`);
  213.  
  214. 			if (!nav_ul_li)
  215. 			{
  216. 				nav_ul_li = document.createElement("li");
  217.  
  218. 				if (options.data) nav_ul_li.setAttribute(options.data, null);
  219. 				if (options.hideWithoutXStyle == true) nav_ul_li.classList.add("wykopxs");
  220. 				addWykopXSClassesToElement(nav_ul_li, options.class, "li") // class="wykopx_aaaaaa_li"
  221.  
  222. 				let nav_ul_li_a = document.createElement("a");
  223.  
  224. 				nav_ul_li.dataset["v-6c2d0fdd"] = "";
  225. 				nav_ul_li_a.dataset["v-6c2d0fdd"] = "";
  226.  
  227. 				if (options.url) nav_ul_li_a.setAttribute("href", options.url);
  228. 				if (options.href) nav_ul_li_a.setAttribute("href", options.href);
  229. 				if (options.target) nav_ul_li_a.setAttribute("target", options.target);
  230. 				if (options.title) nav_ul_li_a.setAttribute("title", options.title);
  231. 				if (options.data) nav_ul_li_a.setAttribute(options.data, null);
  232.  
  233. 				nav_ul_li_a.classList.add("hybrid");
  234. 				if (options.class) addWykopXSClassesToElement(nav_ul_li_a, options.class);
  235.  
  236. 				let nav_ul_li_a_span = document.createElement("span");
  237. 				nav_ul_li_a_span.innerHTML = options.text;
  238.  
  239. 				nav_ul_li_a.appendChild(nav_ul_li_a_span);
  240. 				nav_ul_li.appendChild(nav_ul_li_a);
  241.  
  242. 				if (options.insertAfter != null)
  243. 				{
  244. 					let section = nav_ul.querySelector(options.insertAfter);
  245. 					section.insertAdjacentElement('afterend', nav_ul_li);
  246. 				}
  247. 				else
  248. 				{
  249. 					nav_ul.appendChild(nav_ul_li);
  250. 				}
  251. 			}
  252. 		}
  253. 	}
  254.  
  255.  
  256. 	function createLeftMenuButtons(asideLeftPanel = null)
  257. 	{
  258. 		if (dev) console.log("createLeftMenuButtons(), asideLeftPanel: ", asideLeftPanel);
  259.  
  260. 		if (!asideLeftPanel)
  261. 		{
  262. 			asideLeftPanel = document.querySelector("body > section > div.main-content > aside.left-panel");
  263. 		}
  264.  
  265. 		if (!asideLeftPanel) return;
  266.  
  267. 		let aside_section_div_ul_li = document.createElement('li');
  268.  
  269. 		aside_section_div_ul_li.classList.add('mikroczat');
  270. 		aside_section_div_ul_li.title = mikroczatButtonOpenTitle;
  271. 		aside_section_div_ul_li.innerHTML = `
  272. 			<div class="popper-button">
  273. 				<span>
  274. 					<span class="button">
  275. 						<a href="https://wykop.pl/czat" target="_mikroczat" class="wykopx_open_mikroczat hybrid">
  276. 							<span>${mikroczatButtonOpenLabel}</span>
  277. 						</a>
  278. 					</span>
  279. 				</span>
  280. 			</div>`;
  281.  
  282. 		if (settings.mikroczatShowLeftMenuButton)
  283. 		{
  284. 			const aside_section_buttons_div_ul = asideLeftPanel.querySelector("section.buttons > div.content > ul");
  285. 			if (aside_section_buttons_div_ul && !aside_section_buttons_div_ul.querySelector("li.mikroczat"))
  286. 			{
  287. 				let clone = aside_section_div_ul_li.cloneNode(true);
  288. 				aside_section_buttons_div_ul.appendChild(clone);
  289. 			}
  290. 		}
  291.  
  292. 		if (settings.mikroczatShowLeftMenuLink)
  293. 		{
  294. 			const aside_section_links_div_ul = asideLeftPanel.querySelector("section.links > div.content > ul");
  295. 			if (aside_section_links_div_ul && !aside_section_links_div_ul.querySelector("li.mikroczat"))
  296. 			{
  297.  
  298. 				let clone = aside_section_div_ul_li.cloneNode(true);
  299. 				aside_section_links_div_ul.appendChild(clone);
  300.  
  301. 			}
  302. 		}
  303. 	}
  304.  
  305.  
  306.  
  307.  
  308. 	function addWykopXSClassesToElement(element, inputClassOrArray, suffix = null)
  309. 	{
  310. 		if (inputClassOrArray)
  311. 		{
  312. 			if (typeof inputClassOrArray === 'string')
  313. 			{
  314. 				element.classList.add(`wykopx_${inputClassOrArray}${suffix != null ? "_" + suffix : ""}`);
  315. 			}
  316. 			else if (Array.isArray(inputClassOrArray) && inputClassOrArray.every(item => typeof item === 'string'))
  317. 			{
  318. 				inputClassOrArray.map(item =>
  319. 				{
  320. 					element.classList.add(`wykopx_${item}${suffix != null ? "_" + suffix : ""}`);
  321. 				});
  322. 			}
  323. 		}
  324. 	}
  325.  
  326.  
  327.  
  328.  
  329.  
  330. 	// XS MIKROCZAT  -- START
  331. 	let wykopDomain = "https://wykop.pl";
  332. 	let wxDomain = "https://wykopx.pl";
  333. 	const mikroczatDomain = "https://mikroczat.pl";
  334. 	const mikroczatPath = "/"; /* /czat */
  335. 	const mikroczatMainChannelPath = "czat";
  336. 	const mikroczaDefaultChannel = "mikroblog+";
  337. 	// let mikroczatChannel = "/";
  338. 	let mikroczatWindow = null;
  339. 	const mikroczatButtonOpenTitle = `Wykopowy Mikroczat
  340.  
  341. Otwieranie czatu w 𝗡𝗢𝗪𝗘𝗝 𝗞𝗔𝗥𝗖𝗜𝗘:
  342. - 𝗟𝗣𝗠 - klik lewym przyciskiem myszy
  343.  
  344. Otwieranie czatu w 𝗡𝗢𝗪𝗬𝗠 𝗢𝗞𝗡𝗜𝗘:
  345. - ŚPM - klik środkowym przyciskiem myszy
  346. - klawisz ⌘ 𝗖𝗧𝗥𝗟 + klik
  347. - klawisz ⇧ 𝗦𝗛𝗜𝗙𝗧 + klik
  348. - klawisz ⎇ 𝗔𝗟𝗧 + klik
  349.  
  350. EXTRA:
  351. - będąc na stronie #tagu otworzysz kanał tematyczny czatu
  352. - będąc na stronie wpisu otworzysz widok dyskusji
  353. - będąc na profilu użytkownika lub rozmowie otworzysz kanał prywatnej rozmowy
  354.     
  355. `;
  356.  
  357.  
  358.  
  359.  
  360. 	const mikroczatButtonOpenLabel = "Czat";
  361.  
  362.  
  363.  
  364.  
  365. 	// OTWIERANIE MIKROCZATU Z PRZYCISKÓW CZAT
  366. 	if (settings.mikroczatShowLeftMenuButton || settings.mikroczatShowLeftMenuLink || settings.mikroczatShowTopNavButton)
  367. 	{
  368.  
  369. 		document.addEventListener("mousedown", (e) =>
  370. 		{
  371. 			if (e.target.matches("a.wykopx_open_mikroczat") || e.target.matches("a.wykopx_open_mikroczat > span"))
  372. 			{
  373. 				e.preventDefault();
  374. 				e.stopImmediatePropagation();
  375. 				e.stopPropagation();
  376.  
  377. 				wykopx_open_mikroczat_event(e);
  378. 			}
  379. 		});
  380. 		document.addEventListener("click", (e) =>
  381. 		{
  382. 			if (e.target.matches("a.wykopx_open_mikroczat") || e.target.matches("a.wykopx_open_mikroczat > span"))
  383. 			{
  384. 				e.preventDefault();
  385. 			}
  386. 		});
  387. 		document.addEventListener("auxclick", (e) =>
  388. 		{
  389. 			if (e.target.matches("a.wykopx_open_mikroczat") || e.target.matches("a.wykopx_open_mikroczat > span"))
  390. 			{
  391. 				e.preventDefault();
  392. 			}
  393. 		});
  394.  
  395.  
  396. 		document.addEventListener("mouseout", (e) =>
  397. 		{
  398. 			if (e.target.matches("a.wykopx_open_mikroczat") && e.target.href != "https://wykop.pl/czat")
  399. 			{
  400. 				e.target.href = "https://wykop.pl/czat";
  401. 			}
  402. 		});
  403. 		document.addEventListener("contextmenu", (e) =>
  404. 		{
  405. 			if (e.target.matches("a.wykopx_open_mikroczat"))
  406. 			{
  407. 				e.target.href = "https://mikroczat.pl";
  408. 			}
  409. 			if (e.target.matches("a.wykopx_open_mikroczat > span"))
  410. 			{
  411. 				e.target.closest("a").href = "https://mikroczat.pl";
  412. 			}
  413. 		});
  414. 	}
  415.  
  416. 	function wykopx_open_mikroczat_event(e)
  417. 	{
  418. 		if (e.target.matches("a.wykopx_open_mikroczat") || e.target.matches("a.wykopx_open_mikroczat > span"))
  419. 		{
  420. 			if (e.button === 2) return; // RIGHT MOUSE CLICK OFF
  421.  
  422. 			let windowOptions = "";
  423.  
  424. 			if (e.shiftKey || e.ctrlKey || e.metaKey || e.altKey || e.button === 1) // ŚPM
  425. 			{
  426. 				windowOptions = "popup";
  427. 			}
  428.  
  429. 			openMikroczat(new URL(document.URL).pathname, windowOptions);
  430. 		}
  431. 	}
  432.  
  433.  
  434.  
  435. 	function openMikroczat(hrefURL, windowOptions, target = "mikroczat")
  436. 	{
  437. 		let urlPathnameArray = hrefURL;
  438. 		let mikroczatURL = `${mikroczatDomain}`;
  439.  
  440. 		if (hrefURL.startsWith("https://mikroczat.pl"))
  441. 		{
  442. 			mikroczatURL = hrefURL;
  443. 		}
  444. 		else
  445. 		{
  446. 			if (hrefURL.startsWith("https://wykop.pl"))
  447. 			{
  448. 				urlPathnameArray = hrefURL.replace("https://wykop.pl", "");
  449. 			}
  450.  
  451. 			urlPathnameArray = urlPathnameArray.split("/");
  452.  
  453. 			let channel = ""
  454.  
  455. 			if (Array.isArray(urlPathnameArray))
  456. 			{
  457. 				// #nazwatagu
  458. 				if (urlPathnameArray[1] == "tag")
  459. 				{
  460. 					channel = `${mikroczatMainChannelPath}/${urlPathnameArray[2]}`;
  461. 				}
  462. 				else if (urlPathnameArray[1] == "mikroblog")
  463. 				{
  464. 					if (urlPathnameArray[2] == "najnowsze")	 // /mikroblog/najnowsze
  465. 					{
  466. 						channel = `${mikroczatMainChannelPath}/mikroblog+`;
  467. 					}
  468. 					// TODO pathnameArray[2] == "aktywne"
  469. 					// TODO pathnameArray[2] == "gorace"
  470. 					else
  471. 					{
  472. 						channel = `${mikroczatMainChannelPath}/${mikroczaDefaultChannel}`; // TODO
  473. 					}
  474. 				}
  475. 				// /obserwowane
  476. 				else if (urlPathnameArray[1] == "obserwowane")  	
  477. 				{
  478. 					channel = `${mikroczatMainChannelPath}/observed`;					// Mikroczat "observed" 🤍
  479. 					// TODO pathnameArray[2] == "profile"
  480. 					// TODO pathnameArray[2] == "tagi"
  481. 				}
  482. 				// uzytkownik - profil lub rozmowa z użytkownikiem
  483. 				else if (urlPathnameArray[1] == "ludzie" || urlPathnameArray[1] == "wiadomosci")
  484. 				{
  485. 					channel = "pm/@" + urlPathnameArray[2];
  486. 				}
  487. 				else if (urlPathnameArray[1] == "wpis")
  488. 				{
  489. 					channel = `${mikroczatMainChannelPath}/${mikroczaDefaultChannel}/#${urlPathnameArray[2]}`; // id wpisu - discussion view
  490. 				}
  491. 				else if (urlPathnameArray[1] == "") // ze strony głównej
  492. 				{
  493. 					channel = `${mikroczatMainChannelPath}/observed/#wybierz`;
  494. 				}
  495. 				else // z innych stron
  496. 				{
  497. 					channel = `${mikroczatMainChannelPath}/observed/#wybierz`;
  498. 				}
  499. 			}
  500. 			mikroczatURL += `${mikroczatPath}${channel}`;
  501. 		}
  502.  
  503.  
  504. 		clearKeysDatasetFromBody();
  505.  
  506. 		mikroczatWindow = window.open(mikroczatURL, target, windowOptions);
  507. 	}
  508.  
  509.  
  510.  
  511.  
  512. 	function clearKeysDatasetFromBody()
  513. 	{
  514. 		if (bodySection.dataset.key_shift) delete bodySection.dataset.key_shift;
  515. 		if (bodySection.dataset.key_ctrl) delete bodySection.dataset.key_ctrl;
  516. 		if (bodySection.dataset.key_alt) delete bodySection.dataset.key_alt;
  517. 	}
  518.  
  519.  
  520.  
  521.  
  522.  
  523. 	const keys = {};
  524.  
  525.  
  526. 	// KEYDOWN CTRL SHIFT ALT
  527. 	if (settings.mikroczatOpenMikroczatOnCTRLLeftClick || settings.mikroczatOpenMikroczatOnCTRLMiddleClick)
  528. 	{
  529. 		document.addEventListener("keydown", (e) =>
  530. 		{
  531. 			if (e.target.tagName.toLowerCase() === 'textarea' || e.target.tagName.toLowerCase() === 'input') return;
  532. 			if (!keys["CTRL"] && e.key == "Control")
  533. 			{
  534. 				keys["CTRL"] = true;
  535. 				bodySection.dataset.key_ctrl = "true";
  536. 			}
  537. 			// if (!keys["SHIFT"] && e.key == "Shift")
  538. 			// {
  539. 			// 	keys["SHIFT"] = true;
  540. 			// 	bodySection.dataset.key_shift = "true";
  541. 			// }
  542. 			// if (!keys["ALT"] && (e.key == "Alt" || e.key == "AltGraph"))
  543. 			// {
  544. 			// 	keys["ALT"] = true;
  545. 			// 	bodySection.dataset.key_alt = "true";
  546. 			// }
  547. 		});
  548.  
  549. 		document.addEventListener("keyup", (e) =>
  550. 		{
  551. 			if (e.target.tagName.toLowerCase() === 'textarea' || e.target.tagName.toLowerCase() === 'input') return;
  552.  
  553. 			// if (keys["SHIFT"] && e.key == "Shift")
  554. 			// {
  555. 			// 	keys["SHIFT"] = false;
  556. 			// 	delete bodySection.dataset.key_shift;
  557. 			// }
  558. 			if (keys["CTRL"] && e.key == "Control")
  559. 			{
  560. 				keys["CTRL"] = false;
  561. 				delete bodySection.dataset.key_ctrl;
  562. 			}
  563. 			// if (keys["ALT"] && (e.key == "Alt" || e.key == "AltGraph"))
  564. 			// {
  565. 			// 	keys["ALT"] = false;
  566. 			// 	delete bodySection.dataset.key_alt;
  567. 			// }
  568. 		});
  569. 	}
  570.  
  571.  
  572.  
  573.  
  574. 	const performanceObserver = new PerformanceObserver((PerformanceObserverEntryList, PerformanceObserver) =>
  575. 	{
  576. 		if (settings.mikroczatOpenMikroczatOnCTRLLeftClick || settings.mikroczatOpenMikroczatOnCTRLMiddleClick)
  577. 		{
  578. 			clearKeysDatasetFromBody();
  579. 		}
  580.  
  581. 		if (dev) console.log("PerformanceObserverEntryList", PerformanceObserverEntryList);
  582. 		if (dev) console.log("PerformanceObserverEntryList.getEntries", PerformanceObserverEntryList.getEntries()[0].name);
  583. 		/*
  584. 		{
  585. 			duration: 0
  586. 			entryType: "soft-navigation",
  587. 			name: "https://wykop.pl/wpis/76597433/ponad-700-wykopow-glowna-i-poprawnosc-polityczna-m#268853079",
  588. 			navigationId: "229d696d-dc59-4874-a63b-fd753787d4fd",
  589. 			source: Window {0: Window, 1: global, 2: global, 3: global, 4: global, 5: global, 6: global, 7: global, 8: global, 9: global, 10: global, 11: global, 12: global, 13: Window, 14: global, window: Window, self: Window, document: document, name: '', location: Location, …}
  590. 			startTime: 82282.70000000298
  591. 		}
  592. 		*/
  593. 	});
  594. 	performanceObserver.observe({ type: "soft-navigation", buffered: true });
  595.  
  596.  
  597.  
  598.  
  599.  
  600.  
  601. 	document.addEventListener("mouseover", (e) =>
  602. 	{
  603. 		if (!e.target.matches(`a[href^="https://mikroczat.pl"]`)) return;
  604.  
  605. 		e.target.title = `Otwórz wykopowy Mikroczat`;
  606.  
  607. 		e.target.addEventListener("click", mikroczatHrefClickEventListenerPreventDefault);
  608. 		e.target.addEventListener("auxclick", mikroczatHrefClickEventListenerPreventDefault);
  609. 		e.target.addEventListener("mousedown", mikroczatHrefMouseDownEventListenerWithShift);
  610. 	});
  611.  
  612. 	document.addEventListener("mouseout", (e) =>
  613. 	{
  614. 		if (!e.target.matches(`a[href^="https://mikroczat.pl"]`)) return;
  615. 		removeEventListenersFromMikroczatHref(e.target);
  616. 	});
  617.  
  618. 	function mikroczatHrefClickEventListenerPreventDefault(e)
  619. 	{
  620. 		e.preventDefault();
  621. 	}
  622.  
  623. 	function removeEventListeners(etarget)
  624. 	{
  625. 		etarget.removeEventListener("click", hrefClickEventListenerPreventDefault, true);
  626. 		etarget.removeEventListener("mousedown", hrefMouseDownEventListenerWithShift, true);
  627. 	}
  628. 	function removeEventListenersFromMikroczatHref(etarget)
  629. 	{
  630. 		etarget.removeEventListener("click", mikroczatHrefClickEventListenerPreventDefault, true);
  631. 		etarget.removeEventListener("auxclick", mikroczatHrefClickEventListenerPreventDefault, true);
  632. 		etarget.removeEventListener("mousedown", mikroczatHrefMouseDownEventListenerWithShift, true);
  633. 	}
  634.  
  635.  
  636.  
  637. 	// MOUSE OVER LINKS
  638. 	if (settings.mikroczatOpenMikroczatOnCTRLLeftClick || settings.mikroczatOpenMikroczatOnCTRLMiddleClick || settings.mikroczatOpenMikroczatOnMiddleClick)
  639. 	{
  640. 		document.addEventListener("mouseover", (e) =>
  641. 		{
  642. 			if (!e.target.matches(`a[href^="/tag/"]`)
  643. 				&& !e.target.matches(`a[href^="/ludzie/"]`)
  644. 				// && !e.target.matches(`a.username[href^="/ludzie/"] > span`)
  645. 				//&& !e.target.matches(`a[href^="/ludzie/"]:not(:has(> span))`)
  646. 				&& !e.target.matches(`a[href^="/wpis/"] > time`)) return;
  647.  
  648. 			// ⇧ 𝗦𝗛𝗜𝗙𝗧
  649. 			// ⌘ 𝗖𝗧𝗥𝗟
  650. 			// ⎇ 𝗔𝗟𝗧 
  651. 			// #heheszki
  652.  
  653.  
  654.  
  655. 			if (e.target.matches(`a[href^="/tag/"]`))
  656. 			{
  657. 				e.target.addEventListener("click", hrefClickEventListenerPreventDefault);
  658. 				e.target.addEventListener("auxclick", hrefClickEventListenerPreventDefault);
  659. 				e.target.addEventListener("mousedown", hrefMouseDownEventListenerWithShift);
  660. 				// e.target.addEventListener("mouseup", hrefMouseUpEventListenerWithShift, true);
  661.  
  662. 				e.target.title = `Klikając w tag wciśnij klawisz 𝗖𝗧𝗥𝗟,
  663. lub kliknij w tag śordkowym przyciskiem myszy,
  664. żeby otworzyć na 🗯 𝗠𝗶𝗸𝗿𝗼𝗰𝘇𝗮𝗰𝗶𝗲 kanał tematyczny 
  665.  
  666. Kanał tematyczny #${e.target.innerText}:
  667.  
  668. ⌘ 𝗖𝗧𝗥𝗟 + kliknięcie LPM - w nowej karcie
  669. ⌘ 𝗖𝗧𝗥𝗟 + kliknięcie ŚPM - w nowym oknie
  670. `;
  671. 			}
  672.  
  673. 			// @NadiaFrance
  674. 			else if (e.target.matches(`a[href^="/ludzie/"]`))
  675. 			{
  676. 				e.target.addEventListener("click", hrefClickEventListenerPreventDefault);
  677. 				e.target.addEventListener("auxclick", hrefClickEventListenerPreventDefault);
  678. 				e.target.addEventListener("mousedown", hrefMouseDownEventListenerWithShift);
  679. 				// e.target.addEventListener("mouseup", hrefMouseUpEventListenerWithShift, true);
  680.  
  681. 				e.target.title = `Wciśnij klawisz 𝗖𝗧𝗥𝗟 klikając w login użytkownika,
  682. aby otworzyć rozmowę prywatną (PM) na 🗯 Mikroczacie
  683.  
  684. Rozmowa prywatna:
  685. ⌘ 𝗖𝗧𝗥𝗟 + kliknięcie LPM - w nowej karcie
  686. ⌘ 𝗖𝗧𝗥𝗟 + kliknięcie ŚPM - w nowym oknie
  687. `;
  688. 			}
  689. 			// PERMALINK DO WPISU
  690. 			else if (e.target.matches(`a[href^="/wpis/"] > time`))
  691. 			{
  692. 				e.target.addEventListener("click", hrefClickEventListenerPreventDefault);
  693. 				e.target.addEventListener("auxclick", hrefClickEventListenerPreventDefault);
  694. 				e.target.addEventListener("mousedown", hrefMouseDownEventListenerWithShift);
  695.  
  696. 				// e.target.addEventListener("mouseup", hrefMouseUpEventListenerWithShift, true);
  697.  
  698. 				const dateObj = dayjs(e.target.dateTime);
  699. 				const dateFull = dateObj.format('D MMMM YYYY');
  700. 				const timeFull = dateObj.format('HH:mm:ss');
  701. 				const dateDayOfWeek = dateObj.format('dddd');
  702. 				const daysAgo = dateObj.fromNow();
  703.  
  704. 				e.target.title = `Dodany: 
  705. ⌚ ${daysAgo}, ${timeFull}
  706. 📅 ${dateDayOfWeek}, ${dateFull} r.
  707.  
  708. Klikając w datę wpisu/komentarza wciśnij klawisz 𝗖𝗧𝗥𝗟
  709. lub kliknij datę środkowym przyciskiem myszy, 
  710. żeby otworzyć całą dyskusję ze wszystkimi komentarzami na 🗯 𝗠𝗶𝗸𝗿𝗼𝗰𝘇𝗮𝗰𝗶𝗲 
  711.  
  712. Widok dyskusji:
  713.  
  714. ⌘ 𝗖𝗧𝗥𝗟 + kliknięcie LPM - w nowej karcie
  715. ⌘ 𝗖𝗧𝗥𝗟 + kliknięcie ŚPM - w nowym oknie
  716. `;
  717. 			}
  718.  
  719. 		});
  720.  
  721.  
  722. 		// MOUSE OUT
  723. 		document.addEventListener("mouseout", (e) =>
  724. 		{
  725. 			if (e.target.matches(`a[href^="/tag/"]`) || e.target.matches(`a[href^="/ludzie/"]`) || e.target.matches(`a[href^="/wpis/"] > time`))
  726. 			{
  727. 				removeEventListeners(e.target);
  728. 			}
  729. 		});
  730. 	}
  731.  
  732.  
  733.  
  734.  
  735.  
  736. 	// CLICK EVENT
  737. 	function hrefClickEventListenerPreventDefault(e)
  738. 	{
  739. 		// ŚPM
  740. 		if (settings.mikroczatOpenMikroczatOnMiddleClick)
  741. 		{
  742. 			if (e.button === 1 && !e.shiftKey && !e.altKey && !e.ctrlKey && !e.metaKey) 
  743. 			{
  744. 				e.preventDefault();
  745. 			}
  746. 		}
  747.  
  748. 		// ŚPM + CTRL
  749. 		if (settings.mikroczatOpenMikroczatOnCTRLMiddleClick)
  750. 		{
  751. 			if (e.button === 1 && !e.shiftKey && !e.altKey && (e.ctrlKey || e.metaKey))
  752. 			{
  753. 				e.preventDefault();
  754. 			}
  755. 		}
  756. 		// LPM + CTRL
  757. 		if (settings.mikroczatOpenMikroczatOnCTRLLeftClick)
  758. 		{
  759. 			if (e.button === 0 && !e.shiftKey && !e.altKey && (e.ctrlKey || e.metaKey))
  760. 			{
  761. 				e.preventDefault();
  762. 			}
  763. 		}
  764. 	}
  765.  
  766.  
  767. 	function mikroczatHrefMouseDownEventListenerWithShift(e)
  768. 	{
  769. 		// new window
  770. 		if (e.button === 1 // ŚPM
  771. 			|| (e.button === 0 && !e.shiftKey && !e.altKey && (e.ctrlKey || e.metaKey)) // LPM + CTRL
  772. 		) 
  773. 		{
  774. 			e.preventDefault();
  775. 			e.stopImmediatePropagation();
  776. 			e.stopPropagation();
  777. 			let ahrefElement = e.target;
  778. 			if (e.target.tagName != "A") ahrefElement = e.target.closest("a"); // <a><span>
  779. 			openMikroczat(ahrefElement.href, "popup"); // new window popup
  780. 		}
  781.  
  782. 		// LPM
  783. 		else if (e.button === 0)
  784. 		{
  785. 			e.preventDefault();
  786. 			e.stopImmediatePropagation();
  787. 			e.stopPropagation();
  788. 			let ahrefElement = e.target;
  789. 			openMikroczat(ahrefElement.href, null, "_blank"); // new tab
  790. 		}
  791. 	}
  792.  
  793.  
  794.  
  795. 	// MOUSE DOWN
  796. 	function hrefMouseDownEventListenerWithShift(e)
  797. 	{
  798. 		// ŚPM
  799. 		if (settings.mikroczatOpenMikroczatOnMiddleClick)
  800. 		{
  801. 			if (e.button === 1 && !e.shiftKey && !e.altKey && !e.ctrlKey && !e.metaKey) 
  802. 			{
  803. 				e.preventDefault();
  804. 				e.stopImmediatePropagation();
  805. 				e.stopPropagation();
  806.  
  807. 				let ahrefElement = e.target;
  808. 				if (e.target.tagName != "A") ahrefElement = e.target.closest("a"); // <a><time>
  809.  
  810. 				openMikroczat(ahrefElement.href, null, "_blank"); // new tab
  811. 			}
  812. 		}
  813.  
  814. 		// ŚPM + CTRL
  815. 		if (settings.mikroczatOpenMikroczatOnCTRLMiddleClick)
  816. 		{
  817. 			if (e.button === 1 && !e.shiftKey && !e.altKey && (e.ctrlKey || e.metaKey))
  818. 			{
  819. 				e.preventDefault();
  820. 				e.stopImmediatePropagation();
  821. 				e.stopPropagation();
  822.  
  823. 				let ahrefElement = e.target;
  824. 				if (e.target.tagName != "A") ahrefElement = e.target.closest("a"); // <a><time>
  825.  
  826. 				openMikroczat(ahrefElement.href, "popup"); // new window popup
  827. 			}
  828. 		}
  829. 		// LPM + CTRL
  830. 		if (settings.mikroczatOpenMikroczatOnCTRLLeftClick)
  831. 		{
  832. 			if (e.button === 0 && !e.shiftKey && !e.altKey && (e.ctrlKey || e.metaKey))
  833. 			{
  834. 				e.preventDefault();
  835. 				e.stopImmediatePropagation();
  836. 				e.stopPropagation();
  837.  
  838. 				let ahrefElement = e.target;
  839. 				if (e.target.tagName != "A") ahrefElement = e.target.closest("a"); // <a><time>
  840.  
  841. 				openMikroczat(ahrefElement.href, null, "_blank"); // new tab
  842. 			}
  843. 		}
  844.  
  845. 	}
  846.  
  847.  
  848.  
  849.  
  850.  
  851.  
  852.  
  853.  
  854.  
  855.  
  856.  
  857.  
  858.  
  859.  
  860.  
  861.  
  862.  
  863. 	// WIADOMOŚCI OD MIKROCZAT.PL
  864. 	window.addEventListener('message', function (event)
  865. 	{
  866. 		if (event.origin !== mikroczatDomain) return;
  867. 		if (dev) console.log('Wiadomość z mikroczat.pl', event.data);
  868.  
  869. 		//if (event.data == "MikroCzatOpened") mikroczatWindow.postMessage({ type: "token", token: window.localStorage.getItem("token") }, mikroczatDomain);
  870.  
  871. 		if (event.data == "MikroCzatOpened")
  872. 		{
  873. 			mikroczatWindow.postMessage({ type: "TokensObject", userKeep: window.localStorage.getItem("userKeep") }, mikroczatDomain);
  874. 			// mikroczatWindow.postMessage({ type: "TokensObject", token: window.localStorage.getItem("token"), userKeep: window.localStorage.getItem("userKeep") }, mikroczatDomain);
  875. 		}
  876.  
  877. 		if (event.data == "MikroCzatLoggedIn")
  878. 		{
  879. 			if (dev) console.log("event.data", event.data)
  880. 			bodySection.dataset.mikroczatLogged = true;
  881. 		}
  882.  
  883. 		if (event.data == "MikroCzatClosed")
  884. 		{
  885. 			bodySection.dataset.mikroczatLogged = false;
  886. 			mikroczatWindow = null;
  887. 		}
  888. 	}, false);
  889.  
  890.  
  891.  
  892.  
  893. 	// CSS
  894. 	{
  895. 		CSS += `
  896. 		/* LEFT MENU MIKROCZAT BUTTON - START */
  897.  
  898. 		body aside.left-panel > section.links > div.content > ul > li
  899. 		{
  900. 			position: relative;
  901. 			transition: none;
  902. 		}
  903.  
  904. 		body aside.left-panel:not(.mini):has(section.buttons > div.content > ul > li.mikroczat) > section.links > div.content > ul > li.mikroczat
  905. 		{
  906. 			display: none;
  907. 		}
  908. 		body aside.left-panel > section.links > div.content > ul > li a.hybrid[class] 								/* [data-v-5687662b] */
  909. 		{
  910. 			padding: 0 6px;
  911. 			display: block;
  912. 			-webkit-box-sizing: border-box;
  913. 			box-sizing: border-box;
  914. 			font-weight: 400;
  915. 			text-decoration: none;
  916. 			font-size: 16px;
  917. 			line-height: 36px;
  918. 			height: 36px;
  919.  
  920. 			cursor: pointer;
  921. 			transition: none;
  922. 		}
  923. 		body aside.left-panel > section.links > div.content > ul > li a.hybrid[class]:before						/* [data-v-5687662b] */
  924. 		{
  925. 			content: '';
  926. 			display: block;
  927. 			position: absolute;
  928. 			-webkit-mask-repeat: no-repeat;
  929. 			mask-repeat: no-repeat;
  930. 			-webkit-mask-position: center;
  931. 			mask-position: center;
  932. 			-webkit-mask-size: cover;
  933. 			mask-size: cover;
  934. 			background: var(--gullGray);
  935. 			top: 50%;
  936. 			left: 24px;
  937. 			z-index: 1;
  938. 			transition: none;
  939. 		}
  940. 		
  941. 		body aside.left-panel > section.links > div.content > ul > li.mikroczat a.hybrid[class]:before
  942. 		{
  943. 			-webkit-mask-image: url(https://i.imgur.com/82a9CyK.png);
  944. 			mask-image: url(https://i.imgur.com/82a9CyK.png);
  945. 			-webkit-mask-size: 22px 22px;
  946. 			mask-size: 22px 22px;
  947. 			width: 22px;
  948. 			height: 22px;
  949. 			margin-top: 0px;
  950.  
  951. 			transition: none;
  952. 		}
  953. 		body aside.left-panel > section.links > div.content > ul > li.mikroczat a.hybrid[class]:before
  954. 		{
  955. 			top: 7px;
  956. 			left: 13px;
  957. 		}
  958.  
  959. 		body aside.left-panel > section.links > div.content > ul > li a > span
  960. 		{
  961. 			display: block;
  962. 			padding: 0 16px 0 38px;
  963. 			border-radius: 6px;
  964. 			white-space: nowrap;
  965. 			overflow: hidden;
  966. 			text-overflow: ellipsis;
  967. 			position: relative;
  968.  
  969. 			/* em */
  970. 			font-style: normal;
  971. 			color: var(--steelBluish);
  972. 			transition: none;
  973. 			position: relative;
  974. 		}
  975.  
  976. 		body aside.left-panel > section.links > div.content > ul > li:hover a > span
  977. 		{
  978. 			background: var(--squeeze);
  979. 			cursor: pointer;
  980. 		}
  981. 	
  982. 		body aside.left-panel.mini > section.links > div.content > ul > li.mikroczat a > span
  983. 		{
  984. 			font-size: 0;
  985. 		}
  986. 		`;
  987.  
  988.  
  989. 		//if (settings.mikroczatShowLeftMenuButton)
  990. 		{
  991. 			CSS += `
  992. 			/* 4 BUTTONS */
  993. 			body aside.left-panel:not(.mini) > section.buttons > div.content > ul:has(li.mikroczat)
  994. 			{
  995. 				display: flex;
  996. 				flex-wrap: wrap;
  997. 				justify-content: space-around;
  998. 				column-gap: 0px;
  999. 			}
  1000. 			body aside.left-panel:not(.mini) > section.buttons > div.content > ul > li
  1001. 			{
  1002. 				flex-basis: 47%;
  1003. 				box-sizing: border-box;
  1004. 				padding: 0px;
  1005. 				margin-top: 7px;
  1006. 			}
  1007.  
  1008. 			body aside.left-panel > section > div.content > ul > li
  1009. 			{
  1010. 				position: relative;
  1011. 				cursor: pointer;
  1012. 			}
  1013.  
  1014. 			body aside.left-panel.mini > section > div.content > ul > li:hover,
  1015. 			body aside.left-panel:not(.mini) > section.buttons > div.content > ul > li:hover a::before
  1016. 			{
  1017. 				background: var(--squeeze);
  1018. 			}
  1019.  
  1020. 			aside.left-panel>section.buttons>.content ul li a 									/* [data-v-5687662b] */
  1021. 			{
  1022. 				display: block;
  1023. 				position: relative;
  1024. 				color: var(--steelBluish);
  1025. 				font-size: 0;
  1026. 			}
  1027.  
  1028. 			aside.left-panel>section.buttons>.content ul li.active a, 							/* [data-v-5687662b] */
  1029. 			aside.left-panel>section.buttons>.content ul li:hover a 							/* [data-v-5687662b] */
  1030. 			{
  1031. 				color: var(--tuna);
  1032. 				font-weight: 600;
  1033. 			}
  1034.  
  1035. 			aside.left-panel>section.buttons>.content ul li a:before 							/* [data-v-5687662b] */
  1036. 			{
  1037. 				content: '';
  1038. 				display: block;
  1039. 				width: 100%;
  1040. 				height: 36px;
  1041. 				border: 1px solid var(--porcelain);
  1042. 				border-radius: 6px;
  1043. 				box-sizing: border-box;
  1044. 				transition: background .2s ease, border .2s ease;
  1045. 			}
  1046. 			[data-night-mode] aside.left-panel>section.buttons>.content ul li a:before 			/* [data-v-5687662b] */
  1047. 			{
  1048. 				border-color: #303032;
  1049. 			}
  1050.  
  1051. 			aside.left-panel:not(.mini)>section.buttons>.content ul li:hover a:before,
  1052. 			[data-night-mode] aside.left-panel:not(.mini)>section.buttons>.content ul li:hover a:before
  1053. 			{
  1054. 				border-color: var(--tuna);
  1055. 			}
  1056.  
  1057. 			aside.left-panel:not(.mini)>section.buttons>.content ul li a:after 							/* [data-v-5687662b] */
  1058. 			{
  1059. 				content: '';
  1060. 				display: block;
  1061. 				position: absolute;
  1062. 				-webkit-mask-repeat: no-repeat;
  1063. 				mask-repeat: no-repeat;
  1064. 				-webkit-mask-position: center;
  1065. 				mask-position: center;
  1066. 				background: var(--gullGray);
  1067. 				height: 34px;
  1068. 				width: 100%;
  1069. 				top: 0;
  1070. 				left: 0;
  1071. 				-webkit-transition: background .2s ease;
  1072. 				transition: background .2s ease;
  1073. 			}
  1074.  
  1075. 			aside.left-panel:not(.mini)>section.buttons>.content ul li.mikroczat a:after 					/* [data-v-5687662b] */
  1076. 			{
  1077. 				-webkit-mask-image: url(https://i.imgur.com/82a9CyK.png);
  1078. 				mask-image: url(https://i.imgur.com/82a9CyK.png);
  1079. 				-webkit-mask-size: 22px 22px;
  1080. 				mask-size: 22px 22px;
  1081. 			}
  1082. 	
  1083. 			aside.left-panel:not(.mini)>section.buttons>.content ul li a>span 								/*[data-v-5687662b] */
  1084. 			{
  1085. 				position: relative;
  1086. 				display: inline-block;
  1087. 				font-size: 11px;
  1088. 				left: 50%;
  1089. 				-webkit-transform: translateX(-50%);
  1090. 				transform: translateX(-50%);
  1091. 				white-space: nowrap;
  1092. 				margin-top: 2px;
  1093. 				line-height: 16px;
  1094. 				height: 16px;
  1095. 			}`;
  1096. 			/* LEFT MENU MIKROCZAT BUTTON - END */
  1097. 		}
  1098.  
  1099.  
  1100.  
  1101.  
  1102. 		/* MIKROCZAT TAG LINKS */
  1103. 		CSS += `
  1104. 			section:is(.entry-content, .link-block)[class]
  1105. 			{ overflow: visible!important; }
  1106.  
  1107. 			section:is(.entry-content, .link-block) a[href^="/tag/"]
  1108. 			{
  1109. 				padding-right: 2px !important;
  1110. 				margin-right: 1px;
  1111. 				transition: none!important;
  1112. 			}
  1113.  
  1114. 			section:is(.entry-content, .link-block) a[href^="https://mikroczat.pl/"]
  1115. 			{
  1116. 				padding-right: 2px!important;
  1117. 				padding-left: 2px!important;
  1118. 			}
  1119.  
  1120.  
  1121.  
  1122.  
  1123. 			section.sidebar a[href^="/tag/"],
  1124. 			section:is(.entry-content, .link-block) a[href^="/tag/"],
  1125. 			section.entry div.right a[href^="/wpis/"],
  1126. 			section.entry-content a[href^="/ludzie/"],
  1127. 			section.entry div.right a.username[href^="/ludzie/"],
  1128. 			section.link-block a.username[href^="/ludzie/"],
  1129. 			section.entry-content .wrapper a[href^="https://mikroczat.pl/"]
  1130. 			{
  1131. 				border: 1px solid transparent!important;
  1132. 				position: relative!important;
  1133. 				cursor: pointer!important;
  1134. 				transition: none!important;
  1135. 			}
  1136.  
  1137.  
  1138.  
  1139.  
  1140. 			body > section[data-key_ctrl="true"] 	section.sidebar a[href^="/tag/"],
  1141. 			body > section[data-key_ctrl="true"] 	section:is(.entry-content, .link-block) a[href^="/tag/"],
  1142. 			body > section[data-key_ctrl="true"] 	section:is(.entry-content, .link-block) a[href^="/tag/"] *,
  1143. 			body > section[data-key_ctrl="true"] 	section.entry div.right a[href^="/wpis/"] *,
  1144. 			body > section[data-key_ctrl="true"] 	section.entry-content a[href^="https://mikroczat.pl/"],
  1145. 			body > section[data-key_ctrl="true"] 	section.entry-content a[href^="https://mikroczat.pl/"] *
  1146. 			{
  1147. 				color: var(--tagChannelColor)!important;
  1148. 			}
  1149. 			body > section[data-key_ctrl="true"] 	section.sidebar a[href^="/tag/"],
  1150. 			body > section[data-key_ctrl="true"] 	section:is(.entry-content, .link-block) a[href^="/tag/"],
  1151. 			body > section[data-key_ctrl="true"] 	section.entry div.right a[href^="/wpis/"],
  1152. 			body > section[data-key_ctrl="true"] 	section.entry-content a[href^="https://mikroczat.pl/"]
  1153. 			{
  1154. 				border-color: var(--tagChannelColor)!important;
  1155. 				background-color: color-mix(in srgb, var(--whitish) 90%, var(--tagChannelColor))!important;
  1156. 				border-radius: var(--smallBorderRadius)!important;
  1157. 			}
  1158. 			body > section[data-key_ctrl="true"] 	section.sidebar a[href^="/tag/"]:hover,
  1159. 			body > section[data-key_ctrl="true"] 	section:is(.entry-content, .link-block) a[href^="/tag/"]:hover,
  1160. 			body > section[data-key_ctrl="true"] 	section.entry div.right a[href^="/wpis/"]:hover,
  1161. 			body > section[data-key_ctrl="true"] 	section.entry-content a[href^="https://mikroczat.pl/"]:hover
  1162. 			{
  1163. 				background-color: color-mix(in srgb, var(--whitish) 60%, var(--tagChannelColor))!important;
  1164. 			}
  1165. 			body > section[data-key_ctrl="true"] 	section.sidebar a[href^="/tag/"],
  1166. 			body > section[data-key_ctrl="true"] 	section:is(.entry-content, .link-block) a[href^="/tag/"],
  1167. 			body > section[data-key_ctrl="true"] 	section.entry-content a[href^="/ludzie/"],
  1168. 			body > section[data-key_ctrl="true"] 	section.link-block a.username[href^="/ludzie/"]
  1169. 			{
  1170. 				padding-left: 3px !important;
  1171. 				margin-left: -12px !important;
  1172. 			}
  1173. 			body > section[data-key_ctrl="true"] 	section.sidebar a[href^="/tag/"]:hover,
  1174. 			body > section[data-key_ctrl="true"] 	section:is(.entry-content, .link-block) a[href^="/tag/"]:hover,
  1175. 			body > section[data-key_ctrl="true"] 	section.entry div.right a[href^="/wpis/"]:hover,
  1176. 			body > section[data-key_ctrl="true"] 	section:is(.entry-content, .link-block) a[href^="/ludzie/"]:hover
  1177. 			{
  1178. 				text-decoration: none!important;
  1179. 			}
  1180. 			body > section[data-key_ctrl="true"] 	section.sidebar a[href^="/tag/"]::before,
  1181. 			body > section[data-key_ctrl="true"] 	section:is(.entry-content, .link-block) a[href^="/tag/"]::before
  1182. 			{
  1183. 				content: "#";
  1184. 			}
  1185.  
  1186.  
  1187.  
  1188.  
  1189. 			body > section[data-key_ctrl="true"] 	section.entry-content a[href^="/ludzie/"],
  1190. 			body > section[data-key_ctrl="true"] 	section.entry div.right a.username[href^="/ludzie/"],
  1191. 			body > section[data-key_ctrl="true"] 	section.link-block a.username[href^="/ludzie/"],
  1192. 			body > section[data-key_ctrl="true"] 	section.entry-content a[href^="https://mikroczat.pl/pm/"],
  1193. 			body > section[data-key_ctrl="true"] 	section.entry-content a[href^="https://mikroczat.pl/room/"]
  1194. 			{
  1195. 				color: var(--pmChannelColor)!important;
  1196. 				border-color: var(--pmChannelColor)!important;
  1197. 				background-color: color-mix(in srgb, var(--whitish) 90%, var(--pmChannelColor))!important;
  1198. 				padding: 0px 3px;
  1199. 				margin-left: 3px;
  1200. 			}
  1201. 			body > section[data-key_ctrl="true"] 	section.entry-content a[href^="/ludzie/"]:hover,
  1202. 			body > section[data-key_ctrl="true"] 	section.entry div.right a.username[href^="/ludzie/"]:hover,
  1203. 			body > section[data-key_ctrl="true"] 	section.link-block a.username[href^="/ludzie/"]:hover,
  1204. 			body > section[data-key_ctrl="true"] 	section.entry-content a[href^="https://mikroczat.pl/pm/"]:hover,
  1205. 			body > section[data-key_ctrl="true"] 	section.entry-content a[href^="https://mikroczat.pl/room/"]:hover
  1206. 			{
  1207. 				background-color: color-mix(in srgb, var(--whitish) 60%, var(--pmChannelColor))!important;
  1208. 			}
  1209. 			body > section[data-key_ctrl="true"] 	section.entry-content a[href^="/ludzie/"]::before,
  1210. 			body > section[data-key_ctrl="true"] 	section.entry div.right a.username[href^="/ludzie/"]::before,
  1211. 			body > section[data-key_ctrl="true"] 	section.link-block a.username[href^="/ludzie/"]::before
  1212. 			{
  1213. 				content: "";
  1214. 			}
  1215.  
  1216. 		`;
  1217.  
  1218.  
  1219.  
  1220. 		// /*
  1221. 		// 	body > section[data-key_ctrl="true"] 	section.entry-content a[href^="/tag/"]::after,
  1222. 		// 	body > section[data-key_ctrl="true"] 	section.entry-content a[href^="/ludzie/"]::after,
  1223. 		// 	body > section[data-key_ctrl="true"] 	section.entry div.right a.username[href^="/ludzie/"]::after,
  1224. 		// 	body > section[data-key_ctrl="true"] 	section.entry-content a[href^="https://mikroczat.pl/"]::after
  1225. 		// 	{
  1226. 		// 		color: white;
  1227. 		// 		content: "🗯";
  1228. 		// 		position: absolute;
  1229. 		// 		top: -1em;
  1230. 		// 		right: -0.5em;
  1231. 		// 	}
  1232. 		// */
  1233.  
  1234.  
  1235.  
  1236.  
  1237. 		CSS += `
  1238. 			/* TOP NAV CZAT BUTTON */
  1239. 			body > section.open-left-panel > header.header > div.left > nav.main > ul > li.wykopx_open_mikroczat_li
  1240. 			{
  1241. 				display: none;
  1242. 			}
  1243. 			/*body > section[data-mikroczat-logged="true"] li.wykopx_open_mikroczat_li span:after
  1244. 			{
  1245. 				content: "•";
  1246. 				color: white;
  1247. 				position: absolute;
  1248. 				top: 4px;
  1249. 				right: 5px;
  1250. 			}*/
  1251. 			body > section[data-mikroczat-logged="false"] li.wykopx_open_mikroczat_li span:after
  1252. 			{
  1253. 				content: "•";
  1254. 				color: rgb(255, 255, 255, 0.3);
  1255. 				position: absolute;
  1256. 				top: 4px;
  1257. 				right: 5px;
  1258. 			}`;
  1259. 	}
  1260.  
  1261.  
  1262.  
  1263.  
  1264.  
  1265.  
  1266.  
  1267. 	function throttle(func, delay)
  1268. 	{
  1269. 		let promise = Promise.resolve();
  1270. 		return function (...args)
  1271. 		{
  1272. 			promise = promise.then(() =>
  1273. 			{
  1274. 				return new Promise((resolve) =>
  1275. 				{
  1276. 					setTimeout(() =>
  1277. 					{
  1278. 						func(...args);
  1279. 						resolve();
  1280. 					}, delay);
  1281. 				});
  1282. 			});
  1283. 		};
  1284. 	}
  1285.  
  1286. 	const throttledAddVotersList = throttle(addVotersList, 200);
  1287.  
  1288. 	let observer = new MutationObserver((mutations) => 
  1289. 	{
  1290. 		console.log(`--- ${mutations.length} mutations`, mutations);
  1291.  
  1292. 		mutations.forEach((mutation) =>
  1293. 		{
  1294. 			if (dev || true)
  1295. 			{
  1296. 				console.log("---------- new mutation -----");
  1297. 				console.log(mutation);
  1298.  
  1299. 				if (mutation.type)
  1300. 				{
  1301. 					console.log(`⭐ mutation.type: `, mutation.type)
  1302. 				}
  1303. 				if (mutation.attributeName)
  1304. 				{
  1305. 					console.log(`⭐ mutation.attributeName: ${mutation.attributeName}`, mutation.attributeName)
  1306. 				}
  1307. 				if (mutation.addedNodes.length > 0 && mutation.addedNodes[0] && mutation.addedNodes[0] instanceof Element)
  1308. 				{
  1309. 					console.log(`⭐ mutation.addedNodes.length: ${mutation.addedNodes.length}`, mutation.addedNodes[0])
  1310. 				}
  1311.  
  1312. 				if (mutation.target)
  1313. 				{
  1314. 					console.log(`⭐ mutation.target: ${mutation.target.tagName}`, mutation.target)
  1315.  
  1316. 					if (mutation.target.tagName === "SECTION")
  1317. 					{
  1318.  
  1319. 					}
  1320. 				}
  1321. 			}
  1322.  
  1323. 			// ADDED NODES
  1324. 			if (mutation.addedNodes.length > 0 && mutation.addedNodes[0] && mutation.addedNodes[0].nodeType === Node.ELEMENT_NODE) // && mutation.addedNodes[0] instanceof Element)
  1325. 			{
  1326.  
  1327. 				if (mutation.addedNodes[0].matches("section.entry[id]") && mutation.addedNodes[0].__vue__?.item?.resource != "link_comment")
  1328. 				{
  1329. 					const sectionEntry = mutation.addedNodes[0];
  1330. 					if (dev) console.log("mutation 1", sectionEntry);
  1331.  
  1332. 					processSectionEntry(sectionEntry)
  1333.  
  1334. 					const sectionCommentsArray = sectionEntry.querySelectorAll("section.entry[id]");
  1335. 					if (dev) console.log("mutation 1 - forEach: sectionEntryArray", sectionCommentsArray);
  1336.  
  1337. 					sectionCommentsArray.forEach((sectionComment) =>
  1338. 					{
  1339. 						if (sectionComment.__vue__?.item?.resource != "link_comment")
  1340. 						{
  1341. 							processSectionEntry(sectionComment)
  1342. 						}
  1343. 					});
  1344.  
  1345. 				}
  1346. 				else if (mutation.addedNodes[0].matches("div.content:has(>section.entry[id])"))
  1347. 				{
  1348. 					const sectionEntriesArray = mutation.addedNodes[0].querySelectorAll("section.entry[id]");
  1349. 					if (dev) console.log("mutation 2 - forEach: sectionEntriesArray", sectionEntriesArray);
  1350.  
  1351. 					sectionEntriesArray.forEach((sectionEntry) =>
  1352. 					{
  1353. 						if (sectionEntry.__vue__?.item?.resource != "link_comment")
  1354. 						{
  1355. 							processSectionEntry(sectionEntry)
  1356. 						}
  1357. 					})
  1358. 				}
  1359. 				else if (mutation.target.tagName === "SECTION" && mutation.target.matches("section.entry.detailed[id]"))
  1360. 				{
  1361. 					const sectionEntry = mutation.target;
  1362.  
  1363. 					if (dev) console.log("mutation 3", sectionEntry)
  1364. 					if (dev) console.log("mutation 3: mutation.target", mutation.target);
  1365.  
  1366. 					if (sectionEntry.__vue__?.item?.resource != "link_comment")
  1367. 					{
  1368. 						processSectionEntry(sectionEntry)
  1369. 					}
  1370.  
  1371. 					const sectionCommentsArray = sectionEntry.querySelectorAll("section.entry[id]");
  1372. 					if (dev) console.log("mutation 3 - forEach: sectionEntryArray", sectionCommentsArray);
  1373.  
  1374. 					sectionCommentsArray.forEach((sectionComment) =>
  1375. 					{
  1376. 						if (sectionComment.__vue__?.item?.resource != "link_comment")
  1377. 						{
  1378. 							processSectionEntry(sectionComment)
  1379. 						}
  1380. 					});
  1381. 				}
  1382. 				else if (settings.showAnimatedAvatars && mutation.addedNodes[0].matches("aside.profile-top"))
  1383. 				{
  1384. 					animatedAvatar(mutation.addedNodes[0]);
  1385. 				}
  1386. 				// LEFT SIDE CATEGORY MENU OPENED
  1387. 				else if ((settings.mikroczatShowLeftMenuButton || settings.mikroczatShowLeftMenuLink) && mutation.addedNodes[0]?.matches("section.links"))
  1388. 				{
  1389. 					createLeftMenuButtons();
  1390. 				}
  1391. 			}
  1392. 			else if (mutation.removedNodes.length > 0 && mutation.removedNodes[0] && mutation.removedNodes[0].nodeType === Node.ELEMENT_NODE)
  1393. 			{
  1394. 				// LEFT SIDE CATEGORY MENU CLOSED
  1395. 				if ((settings.mikroczatShowLeftMenuButton || settings.mikroczatShowLeftMenuLink) && mutation.removedNodes[0]?.nodeType === Node.ELEMENT_NODE && mutation.removedNodes[0]?.matches("section.links"))
  1396. 				{
  1397. 					createLeftMenuButtons();
  1398. 				}
  1399. 			}
  1400.  
  1401. 		});
  1402. 	});
  1403.  
  1404.  
  1405.  
  1406. 	if (settings.mikroczatShowLeftMenuButton || settings.mikroczatShowLeftMenuLink)
  1407. 	{
  1408. 		createLeftMenuButtons();
  1409. 	}
  1410. 	if (settings.mikroczatShowTopNavButton)
  1411. 	{
  1412. 		createNewNavBarButton({
  1413. 			position: "left",
  1414. 			// text: "Mikro<strong>czat</strong>",
  1415. 			text: mikroczatButtonOpenLabel,
  1416. 			title: mikroczatButtonOpenTitle,
  1417. 			class: "open_mikroczat", 		// wykopx_open_mikroczat_li
  1418. 			hideWithoutXStyle: false,
  1419. 			//url: mikroczatDomain,
  1420. 			url: "https://wykop.pl/czat",
  1421. 			target: "_mikroczat",
  1422. 			number: null,
  1423. 		});
  1424. 	}
  1425.  
  1426. 	// CONTENT LOADED
  1427. 	let mainSection;
  1428.  
  1429.  
  1430.  
  1431. 	document.addEventListener('readystatechange', (event) => 
  1432. 	{
  1433. 		if (dev) console.log('readyState:' + document.readyState);
  1434. 		mainSection = document.querySelector('body > section');
  1435.  
  1436. 		if (mainSection)
  1437. 		{
  1438. 			const sectionEntryArray = mainSection.querySelectorAll("section.entry[id]");
  1439.  
  1440. 			// if (dev) console.log("sectionEntryArray", sectionEntryArray);
  1441. 			sectionEntryArray.forEach((sectionEntry) =>
  1442. 			{
  1443. 				if (sectionEntry.__vue__?.item?.resource != "link_comment")
  1444. 				{
  1445. 					processSectionEntry(sectionEntry)
  1446. 				}
  1447. 			})
  1448. 			const config = {
  1449. 				childList: true,
  1450. 				subtree: true,
  1451. 			};
  1452.  
  1453. 			observer.observe(mainSection, config);
  1454.  
  1455. 			if (settings.showAnimatedAvatars)
  1456. 			{
  1457. 				const asideProfileTop = mainSection.querySelector("aside.profile-top");
  1458. 				if (asideProfileTop) animatedAvatar(asideProfileTop);
  1459. 			}
  1460. 		}
  1461.  
  1462. 	});
  1463.  
  1464.  
  1465.  
  1466. 	function processSectionEntry(sectionEntry)
  1467. 	{
  1468. 		if (dev) console.log("processSectionEntry()", sectionEntry)
  1469.  
  1470. 		if (!sectionEntry) return;
  1471.  
  1472. 		if (settings.showAnimatedAvatars) animatedAvatar(sectionEntry);
  1473.  
  1474. 		if (settings.showFavouriteButton) addFavouriteButton(sectionEntry);
  1475.  
  1476. 		if (settings.entryVotersListEnable && sectionEntry?.__vue__?.item) 
  1477. 		{
  1478. 			if (dev) console.log("sectionEntry?.__vue__.item.id", sectionEntry?.__vue__.item.id);
  1479. 			if (dev) console.log("sectionEntry.dataset?.votersLoaded", sectionEntry.dataset?.votersLoaded);
  1480.  
  1481. 			if (sectionEntry.dataset?.votersLoaded == sectionEntry?.__vue__.item.id) return;
  1482. 			if (sectionEntry?.__vue__.item.votes.up == 0)
  1483. 			{
  1484. 				removeVotersListWhenNoVoters(sectionEntry);
  1485. 				return;
  1486. 			}
  1487.  
  1488. 			if (settings.entryVotersListExpandIfLessThan > 5 && sectionEntry?.__vue__.item.votes.up <= settings.entryVotersListExpandIfLessThan && sectionEntry?.__vue__.item.votes.up > 5) 
  1489. 			{
  1490. 				if (dev) console.log(`processSectionEntry() wybrano 💛throttledAddVotersList  ${sectionEntry.__vue__.item.id} | plusow: ${sectionEntry.__vue__.item.votes.up}`,)
  1491. 				throttledAddVotersList(sectionEntry);
  1492. 			}
  1493. 			else
  1494. 			{
  1495. 				if (dev) console.log(`processSectionEntry() wybrano 🤎addVotersList  ${sectionEntry.__vue__.item.id} | plusow: ${sectionEntry.__vue__.item.votes.up}`,)
  1496. 				addVotersList(sectionEntry)
  1497. 			}
  1498. 		}
  1499. 	}
  1500.  
  1501.  
  1502. 	function animatedAvatar(sectionEntry)
  1503. 	{
  1504. 		const image = sectionEntry.querySelector('a.avatar figure img'); // Replace with your actual selector
  1505. 		if (image)
  1506. 		{
  1507. 			const currentSrc = image.getAttribute('src');
  1508. 			if (currentSrc.endsWith('.gif'))
  1509. 			{
  1510. 				const modifiedSrc = currentSrc.replace(/,.*?\./, '.');
  1511. 				image.setAttribute('src', modifiedSrc);
  1512. 			}
  1513. 		}
  1514. 	}
  1515.  
  1516. 	function removeVotersListWhenNoVoters(sectionEntry)
  1517. 	{
  1518. 		if (sectionEntry)
  1519. 		{
  1520. 			delete sectionEntry.dataset?.votersLoaded;
  1521. 			sectionEntry.querySelector("section.entry-voters")?.remove();
  1522. 		}
  1523.  
  1524. 	}
  1525.  
  1526. 	async function addVotersList(sectionEntry)
  1527. 	{
  1528. 		if (!sectionEntry || !sectionEntry.__vue__) return;
  1529. 		if (sectionEntry.dataset?.votersLoaded == sectionEntry?.__vue__.item.id) return;
  1530.  
  1531. 		if (sectionEntry?.__vue__ && sectionEntry?.__vue__.item.votes.up > 0)
  1532. 		{
  1533. 			if (sectionEntry?.__vue__ && settings.entryVotersListExpandIfLessThan > 5 && sectionEntry?.__vue__.item.votes.up <= settings.entryVotersListExpandIfLessThan && sectionEntry?.__vue__.item.votes.up > 5)
  1534. 			{
  1535. 				let entryId, commentId;
  1536. 				if (sectionEntry?.__vue__?.item.resource == "entry") 
  1537. 				{
  1538. 					entryId = sectionEntry?.__vue__?.item.id;
  1539. 				}
  1540. 				else if (sectionEntry?.__vue__?.item.resource == "entry_comment") 
  1541. 				{
  1542. 					entryId = sectionEntry?.__vue__?.item.parent.id;
  1543. 					commentId = sectionEntry?.__vue__?.item.id;
  1544. 				}
  1545. 				let voters = await fetchAllVotersFromAPI(entryId, commentId);
  1546.  
  1547. 				appendVotersToEntry(sectionEntry, voters);
  1548.  
  1549. 			}
  1550. 			else
  1551. 			{
  1552. 				appendVotersToEntry(sectionEntry, sectionEntry?.__vue__?.item?.votes?.users);
  1553. 			}
  1554. 		}
  1555. 	}
  1556.  
  1557. 	function addFavouriteButton(sectionEntry)
  1558. 	{
  1559. 		if (sectionEntry && sectionEntry?.__vue__)
  1560. 		{
  1561. 			const sectionActionsUL = sectionEntry.querySelector("section.actions:not(:has(li.favourite)) > ul");
  1562. 			if (!sectionActionsUL) return;
  1563.  
  1564. 			let entryId, commentId;
  1565.  
  1566. 			let isFavourite = sectionEntry?.__vue__?.item.favourite;
  1567.  
  1568. 			if (sectionEntry?.__vue__?.item.resource == "entry") 
  1569. 			{
  1570. 				entryId = sectionEntry?.__vue__?.item.id;
  1571. 			}
  1572. 			else if (sectionEntry?.__vue__?.item.resource == "entry_comment") 
  1573. 			{
  1574. 				entryId = sectionEntry?.__vue__?.item.parent.id;
  1575. 				commentId = sectionEntry?.__vue__?.item.id;
  1576. 			}
  1577.  
  1578.  
  1579. 			const favButtonLI = document.createElement("li");
  1580. 			favButtonLI.classList.add("favourite", "icon", "icon-favourite");
  1581.  
  1582.  
  1583. 			if (isFavourite) { favButtonLI.classList.add("active"); }
  1584. 			const favButtonSpan = document.createElement("span");
  1585. 			favButtonSpan.classList.add("favouriteButton");
  1586.  
  1587. 			// VUE SENSITIVE
  1588. 			/*
  1589. 				data-v-90179052
  1590. 			*/
  1591. 			favButtonLI.setAttribute('data-v-90179052', '');
  1592. 			favButtonSpan.setAttribute('data-v-90179052', '');
  1593.  
  1594. 			favButtonSpan.dataset.isFavourite = isFavourite;
  1595. 			favButtonSpan.dataset.entryId = entryId;
  1596. 			if (commentId) favButtonSpan.dataset.commentId = commentId;
  1597. 			if (settings.showFavouriteButtonLabel) favButtonSpan.innerText = `Ulubione`;
  1598. 			favButtonLI.appendChild(favButtonSpan);
  1599.  
  1600. 			const sharingElement = sectionActionsUL.querySelector(".sharing");
  1601. 			if (sharingElement) sharingElement.insertAdjacentElement("afterend", favButtonLI);
  1602.  
  1603. 		}
  1604.  
  1605. 	}
  1606.  
  1607.  
  1608.  
  1609.  
  1610. 	function appendVotersToEntry(sectionEntry, voters)
  1611. 	{
  1612. 		if (!sectionEntry) return;
  1613. 		const divEditWrapperElement = sectionEntry.querySelector('article > div.edit-wrapper');
  1614. 		if (!divEditWrapperElement) return;
  1615.  
  1616. 		sectionEntry.dataset.votersLoaded = sectionEntry?.__vue__?.item.id;
  1617.  
  1618. 		const fiveVoters = voters;
  1619.  
  1620. 		if (!fiveVoters || fiveVoters.length < 1) return false;
  1621.  
  1622. 		let sectionEntryVotersHTML = `<ul>`;
  1623.  
  1624. 		fiveVoters.forEach(voter =>
  1625. 		{
  1626. 			sectionEntryVotersHTML += getListItemForUser(voter);
  1627. 		});
  1628.  
  1629. 		// <li class="more">
  1630. 		if (sectionEntry?.__vue__?.item?.votes.up > settings.entryVotersListExpandIfLessThan && voters.length <= settings.entryVotersListExpandIfLessThan)
  1631. 		{
  1632. 			sectionEntryVotersHTML += `
  1633. 				<li data-no-bubble="" class="more">
  1634. 					<span data-votes-up="${sectionEntry?.__vue__?.item?.votes.up}"`;
  1635.  
  1636. 			if (sectionEntry?.__vue__?.item.resource == "entry") 
  1637. 			{
  1638. 				sectionEntryVotersHTML += `data-entry-id="${sectionEntry?.__vue__?.item.id}"`;
  1639. 			}
  1640. 			else if (sectionEntry?.__vue__?.item.resource == "entry_comment") 
  1641. 			{
  1642. 				sectionEntryVotersHTML += `data-entry-id="${sectionEntry?.__vue__?.item.parent.id}"`;
  1643. 				sectionEntryVotersHTML += `data-comment-id="${sectionEntry?.__vue__?.item.id}"`;
  1644. 			}
  1645.  
  1646. 			sectionEntryVotersHTML += `>+${sectionEntry?.__vue__?.item?.votes.up - 5} innych</span></li>`;
  1647. 		}
  1648. 		sectionEntryVotersHTML += `</ul>`;
  1649.  
  1650. 		const sectionEntryVoters = document.createElement("section");
  1651. 		sectionEntryVoters.classList.add("entry-voters");
  1652. 		sectionEntryVoters.innerHTML = sectionEntryVotersHTML;
  1653.  
  1654. 		const sectionEntryVotersElement = divEditWrapperElement.querySelector('section.entry-voters');
  1655.  
  1656. 		if (sectionEntryVotersElement)
  1657. 		{
  1658. 			let parentElement = sectionEntryVotersElement.parentNode;
  1659. 			parentElement.replaceChild(sectionEntryVoters, sectionEntryVotersElement);
  1660. 		}
  1661. 		else
  1662. 		{
  1663. 			const editWrapper = sectionEntry.querySelector(".edit-wrapper");
  1664. 			if (editWrapper) editWrapper.appendChild(sectionEntryVoters);
  1665. 		}
  1666. 	}
  1667.  
  1668. 	function getListItemForUser(voter)
  1669. 	{
  1670. 		let userHTML = `<li>
  1671. 				<a href="/ludzie/${voter.username}" class="username`;
  1672.  
  1673. 		userHTML += ` ${voter.color}-profile`; 		// orange-profile green-profile burgundy-profile
  1674. 		userHTML += ` ${voter.status}`;				// active banned suspended removed
  1675. 		userHTML += ` follow-${voter.follow}`;		// follow-true  follow-false
  1676. 		userHTML += ` verified-${voter.verified}`;	// verified-false
  1677. 		userHTML += ` blacklist-${voter.blacklist}`;// blacklist-true blacklist-false
  1678. 		userHTML += ` online-${voter.online}`;		// online-true online-false
  1679.  
  1680. 		userHTML += ` ${voter.gender}-gender`;		// m-gender, f-gender, null-gender
  1681. 		if (voter.gender == "m") userHTML += ` male`;
  1682. 		else if (voter.gender == "f") userHTML += ` female`;
  1683. 		userHTML += `">`;
  1684.  
  1685.  
  1686. 		if (settings?.votersFollow && voter.follow) userHTML += `<i class="follow-true" title="Obserwujesz tego użytkownika"></i>`;
  1687. 		if (settings?.votersVerified && voter.verified) userHTML += `<i class="verified-true" title="Ten użytkownik jest zweryfikowany"></i>`;
  1688. 		if (settings?.votersBlacklist && voter.blacklist) userHTML += `<i class="blacklist-true" title="Ten użytkownik jest na Twojej czarnej liście"></i>`;
  1689. 		if (settings?.votersOffline && !voter.online) userHTML += `<i class="online-false" title="Ten uzytkownik jest teraz offline"></i>`;
  1690. 		if (settings?.votersOnline && voter.online) userHTML += `<i class="online-true" title="Ten uzytkownik jest teraz online"></i>`;
  1691. 		if (settings?.votersBanned && voter.status == "banned") userHTML += `<i class="banned" title="Użytkownik dostał bana. Z dodatkiem Wykop XS - Ban Info możesz szybko sprawdzić przyczynę i długość trwania bana."></i>`;
  1692. 		if (settings?.votersSuspended && voter.status == "suspended") userHTML += `<i class="suspended" title="To konto jest w trakcie usuwania."></i>`;
  1693. 		if (settings?.votersRemoved && voter.status == "removed") userHTML += `<i class="removed" title="Konto usunięte"></i>`;
  1694. 		if (settings?.votersGenderM && voter.gender == "m") userHTML += `<i class="${voter.gender}-gender" title="Wpis od niebieskiego"></i>`;
  1695. 		if (settings?.votersGenderF && voter.gender == "f") userHTML += `<i class="${voter.gender}-gender" title="Plus od różowej"></i>`;
  1696.  
  1697. 		userHTML += `<span>${voter.username}</span>
  1698. 				</a>
  1699. 			</li>`;
  1700.  
  1701. 		return userHTML;
  1702. 	}
  1703.  
  1704.  
  1705. 	/*
  1706. 	<section data-v-6e6ed6ee="" data-v-2aacfeb5="" class="entry-voters">
  1707. 		<ul data-v-6e6ed6ee="">
  1708. 			<li data-v-6e6ed6ee="" class="">
  1709. 				<a data-v-ed9f6c56="" data-v-6e6ed6ee="" href="/ludzie/NaczelnyAgnostyk" class="username orange-profile active">
  1710. 					<span data-v-ed9f6c56="">
  1711. 						NaczelnyAgnostyk<!---->
  1712. 					</span>
  1713. 				</a>
  1714. 			</li>
  1715. 			<li data-v-6e6ed6ee="" data-no-bubble="" class="more">
  1716. 				<span data-v-6e6ed6ee="">+5 innych</span>
  1717. 			</li>
  1718. 		</ul>
  1719. 	</section>
  1720. 	*/
  1721.  
  1722. 	function fetchAllVotersFromAPI(entryId, commentId)
  1723. 	{
  1724. 		if (dev) console.log(`fetchAllVotersFromAPI: ${entryId}, ${commentId}`)
  1725. 		let apiURL = `https://wykop.pl/api/v3/entries/${entryId}/votes?page=1`
  1726. 		if (commentId) apiURL = `https://wykop.pl/api/v3/entries/${entryId}/comments/${commentId}/votes`;
  1727.  
  1728. 		return new Promise(async (resolve, reject) =>
  1729. 		{
  1730. 			await fetch(apiURL, {
  1731. 				method: "GET",
  1732. 				headers: {
  1733. 					"Content-Type": "application/json",
  1734. 					Authorization: "Bearer " + window.localStorage.getItem("token"),
  1735. 				},
  1736. 			})
  1737. 				.then((response) =>
  1738. 				{
  1739. 					if (!response.ok)
  1740. 					{
  1741. 						if (dev) console.log("HTTP error! status: ${response.status}");
  1742. 						// throw new Error(`HTTP error! status: ${response.status}`);
  1743. 					}
  1744. 					return response.json();
  1745. 				})
  1746. 				.then(async (responseJSON) =>
  1747. 				{
  1748. 					resolve(responseJSON.data);
  1749.  
  1750. 				}).catch((error) =>
  1751. 				{
  1752. 					if (error instanceof TypeError)
  1753. 					{
  1754. 						console.error('Network error:', error); // AWARIA SERWERA WYPOKU
  1755. 					} else
  1756. 					{
  1757. 						console.error('Other error:', error);
  1758. 					}
  1759. 					reject(error);
  1760. 				});
  1761. 		});
  1762. 	}
  1763.  
  1764. 	function postFavouriteToAPI(favourite, resource, id)
  1765. 	{
  1766. 		let apiURL = `https://wykop.pl/api/v3/favourites`;
  1767. 		const method = favourite ? "POST" : "DELETE";
  1768. 		const body = {
  1769. 			data: {
  1770. 				type: resource,
  1771. 				source_id: id
  1772. 			}
  1773. 		}
  1774.  
  1775. 		return new Promise(async (resolve, reject) =>
  1776. 		{
  1777. 			await fetch(apiURL, {
  1778. 				method: method,
  1779. 				headers: {
  1780. 					"Content-Type": "application/json",
  1781. 					Authorization: "Bearer " + window.localStorage.getItem("token"),
  1782. 				},
  1783. 				body: JSON.stringify(body)
  1784. 			})
  1785. 				.then((response) =>
  1786. 				{
  1787. 					if (!response.ok)
  1788. 					{
  1789. 						if (dev) console.log("HTTP error! status: ${response.status}");
  1790. 						// throw new Error(`HTTP error! status: ${response.status}`);
  1791. 					}
  1792. 					return response.json();
  1793. 				})
  1794. 				.then(async (responseJSON) =>
  1795. 				{
  1796. 					resolve(responseJSON.data);
  1797.  
  1798. 				}).catch((error) =>
  1799. 				{
  1800. 					if (error instanceof TypeError)
  1801. 					{
  1802. 						console.error('Network error:', error); // AWARIA SERWERA WYPOKU
  1803. 					} else
  1804. 					{
  1805. 						console.error('Other error:', error);
  1806. 					}
  1807. 					reject(error);
  1808. 				});
  1809. 		});
  1810. 	}
  1811.  
  1812. 	// settings.addCommentPlusWhenVotingOnEntry, settings.addCommentPlusWhenVotingOnComment
  1813. 	function postCommentPlus1ToAPI(sectionEntry)
  1814. 	{
  1815. 		if (!sectionEntry || !sectionEntry.__vue__) return;
  1816.  
  1817. 		const resource = sectionEntry.__vue__.item.resource;
  1818. 		let entryId;
  1819. 		let authorUsername = sectionEntry.__vue__.item.author.username;
  1820. 		if (resource === "entry")
  1821. 			entryId = sectionEntry.__vue__.item.id;
  1822.  
  1823. 		else if (resource === "entry_comment")
  1824. 			entryId = sectionEntry.__vue__.item.parent.id;
  1825.  
  1826. 		// TODO ZNALEZISKA
  1827. 		let apiURL = `https://wykop.pl/api/v3/entries/${entryId}/comments`;
  1828. 		const method = "POST";
  1829. 		const body = {
  1830. 			data: {
  1831. 				"content": `@${authorUsername} [+](https://greasyfork.org/en/scripts/489949)1`,
  1832. 				"adult": false
  1833. 			}
  1834. 		}
  1835. 		/*
  1836. 		"data": 
  1837. 			{
  1838. 				"content": "**foobar** __foobar__ [lorem](https://www.wykop.pl) impsum!!! #nsfw #wykop",
  1839. 				"embed": "1fde707843ss3fbe9cb4eed0asdfsdfc64ab9a4df6084199b39d2",
  1840. 				"photo": "e07843ss3fbe9cb4saeed0asdfsdfc64b9a4df6084199b39d2",
  1841. 				"adult": false
  1842. 				}
  1843. 			}
  1844. 		*/
  1845.  
  1846. 		return new Promise(async (resolve, reject) =>
  1847. 		{
  1848. 			await fetch(apiURL, {
  1849. 				method: method,
  1850. 				headers: {
  1851. 					"Content-Type": "application/json",
  1852. 					Authorization: "Bearer " + window.localStorage.getItem("token"),
  1853. 				},
  1854. 				body: JSON.stringify(body)
  1855. 			})
  1856. 				.then((response) =>
  1857. 				{
  1858. 					if (!response.ok)
  1859. 					{
  1860. 						if (dev) console.log("HTTP error! status: ${response.status}");
  1861. 						// throw new Error(`HTTP error! status: ${response.status}`);
  1862. 					}
  1863. 					return response.json();
  1864. 				})
  1865. 				.then(async (responseJSON) =>
  1866. 				{
  1867. 					resolve(responseJSON.data);
  1868.  
  1869. 				}).catch((error) =>
  1870. 				{
  1871. 					if (error instanceof TypeError)
  1872. 					{
  1873. 						console.error('Network error:', error); // AWARIA SERWERA WYPOKU
  1874. 					} else
  1875. 					{
  1876. 						console.error('Other error:', error);
  1877. 					}
  1878. 					reject(error);
  1879. 				});
  1880. 		});
  1881. 	}
  1882.  
  1883. 	// li.more click
  1884. 	document.addEventListener("click", async function (e)
  1885. 	{
  1886. 		if (e.target.closest("div.buttons button.plus"))
  1887. 		{
  1888. 			const sectionEntry = e.target.closest("section.entry[id]");
  1889. 			if (sectionEntry.__vue__?.item?.voted == 1)
  1890. 			{
  1891. 				// if (settings.addCommentPlusWhenVotingOnEntry && sectionEntry && sectionEntry.__vue__?.item?.resource == "entry") 
  1892. 				// {
  1893. 				// 	postCommentPlus1ToAPI(sectionEntry);
  1894. 				// }
  1895. 				// else if (settings.addCommentPlusWhenVotingOnComment && sectionEntry && sectionEntry.__vue__?.item?.resource == "entry_comment")
  1896. 				// {
  1897. 				// 	postCommentPlus1ToAPI(sectionEntry);
  1898. 				// }
  1899. 			}
  1900. 		}
  1901.  
  1902. 		if (e.target.matches("li.more span"))
  1903. 		{
  1904. 			e.preventDefault();
  1905.  
  1906. 			let sectionEntry = e.target.closest("section.entry");
  1907. 			const entryId = e.target.dataset.entryId;
  1908. 			const commentId = e.target.dataset.commentId;
  1909. 			if (dev) console.log(`Wykop XS pobiera listę ${e.target.dataset.votesUp} plusujących`);
  1910.  
  1911. 			e.target.closest("section.entry-voters").innerHTML = `<span>(Wykop X: wczytywanie ${e.target.dataset.votesUp} plusujących...)</span>`;
  1912.  
  1913. 			let voters = await fetchAllVotersFromAPI(entryId, commentId);
  1914.  
  1915. 			appendVotersToEntry(sectionEntry, voters);
  1916. 			return;
  1917. 		}
  1918.  
  1919. 		if (e.target.matches("span.favouriteButton"))
  1920. 		{
  1921. 			e.preventDefault();
  1922. 			if (e.target.dataset.isFavourite == "true")
  1923. 			{
  1924. 				if (e.target.dataset.commentId) postFavouriteToAPI(false, "entry_comment", e.target.dataset.commentId);
  1925. 				else postFavouriteToAPI(false, "entry", e.target.dataset.entryId);
  1926. 				e.target.parentElement.classList.remove("active");
  1927. 				e.target.dataset.isFavourite = "false";
  1928.  
  1929. 			}
  1930. 			else if (e.target.dataset.isFavourite == "false")
  1931. 			{
  1932. 				if (e.target.dataset.commentId) postFavouriteToAPI(true, "entry_comment", e.target.dataset.commentId);
  1933. 				else postFavouriteToAPI(true, "entry", e.target.dataset.entryId);
  1934. 				e.target.parentElement.classList.add("active");
  1935. 				e.target.dataset.isFavourite = "true";
  1936. 			}
  1937. 			return;
  1938. 		}
  1939. 	}, false);
  1940.  
  1941.  
  1942.  
  1943.  
  1944.  
  1945.  
  1946. 	/* CSS WYKOP XS MIKROCZAT */
  1947. 	if (settings?.hideShareButton) CSS += `section.actions ul li.sharing 									{ display: none!important; }`;
  1948.  
  1949.  
  1950. 	/* Wykop X Style 3.0 */
  1951. 	CSS += `
  1952. 		:root
  1953. 		{
  1954. 			--kolorBananowy1: rgba(255, 185, 0, 1);
  1955. 			--tagChannelColor: rgba(0, 183, 255, 1);
  1956. 			--pmChannelColor: rgba(255, 89, 23, 1);
  1957. 			--smallBorderRadius: 4px;
  1958. 		}
  1959. 		div[data-modal="entryVoters"] section.entry-voters::after {content: none!important;} /* Wykop X Style PROMO */
  1960. 	`;
  1961.  
  1962. 	/* LISTA PLUSUJĄCYCH CSS, PRZYCISK DODAJ DO ULUBIONYCH */
  1963. 	if (settings?.entryVotersListEnable)
  1964. 	{
  1965. 		CSS += `
  1966. 		/* Chrome 109, Firefox 115 */
  1967. 			@supports not (display: block flex)
  1968. 			{
  1969. 				section.entry-voters ul
  1970. 				{
  1971. 					display: flex;
  1972. 				}
  1973. 			}
  1974.  
  1975. 			section.entry-voters ul
  1976. 			{
  1977. 				display: block flex;
  1978. 				row-gap: 0px;
  1979. 				flex-wrap: wrap;
  1980. 				align-items: baseline;
  1981. 				padding: 0 0 0 0;
  1982. 				margin: 0;
  1983. 				margin-top: 8px;
  1984. 				list-style-type: none;
  1985. 				position: relative;
  1986. 			}
  1987.  
  1988. 			section.entry-voters ul,
  1989. 			section.entry-voters > span
  1990. 			{
  1991. 				font-size: var(--entryVotersTextFontSize, 12px);
  1992. 				color: var(--gullGray);
  1993. 			}
  1994.  
  1995. 			section.entry-voters ul::before
  1996. 			{
  1997. 				content: "Plusujący: ";
  1998. 				margin-right: 0.2em;
  1999. 			}
  2000.  
  2001. 			section.entry-voters ul li.more
  2002. 			{
  2003. 				cursor: pointer;
  2004. 				font-weight: 700;
  2005. 				text-transform: uppercase;
  2006. 			}
  2007.  
  2008. 			section.entry-voters ul li::after
  2009. 			{
  2010. 				content: " • ";
  2011. 				margin: 0px 0.2em 0px 0em;
  2012. 			}
  2013.  
  2014. 			section.entry-voters ul li.more::after,
  2015. 			section.entry-voters ul li:only-child::after
  2016. 			{ content: none; }
  2017.  
  2018. 			section.entry-voters ul li a.username span
  2019. 			{
  2020. 				font-weight: normal;
  2021. 			}
  2022.  
  2023. 			section.entry-voters ul li a.username i 				{ display: none; font-size: 0.8em; font-style: normal; bottom: 0px; position: relative; }
  2024. 			section.entry-voters ul li a.username i:has(+span) 		{ margin-right: 1px; }
  2025. 			section.entry-voters ul li a.username i.follow-true,
  2026. 			section.entry-voters ul li a.username i.blacklist-true,
  2027. 			section.entry-voters ul li a.username i.banned ,
  2028. 			section.entry-voters ul li a.username i.suspended,
  2029. 			section.entry-voters ul li a.username i.removed,
  2030. 			section.entry-voters ul li a.username i.f-gender,
  2031. 			section.entry-voters ul li a.username i.m-gender
  2032. 			{ display: inline flex;} 
  2033. 			
  2034. 			
  2035. 			section.entry-voters ul li a.username i.follow-true::before 										{ content: '🔔'; }
  2036. 			section.entry-voters ul li a.username i.blacklist-true::before 										{ content: '⛔'; }
  2037. 			section.entry-voters ul li a.username i.banned::before 												{ content: '🍌'; }
  2038. 			section.entry-voters ul li a.username i.suspended::before 											{ content: '✖'; }
  2039. 			section.entry-voters ul li a.username i.removed::before 											{ content: '❌'; }
  2040. 			section.entry-voters ul li a.username i.f-gender::before 											{ content: '🟣'; font-size: 0.7em; bottom: 3px; }
  2041. 			
  2042. 			section.entry-voters ul li:has(a.username) 															{ order: 6; }
  2043. 			section.entry-voters ul li.more 																	{ order: 100; }
  2044. 			`;
  2045.  
  2046. 		if (settings?.votersFollowFirst) CSS += `section.entry-voters ul li:has(a.username.follow-true) 		{ order: 1; }`;
  2047. 		if (settings?.votersBlackFirst) CSS += `section.entry-voters ul li:has(a.username.burgundy-profile) 	{ order: 3; }`;
  2048. 		if (settings?.votersOrangeFirst) CSS += `section.entry-voters ul li:has(a.username.orange-profile) 		{ order: 4; }`;
  2049. 		if (settings?.votersGreenFirst) CSS += `section.entry-voters ul li:has(a.username.green-profile) 		{ order: 5; }`;
  2050.  
  2051. 		if (settings?.votersBlacklistLast) CSS += `section.entry-voters ul li:has(a.username.blacklist-true) 	{ order: 7; }`;
  2052. 		if (settings?.votersBannedLast) CSS += `section.entry-voters ul li:has(a.username.banned) 				{ order: 8; }`;
  2053. 		if (settings?.votersSuspendedLast) CSS += `section.entry-voters ul li:has(a.username.banned) 			{ order: 9; }`;
  2054. 		if (settings?.votersRemovedLast) CSS += `section.entry-voters ul li:has(a.username.removed) 			{ order: 10; }`;
  2055.  
  2056. 		if (!settings?.votersColorOrange) CSS += `section.entry-voters ul li a.username.orange-profile 			{ color: var(--gullGray); }`;
  2057. 		if (!settings?.votersColorGreen) CSS += `section.entry-voters ul li a.username.green-profile 			{ color: var(--gullGray); }`;
  2058. 		if (!settings?.votersColorBurgundy) CSS += `section.entry-voters ul li a.username.burgundy-profile 		{ color: var(--gullGray); }`;
  2059.  
  2060. 		CSS += `
  2061. 			section.entry-voters ul li a.username.banned:not(.removed) span  				{ color: var(--kolorBananowy1); };
  2062. 			section.entry-voters ul li a.username.suspended:not(.removed) span 				{ color: var(--heather); }
  2063. 			section.entry-voters ul li a.username.removed span 								{ color: var(--heather); }
  2064. 			[data-night-mode] section.entry-voters ul li a.username.removed span 			{ background-color: rgba(255, 255, 255, 0.1); padding-left: 5px; padding-right: 5px; }
  2065. 		`;
  2066. 	}
  2067.  
  2068. 	/* ULUBIONE */
  2069. 	CSS += `
  2070. 		section.actions > ul > li.favourite 
  2071. 		{
  2072. 			cursor: pointer;
  2073. 			user-select: none;
  2074. 			color: var(--gullGray);
  2075. 			font-size: 14px;
  2076. 			padding-left: 26px;
  2077. 			transition: color .2s ease, opacity .2s ease;
  2078. 		}
  2079.  
  2080. 		.actions li.favourite span::before
  2081. 		{
  2082. 			content: '';
  2083. 			width: 18px;
  2084. 			height: 18px;
  2085. 			display: block;
  2086. 			position: absolute;
  2087. 			left: 0;
  2088. 			background: var(--gullGray);
  2089. 			transition: background .2s ease;
  2090.  
  2091. 			-webkit-mask-size: 18px 18px;
  2092. 			mask-size: 18px 18px;
  2093. 			-webkit-mask: url(/static/img/svg/favourite.svg) no-repeat center;
  2094. 			mask-image: url(/static/img/svg/favourite.svg);
  2095. 		}
  2096. 		
  2097. 		.actions li.favourite.active span::before 
  2098. 		{
  2099. 			background: var(--orange);
  2100. 			-webkit-mask: url(/static/img/svg/favourite-filled.svg) no-repeat center;
  2101. 			mask-image: url(/static/img/svg/favourite-filled.svg);
  2102. 		}
  2103. 	`;
  2104.  
  2105.  
  2106. 	/* HIDE ADS ALWAYS */
  2107. 	if (settings.hideAds) { CSS += `.pub-slot-wrapper { display: none!important; }`; }
  2108.  
  2109. 	/* HIDE WYKOP XS PROMO FROM STYLUS */
  2110. 	CSS += `.wykopxs, body div.main-content[class] section > section.sidebar::after  { display: none!important; }`;
  2111.  
  2112. 	styleElement.textContent = CSS;
  2113. 	document.head.appendChild(styleElement);
  2114. })();
  2115.