MediaWiki:Common.js
Замечание: Возможно, после публикации вам придётся очистить кэш своего браузера, чтобы увидеть изменения.
- Firefox / Safari: Удерживая клавишу Shift, нажмите на панели инструментов Обновить либо нажмите Ctrl+F5 или Ctrl+R (⌘+R на Mac)
- Google Chrome: Нажмите Ctrl+Shift+R (⌘+Shift+R на Mac)
- Edge: Удерживая Ctrl, нажмите Обновить либо нажмите Ctrl+F5
- Opera: Нажмите Ctrl+F5.
/* Веб-проигрыватель для аудио на страницах вики.
*
* Использование в викитексте:
* <div class="cl-audio" data-title="Название" data-artist="Исполнитель">
* [[Media:Файл.mp3|Слушать трек]]</div>
*
* Ссылка [[Media:...]] нужна обязательно: скрипт берёт из неё адрес файла,
* а если JavaScript отключён — посетитель просто увидит рабочую ссылку.
* Трек НИКОГДА не запускается сам: без autoplay и с preload="none",
* а preload="metadata" тянет только заголовок файла (длительность), а не сам трек.
*/
$( function () {
$( '.cl-audio' ).each( function () {
var $box = $( this );
if ( $box.hasClass( 'cl-audio-ready' ) ) {
return;
}
var $link = $box.find( 'a' ).first();
var src = $box.attr( 'data-src' ) || ( $link.length ? $link.attr( 'href' ) : '' );
if ( !src ) {
return;
}
var title = $box.attr( 'data-title' ) || ( $link.length ? $link.text() : 'Аудиозапись' );
var artist = $box.attr( 'data-artist' ) || '';
var audio = document.createElement( 'audio' );
audio.controls = true;
audio.autoplay = false;
audio.preload = 'metadata';
audio.src = src;
audio.className = 'cl-audio-el';
var $head = $( '<div>' ).addClass( 'cl-audio-head' )
.append( $( '<span>' ).addClass( 'cl-audio-title' ).text( title ) );
if ( artist ) {
$head.append( $( '<span>' ).addClass( 'cl-audio-artist' ).text( artist ) );
}
$box.empty()
.addClass( 'cl-audio-ready' )
.append( $( '<span>' ).addClass( 'cl-audio-ico' ).text( '♪' ) )
.append(
$( '<div>' ).addClass( 'cl-audio-meta' )
.append( $head )
.append( audio )
);
} );
} );