MediaWiki:Gadget-audioplayer-core.js

From RuneRealm Wiki

This is an old revision of this page, as edited by Alex (talk | contribs) at 01:50, 13 October 2024 (Created page with "$(function() { →‎* Replace audio track links with the audio file when clicked *: function playTrack(e, playlist) { if ($(this).attr('target') == '_blank') { // do not play another track if the link opens in a new tab. return; } e.preventDefault(); var filename = $(e.target).closest('a').attr('href').match(/File:(.*\.ogg)/)[1]; var $audio = $('<audio>').attr({ src: '/images/' + filename + '?11111', autoplay: playlist !== true, controls: true,..."). The present address (URL) is a permanent link to this revision, which may differ significantly from the current revision.

(diff) ← Older revision | Latest revision (diff) | Newer revision → (diff)
Jump to navigation Jump to search

After saving, you may need to bypass your browser's cache to see the changes. For further information, see Wikipedia:Bypass your cache.

  • In most Windows and Linux browsers: Hold down Ctrl and press F5.
  • In Safari: Hold down ⇧ Shift and click the Reload button.
  • In Chrome and Firefox for Mac: Hold down both ⌘ Cmd+⇧ Shift and press R.
$(function() {
	/** Replace audio track links with the audio file when clicked **/
	function playTrack(e, playlist) {
		if ($(this).attr('target') == '_blank') {
			// do not play another track if the link opens in a new tab.
			return;
		}
		e.preventDefault();
		var filename = $(e.target).closest('a').attr('href').match(/File:(.*\.ogg)/)[1];
		var $audio = $('<audio>').attr({
			src: '/images/' + filename + '?11111',
			autoplay: playlist !== true,
			controls: true,
		}).addClass('rsw-music-player'); // .rsw-music-player { height: 2em; vertical-align: middle; }
		$('.rsw-music-player').each(function() {
			if (playlist && $(this).is('#music-playlist audio')) {
				// do not pause the playlist player when listening to a list
				return;
			}
			// pause all other songs that are currently playing
			if (!this.paused) {
				this.pause();
			}
		});
		// load and start playing activated song
		$(e.target).replaceWith($audio);
		return $audio.attr('src');
	}
	
	// Apply onclick to audio links inside .embed-audio-links class
	$('body').on('click', '.embed-audio-links a[href^="/w/File:"][href$=".ogg"]', playTrack)

	/**  Script for handling playlists added through [[Template:Playlist]]. **/
	var $div = $('#music-playlist:not(.musicMap-playlist)');
	if ($div.length !== 0) {
		$div.show();
		var unlocked = $div.data('unlocked-button')
		var $play = $('<button>').attr('id', 'music-play').addClass('cdx-button').html('Shuffle play'+(unlocked?' all':'')).appendTo($div);
		if (unlocked) {
			var $playunlocked = $('<button>').attr('id', 'music-playunlocked').addClass('cdx-button').html('Shuffle play unlocked').appendTo($div)
		}
		$('<br/>').appendTo($div);
		var $playing = $('<span>').attr('id', 'music-playing').appendTo($div);
		var $scroll = $('<span>').addClass('music-scroll-to').appendTo($div);
		$('<a>').attr('href', '#music-current-song').html('Scroll to song').appendTo($scroll).before(' (').after(')');
		$('<br/>').appendTo($div);
		var $player = $('<audio>').attr({
			id: 'music-player',
			autoplay: true,
			controls: true,
		}).addClass('rsw-music-player').appendTo($div);

		// Event handlers
		$play.click(function(e) {
			if (playRandom.call($player.get(0), false, true)) {
				$(this).html('Shuffle playing').prop('disabled', true);
				if (unlocked) {
					$playunlocked.html('Shuffle play unlocked').prop('disabled', false);
				}
				// queue the next song after the previous one ends:
				$player.on('ended', playRandom.bind($player.get(0), false));
			}
		});
		if (unlocked) {
			$playunlocked.click(function(e) {
				if (playRandom.call($player.get(0), true, true)) {
					$(this).html('Shuffle playing unlocked').prop('disabled', true);
					$play.html('Shuffle play'+(unlocked?' all':'')).prop('disabled', false);
				}
				// queue the next song after the previous one ends:
				$player.on('ended', playRandom.bind($player.get(0), true));
			});
		}
	}
	
	// Play a random song from the tables on the current page
	function playRandom(unlocked, firstsong) {
		var $player = $(this);
		var $songs = $('a[href^="/w/File:"][href$=".ogg"]')
		if (unlocked) {
			$songs = $songs.filter('.highlight-on a');
		}
		if ($songs.length == 0) {
			if (firstsong === true) {// give no-songs alert only when it was the user who started the song. If autoplay can't find more, end silently.
				alert('Could not find any '+(unlocked?'unlocked ':'')+'music tracks to play. Reload the page to allow previous songs to be played again.');
			} else {
				$('#music-play').html('Shuffle play'+(unlocked?' all':'')).prop('disabled', false);
				if (unlocked) {
					$playunlocked.html('Shuffle play unlocked').prop('disabled', false);
				}
			}
			return false;
		}
		var song = $songs.get(Math.floor(Math.random() * $songs.length));
		$('#music-current-song').removeAttr('id');
		$(song).closest('tr').attr('id', 'music-current-song');
		var $songlink = $(song).parents('tr').find('td:first-child a').eq(0).clone();
		$songlink.attr('target', '_blank');
		var e = {
			preventDefault: function() {},
			target: song,
		};
		var url = playTrack(e, true); // replace the link in the list with the music player
		$player.attr('src', url); // play the track in the playlist player at the top; autoplay-attribute makes this play automatically.

		var $playing = $('#music-playing');
		$playing.html("Now playing: "); // Indicate which song is playing
		$songlink.appendTo($playing); // link to song
		
		return true;
	}
});