Video Paused but its sound still trailing - javascript

I'm building a winstore app and building a skip-able intro (dynamically added it through JavaScript code).
However, if i skip it and set
this.video.pause();
in the button click function, even though the video is paused, the sound of the video is still trailing for a few sec before it stopped.
How could i make the sound stop right there with the images?
It's just weird that the video is already paused but the sound still can be heard when it should've been paused too (the video contain mp4 and mp3 in it).

It's weird because if a video is really paused it off the image and sound.
You can try this following command (it cut the sound) :
this.video.setAttribute("muted", "muted");
But it's not the solution because pause() method should work, so checks if you don't have 2 videos elements in your page.

Related

Using Nightwatchjs To Detect Video Play

I'm testing an app that includes a video player. I'd like Nightwatch to identify that the video is playing after it hits the play button and pauses when it hits the pause button. I'm not talking about detecting a play or pause event that the player sends but detecting if the video is actually playing. Any ideas how to detect if the video is indeed playing or paused?
Here can be the answare you are looking for: https://www.w3.org/2010/05/video/mediaevents.html
with video.paused event you can see if the video is paused or not..

Loud feedback after HTMLAudioElement is played with JavaScript

I needed a "ding" sound effect for a pomodoro app that I am building, and I found this sound which met my requirements. I play the sound in my application like this:
var audio = new Audio('ding.wav');
audio.play();
My problem is that, while the sound does play, after the sound finishes playing I hear loud, high pitched digital feedback for about a second.
I have not had this issue before when working with mp3s, so to ensure that it was not related to the file type, I tried using a different .wav file from the same website. This file, when played in the same way is not followed by the feedback. Also, the timing suggests that ding.wav has finished playing completely before the feedback starts.
The file that is followed by the feedback does not have any feedback when played through the media player on my computer.
What would cause this kind of audio feedback, and how can I fix it? I have searched on here and looked through the documentation for HTMLAudioElement, but haven't found anything useful so far. I tried lowering the .volume of the element to see if it was related to that, but it didn't make a difference.
If it would be helpful to actually hear what I am hearing, I can make a video and link to it, but I am not sure how else to give an example in e.g., a fiddle, because the audio file is stored locally on my computer.
Update:
I am not sure if this makes the problem clearer, but the issue does appear to be tied to the playing of the sound rather than the audio file itself. Currently, for testing purposes, the playing of the sound is tied to the pressing of a button. If I quickly press the button 5 times in a row the full sound effect will only play fully once (i.e., if I press the button before the sound is finished, the sound is cut off and starts again), but after the sound fades out from the last button press, I will hear one loud feedback beep for each time I pressed the button (i.e., five beeps for five button presses etc.).

JS alert is messing up HTML5 video

I have an mp4 video on my site that I play with $("#movie").get(0).play(). That works fine.
However, if I do alert("anything"); and then try playing the movie, the movie only advances a few frames (I get sound too). Then it freezes. The video controls still show "pause" being an option, so the player still thinks it's playing. I have to refresh the screen, and avoid alert()ing anything in order to play the whole video. How can I get around this problem?
I'm on the newest version of Chrome on a Macbook Pro with the newest Yosemite.

Android not playing html5 audio from an interval

I'm trying to play audio using a HTML5 Audio tag on my phone.
I've loaded the sound but when I run the .play() command, nothing happens.
I made the default controls visible so that I test by pressing that play button and that one works and the sound plays.
I've also tried playing the sound by executing the javascript from the address bar and that works aswell.
The code I'm using to play looks something like this:
setInterval(function(){
if(blahblah){
document.getElementById("player").play();
}
},500);
To make sure that it even tries to play the sound, I put an alert after it, like this:
setInterval(function(){
if(blahblah){
document.getElementById("player").play();
alert("Played!");
}
},500);
I saw the alert, but no sound was played.
Thanks for any help :)
Most mobile devices will only allow you to play audio when it is the result of a user interaction. If you put your play code into a button click event, it should work (assuming you have no other bugs in the code), but the device is preventing your audio from playing from inside setInterval because it doesn't think it has the user's permission to play it.
What I do now, and I admit this is a workaround, is I play and immediately stop the audio inside my button click event, and then call setInterval. It works--for now--because the device thinks it has been granted permission to play that audio by the user, even if I trigger it later. The code inside my button click event looks like this:
document.getElementById("player").play();
document.getElementById("player").pause();
setInterval(function(){
document.getElementById("player").play();
}, 500);
Keep in mind that on mobile, it may not play nearly as smoothly as it does on your computer. Seek alternative approaches where possible.

Synchronising SoundCloud audio and Vimeo/Youtube video playing together

Alright, I'm working on one project which involves html5 audio, in addition to that a video is shown while audio is playing (Just video, no controls etc). Video is a visualisation (sometimes called equaliser) of audio that is playing, made beforehand in adobe after effects. both files (video and audio) are same length e.g. 3 min 20 sec. I need a way to synchronise both, as video might load slower than audio or vice versa. Therefore I need to make it so that on computers with slow internet connection if video stops loading at some point and starts buffering I need to pause audio, and once video resumes start audio again, both at exactly same time, also when user skips to a certain bit in a song, video should skip to that bit as well, I'll use custom api made player for video so there would be no controls on video, only on soundcloud player.
It is almost as if I was using soundcloud custom player to control video. I'm struggling to find any resources on this anywhere, and would really like to know how to achieve this functionality.
javascript or jQuery solutions are preferable.
What makes it even more complicated is that I use SoundCloud's custom player to play songs:
http://developers.soundcloud.com/docs/custom-player#
And upload videos to Vimeo/YouTube (all done to decrease load on a website)
Check here: http://html5demos.com/two-videos
The sample is for syncing 2 videos, but with some hacking probably you can manage to sync audio and video.
Second, don't use Custom player, make your own HTML5 Audio element, check the SoundCloud API there is a property stream_url for every streamable track on soundcloud, just put that URL as source on your html5 audio tag.
Keep on mind that this will not work on Firefox and Opera for some time. Firefox will integrate native mp3 support in v20, not sure about opera

Categories

Resources