Reference URL with JavaScript to play sound?

Question

Im using soundcloud dot com to upload my sounds. i want to press a button within my mobile application and have that sound play.

So basically i want my sound to be referenced from the URL that I am given when the button is pressed by the user.

I need to do it with Javascript only. No HTML 5 please. Any help is greatly appreciated cause this is Xtremely frustrating. Any ideas? Thanks in advance.

Extremity

There is no way without HTML5 and Flash, I'm afraid. Pure JavaScript is not able to do that. – Dusty

There is no way without HTML5 or Flash. – Circumfuse

Answer 1

It's pretty simple to get started really:

function playSound(url) {
    var a = new Audio(url);
    a.play();
}

Use that as whatever event handler you want for your application. Of course, I'd hope you'd want to do more than just play (for example, maybe pause would be good too?), but it's a start.

Circumfuse

JColling askes for a solution without HTML5. This is JavaScript, but makes use of HTML5 and is only available where HTML5 is available (all modern browsers). If you need to support older browsers, there are Flash polyfills which can be used similarily to the HTML5 element, like mediaelementjs.com – Dusty

@rami -- yeah, but he also said for his mobile site, which kinda pushes Flash off the table. I assumed there must have been a misunderstanding about what HTML5 is -- I read it more as that he didn't want any player UI on the page. – Circumfuse

mobile app not site and your right Nickf, I do NOT want a player in my app. I want the button I created to make the sound I choose......Like I said I uploaded a sound with soundcloud. Im not sure if maybe i need a different way of doing things, but I want my button to make the sound go off...Its not that hard to understand i dont know how else to explain it....push button hear sound...simple really.....I appreciate the help guys. It means a ton to me. ;) – Extremity

@Extremity Then the code by nickf should work. At least in modern browsers. It is HTML5 but does not show a player at all, so everyone's happy. My further suggestion was to use some invisible(!) Flash library for the browsers not supporting this code. – Dusty

@Circumfuse Yep, seems to be a misunterstanding :) – Dusty

What do you bean by URL? Can i set a youtube link? If not what sites can i use to upload my custom audios? – Fresco

sometime working some time error of promise in google chrome browser – Kyungkyushu

Answer 2

let sound = new Audio("http://sound.com/mySound.mp3");

//on play event:
sound.onplay = () => {

};

//on pause event:
sound.onpause = () => {

};

//on end event:
sound.onended = () => {

};

//play:
sound.play();

//pause:
sound.pause();

//stop:
sound.pause();
sound.currentTime = 0;

Pyrex

Answer 3

Use jPlayer to play sound using Javascript. This will take you a lot of time and frustration.

jplayer.org/

Here's what your code might look like with jPlayer. Note: You're not forced to use a skin with jPlayer because all it is is just an API to play audio.

Example code to play a video or audio on load.

$(function() { // executed when $(document).ready()
  $("#jpId").jPlayer( {
    ready: function () {
      $(this).jPlayer("setMedia", {
        m4v: "http://www.myDomain.com/myVideo.m4v" // Defines the m4v url
      }).jPlayer("play"); // Attempts to Auto-Play the media
    },
    supplied: "m4v",
    swfPath: "jPlayer/js"
  });
});

http://jplayer.org/latest/developer-guide/

Quigley

I appreciate the attempt, but I dont want a "player".....I want to push a button in my application and have a sound play through the users speakers. I dont want a player with buttons to show on screen and I dont want a new web page to show up I just want the sound to start playing at the click of a pre made button...... Any help is greatly appreciated. Thank you in advance! ;-) – Extremity

You're misunderstanding what jPlayer is. It's really just a jQuery plugin and swf file that allows you to play audio through a web browser. You don't need a skin to play audio with it. $( element ).jPlayer( 'play' ) is all you need to play audio on any element in the DOM. Also it has a TON of features that you love. Try it out. jplayer.org/latest/developer-guide – Quigley

your right im confused now lol.....I just want the user to push a button and a sound to play.....Is this the easiest way? The simpler, the better.... – Extremity

Well. Yes. You either need HTML5, Flash, Silverlight or a plugin of some kind to play audio. Or... you could use the embed tag. Here's a tutorial oreillynet.com/pub/a/oreilly/digitalmedia/2005/02/23/… – Quigley

Thanks Larry, but Im not looking for an option that causes a pop up window to display, i just want the sound to play when the button is clicked. No windows, no players, no popups....Just the sound to play once each time the button is clicked.... Thanks in advance to anyone that can help...... – Extremity

I appreciate the attempt to help, by the way. ;-) – Extremity