Difference between revisions of "MediaWiki:Common.js"

/* Any JavaScript here will be loaded for all users on every page load. */

var toggleMapListSetup = function() {
	var btn = $('a[id^="collapseButton"]');

	btn.each(function() {
		var table = $(this).closest('table');
		var m = $('.maprow', table);

		if (m.length) {
			m.hide(); // Collapse maps by default

			var span = $('<span>', {
				'class': 'mapsCollapseButton',
				'css': {
					'font-weight': 'normal',
					'float': 'right',
					'margin-right': '7px',
					'cursor': 'pointer'
				}
			});

			table.data('maps-collapsed', true);

			var toggleMaps = function() {
				table.find('.maprow').toggle();
				table.data('maps-collapsed', !table.data('maps-collapsed'));

				$(this).text(function(i, txt) {
					return txt.replace(/\+|-/, function(a) {
						return a === '+' ? '-' : '+';
					});
				});
			};

			var a = $('<a>+maps</a>').click(toggleMaps);

			span.append('[', a, ']');
			$(this).parent().after(span);

			if (table.hasClass('uncollapsed-maps')) {
				a.trigger('click');
			}
		}
	});
};

/** Collapsible tables *********************************************************
*
* From English Wikipedia, 2008-09-15
*
*  Description: Allows tables to be collapsed, showing only the header. See
*               [[Wikipedia:NavFrame]].
*  Maintainers: [[User:R. Koot]]
*/

var autoCollapse = 2;
var collapseCaption = "hide";
var expandCaption = "show";

function collapseTable( tableIndex )
{
	var Button = document.getElementById( "collapseButton" + tableIndex );
	var Table = document.getElementById( "collapsibleTable" + tableIndex );

	if ( !Table || !Button ) {
		return false;
	}

	var Rows = Table.rows;

	if ( Button.firstChild.data == collapseCaption ) {
		for ( var i = 1; i < Rows.length; i++ ) {
			Rows[i].style.display = "none";
		}
		Button.firstChild.data = expandCaption;

		$('.mapsCollapseButton', Table).hide();
	} else {
		for ( var i = 1; i < Rows.length; i++ ) {
			if ( hasClass( Rows[i], "maprow" ) ) {
				// Skip showing for this row if the maps are in collapsed state
				if ($(Table).data('maps-collapsed')) {
					continue;
				}
			}

			Rows[i].style.display = Rows[0].style.display;
		}
		Button.firstChild.data = collapseCaption;

		$('.mapsCollapseButton', Table).show();
	}
}

function createCollapseButtons()
{
	var tableIndex = 0;
	var NavigationBoxes = new Object();
	var Tables = document.getElementsByTagName( "table" );

	for ( var i = 0; i < Tables.length; i++ ) {
		if ( hasClass( Tables[i], "collapsible" ) ) {

			/* only add button and increment count if there is a header row to work with */
			var HeaderRow = Tables[i].getElementsByTagName( "tr" )[0];
			if (!HeaderRow) continue;
			var Header = HeaderRow.getElementsByTagName( "th" )[0];
			if (!Header) continue;

			NavigationBoxes[ tableIndex ] = Tables[i];
			Tables[i].setAttribute( "id", "collapsibleTable" + tableIndex );

			var Button     = document.createElement( "span" );
			var ButtonLink = document.createElement( "a" );
			var ButtonText = document.createTextNode( collapseCaption );
			Button.className = "collapseButton"; //Styles are declared in Common.css

			ButtonLink.style.color = Header.style.color;
			ButtonLink.setAttribute( "id", "collapseButton" + tableIndex );
			ButtonLink.setAttribute( "href", "javascript:collapseTable(" + tableIndex + ");" );
			ButtonLink.appendChild( ButtonText );

			Button.appendChild( document.createTextNode( "[" ) );
				Button.appendChild( ButtonLink );
				Button.appendChild( document.createTextNode( "]" ) );

				Header.insertBefore( Button, Header.childNodes[0] );
				tableIndex++;
		}
	}

	// Create [+maps] buttons after setting up the table collapse buttons,
	// but before initial collapseTable calls
	toggleMapListSetup();

	for ( var i = 0;  i < tableIndex; i++ ) {
		if ( hasClass( NavigationBoxes[i], "collapsed" ) || ( tableIndex >= autoCollapse && hasClass( NavigationBoxes[i], "autocollapse" ) ) ) {
			collapseTable( i );
		}
	}
}

/** Test if an element has a certain class **************************************
*
* Description: Uses regular expressions and caching for better performance.
* Maintainers: [[User:Mike Dillon]], [[User:R. Koot]], [[User:SG]]
*/

var hasClass = (function () {
	var reCache = {};
	return function (element, className) {
		return (reCache[className] ? reCache[className] : (reCache[className] = new RegExp("(?:\\s|^)" + className + "(?:\\s|$)"))).test(element.className);
	};
})();

$(document).ready (function() {
	createCollapseButtons();
	/* Force scroll to anchor, if there is one, after divs and tables are collapsed */
	if (location.hash) {
		var selector = location.hash.replace( /(:|\.|\[|\])/g, "\\$1" );
		if ($(selector).length > 0)
			$(document).scrollTop($(selector).offset().top);
	}
});


/* Bracket Popups by Anomek */

var bracketGame;
$.fn.justtext = function() {
	return $(this).clone().children().remove('div').end().text().trim();
};
$(document).ready(function() {
	$('.bracket-game').each( function() {
		if ($(this).find('.bracket-game-details').length > 0) {
			var margin = $(this).find(':first-child').height() - 6;
			$(this).prepend('<div class="icon" style="margin-top:' + margin + 'px;"></div>');
			$(this).find('.bracket-team-top, .bracket-team-bottom, .bracket-player-top, .bracket-player-bottom').each(function() {
				$(this).css('cursor', 'pointer');
				$(this).attr('title', 'Click for further information');
			});
		}
	});
	$('.match-row').each( function() {
		if ($(this).find('.bracket-game-details').length > 0) {
			$(this).find('td:eq(2)').prepend('<div style="position:relative"><div class="match-row-icon"></div></div>');
		}
		$(this).attr('title', 'Click for further information');
	});

	$('html').click(function () {
		if (bracketGame != null) {
			bracketGame.find('.bracket-game-details').toggle();
			bracketGame = null;
		}
	});

	$('.bracket-team-top, .bracket-team-bottom, .bracket-player-top, .bracket-player-bottom, .bracket-game .icon').click(
	function (event) {
		var bracket = $(this).closest('.bracket, .crosstable'),
			detailsHeight, detailsWidth, spaceOnTheRight;
		if (bracketGame != null) {
			bracketGame.children('.bracket-game-details').toggle();
			if (bracketGame[0] === $(this).closest('.bracket-game')[0]) {
				bracketGame = null;
				return;
			}
		}
		bracketGame = $(this).closest('.bracket-game');
		detailsHeight= bracketGame.children('.bracket-game-details').height();
		detailsWidth = bracketGame.children('.bracket-game-details').width();

		bracketGame.children('.bracket-game-details').css('margin-top', -detailsHeight / 2);
		spaceOnTheRight = Math.max($(window).width(), bracket.offset().left + bracket.outerWidth()) - (bracketGame.offset().left + bracketGame.outerWidth());
		if (spaceOnTheRight < detailsWidth && bracketGame.offset().left > detailsWidth) {
			bracketGame.children('.bracket-game-details').css('margin-left', -detailsWidth - 1);
		} else {
			bracketGame.children('.bracket-game-details').css('margin-left', bracketGame.width());
		}
		bracketGame.children('.bracket-game-details').toggle();
		event.stopPropagation();
	});
	$('.match-row').click(function (event) {
		if (bracketGame != null) {
			bracketGame.find('.bracket-game-details').toggle();
			if (bracketGame[0] === $(this)[0]) {
				bracketGame = null;
				return;
			}
		}
		bracketGame = $(this);
		var height = bracketGame.find('.bracket-game-details').height();
		bracketGame.find('.bracket-game-details').css('margin-top', 3);
		bracketGame.find('.bracket-game-details').toggle();
		event.stopPropagation();
	});

	$('.bracket-game-details').click(function (event) {
		event.stopPropagation();
	});
});

/* Highlighting by FO-nTTaX */

var highlightingsearch = [];
var highlightingstandardicon = ['Team16.png'];
$(document).ready(function() {

	$('tr.match-row').hover(function () {
		$(this).addClass('bracket-hover');
		if ($(this).closest('tr.match-row').find('.bracket-game-details').length) {
			$(this).css('cursor', 'pointer');
		}
	}, function () {
		$(this).removeClass('bracket-hover');
	});

	if($('.bind-highlighting').length > 0) {
		var highlightingbinds = [];
		$('.bind-highlighting').each(function () {
			var to = $(this).children('.bind-highlighting-to');
			var from = $(this).children('.bind-highlighting-from');

			var icto = $(to).find('.team-template-image img');
			if (icto.length == 1) {
				var icsrcto = icto.attr('src').split('/');
				icsrcto = icsrcto[icsrcto.length - 1];
				icsrcto = icsrcto.replace("-icon", "_std");
				if (icsrcto.indexOf('-') != -1) {
					icsrcto = icsrcto.split('-');
					icsrcto = icsrcto[icsrcto.length - 1];
				}
				if (highlightingstandardicon.indexOf(icsrcto) != -1) {
					icsrcto = $(to).justtext();
				}
			} else {
				var icsrcto = $(to).justtext();
			}
			var icfrom = $(from).find('.team-template-image img');
			if (icfrom.length == 1) {
				var icsrcfrom = icfrom.attr('src').split('/');
				icsrcfrom = icsrcfrom[icsrcfrom.length - 1];
				icsrcfrom = icsrcfrom.replace("-icon", "_std");
				if (icsrcfrom.indexOf('-') != -1) {
					icsrcfrom = icsrcfrom.split('-');
					icsrcfrom = icsrcfrom[icsrcto.length - 1];
				}
				if (highlightingstandardicon.indexOf(icsrcfrom) != -1) {
					icsrcfrom = $(from).justtext();
				}
			} else {
				var icsrcfrom = $(from).justtext();
			}
			highlightingbinds[icsrcfrom] = icsrcto;
		});
	}
	$('.bracket-team-top, .bracket-team-bottom, .bracket-team-middle, .bracket-player-top, .bracket-player-bottom, .bracket-player-middle, .matchlistslot, .grouptableslot').each(function() {
		var ic = $(this).find('.team-template-image img');
		if (ic.length == 1) {
			var icsrc = ic.attr('src').split('/');
			icsrc = icsrc[icsrc.length - 1];
			icsrc = icsrc.replace("-icon", "_std");
			if (icsrc.indexOf('-') != -1) {
				icsrc = icsrc.split('-');
				icsrc = icsrc[icsrc.length - 1];
			}
			if (highlightingstandardicon.indexOf(icsrc) != -1) {
				icsrc = $(this).justtext();
			}
			if ((typeof highlightingbinds !== 'undefined') && (icsrc in highlightingbinds)) {
				icsrc = highlightingbinds[icsrc];
			}
			if (!Array.isArray(highlightingsearch[icsrc])) {
				highlightingsearch[icsrc] = [];
			}
			highlightingsearch[icsrc].push(this);
			$(this).data('highlightingkey', icsrc);
		} else {
			var icsrc = $(this).justtext();
			if ((typeof highlightingbinds !== 'undefined') && (icsrc in highlightingbinds)) {
				icsrc = highlightingbinds[icsrc];
			}
			if (!Array.isArray(highlightingsearch[icsrc])) {
				highlightingsearch[icsrc] = [];
			}
			highlightingsearch[icsrc].push(this);
			$(this).data('highlightingkey', icsrc);
			
			/* Starcraft specific start */
			if ((!$(this).hasClass('grouptableslot')) && (!$(this).hasClass('matchlistslot'))) {
				$(this).data('background-color', $(this).css('background-color'));
				switch ($(this).data('background-color')) {
					case 'rgb(242, 184, 184)':
						$(this).data('background-color-hover', 'rgb(250,217,217)'); //Zerg
						break;
					case 'rgb(184, 242, 184)':
						$(this).data('background-color-hover', 'rgb(217,250,217)'); //Protoss
						break;
					case 'rgb(184, 184, 242)':
						$(this).data('background-color-hover', 'rgb(217,217,250)'); //Terran
						break;
					default:
						$(this).data('background-color-hover', 'rgb(250,250,250)'); //normal
						break;
				}
			}
			/* Starcraft specific end */
		}
	});
	$('.bracket-team-top, .bracket-team-bottom, .bracket-team-middle, .bracket-player-top, .bracket-player-bottom, .bracket-player-middle, .matchlistslot, .grouptableslot').hover(function() {
		var icsrc = $(this).data('highlightingkey');
		if (typeof icsrc !== 'undefined') {
			var filter = ['BYE', 'TBD', 'TBA', ''];
			if (filter.indexOf(icsrc.toUpperCase()) == -1) {
				$.each(highlightingsearch[icsrc], function() {
					$(this).addClass('bracket-hover');
					/* Starcraft specific start */
					if (typeof $(this).data('background-color-hover') !== 'undefined') {
						$(this).css('background-color', $(this).data('background-color-hover'));
					}
					/* Starcraft specific end */
				});
			}
		}
	}, function() {
		var icsrc = $(this).data('highlightingkey');
		if (typeof icsrc !== 'undefined') {
			$.each(highlightingsearch[icsrc], function() {
				$(this).removeClass('bracket-hover');
				/* Starcraft specific start */
				if (typeof $(this).data('background-color-hover') !== 'undefined') {
					$(this).css('background-color', $(this).data('background-color'));
				}
				/* Starcraft specific end */
			});
		}
	});
  
});