JW Player "doubling" audio in IE - javascript

I have JW player installed on our site, once on the homepage, and once on our video page. All video's work on the homepage in ALL browsers. However, on the video page, when a video is played in IE, the video starts out correctly, then about 5 - 10 seconds in, the audio portion of the file starts playing a second time, over the top of everything. The original video and audio still play as well, along with the 5-10 second delayed second audio.
The strangest part is I use the same code on both the homepage and video page, I don't understand why it's doing this on only one of the two player instances.
http://www.timetoplaymag.com is the homepage, and the videos are hosted at timetoplaymag . com / video (sorry, it will only let me post 1 link, first time poster).
This current code is using the overlay hosted on longtailvideo.com, as I switched it to see if my own hosted overlay might have been the problem. It's not, as I'm still having problems even with the longtail overlay.
<script type="text/javascript">
var so = new SWFObject('http://video.anbmedia.com/player/player.swf','mpl','382','216','9');
so.addParam('allowscriptaccess','always');
so.addParam('allowfullscreen','true');
so.addParam('flashvars','&author=Time to Play&file=http://video.anbmedia.com/<?php echo $video_video; ?>&image=http://images.anbmedia.com/<?php echo $video_image; ?>&autostart=true&skin=http://www.longtailvideo.com/jw/upload/overlay.swf&backcolor=000000&frontcolor=FFFFFF&lightcolor=00528e&controlbar=over');
so.write('player');
</script>

I have the same problem.
The problem occurs because the player is loaded three times (at least in my case)
However if you set the 'autostart' option to false the other players will not get activated.

Video wont start in either page for me: "Done, but with errors on page". IE 8.0 Windows Vista 64 bit.

Related

HTML video not playing on mobile after multiple visits from same phone

I've run into a strange problem with video playback on mobile - in general, the videos playback fine on phones, but if the same phone has visited the site more than a few times (say 4 or 5), the video will no longer play and instead display a still image. Here is the format of the HTML for the videos:
<video playsinline autoplay muted loop id="waterBackground" src="../assets/water1-forwards_compressed.mp4"></video>
There is one line of JS changing the video playback rate, but that's it:
$("#waterBackground")[0].playbackRate = 0.8;
All of the HTML videos use this exact format, and every phone I have tested this on (except iphone < 5) has no trouble playing the first the first few times. But things stop working after that. When I clear the browser history and close and reopen the app, the video is working again. Any ideas why this might be happening and how I can fix it?

YouTube embedded iFrame API not starting new videos when playVideo() is called and the page is loaded

I have a webpage that plays continuous random videos (pulled from an external list), and it works great on mobile or desktop. But, when you try to chromecast the videos, the first one will successfully play on chromecast, but if my embedded player changes videos, it seems like the playVideo() function does not update what video is playing on the chromecast.
In the process of writing the question I figured out I wasn't actually calling player.playVideo(), and was relying on the autoplay behavior of player.loadVideoById() in all other contexts. Adding a player.playVideo() call immediately after play.loadVideoById() fixed the issue!

video loads fine sometimes, and other times it takes forever to load, or doesn't load at all?

I have a 10 second video clip, and a full video that the video clip is from on my site. the 10second video is set to (autoplay, preload=auto, and muted), and the full video is set to (preload=none) and is set to only load when clicked. the videos are both .mp4.
I publish my site to IIS on my computer, and I go to localhost, and the site will load fine. The 10second video loads fine on my video carousel, but when I click it to go to the dedicated page about the video the 10second video will either load like it should, or either it will take a few extra seconds to load, or doesn't load at all??
The full video will load perfect every time even if the 10second video doesn't load I can still click the space where it should be (I have a div that's clicked that activates the full video not the click of the clip), and the full video will open, and start playing fine?
I cannot figure out what is causing this issue since the video will load fine on the main page even if 5 other vidoes are loading on the carousel at the same time, yet when its on its own page it just doesn't load almost every time..? I try clearing cache, and reloading the page, but still 90% of the time it just doesn't load?
so can someone tell me what could be causing a 10second video 2.2mb to not load when preload is on, but a video that's 90.2mb will load when activated instantly even though preload is off?? even if I reload the page, and click to load the full video right away it will load almost instantly?? I literally have the same code on the main page to get the video clip and play it which works every time!
10second clip: I have divs around these video clips that have an id so the div can be loaded on other pages which loads the videos.
<video preload="auto" src="#Url.Content("~/Content/Video/")#item.clip" autoplay loop="" muted style="width:100%;"></video>
full video:
<video id="videoClick1" controlsList="nodownload" src="#Url.Content("~/Content/Video/")#item.selectFile" preload="none" controls style="width:100%;"></video>
here is where the videos get loaded:
<div id="fullVideoClick">
<div id="video2">
</div>
<div id="video1">
</div>
</div>
<script>
$("#video1").load("/VideoCarousels/index #profileVideo1");
$("#video2").load("/VideoCarousels/index #carouselVideo1");
</script>
and on the main page:
<div id="video1">
</div>
<script>
$("#video1").load("/VideoCarousels/index #carouselVideo1");
</script>
the only thing I can think of is the preload for the video clip isn't activating sometimes for some reason since it works perfect about 5% of the time, and 5% of the time it takes longer than usual, but still loads, and the other 90% of the time it just never loads, yet on the main page it loads perfect 95% of the time, and the other 5% of the times it will load eventually, but takes longer then normal.
--edit--
I have set my 5 video carousel to play the same video clip on each slide, and it seems to load the video 3 out of 5 slides when I reload the page after I clear cache, but when I reload the page the second time it loads them all fine, but still on the dedicated pages it just doesn't load the clip. I also added in
$(document).ready(function(){ ... }); which at first loaded the clip, which made me hopeful that that would be the answer, but after refreshing the page again the clip didn't load anymore even after clearing cache it was random if it was going to load or not.
--edit2--
found the weirdest thing! I inspected elements, and deleted the full video from poping up because behind it is the video clip so I was able to see the video controls for the video clip, and whats weird is the video clip is actually loaded fine, but the weirdest thing is that clicking play does nothing?? I click play, and then I have to click a few seconds into the video, and then it starts playing??? anyone have ANY idea why this is happening??
You haven't wrapped your jQuery code in
$(document).ready(function(){ ... });
Always a good place to start with any load issue.

Safari Desktop HTML5 Audio Tag

do you have any information related to the audio tag on MacOS Safari. The issue I am having is when I use audio.play() the sound is delayed 100ms - a full second. It is as the sound is being reloaded from the server each time.
I am only using one file and I was hoping maybe there was a work around for this things I tried was to play the audio file and pause it before the end and them move the position and the play the audio again but I beleive the play() function in safari actually reloaded the file.
Thank you!

Videos loading but not playing with mediaelement.js in Chrome 27.x when including subtitle tracks

I'm using mediaelement.js to load videos with subtitle tracks.
All was working well until I updated my Chrome browser to 27.x. Now if a subtitle track is included, the video will load but not play. The video buffers fine (I can manually scrub through it), but neither the play button or javascript play() will play the video. The loading gif just sits there, and I don't see any errors in the console.
It works in all other browsers I've tested, including Chrome 26.x.
If I remove the subtitle source element, the videos load and play correctly in Chrome.
(This is my first SO question so any tips would be appreciated, thanks)
I'm on day four of trying to solve this same issue and came across this question. It's happening on Mac and Windows. Troubleshooting is aggravated by what appears to be local caching -- if I comment out the <track> the video plays; When I re-enable it and reload, it also plays, but then if I close out of the browser it will no longer work until I comment the <track> out again.
If I disable mediaelement and test with native HTML5 video, the problem does not manifest itself.

Categories

Resources