Tidy up your Dashboard

Customizable Userscript which tidies up your Dashboard!

נכון ליום 05-04-2015. ראה הגרסה האחרונה.

You will need to install an extension such as Tampermonkey, Greasemonkey or Violentmonkey to install this script.

You will need to install an extension such as Tampermonkey or Violentmonkey to install this script.

You will need to install an extension such as Tampermonkey or Violentmonkey to install this script.

You will need to install an extension such as Tampermonkey or Userscripts to install this script.

You will need to install an extension such as Tampermonkey to install this script.

You will need to install a user script manager extension to install this script.

(I already have a user script manager, let me install it!)

You will need to install an extension such as Stylus to install this style.

You will need to install an extension such as Stylus to install this style.

You will need to install an extension such as Stylus to install this style.

You will need to install a user style manager extension to install this style.

You will need to install a user style manager extension to install this style.

You will need to install a user style manager extension to install this style.

(I already have a user style manager, let me install it!)

// ==UserScript==
// @name Tidy up your Dashboard
// @namespace https://greasyfork.org/users/10154
// @grant none
// @match https://www.warlight.net/MultiPlayer/*
// @description Customizable Userscript which tidies up your Dashboard!
// @version 1.5
// @icon http://i.imgur.com/XzA5qMO.png
// ==/UserScript==


/*
 * Userscript Settings
 */
var inputs = "";
inputs += '<label for="scrollGames">Fixed window with scrollable Games</label><input type="checkbox" id="scrollGames"><br>';
inputs += '<label for="hideMyGamesIcons">Hide Icons in "My Games"</label><input type="checkbox" id="hideMyGamesIcons"><br>';
inputs += '<label for="autoRefreshOnFocus">Automatically refresh Games on Tabfocus</label><input type="checkbox" id="autoRefreshOnFocus"><br>';
inputs += '<label for="hightlightTournaments">Hightlight Tournament invites</label><input type="checkbox" id="hightlightTournaments"><br>';
inputs += '<div class="close-userscript">Close and Refresh</div>';

/**
 * Manage Refresh
 */
lastRefresh = new Date()
$("#RefreshBtn").replaceWith($("#RefreshBtn").clone().removeAttr("id").attr("id", "refreshAll"));
$("#refreshAll").appendTo("body");
$("#refreshAll").on("click", function () {
	if (new Date() - lastRefresh > 3000) {
		lastRefresh = new Date()
		refreshAll();
	}
})

if (autoRefreshOnFocus) {
	$(window).on('focus', function () {
		if (new Date() - lastRefresh > 30000) {
			lastRefresh = new Date();
			refreshAll();
		}
	});
}

$("body").keyup(function (event) {
	if (event.which == 82) {
		if (new Date() - lastRefresh > 3000) {
			lastRefresh = new Date()
			refreshAll();
		}
	}
});

/*
 * Add Userscript Menu
 */
$("body").append("<div class='userscript-container userscript-show'></div><div class='userscript userscript-show'><div class='head'>Change Userscript Settings<img class='close-userscript-img' src='https://i.imgur.com/RItbpDS.png' height='25' width='25'></div>" + inputs + "</div>");
$(".userscript").on("change", function () {
	storeVariables();
});
$("#TopRightDropDown ul").append('<li><div class="userscript-menu ">Userscript</div></li>');

$(".userscript-menu").on("click", function () {
	$(".userscript-show").fadeToggle();
	$("#TopRightDropDown").fadeToggle();
});

$(".close-userscript").on("click", function () {
	$(".userscript-show").fadeToggle();
	location.reload();
});

$(".close-userscript-img").on("click", function () {
	$(".userscript-show").fadeToggle();
});

/*
 * Read Localstorage
 */
var scrollGames = localStorage.getItem("scrollGames") == "true";
$("#scrollGames").prop("checked", scrollGames)

var autoRefreshOnFocus = localStorage.getItem("autoRefreshOnFocus") == "true";
$("#autoRefreshOnFocus").prop("checked", autoRefreshOnFocus)

var hightlightTournaments = localStorage.getItem("hightlightTournaments") == "true";
$("#hightlightTournaments").prop("checked", hightlightTournaments)

var hideMyGamesIcons = localStorage.getItem("hideMyGamesIcons") == "true";
$("#hideMyGamesIcons").prop("checked", hideMyGamesIcons)

var hideCoinSymbol = true;

/* 
 * Hide coin Symbol
 */
if (hideCoinSymbol) {
	createSelector('#PromotedGamesTable td:last-of-type a img', 'display:none')
}

/* 
 * Delayed Functions for expanding Games
 */
var showAllGames = "";
var showAllCoinGames = "";
styleInterval = setInterval(delayed, 100);
setTimeout(function () {
	clearInterval(styleInterval)
}, 3000);

/* 
 * Refresh Animation
 */
$("#OpenGamesTable").prepend("<div class='loading loading-open'><img src='https://www.adobe.com/business/calculator/VIP/image/loader.gif' height='32' width='32'></div>");
$("#MyGamesTable").prepend("<div class='loading loading-my'><img src='https://www.adobe.com/business/calculator/VIP/image/loader.gif' height='32' width='32'></div>");
$("#PromotedGamesTable").prepend("<div class='loading loading-prom'><img src='https://www.adobe.com/business/calculator/VIP/image/loader.gif' height='32' width='32'></div>");

$("label[for='Refresh']").on("click", function () {
	refreshAll();
})


/* 
 * Highlight Tournaments
 */
if (hightlightTournaments) {
	createSelector("#MyTournamentsTable tbody", "background:#4C4C33;");
}

/* 
 * Hide Icons in My Games
 */
if (hideMyGamesIcons) {
	createSelector("#MyGamesTable td img", "display:none;");
}


/* 
 * Base CSS
 */
createSelector(".GameRow a", "font-size:16px !important;");
createSelector(".GameRow td:last-of-type span,#OpenGamesTable .GameRow td:last-of-type span:first-child, #PromotedGamesTable .GameRow td:last-of-type span:first-child", "margin:5px 0px;position:relative !important;z-index:10;");
createSelector("#MyGamesTable a img, #MyGamesTable span img", "display:inline-block;");
createSelector(".GameRow:hover", "background-color:rgb(50, 50, 50);cursor:pointer;");
createSelector(".BootTimeLabel", "color:white !important;font-weight:normal!important;font-style:italic;font-size:13px!important;z-index:50;");
createSelector(".GameRow a:hover", "text-decoration:none;");
createSelector(".ui-buttonset label", "font-size:11px;");
createSelector("#OpenGamesTable label:hover", " border: 1px solid #59b4d4;background: #0078a3 50% 50% repeat-x;font-weight: bold;color: #ffffff;");
createSelector("#OpenGamesTable td:last-child,#MyGamesTable td:last-child, #PromotedGamesTable td:last-child", "position: relative;");
createSelector("#OpenGamesTable td:nth-child(2) a,#MyGamesTable td:nth-child(2) a, #PromotedGamesTable td:nth-child(2) a", " display: block;width: 100%;height: 100%;float: left;position: absolute;margin-top: -5px;white-space: nowrap;text-overflow: ellipsis;overflow: hidden;");
createSelector(".loading", "position: absolute;height: 100%;width:  100%;background-color: rgba(255, 255, 255, 0.2);text-align: center;z-index: 12;margin-top: 34px;display:none;");
createSelector(".loading img", "position: absolute;top: 50%;left: 50%;margin-left: -16px;margin-top: -16px;");
createSelector("img", "position: relative;z-index:50;");
createSelector("input", "z-index: 1000;position: relative;");
createSelector(".userscript", "position: fixed;width: 420px;left: 50%;background: #171717;margin-left: -250px;top: 100px;z-index: 50000001; color:white;padding:60px 30px 30px 30px;border: 2px solid gray;border-radius:8px");
createSelector(".userscript-menu", "display: block;color: #555;text-decoration: none;line-height: 18px;padding: 3px 15px;margin: 0;white-space: nowrap;")
createSelector(".userscript-menu:hover", "cursor:pointer;background-color: #08C;color: #FFF;cursor: pointer;")
createSelector(".close-userscript", "margin-top: 40px;width: 100%;text-align: center;font-size: 15px;cursor: pointer;background: gray;line-height: 30px;border-radius: 8px;");
createSelector(".close-userscript-img", "float:right;margin:5px;cursor:pointer");
createSelector(".userscript label", "width: 80%;display: inline-block;font-size: 15px;margin: 5px;")
createSelector(".userscript input", "width: 20px;height: 20px;margin-left:30px;margin: 5px");
createSelector(".userscript-container", "display: block;position: absolute;background: white;top: 0;left: 0;right: 0;bottom: 0;z-index: 50000000;opacity: 0.5;");
createSelector(".userscript .head", "position: absolute;height: 40px;background: #330000;width: 100%;left: 0;right: 0;top: 0;color: white;font-size: 15px;text-align: center;line-height: 40px;border-top-left-radius:8px;border-top-right-radius:8px;");
createSelector(".userscript-show", "display:none");
createSelector(".showGames table thead td", "display:table-cell;width:100%;");
createSelector(".showGames table thead tr", "display:table;width:100%;");
createSelector(".showGames table tbody", "display:table;width:100%;");


/* 
 * Fixed window with Scrollable Games
 */
var gameButtons = "";
var showGamesActive = "ShowMyGames";

if (scrollGames) {
	gameButtons = '<div style="margin: 10px;" id="switchGameRadio" class="ui-buttonset"><input type="radio" id="ShowMyGames" name="switchGames" checked="checked" class="ui-helper-hidden-accessible"><label for="ShowMyGames" class="ui-state-active ui-button ui-widget ui-state-default ui-button-text-only ui-corner-left" role="button"><span class="ui-button-text">My Games</span></label><input type="radio" id="ShowOpenGames" name="switchGames" class="ui-helper-hidden-accessible"><label for="ShowOpenGames" class="ui-button ui-widget ui-state-default ui-button-text-only" role="button"><span class="ui-button-text">Open Games</span></label><input type="radio" id="ShowCoinGames" name="switchGames" class="ui-helper-hidden-accessible"><label for="ShowCoinGames" class="ui-button ui-widget ui-state-default ui-button-text-only ui-corner-right" role="button"><span class="ui-button-text">Coin Games</span></label></div>';

	$(".MainColumn ").prepend('<div class="showGamesContainer">' + gameButtons + '<div class="showGames"></div></div>');
	$("#MyGamesTable").appendTo(".showGames");

	$(".MainColumn ").after('<div class="showSide"></div>');
	$(".SideColumn").appendTo(".showSide");

	/*
	 * Fixed Titles in Sidecolumn
	 */
	$("#BlogTable").before("<div class='followMeBar'>" + $("#BlogTable > thead > tr > td").html() + "</div>");
	$("#RealTimeLadderTable").before("<div class='followMeBar'>" + $("#RealTimeLadderTable > thead > tr > td").html() + "</div>");
	$("#ForumTable").before("<div class='followMeBar'>" + $("#ForumTable > thead > tr > td").html() + "</div>");
	$("#ClanForumTable").before("<div class='followMeBar'>" + $("#ClanForumTable > thead > tr > td").html() + "</div>");
	$("#MapOfTheWeekTable").before("<div class='followMeBar'>" + $("#MapOfTheWeekTable > thead > tr > td").html() + "</div>");
	$("#LeaderboardTable").before("<div class='followMeBar'>" + $("#LeaderboardTable > thead > tr > td").html() + "</div>");
	$("#MyTournamentsTable").before("<div class='followMeBar'>" + $("#MyTournamentsTable > thead > tr > td").html() + "</div>");

	createSelector(".followMeBar", "background: #330000;padding: 5px 0px;position: relative;z-index: 1;color: #fff;border-top-right-radius:8px;border-top-left-radius:8px;border: 1px solid gray;border-bottom:none");
	var top = parseInt($(".showSide").offset().top) + parseInt(43);
	createSelector(".followMeBar.fixed", "position: fixed;top: " + top + "px;z-index: 0;z-index:100;");
	createSelector(".followMeBar.fixed.absolute", "position: absolute;");

	createSelector(".showSide", "overflow-y:scroll;float: left;margin-top: 43px;padding-right: 6px;");
	createSelector(".showSide thead", "display:none");
	createSelector(".showSide table", "border-top-right-radius:0;border-top-left-radius:0");

	/**
	 * Other CSS
	 */
	createSelector("#switchGameRadio label", "margin-left: 6px !important")
	createSelector(".showGames table", "display:block !important")
	createSelector("#switchGameRadio label:hover", "border: 1px solid rgb(89, 180, 212);border-image-source: initial;border-image-slice: initial;border-image-width: initial;border-image-outset: initial;border-image-repeat: initial;background:rgb(0, 120, 163);font-weight: bold;color: rgb(255, 255, 255);")
	createSelector("#MyGamesTable, #PromotedGamesTable, #OpenGamesTable", "display:none")
	createSelector("#MainSiteContent > table > tbody > tr > td", "width:100%")
	createSelector(".MainColumn", "min-width:535px")
	createSelector(".MainColumn", "width:40.55% !important")
	createSelector(".SideColumn", "float:left !important")
	createSelector("h2 + span", "margin-right: 50px;")
	createSelector(".fakerow div", "height: 0px;display: inline-block;opacity: 0;")
	createSelector(".fakerow td", "border:none !important")
	createSelector("body", "overflow:hidden");
	createSelector(".SideColumn", "width: 100% !important;");
	createSelector("#MyGamesFilter", "width:200px");
	createSelector(".showGames table thead", "position:fixed; z-index:500; border-top-left-radius:8px")
	createSelector(".showGames table", "display:block; overflow-y:scroll; overflow-x:hidden; border:1px gray solid; border-radius:8px");
	createSelector(".adsbygoogle", "margin-top: 25px;");
	createSelector(".showSide", "overflow-y:scroll;float: left;margin-top: 43px;padding-right: 6px;width:33.55%; min-width:500px;margin-left: 20px;border-top-left-radius:8px;border-top-right-radius:8px");
	createSelector("#refreshAll", "position: absolute;top: 85px;right: 31px;");

	new stickyTitles(jQuery(".followMeBar")).load();
	refreshSingleColumnSize();

	$("#switchGameRadio label").on("click", function () {
		var newShowGames = $(this).attr("for");
		if(newShowGames != showGamesActive) {
		$.each($("#switchGameRadio label"), function (key, value) {
			$(this).removeClass("ui-state-active");
		});
		$(this).addClass("ui-state-active");

		if (newShowGames == "ShowMyGames") {
			showGamesActive = newShowGames;
			$("#PromotedGamesTable").appendTo("body");
			$("#OpenGamesTable").appendTo("body");
			$("#MyGamesTable").appendTo(".showGames");
		} else if (newShowGames == "ShowCoinGames") {
			showGamesActive = newShowGames;
			$("#MyGamesTable").appendTo("body");
			$("#OpenGamesTable").appendTo("body");
			$("#PromotedGamesTable").appendTo(".showGames");
		} else if (newShowGames == "ShowOpenGames") {
			showGamesActive = newShowGames;
			$("#MyGamesTable").appendTo("body");
			$("#PromotedGamesTable").appendTo("body");
			$("#OpenGamesTable").appendTo(".showGames");
		}

		showAllGames.trigger("click");
		refreshSingleColumnSize()

		}
	});
}

$("label[for='MultiDayRadio']").on("click", function () {
	$("#OpenGamesTable").scrollTop(0);

})
$("label[for='RealTimeRadio']").on("click", function () {
	$("#OpenGamesTable").scrollTop(0);
})
$("label[for='BothRadio']").on("click", function () {
	$("#OpenGamesTable").scrollTop(0);
})

$(window).resize(function () {
	if (scrollGames) {
		refreshSingleColumnSize();
	}
});

function delayed() {
	if (showAllGames == "") {
		showAllGames = $("#ShowMoreOpenGamesLink")
		showAllGames.trigger("click");
	}
	if (showAllCoinGames == "") {
		showAllCoinGames = $("#ShowMorePromotedGamesLink");
		showAllCoinGames.trigger("click");
	}
}

function storeVariables() {
	localStorage.setItem("autoRefreshOnFocus", $("#autoRefreshOnFocus").prop("checked"));
	localStorage.setItem("hightlightTournaments", $("#hightlightTournaments").prop("checked"));
	localStorage.setItem("hideMyGamesIcons", $("#hideMyGamesIcons").prop("checked"));
	localStorage.setItem("scrollGames", $("#scrollGames").prop("checked"));

}

function refreshSingleColumnSize() {
	$(".showSide").scrollTop(0)
	/**
	 * Sticky Titles
	 */
	$(".followMeBar").each(function () {
		$(this).removeClass("fixed");
		if ($(this).parent().hasClass("followWrap")) {
			$(this).unwrap();
		}
		var thisSticky = $(this).wrap('<div class="followWrap" />');
		thisSticky.parent().height(thisSticky.outerHeight());

		var pos = parseInt(thisSticky.offset().top) - parseInt($(".showSide").offset().top);
		$.data(thisSticky[0], 'pos', pos);
	});
	var width = $("#ForumTable").width();
	createSelector(".followMeBar", "width:" + width + "px;");


	$(".showGames table").css({
		height: window.innerHeight - 150
	});
	$(".showGames table thead").css({
		width: $(".showGames").width() - 20
	});
	var height = $(".showGames table thead").height() + 6;
	createSelector(".showGames table tbody tr:first-of-type td", "padding-top:" + height + "px");

	$(".showSide").css({
		height: window.innerHeight - 150
	});
	$(".showGames table tbody tr:first-of-type td").css("padding-top", $(".showGames table thead").height() + 6)

}

function refreshHeight() {
	$("#MyGamesTable").css({
		height: window.innerHeight - 110,
		display: "block",
		"overflow-y": "scroll",
		"overflow-x": "hidden",
		"border": "1px gray solid",
		"border-radius": "8px"
	});
	$("#OpenGamesTable").css({
		height: window.innerHeight - 110,
		display: "block",
		"overflow-y": "scroll",
		"overflow-x": "hidden",
		"border": "1px gray solid",
		"border-radius": "8px"
	});
}

function createSelector(name, rules) {
	var style = document.createElement('style');
	style.type = 'text/css';
	document.getElementsByTagName('head')[0].appendChild(style);
	if (!(style.sheet || {}).insertRule)
		(style.styleSheet || style.sheet).addRule(name, rules);
	else
		style.sheet.insertRule(name + "{" + rules + "}", 0);
}

function refreshAll() {
	$("#MyGamesTable tbody").fadeTo('slow', 0.15);
	$("#OpenGamesTable tbody").fadeTo('slow', 0.15);
	$("#PromotedGamesTable tbody").fadeTo('slow', 0.15);

	var page = $('<div />').load('https://www.warlight.net/MultiPlayer/ ', function () {
		var myGames = page.find('#MyGamesTable tbody tr');
		var openGames = page.find('#OpenGamesTable tbody tr');
		var promotedGames = page.find('#PromotedGamesTable tbody tr');

		$.each($("#PromotedGamesTable tbody tr"), function (key, value) {
			if ($(value).html().indexOf("PastGames") < 0) {
				$(value).remove();
			}
		});

		$("#OpenGamesTable tbody tr").remove();
		$("#PromotedGamesTable tbody tr").remove();


		$.each($("#MyGamesTable tbody tr"), function (key, value) {
			if ($(value).html().indexOf("PastGames") < 0) {
				$(value).remove();
			}
		});

		$("#OpenGamesTable").scrollTop(0);
		$("#MyGamesTable").scrollTop(0)
		$("#PromotedGamesTable").scrollTop(0)

		$("#MyGamesTable tbody").prepend(myGames);
		$("#OpenGamesTable tbody").prepend(openGames);
		$("#PromotedGamesTable tbody").prepend(promotedGames);

		$("#ShowMorePromotedGamesLinkContainer").remove();
		showAllGames.trigger("click");
		showAllCoinGames.trigger("click");

		$("#MyGamesTable tbody").fadeTo('slow', 1);
		$("#OpenGamesTable tbody").fadeTo('slow', 1);
		$("#PromotedGamesTable tbody").fadeTo('slow', 1);

		if (scrollGames) {
			refreshSingleColumnSize()
		}
	});
}

jQuery.fn.outerHTML = function (s) {
	return s ? this.before(s).remove() : jQuery("<p>").append(this.eq(0).clone()).html();
};

function stickyTitles(stickies) {

	var thisObj = this;
	thisObj.load = function () {
		stickies.each(function () {
			var thisSticky = $(this).wrap('<div class="followWrap" />');
			thisSticky.parent().height(thisSticky.outerHeight());
			var pos = parseInt(thisSticky.offset().top) - parseInt($(".showSide").offset().top);
			$.data(thisSticky[0], 'pos', pos);
		});
		$(".showSide").off("scroll.stickies").on("scroll.stickies", function () {
			thisObj.scroll();
		});
	}

	thisObj.scroll = function () {
		stickies.each(function (i) {
			var thisSticky = $(this),
				nextSticky = stickies.eq(i + 1),
				prevSticky = stickies.eq(i - 1),
				pos = $.data(thisSticky[0], 'pos');
			if (pos <= $(".showSide").scrollTop()) {
				thisSticky.addClass("fixed");
				if (nextSticky.length > 0 && thisSticky.offset().top >= $.data(nextSticky[0], 'pos') - thisSticky.outerHeight()) {
					thisSticky.addClass("absolute").css("top", jQuery.data(nextSticky[0], 'pos') - thisSticky.outerHeight());
				}
			} else {
				thisSticky.removeClass("fixed");
				if (prevSticky.length > 0 && $(".showSide").scrollTop() <= $.data(thisSticky[0], 'pos') - prevSticky.outerHeight()) {
					prevSticky.removeClass("absolute").removeAttr("style");
				}
			}
		});
	}
}