MediaWiki:Common.js: Difference between revisions

Revision as of 07:44, 8 December 2010

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

/** Youtube Playlists *********************************************************
 *
 *  Description: Turns a list of youtube videos into a playlist thing
 *  Maintainers: [[User:t2t2]]
 */
function lookForPlaylist() {
	lists = getElementsByClassName(document, 'div', 'videoplaylist')
	if(lists.length > 0) {
		for(var i = 0; i < lists.length; i++) {
			container = lists[i]
			container.className = 'playlistplayer'
			container.getElementsByTagName('ul')[0].className = 'videolist'
			videoids = container.getElementsByTagName('a')
			for(var j = 0; j < videoids.length; j++) {
				videoid = videoids[j].href.split('').reverse().join('').match(/([a-zA-Z0-9_-])+(?==v\?)/g).toString().split('').reverse().join('')
				var prewimg = document.createElement('img')
				prewimg.src = 'http://img.youtube.com/vi/'+videoid+'/default.jpg'
				prewimg.className = 'youtube-prewimg'
				videoids[j].insertBefore(prewimg, videoids[j].firstChild)
				addClickHandler(videoids[j], playPlaylist)
			}
			var playercontainer = document.createElement('div')
			playercontainer.className = 'playlist-container'
			container.insertBefore(playercontainer, container.getElementsByTagName('ul')[0])
			playPlaylist({target: videoids[0]})
		}
		appendCSS(
			'.playlistplayer {width: 825px; height: 370px; padding: 5px; margin: 5px auto; border: 1px solid #501E1E; clear: both;}'
		+ '.playlist-container {width: 600px; height: 370px; float: left;}'
		+ '.videolist {width: 220px; height: 370px; overflow-y: scroll; margin: 0 0 0 5px; list-style: none; padding: 0; float: right;}'
		+ '.videolist li {clear: both; width: 200px; margin-bottom: 5px; font-size: 13px;}'
		+ '.videolist li a {display: block; min-height: 45px; background: transparent !important; padding-right: 0 !important;}'
		+ '.youtube-prewimg {height: 45px; width: 60px; border: none; margin-right: 5px; float: left;}'
		);
	}
}
function playPlaylist(e) {
	if (!e) var e = window.event
	if (e.target) targ = e.target;
	else if (e.srcElement) targ = e.srcElement;
	videoid = targ.href.split('').reverse().join('').match(/([a-zA-Z0-9_-])+(?==v\?)/g).toString().split('').reverse().join('')
	getElementsByClassName(targ.parentNode.parentNode.parentNode, 'div', 'playlist-container')[0].innerHTML = '<object width="600" height="370"><param name="movie" value="http://www.youtube.com/v/'+videoid+'"></param><param name="wmode" value="transparent"></param><embed src="http://www.youtube.com/v/'+videoid+'" type="application/x-shockwave-flash" wmode="transparent" width="600" height="370"></embed></object>'
	if (e.preventDefault) { e.preventDefault(); } else { e.returnValue = false; } // Ahh IE, at least leaves a way for direct calling
}
addOnloadHook(lookForPlaylist);