How to create an audio player using javascript? - javascript

I have been given assignment for creating an audio player using js without using any plugin. I am totally blank regarding this can anyone help please. I would prefer to create in firefox...I am not allowed to use HTML5

JavaScript cannot play audio. You need HTML5 or, usually, Flash.

You will have to use HTML5 audio. Here are some links:
http://html5doctor.com/native-audio-in-the-browser/
http://www.position-absolute.com/articles/introduction-to-the-html5-audio-tag-javascript-manipulation/

Related

How to play a background video using angular js

I have tried in several ways, but I couldn't find a better one. I really want to play a background video using pure Angularjs
Hi why dont you use this
http://www.videogular.com/
Its a well documented Lib

Is it possible to create javascript audio player with multiple tracks playing in same time?

I want to create custom player with 10 sounds for example. All 10 tracks are components of one music composition, created by different instruments.
For each track I want to have on/off switcher. After clicking each switcher sounds will play.
After turning on of all buttons all tracks have to be played in the same time.
Each track have to be repeated again and again after finishing. Is it possible to make this without flash?
This is example of this task, created in ActionScripts: http://www.incredibox.com/en/play#
Thanks!
It is possible with HTML5 Audio API.
See this getting started tutorial: http://www.html5rocks.com/en/tutorials/webaudio/intro/
Here is an excellent library to start with: http://www.createjs.com
and some examples: http://www.createjs.com/#!/SoundJS/demos
as well as the official spec: https://dvcs.w3.org/hg/audio/raw-file/tip/webaudio/specification.html
Using the HTML5 javascript audio API, you can instantiate as many audio objects as you like:
var soundOne = new Audio('sound1.ogg'),
soundTwo = new Audio('sound2.ogg'),
soundThree = new Audio('sound3.ogg');
// etc.
You can then play and stop them programatically. E.g. soundOne.play();
Check out https://developer.mozilla.org/en-US/docs/Web/HTML/Element/audio
For looping, there is a loop directive, but it's not widely supported. Check out this SO article for a work around: HTML5 Audio Looping

Visualising Audio From SoundCloud's Custom player?

I would like to know if it is possible to visualise audio from soundcloud's custom player:
http://developers.soundcloud.com/docs/custom-player#
At the moment I could only think about using videos, but I would like to know if it is possible to do with javascript or jQuery, maybe there are some cool libraries out there?
EDIT:
So far this is the only exact thing I found that does exactly what I want, but I am having trouble in understanding how it works, I was trying to play around with source code but had no luck ;/ and I don't wan't to copy it exactly. Maybe you could explain principle behind it and suggest how to change it's appearance?
check here: http://learningthreejs.com/blog/2012/05/08/sound-visualisation-vuemeter-in-webgl/
or you can search other Web Audio Api examples for Chrome and Safari and Data Audio API for Firefox

Lightest hidden mp3 sound player?

I'd like to know if there is any cross browser light-weight invisible sound players that are controlled by JavaScript, but not using any frameworks like jQuery.
I'm not looking to use HTML5 at all. So maybe a solution that uses Flash.
Something that is not more than load() and play().
I believe SoundManager 2 may fit your needs:
http://www.schillmania.com/projects/soundmanager2/
If you don't care about old browser, i'd suggest looking at what you can do with the audio tag of HTML5.
For example to play see: http://dev.w3.org/html5/spec/Overview.html#playing-the-media-resource
The 1Pixelout Player for Wordpress could by used (just use the SWF) and then hidden with CSS
http://wpaudioplayer.com/
-edit
DewPlayer has also JavaScript Controls (scroll down to the bottom)
http://www.alsacreations.fr/dewplayer-en
SoundJS
http://www.createjs.com/#!/SoundJS
A Javascript library that provides a simple API, and powerful features to make working with audio a breeze.
Nice looking examples
Easy to use
Large following of users
Continuous development
Published on GitHub
and you can use it via a CDN:
http://cdnjs.cloudflare.com/ajax/libs/SoundJS/0.4.1/soundjs.min.js

JavaScript Music Player with progress bar?

I am creating a little JavaScript music player that sits on the btottom of the page, a lot like streampad. But streampad uses a flash progress bar for the song and JavaScript for everything else and I am having a hard time finding anyone who does this with JavaScript alone. Can anyone point me in the right direction on how this can be done (preferably without using HTML5)?
There's no way to do this with just Javascript, without going into html5 (the audio tag).
SoundManager 2 has a hidden flash component, and the UI is completely in JS. It's up to you to implement a seekbar or whatever you want, but there's a whole lot of example code. SM2 seems pretty popular, and is used by a number of big sites (Soundcloud, Last.fm, Muxtape).
i think you may found usefull look at theese:
Monitoring Loading Progress of SWFs
http://code.google.com/p/swfsound/
SWFSound is based on SWFObject and
allows cross-plattform, cross-browser
sound support for HTML/JavaScript
using Flash Player 8 and higher.
http://code.google.com/p/swfobject/
SWFObject is an easy-to-use and
standards-friendly method to embed
Flash content, which utilizes one
small JavaScript file
just some example
http://www.happyworm.com/jquery/jplayer/
http://www.bauer.uh.edu/parks/video3.htm
You can't do that without HTML 5 or Flash.
You could however create an hidden flash player and control it via javascript using External Interfaces.
Maybe you can use a library that implements a progress bar using html5 and javascript, see RGraph: http://www.rgraph.net/examples/progress.html

Categories