Help
cancel
Showing results for 
Search instead for 
Did you mean: 
Highlighted
Copilot Lvl 3
Message 1 of 5

Is it possible to open a sound file?

Solved! Go to Solution.

First, some context: I am a complete newb w.r.t. Git-anything, and not a programmer. I am trying to port some plain vanilla HTML pages (from a dead server), which contain stuff like this:

 

     You can hear this in the word <a href="001.mp3">elephant</a>

 

and when the reader clicks "elephant", it plays the mp3 file (or at least does what the browser is set to do with an mp3 file). I can't figure out if there is any translation into Markdown that does this. The following does not work as desired:

 

You can hear this in the word [elephant](https://github.com/Whoever/Whoever.github.io/blob/master/001.mp3/)

 

This sends the end user to a separate page where they can click a download button or view raw, which will then play the file. Is there a way to cut out some steps, such as directly open the player without the intermediate page; or even, play it in the background or a second tab, while still displaying the main page? (End users will have minimal experience with computers, so simplicity is essential).

 

Thanks, Dave Odden

 

4 Replies
Moderator
Message 2 of 5

Re: Is it possible to open a sound file?

Since the MP3 files are in your repository already, you don't have to link to them via the https://github.com link. You can link to them directly via your Pages site like this:

 

[elephant](/001.mp3)

 

That `/001.mp3` will be resolved as https://logoori.github.io/001.mp3, which when clicked will play the file in the web browser's media player. You can click the link in the previous sentence to see it work 😀

 

(The reason why the https://github.com link doesn't work the way you want is because we only enable linking of certain file types and force download of all others, such as MP3s, from https://github.com.)

Copilot Lvl 3
Message 3 of 5

Java / HTML5 audio play and htmlpreview

My current question relates to this earlier question. My goal is to create a page where users can click on and listen to word recordings (similar to Forvo.com). My earlier strategy was to use an html anchor (<a href="002.mp3">play</a>"), but probably most users (no-tech) will be using phones and this won't usually or ever work, since browsers will at best offer to download the file. I somewhat sorted out how to use HTML5 and Java to play sounds, and a simple example is at https://github.com/Logoori/Logoori.github.io/blob/master/4TestJS.htm. It works if I open it locally on my computer.

 

I tried to open the same thing via https://htmlpreview.github.io/?https://github.com/Logoori/Logoori.github.io/blob/master/4TestJS.htm, and it displays correctly, but it does not play.  The code inside that file is

 

click <audio id="ID004" source src="004.mp3"></audio><button onclick="playAudio('ID004')" type="button">play4</button> and then <audio id="ID003" source src="003.mp3"></audio><button onclick="playAudio('ID003')" type="button">play3</button>
<script>
function playAudio(audio_element) {
	var x = document.getElementById(audio_element);
	x.play();
}
</script>

I'm trying to figure out why it won't work. One possible answer is that I'm trying to do something forbidden, and I should stop trying. Man Sad Another thing that I thought of is that I just don't understand how this html preview thing works, and I'm thinking about this the wrong way. If anyone has any suggestions, that would be highly appreciated.

 

 

Moderator
Message 4 of 5

Re: Java / HTML5 audio play and htmlpreview

Since this is an extension of the original question, it should just be another post on the same topic so that people can get all the details. I've gone ahead and merged the topics for you 😀

Solution
Copilot Lvl 3
Message 5 of 5

Re: Java / HTML5 audio play and htmlpreview

Well, never mind. It turns out that if I just open https://Logoori.github.io/WHATEVERFILE.HTML, there's no need for an HTML preview prefix, and the page works as it's supposed to. https://github.com/Logoori/Logoori.github.io/blob/master/ seems to have the same stuff as https://Logoori.github.io, but it's treated differently (as a web page).