MediaWiki:Gadget-audioplayer-core.js

From Old School Near-Reality Wiki
Revision as of 19:14, 3 October 2022 by Jacmob (talk | contribs) (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: '/w/Special:Redirect?wptype=file&wpvalue=' + filename, autoplay: playlist !== true,...")
(diff) ← Older revision | Latest revision (diff) | Newer revision → (diff)
Jump to navigation Jump to search

Note: After publishing, you may have to bypass your browser's cache to see the changes.

  • Firefox / Safari: Hold Shift while clicking Reload, or press either Ctrl-F5 or Ctrl-R (⌘-R on a Mac)
  • Google Chrome: Press Ctrl-Shift-R (⌘-Shift-R on a Mac)
  • Internet Explorer / Edge: Hold Ctrl while clicking Refresh, or press Ctrl-F5
  • Opera: Press Ctrl-F5.
  1 $(function() {
  2 	/** Replace audio track links with the audio file when clicked **/
  3 	function playTrack(e, playlist) {
  4 		if ($(this).attr('target') == '_blank') {
  5 			// do not play another track if the link opens in a new tab.
  6 			return;
  7 		}
  8 		e.preventDefault();
  9 		var filename = $(e.target).closest('a').attr('href').match(/File:(.*\.ogg)/)[1];
 10 		var $audio = $('<audio>').attr({
 11 			src: '/w/Special:Redirect?wptype=file&wpvalue=' + filename,
 12 			autoplay: playlist !== true,
 13 			controls: true,
 14 		}).addClass('rsw-music-player'); // .rsw-music-player { height: 2em; vertical-align: middle; }
 15 		$('.rsw-music-player').each(function() {
 16 			if (playlist && $(this).is('#music-playlist audio')) {
 17 				// do not pause the playlist player when listening to a list
 18 				return;
 19 			}
 20 			// pause all other songs that are currently playing
 21 			if (!this.paused) {
 22 				this.pause();
 23 			}
 24 		});
 25 		// load and start playing activated song
 26 		$(e.target).replaceWith($audio);
 27 		return $audio.attr('src');
 28 	}
 29 	
 30 	// Apply onclick to audio links inside .embed-audio-links class
 31 	$('body').on('click', '.embed-audio-links a[href^="/w/File:"][href$=".ogg"]', playTrack)
 32 
 33 	/**  Script for handling playlists added through [[Template:Playlist]]. **/
 34 	var $div = $('#music-playlist:not(.musicMap-playlist)');
 35 	if ($div.length !== 0) {
 36 		$div.show();
 37 		var unlocked = $div.data('unlocked-button')
 38 		var $play = $('<button>').attr('id', 'music-play').addClass('mw-ui-button').html('Shuffle play'+(unlocked?' all':'')).appendTo($div);
 39 		if (unlocked) {
 40 			var $playunlocked = $('<button>').attr('id', 'music-playunlocked').addClass('mw-ui-button').html('Shuffle play unlocked').appendTo($div)
 41 		}
 42 		$('<br/>').appendTo($div);
 43 		var $playing = $('<span>').attr('id', 'music-playing').appendTo($div);
 44 		var $scroll = $('<span>').addClass('music-scroll-to').appendTo($div);
 45 		$('<a>').attr('href', '#music-current-song').html('Scroll to song').appendTo($scroll).before(' (').after(')');
 46 		$('<br/>').appendTo($div);
 47 		var $player = $('<audio>').attr({
 48 			id: 'music-player',
 49 			autoplay: true,
 50 			controls: true,
 51 		}).addClass('rsw-music-player').appendTo($div);
 52 
 53 		// Event handlers
 54 		$play.click(function(e) {
 55 			if (playRandom.call($player.get(0), false, true)) {
 56 				$(this).html('Shuffle playing').prop('disabled', true);
 57 				if (unlocked) {
 58 					$playunlocked.html('Shuffle play unlocked').prop('disabled', false);
 59 				}
 60 				// queue the next song after the previous one ends:
 61 				$player.on('ended', playRandom.bind($player.get(0), false));
 62 			}
 63 		});
 64 		if (unlocked) {
 65 			$playunlocked.click(function(e) {
 66 				if (playRandom.call($player.get(0), true, true)) {
 67 					$(this).html('Shuffle playing unlocked').prop('disabled', true);
 68 					$play.html('Shuffle play'+(unlocked?' all':'')).prop('disabled', false);
 69 				}
 70 				// queue the next song after the previous one ends:
 71 				$player.on('ended', playRandom.bind($player.get(0), true));
 72 			});
 73 		}
 74 	}
 75 	
 76 	// Play a random song from the tables on the current page
 77 	function playRandom(unlocked, firstsong) {
 78 		var $player = $(this);
 79 		var $songs = $('a[href^="/w/File:"][href$=".ogg"]')
 80 		if (unlocked) {
 81 			$songs = $songs.filter('.highlight-on a');
 82 		}
 83 		if ($songs.length == 0) {
 84 			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.
 85 				alert('Could not find any '+(unlocked?'unlocked ':'')+'music tracks to play. Reload the page to allow previous songs to be played again.');
 86 			} else {
 87 				$('#music-play').html('Shuffle play'+(unlocked?' all':'')).prop('disabled', false);
 88 				if (unlocked) {
 89 					$playunlocked.html('Shuffle play unlocked').prop('disabled', false);
 90 				}
 91 			}
 92 			return false;
 93 		}
 94 		var song = $songs.get(Math.floor(Math.random() * $songs.length));
 95 		$('#music-current-song').removeAttr('id');
 96 		$(song).closest('tr').attr('id', 'music-current-song');
 97 		var $songlink = $(song).parents('tr').find('td:first-child a').eq(0).clone();
 98 		$songlink.attr('target', '_blank');
 99 		var e = {
100 			preventDefault: function() {},
101 			target: song,
102 		};
103 		var url = playTrack(e, true); // replace the link in the list with the music player
104 		$player.attr('src', url); // play the track in the playlist player at the top; autoplay-attribute makes this play automatically.
105 
106 		var $playing = $('#music-playing');
107 		$playing.html("Now playing: ") // Indicate which song is playing
108 		$songlink.appendTo($playing); // link to song
109 		
110 		return true;
111 	}
112 });