Difference between revisions of "Widget:PlayWrap"

From No Subject - Encyclopedia of Psychoanalysis
Jump to: navigation, search
(Created page with "<noinclude>__NOTOC__ This widget allows you to embed '''[https://github.com/etianen/html5media HTML5 Video Media]''' on your wiki page. Created by [https://www.mediawikiwidge...")
 
 
(5 intermediate revisions by the same user not shown)
Line 9: Line 9:
 
== Copy to your site ==
 
== Copy to your site ==
 
To use this widget on your site, just install [https://www.mediawiki.org/wiki/Extension:Widgets MediaWiki Widgets extension] and copy the [{{fullurl:{{FULLPAGENAME}}|action=edit}} full source code] of this page to your wiki as page '''{{FULLPAGENAME}}'''.
 
To use this widget on your site, just install [https://www.mediawiki.org/wiki/Extension:Widgets MediaWiki Widgets extension] and copy the [{{fullurl:{{FULLPAGENAME}}|action=edit}} full source code] of this page to your wiki as page '''{{FULLPAGENAME}}'''.
−
</noinclude><includeonly><script src="//gist.githubusercontent.com/jeremejazz/3bf2fb128cd651dc7f84/raw/71ee8fad07cbb026ea6cb566b80548f6ef664a6d/script.js"></script><link rel="stylesheet" href="https://gist.githubusercontent.com/jeremejazz/3bf2fb128cd651dc7f84/raw/71ee8fad07cbb026ea6cb566b80548f6ef664a6d/style.css" />
+
</noinclude><includeonly>
 +
<script type="text/javascript" src="https://www.link-elearning.com/linkdl/preview/views/default/script/jquery.min.js"></script>
 +
<script type="text/javascript" src="https://www.link-elearning.com:443/linkdl/script/mediaelement/mediaelement-and-player.min.js"></script>
 +
<!-- <script type="text/javascript" src="https://www.link-elearning.com:443/linkdl/script/mediaelement/plugins/mep-feature-playlist.js"></script> -->
 +
<script type="text/javascript" src="http://clubscrap.com/wp-content/plugins/rtmedia-pro/lib/playlist/mep-feature-playlist.js"></script>
 +
<link rel="stylesheet" href="https://www.link-elearning.com:443/linkdl/script/mediaelement/linkskin/mediaelementplayer.min.css" type="text/css" media="all">
 +
<link rel="stylesheet" href="https://www.link-elearning.com:443/linkdl/script/mediaelement/plugins/mep-feature-playlist.css" type="text/css" media="all">
  
−
<div id="playwrap">
+
 
 +
<div id="<!--{$id|escape:'html'|default:'wrapper'}-->" width="<!--{$width|escape:'html'|default:'450px'}-->" style="width:<!--{$width|escape:'html'|default:'450px'}-->; height:<!--{$height|escape:'html'|default:'500px'}-->;">
 +
<script>
 +
var mediaElements = document.querySelectorAll('video, audio');
 +
for (var i = 0, total = mediaElements.length; i < total; i++) {
 +
new MediaElementPlayer(mediaElements[i], {
 +
features: ['playpause','progress','duration','volume'],
 +
});
 +
}
 +
</script>
 
<audio id="mejs" src="<!--{$url1|validate:url}-->" type="audio/mp3" controls="controls"></audio>
 
<audio id="mejs" src="<!--{$url1|validate:url}-->" type="audio/mp3" controls="controls"></audio>
 
<ul class="mejs-list">
 
<ul class="mejs-list">
−
        <li  class="current"  data-url="<!--{$url1|validate:url}-->"><!--{$title1}--></li>
+
    <li  class="current"  data-url="<!--{$url1|validate:url}-->"><!--{$title1|escape:'html'|default:'Track 1'}--></li>
−
    <li data-url="<!--{$url2|validate:url}-->"><!--{$title2}--></li>
+
<li data-url="<!--{$url2|validate:url}-->"><!--{$title2|escape:'html'|default:'Track 2'}--></li>
−
    <li data-url="<!--{$url3|validate:url}-->"><!--{$title3}--></li>
+
<li data-url="<!--{$url3|validate:url}-->"><!--{$title3|escape:'html'|default:'Track 3'}--></li>
−
    <li data-url="<!--{$url4|validate:url}-->"><!--{$title4}--></li>
+
<li data-url="<!--{$url4|validate:url}-->"><!--{$title4|escape:'html'|default:'Track 4'}--></li>
−
    <li data-url="<!--{$url5|validate:url}-->"><!--{$title5}--></li>
+
<li data-url="<!--{$url5|validate:url}-->"><!--{$title5|escape:'html'|default:'Track 5'}--></li>
−
    <li data-url="<!--{$url6|validate:url}-->"><!--{$title6}--></li>
+
<li data-url="<!--{$url6|validate:url}-->"><!--{$title6|escape:'html'|default:'Track 6'}--></li>
−
    <li data-url="<!--{$url7|validate:url}-->"><!--{$title7}--></li>
+
<li data-url="<!--{$url7|validate:url}-->"><!--{$title7|escape:'html'|default:'Track 7'}--></li>
−
    <li data-url="<!--{$url8|validate:url}-->"><!--{$title8}--></li>
+
<li data-url="<!--{$url8|validate:url}-->"><!--{$title8|escape:'html'|default:'Track 8'}--></li>
−
    <li data-url="<!--{$url9|validate:url}-->"><!--{$title9}--></li>
+
<li data-url="<!--{$url9|validate:url}-->"><!--{$title9|escape:'html'|default:'Track 9'}--></li>
−
    <li data-url="<!--{$url10|validate:url}-->"><!--{$title10}--></li>
+
<li data-url="<!--{$url10|validate:url}-->"><!--{$title10|escape:'html'|default:'Track 10'}--></li>
−
    <li data-url="<!--{$url11|validate:url}-->"><!--{$title11}--></li>
+
<li data-url="<!--{$url11|validate:url}-->"><!--{$title11|escape:'html'|default:'Track 11'}--></li>
−
    <li data-url="<!--{$url12|validate:url}-->"><!--{$title12}--></li>
+
<li data-url="<!--{$url12|validate:url}-->"><!--{$title12|escape:'html'|default:'Track 12'}--></li>
−
    <li data-url="<!--{$url13|validate:url}-->"><!--{$title13}--></li>
+
<li data-url="<!--{$url13|validate:url}-->"><!--{$title13|escape:'html'|default:'Track 13'}--></li>
 
</ul>
 
</ul>
 +
 +
 
</div>
 
</div>
 
</includeonly>
 
</includeonly>
 +
 +
<script>
 +
$(function(){
 +
    $('audio,video').mediaelementplayer({
 +
        loop: true,
 +
        shuffle: false,
 +
        playlist: true,
 +
        audioHeight: 30,
 +
        playlistposition: 'bottom',
 +
        features: ['playlistfeature', 'prevtrack', 'playpause', 'nexttrack', 'playlist', 'current', 'progress', 'duration', 'volume'],
 +
    });
 +
});
 +
</script>

Latest revision as of 02:23, 5 July 2019

This widget allows you to embed HTML5 Video Media on your wiki page.

Created by taipan

Using this widget

For information on how to use this widget, see widget description page on MediaWikiWidgets.org.

Copy to your site

To use this widget on your site, just install MediaWiki Widgets extension and copy the full source code of this page to your wiki as page Widget:PlayWrap.


<script> $(function(){ 

   $('audio,video').mediaelementplayer({
       loop: true,
       shuffle: false,
       playlist: true,
       audioHeight: 30,
       playlistposition: 'bottom',
       features: ['playlistfeature', 'prevtrack', 'playpause', 'nexttrack', 'playlist', 'current', 'progress', 'duration', 'volume'],
   });

}); </script>

Retrieved from "https://nosubject.com/index.php?title=Widget:PlayWrap&oldid=51547"