Difference between revisions of "Template:SNDS PREVIEW"

From Olekdia Wiki
 
(18 intermediate revisions by the same user not shown)
Line 1: Line 1:
 
{{#tag:html
 
{{#tag:html
|<button onclick="var i=2;var c=this.children;c[0].paused?c[0].play():c[0].pause();c[1].src='a/olekdia/wiki_resources/'+(c[0].paused?'ic_play.svg':'ic_pause.svg');c[0].onended=function(){if(c.length>i){c[0].src='a/prana_breath/soundfiles/'+c[i].innerHTML;i++;c[0].load();c[0].play();}else{c[1].src='a/olekdia/wiki_resources/ic_play.svg';c[0].src='a/prana_breath/soundfiles/{{{1}}}';} }"><audio><source src="a/prana_breath/soundfiles/{{{1}}}" type="audio/ogg"/></audio><img src="a/olekdia/wiki_resources/ic_play.svg" width="30"/>{{#if: {{{2|}}}|<span class="hidden-sp">{{{2}}}</span>}}{{#if: {{{3|}}}|<span class="hidden-sp">{{{3}}}</span>}}{{#if: {{{4|}}}|<span class="hidden-sp">{{{4}}}</span>}}{{#if: {{{5|}}}|<span class="hidden-sp">{{{5}}}</span>}}</button>
+
|<button class="square-btn" onclick="var i=2;var c=this.children;var stop=function(){c[0].pause();c[1].src='a/olekdia/wiki_resources/ic_play.svg';c[0].src='a/prana_breath/soundfiles/{{{1}}}';};if(c[0].paused){c[0].play();c[1].src='a/olekdia/wiki_resources/ic_pause.svg';c[0].onended=function(){if(c.length>i){c[0].src='a/prana_breath/soundfiles/'+c[i].innerHTML;i++;c[0].load();c[0].play();}else{stop();} } }else{stop();};"><audio><source src="a/prana_breath/soundfiles/{{{1}}}" type="audio/ogg"/></audio><img src="a/olekdia/wiki_resources/ic_play.svg" width="30"/>{{#if: {{{2|}}}|<span class="hidden-sp">{{{2}}}</span>}}{{#if: {{{3|}}}|<span class="hidden-sp">{{{3}}}</span>}}{{#if: {{{4|}}}|<span class="hidden-sp">{{{4}}}</span>}}{{#if: {{{5|}}}|<span class="hidden-sp">{{{5}}}</span>}}</button>
 
|
 
|
 
|}}
 
|}}
 
<noinclude>
 
<noinclude>
 
<pre>
 
<pre>
<-- children[0] is an <audio> element
+
<-- children[0] is an <audio> element, children[1] is an <img> element -->
<button onclick="var numChild=2;var children=this.children;this.firstChild.paused?this.firstChild.play():this.firstChild.pause();children[1].src='a/olekdia/wiki_resources/'+(this.firstChild.paused?'ic_play.svg':'ic_pause.svg');this.firstChild.onended=function(){if(children.length>numChild){this.src='a/prana_breath/soundfiles/'+children[numChild].innerHTML;numChild++;this.load();this.play();}else{children[1].src='a/olekdia/wiki_resources/ic_play.svg';}}">
+
<button onclick="var i=2;var c=this.children;var stop=function(){c[0].pause();c[1].src='a/olekdia/wiki_resources/ic_play.svg';c[0].src='a/prana_breath/soundfiles/{{{1}}}';};if(c[0].paused){c[0].play();c[1].src='a/olekdia/wiki_resources/ic_pause.svg';c[0].onended=function(){if(c.length>i){c[0].src='a/prana_breath/soundfiles/'+c[i].innerHTML;i++;c[0].load();c[0].play();}else{stop();} } }else{stop();};">
 
     <audio>
 
     <audio>
 
         <-- Here first audio data is inserted -->
 
         <-- Here first audio data is inserted -->

Latest revision as of 14:31, 25 January 2019

<-- children[0] is an <audio> element, children[1] is an <img> element -->
<button onclick="var i=2;var c=this.children;var stop=function(){c[0].pause();c[1].src='a/olekdia/wiki_resources/ic_play.svg';c[0].src='a/prana_breath/soundfiles/{{{1}}}';};if(c[0].paused){c[0].play();c[1].src='a/olekdia/wiki_resources/ic_pause.svg';c[0].onended=function(){if(c.length>i){c[0].src='a/prana_breath/soundfiles/'+c[i].innerHTML;i++;c[0].load();c[0].play();}else{stop();} } }else{stop();};">
    <audio>
        <-- Here first audio data is inserted -->
        <source src="a/prana_breath/soundfiles/sound_0.ogg" type="audio/ogg">
    </audio>
    
    <-- Image inside button -->
    <img src="a/olekdia/wiki_resources/ic_play.svg" width="30"/>

    <!-- Here sound elements is inserted -->
    <span style="display: none;">sound_2.ogg</span>
    <span style="display: none;">sound_1.ogg</span>
    <span style="display: none;">sound_4.ogg</span>
</button>