Difference between revisions of "Template:SNDS PREVIEW"
From Olekdia Wiki
| (20 intermediate revisions by the same user not shown) | |||
| Line 1: | Line 1: | ||
{{#tag:html | {{#tag:html | ||
| − | |<button onclick="var | + | |<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> | ||
| − | <button onclick="var | + | <-- 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> | </button> | ||
</pre> | </pre> | ||
</noinclude> | </noinclude> | ||
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>