forked from andyburke/autonomous.contact
		
	
		
			
				
	
	
		
			48 lines
		
	
	
	
		
			1.7 KiB
		
	
	
	
		
			JavaScript
		
	
	
	
	
	
			
		
		
	
	
			48 lines
		
	
	
	
		
			1.7 KiB
		
	
	
	
		
			JavaScript
		
	
	
	
	
	
| function embed_audio(link_info) {
 | |
| 	if (typeof link_info.extension !== "string") {
 | |
| 		return;
 | |
| 	}
 | |
| 
 | |
| 	const mime_types = get_mime_types(link_info.extension);
 | |
| 	const is_audio = mime_types[0]?.indexOf("audio") === 0;
 | |
| 
 | |
| 	if (!is_audio) {
 | |
| 		return;
 | |
| 	}
 | |
| 
 | |
| 	return `
 | |
| 	<div class="audio-container" tabindex="-1">
 | |
| 		<audio controls>
 | |
| 			<source src="${link_info.url}" type="${mime_types[0].indexOf("audio/mpeg") === 0 ? "audio/mpeg" : mime_types[0]}">
 | |
| 			Your browser does not support the audio element.
 | |
| 		</audio>
 | |
| 		<div class="enhanced-audio-player-container">
 | |
| 			<div class="audio-player-display-container">
 | |
| 				<canvas class="audio-player-display"></canvas>
 | |
| 			</div>
 | |
| 			<div class="audio-controls-container">
 | |
| 				<div class="progress-container">
 | |
| 					<div class="time-container"><span class="current">00:00</span></div>
 | |
| 					<div class="slider-container">
 | |
| 						<input type="range" name="progress" title="" min="0" max="1000" step="1" value="0" />
 | |
| 						<label class="time-container" for="progress"><span class="current">00:00</span></label>
 | |
| 					</div>
 | |
| 					<div class="time-container"><span class="duration">00:00</span></div>
 | |
| 				</div>
 | |
| 				<div class="buttons-container">
 | |
| 					<div class="audio-control blank">
 | |
| 						<a href="${link_info.url}" download>
 | |
| 							<div class="icon download"></div>
 | |
| 						</a>
 | |
| 					</div>
 | |
| 					<div class="audio-control skip-back"><div class="icon skip-back"></div></div>
 | |
| 					<div class="audio-control play-pause-toggle"><div class="icon play"></div><div class="icon pause"></div></div>
 | |
| 					<div class="audio-control skip-forward"><div class="icon skip-forward"></div></div>
 | |
| 					<div class="audio-control volume">
 | |
| 						<input type="range" name="volume" title="Volume" min="0" max="100" step="1" value="" />
 | |
| 					</div>
 | |
| 				</div>
 | |
| 			</div>
 | |
| 		</div>
 | |
| 	</div>`;
 | |
| }
 |