Skip to content

Instantly share code, notes, and snippets.

@DesertEagleDerek
Last active June 12, 2022 15:41
Show Gist options
  • Save DesertEagleDerek/3886d0db45656dfa6cdea222ee18f3aa to your computer and use it in GitHub Desktop.
Save DesertEagleDerek/3886d0db45656dfa6cdea222ee18f3aa to your computer and use it in GitHub Desktop.
Hide viewer count on thumbnails and randomise streams
// ==UserScript==
// @name Twitch hide viewer count / stream randomiser
// @namespace https://gist.githubusercontent.com/DesertEagleDerek/3886d0db45656dfa6cdea222ee18f3aa/raw/Twitch_Viewer_Count.user.js
// @updateURL https://gist.githubusercontent.com/DesertEagleDerek/3886d0db45656dfa6cdea222ee18f3aa/raw/Twitch_Viewer_Count.user.js
// @downloadURL https://gist.githubusercontent.com/DesertEagleDerek/3886d0db45656dfa6cdea222ee18f3aa/raw/Twitch_Viewer_Count.user.js
// @version 0.11
// @author DesertEagleDerek
// @description Hide viewer count on thumbnails and randomise streams
// @homepage http://www.deserteaglederek.com/
// @match https://www.twitch.tv/*
// @run-at document-start
// @require https://ajax.googleapis.com/ajax/libs/jquery/3.6.0/jquery.min.js
// ==/UserScript==
//------------------------------------------------------------------------------------------------------------------------------
// DO NOT CHANGE ANYTHING ABOVE THIS LINE! FEEL FREE TO ENABLE OR DISABLE THE OPTIONS BELOW, THOUGH!
//------------------------------------------------------------------------------------------------------------------------------
var $autoScrollToTop = true; /* scroll back to the top after pressing the randomise button */
var $hideViewerCount = true; /* hide the viewer count on thumbnails and channel pages */
var $randomiseNavBarButton = true; /* show randomise button on main navigation */
//------------------------------------------------------------------------------------------------------------------------------
// DO NOT EDIT THIS FUNCTION UNLESS YOU KNOW WHAT YOU'RE DOING! IT'S WHAT DETECTS WHICH PAGE IS LOADED!
//------------------------------------------------------------------------------------------------------------------------------
function checkCurrentPage(checking) {
if(checkCurrentPageHtml(checking, "html", "DirectoryGamePage", $('*[data-a-target="game-directory-live-tab"]'), "")) { return; }
if(checkCurrentPageHtml(checking, "html", "FollowingLivePage", $('*[data-a-target="following-live-tab"]'), "")) { return; }
if(checkCurrentPageHtml(checking, "html", "DirectoryPage", $('*[data-a-target="browse-type-tab-categories"]'), "")) { return; }
}
//------------------------------------------------------------------------------------------------------------------------------
// DO NOT CHANGE ANYTHING BELOW THIS LINE! THIS IS WHERE ALL OF THE GEEKY CODE STUFF LIVES!
//------------------------------------------------------------------------------------------------------------------------------
/* globals jQuery */
/* globals $ */
var $currentPage;
var $lastCheckedPage;
var $buttonNavBarReady = false;
var $timerIdNavBar;
var $timerIdRefresh;
jQuery(document).ready(jQueryBegin);
function randomisePage() {
var $streams;
switch($currentPage) {
case "DirectoryGamePage":
var $directoryContainer = $('*[data-target="directory-container"]').children();
$streams = $directoryContainer.children('*[data-target]');
break;
case "FollowingLivePage":
$streams = $('.tw-tower').children('div').has('div.live-channel-card');
break;
case "DirectoryPage":
$streams = $('.tw-tower').children('*[data-target]');
break;
}
randomiseStreamElements($streams);
}
function randomiseStreamElements($streams) {
var $streamElements = [];
$streams.each(function() {
$streamElements.push($(this).html());
});
$streamElements = shuffleArray($streamElements);
var arrayIndex = 0;
$streams.each(function() {
$(this).html($streamElements[arrayIndex]);
arrayIndex++;
});
}
function shuffleArray(array) {
for (let i = array.length - 1; i > 0; i--) {
const j = Math.floor(Math.random() * (i + 1));
[array[i], array[j]] = [array[j], array[i]];
}
return array;
}
function pageReadyRefresh() {
checkCurrentPage(true);
if($currentPage != $lastCheckedPage) {
checkCurrentPage(false);
}
}
function pageReadyNavBar() {
if(!$buttonNavBarReady) {
checkCurrentPage(false);
}
}
function checkCurrentPageHtml(checking, checkType, pageType, pageData, pageDataToMatch) {
var checkPassed = false;
if(checkType === "html") {
// check against html()
if(pageData.html() !== undefined) {
checkPassed = true;
}
} else if(checkType === "text") {
// check against plain text
if(pageData === pageDataToMatch) {
checkPassed = true;
}
} else {
return false;
}
// did the check pass?
if(checkPassed) {
if(checking) {
setLastCheckedPage(pageType);
} else {
addPage(pageType);
}
return true;
}
return false;
}
function setLastCheckedPage(page) {
$lastCheckedPage = page;
}
function addPage(page) {
cancelTimerNavBar(page);
if($randomiseNavBarButton) {
var $randomiseButton = $('#randomise-button');
if($randomiseButton.html() === undefined) {
$('nav div div').first().append('<div class="tw-align-items-center tw-flex tw-full-height tw-pd-x-1"> <div id="randomise-button-container"><a id="randomise-button" href="#top">?</a></div> </div>');
$('#randomise-button').click(function() { randomisePage(); });
}
}
if($autoScrollToTop) {
var $scrollTopAnchor = $('#top');
if($scrollTopAnchor.html() === undefined) {
$('.root-scrollable__wrapper').first().prepend('<a id="top"></a>');
}
}
}
function cancelTimerNavBar(page) {
$buttonNavBarReady = true;
clearInterval($timerIdNavBar);
$currentPage = page;
}
function jQueryBegin(){
if($hideViewerCount) {
// disable viewer count by overriding the css
$('body').append('<style>.tw-media-card-stat { visibility: hidden !important; }</style>');
}
if($randomiseNavBarButton) {
// add styles for custom randomise button
$('body').append('<style>#randomise-button-container { margin-top: 0px; } #randomise-button { border: 1px solid #9147ff; border-radius: 4px; padding: 6px 10px; background: #9147ff; color: #fff; text-decoration: none; font-weight: 600; } #randomise-button:link { color: #fff; text-decoration: none; } #randomise-button:hover { border: 1px solid #772ce8; background: #772ce8; } #randomise-button:active { border: 1px solid #5c16c5; background: #5c16c5 }</style>');
// set timers to add code when the page is ready
$timerIdNavBar = setInterval(pageReadyNavBar, 50);
$timerIdRefresh = setInterval(pageReadyRefresh, 500);
}
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment