Soundcloud widget is a great thing but volume control is completely broken. JS api calls to setVolume just ignored by player, tested in latest Chrome and Firefox.
Broken volume control can be easily seen at official playground page - https://w.soundcloud.com/player/api_playground.html
Some time ago there was workaround - SoundCloud Widget API setVolume Method broken? - but now even this hack does not work. Please fix widget API. without volume control it is almost unusable ( Btw, workaround is not ok anyway, since first second of loaded sound still playing at full volume, hiting site visitor with "overloaded" sound
UPDATE: Just found the reason.
Seems like setVolume/getVolume range is now 0..1, not 0..100 as it was earlier
Documentation and playground just didn`t updated yet
Related
I'm just trying to do some simple calls on youtube videos such as using their seekTo() method and getTimeStamp() sort of thing. I'm struggling to follow the documentation and was wondering if anyone knew of any example code I could look at?
e.g. Working with embedded videos -
Currently using -
Is it as simple as adding enablejsapi=1 like so?
link = http://www.youtube.com/v/VIDEO_ID?version=3&enablejsapi=1
How exactly do you call methods such as seekTo() etc. then? Sorry if this is unclear.
As JCD indicated as well, the YouTube Player API is a great starting point for what you might need to do.
It goes into detail on where to start, how to load videos, JS functions used, etc.
seekTo(...) requires 2 parameters, seconds and allowSeekAhead. Its recommended to set allowSeekAhead to false when the user is dragging the progress bar and true when user releases it.
I have a small, very basic 3d game that runs in all browsers. But my issue is that when it runs in Chrome I can see in my console messages that the sounds are "pending" and don't play when they should. The thing is that after some time have passed ALL sounds play at the same time. It doesn't seem to be happening anywhere else, its just in Chrome. I came across this article that someone posted but it did not solve my issue. Just in case I am running Version 43.0.2357.81 m of Chrome and I am using the Sound Manager 2 library (I needed it in order to have sound work with IE 9 and up).
Can anyone offer some suggestions or point me to any more articles that might point me to a solution? Many thanks in advance!
Turn on logging in Chrome (inspect element/console - Preserve log) and see what your code is doing.
Also, you could try enabling/disabling your audio flags just be sure to set them back to default when you are done.
chrome://flags/#disable-encrypted-media
chrome://flags/#disable-prefixed-encrypted-media/
chrome://flags/#try-supported-channel-layouts
chrome://flags/#enable-delay-agnostic-aec
chrome://flags/#disable-delay-agnostic-aec
chrome://flags/#enable-tab-audio-muting
in chrome and see if that makes a difference.
Just shooting from the hip on the information given though, I would imagine that chrome is delaying your audio javascript execution to the end of the page load. Moving the script to the beginning of the page, or using an async could fix this. Here is a good resource for javascript page load issues: http://www.html5rocks.com/en/tutorials/speed/script-loading/
So I have scoured the web on information on how to embed the Youtube players but actual detailed tutorials seem extremely sparse or completely non existent. In addition, although there is documentation found on the google site
it seems to be somewhat confusing for a novice on how to implement either which leads me to my question. It seems that there are two players, the IFrame player and the Chromeless player which uses an swf embed. I have gone ahead and provided examples of both:
IFrame Player(using angular): http://plnkr.co/edit/H5VnlPhOaa2n6ZsfSj5p?p=preview
Chromeless Player: http://plnkr.co/edit/Epz9uXDZ1uIiV4lgB0vw?p=preview
My question is, what is the difference? What is the advantage of using one over the other? Does one have more backwards compatibility with browsers? Mobile Support? The Chromeless player seems to require less code to run as most of the code runs out of the box from the included "swfobject.js".In addition it seems that the chromeless player does not work on iOS devices due to the flash requirement. Is this correct?
Addendum: You can see the iframe and chromeless player are mostly the same besides the fact that you can click on the iframe youtube player to pause it while the chromeless player can only be controlled from the play/pause controls.
One big benefit to using iFrames with Youtube is that it is basically a new window with a call back to youtube... and guess what? Youtube will interpret what browser and platform the request is coming from and populate the appropriate content BUT iFrame can be slow loading on older browsers and on mobile devices where object/embed would not. Parameter settings (to tune the user experience on your site) is roughly the same. We all know SWF files won't work on iOS so you might need to factor that into your development for your userbase.
So I'm using videojs to render some mp4s coming in from instagram dynamically. I'm using this function to call the player, and it works great until it comes to firefox:
// o is the jquery object for the video
var vid_obj = o.find('video')
var vid_id = vid_obj[0].id
settings = vid_obj.attr('data-settings')
if (settings) settings = $.parseJSON(settings)
if (vid_id) {
settings.height = vid_obj.height()
videojs.options.flash.swf = "/scripts/vendor/video.js/video-js.swf"
videojs(vid_id, settings)
}
When I run the script in Chrome or any other browser with native mp4 support it loads fine, even if i specify flash as the default for tech order. In firefox, the audio plays but the video is blank.
In addition, I'm getting these errors from firefox:
Specified "type" attribute of "video/mp4" is not supported. Load of media resource http://distilleryimage6.s3.amazonaws.com/6ccd80e8561211e38d000a4507324e8b_101.mp4 failed.
All candidate resources failed to load. Media load paused.
Specified "type" attribute of "video/mp4" is not supported. Load of media resource http://distilleryimage6.s3.amazonaws.com/6ccd80e8561211e38d000a4507324e8b_101.mp4 failed.
All candidate resources failed to load. Media load paused.
I dug around a bit on stackoverflow and found this thread: Issue with the flash fallback of VideoJs with Firefox
Also, this interesting point
I did run into an issue on Firefox where the Flash fallback would play the video but the video would be blank (audio would play) when I included a "ready" event. I was able to get around this by firing a blur event on the $(this) object. That may be helpful to you if you need to use ready.
I tried adding the .ready() callback with the $(this).blur() with no success. Any suggestions?
You can also post your own answer and accept it if you prefer (since you are indeed the one that found the solution), but here's the answer from GitHub in case someone else stumbles on this question.
Solution below is from Video.js GitHub issue #854. Question and solution was provided by uxtx.
#mmcc, thanks for your help. I whipped up this dynamic video mockup (http://jsfiddle.net/nbAN5/5/), and it was working perfectly for me. Did some more digging and there was an issue in my implementation where videos getting animating was causing the flash object position to be mistranslated. Adding a css rule to reset the translation resolved it, IE:
object.vjs-tech {
-moz-transform: translate(0,0)
}
Note: if you're using videojs youtube plugin which i believe uses iframe, you'll need to use that same fix to resolve that translation issue as well.
If it is the same problem that led me here, then it's an issue with the Webkit implementation that Qt 4 uses on OSX. The solution is to upgrade to Qt 5 which uses a newer version that doesn't throw TypeError's when trying to play MP4 videos.
This details the specifics of my problem and the solution:
http://magnemg.tumblr.com/post/113251336220/how-to-solve-a-capybara-webkit-and-video-js
I'm currently working on embedding a youtube video using the iframe API, what is annoying me is that the events are not firing only on Firefox (I have just tried firefox 14), they work on every other browser (obviously not using browsers from hell like IE7).
The samples from their documentation don't work either, if you grab the piece of code they have under the getting started section of this page and here is the jsfiddle version for your quick view.
The player is displayed on the page, but as I mentioned the events are not working, neither I can use any function from the api, they all throw undefined error.
I appreciate any help.
Ok I found the problem,
It's because of the Firefox Extension HTTPS-Everywhere, which is switching the requests to use https, and since my page is requested using http, that was causing a conflict with the youtube iframe requests.
I believe I should put a warning on my site about using that plugin. Thanks for your help everyone.
I had once a problem with plying events to the iframe and it also apeared only in Firefox.
The answer was to specify the id and name of the iframe to the same value.
Try it - it might work for you as well.