Template:Audio: Difference between revisions
Jump to navigation
Jump to search
Content added Content deleted
PetraMagna (talk | contribs) mNo edit summary |
PetraMagna (talk | contribs) mNo edit summary |
||
Line 1: | Line 1: | ||
<includeonly><templatestyles src="Audio/style.css"/><div class="audio-player" style="{{{container-style|}}}" data-src="{{filepath:{{{src|}}}}}" data-group="{{{group|}}}" data-volume="{{{volume|1}}}" data-loop="{{{loop|false}}}" data-loop-start="{{{loop-start|0}}}" data-loop-end="{{{loop-end|0}}}" data-pause-button="{{{pause-button|}}}"> |
<includeonly><templatestyles src="Audio/style.css"/><div class="audio-player" style="{{{container-style|}}}" data-src="{{filepath:{{{src|}}}}}" data-file-page="{{{src|}}}" data-group="{{{group|}}}" data-volume="{{{volume|1}}}" data-loop="{{{loop|false}}}" data-loop-start="{{{loop-start|0}}}" data-loop-end="{{{loop-end|0}}}" data-pause-button="{{{pause-button|}}}"> |
||
{{#if:{{{no-progress|}}}||<div class="timeline"><div class="progress"></div></div>}} |
{{#if:{{{no-progress|}}}||<div class="timeline"><div class="progress"></div></div>}} |
||
<div class="controls" style="{{{controls-style|{{#if:{{{no-progress|}}}|padding-top:20px|}}}}}"> |
<div class="controls" style="{{{controls-style|{{#if:{{{no-progress|}}}|padding-top:20px|}}}}}"> |
||
Line 35: | Line 35: | ||
#Style tweaks. |
#Style tweaks. |
||
#Link to corresponding File page. |
#Link to corresponding File page. |
||
#Lazy updates to progress bar and time: do not update when audio is paused or not started. |
#Lazy updates to progress bar and time: do not update when audio is paused or not started. <- sort of done: only overhead is a check against the previous playtime |
||
#Lazy loading. Especially helpful for pages with hundreds of audio files. |
#Lazy loading. Especially helpful for pages with hundreds of audio files. <- not urgent: this reduces latency anyway |
||
#Draggable progress bar and volume control. |
#Draggable progress bar and volume control. |
||
#Mobile compatibility test. |
#Mobile compatibility test. |
Revision as of 03:53, 2 July 2024
Adapted from CodePen with MIT license.
Loading...
ClearMorning Short.ogg
Loading...
Theme 158 Intro.ogg
Loading...
Theme 59 Short.ogg
sound effect of rain
Loading...
AMB Helicopter.ogg
BGM pauses
- Allow custom styles (especially transform scale). Maybe allow custom class as well?
- Style tweaks.
- Link to corresponding File page.
- Lazy updates to progress bar and time: do not update when audio is paused or not started. <- sort of done: only overhead is a check against the previous playtime
- Lazy loading. Especially helpful for pages with hundreds of audio files. <- not urgent: this reduces latency anyway
- Draggable progress bar and volume control.
- Mobile compatibility test.