Does the normal YouTube player (by normal I mean the one you get when you use the embed code iframe) fire an event when playback is completed that I can catch outside the iframe?
As normal cross-domain javascript communication is restricted for security reasons this is not 'normally' possible.
In modern, HTML5 compliant, browsers a new method was introduced: postMessage. To be able to do exactly that: safe cross-domain communication in Javascript.
The iframe YouTube player 'posts' out an onStateChanged event with different stati. To enable this interaction however, you need to use Javascript to embed the iframe player.
Check out the following link to see how it's done.
(Experimental feature by the way...)
http://code.google.com/intl/nl/apis/youtube/iframe_api_reference.html
Related
We are developing a free, open source Google Reader alternative at http://reader.pykih.com and the code is at http://github.com/pykih/reader
When a user signs up or adds a RSS feed, we add the feed url to the database and then ask a DelayedJob to fetch articles from that RSS url. This typically takes few seconds to minute or two, depending on the DelayedJob queue. Many users have complained that RSS feed is not being fetched at all when in reality it is being fetched. All that the user has to do is refresh his own page. We wrote a message there, yet users are complaining.
Can anyone point us in direction towards - what is the best way to design a Facebook or Google style "Loading" (icon in yellow) functionality and once loaded it automatically adds the entries to the screen without page refresh.
Thank you in advance
If I understand correctly, you basically want to update the user's view of the page while it's still open, in real time. (At any rate, that's what Facebook and most Google products do nowadays). This technique is usually called server push - information is pushed from the server to the client, instead of having the client request (pull) information from the server.
There are multiple ways to implement server push.
You could use AJAX to 'reload' the page every ten seconds or so. This is very easy to implement, but not realtime at all, and could cause unneeded load on your server. It works with all browsers.
You could use EventSource, a relatively new format supported by Firefox, Chrome, Safari, Opera and others (but not IE). It's a very simple format and easy to implement. EventSource is one-way communication only: it sends events from the server to the client, not in reverse.
You could use WebSockets, probably using a library like EventMachine and a WebSocket library. WebSockets allow fast bidirectional communication, but it's more complex than EventSource and only the newest IE versions support it.
You could use a commercial service like Pusher. Pusher is easy to integrate and fast, but not free. Browser compatibility is great, though.
The options differ primarily in the amount of client support (do you need IE support?) and the amount of Ruby integration you get.
What is the difference between all three? They seem to do the exact same thing. Why and when would you choose to use one method over the other?
AJAX and websockets do similar tasks — they both establish a communication channel to a server. Web workers have nothing to do with either of them, they are just separate threads of JS execution.
AJAX is more mature than websockets — it has been around much longer and has a much wider browser support. AJAX is request-oriented — you make a request to the server, the server responds, and the connection is closed. Websockets on the other hand establish a persistent connection to the server, over which you exchange multiple messages in both directions.
Webworkers are useful if you want to perform a processor intensive task without blocking the browser interface.
They are not same. But one can use them together to build advanced application.
Ajax: As abbrevation States is asynchronous javascript and xml.. is used to load the content dynamically from the server upon called.
Websockets : Websockets is the feature defined in HTML5 . As wikipedia states "WebSocket is a protocol providing full-duplex communications channels over a single TCP connection." so this is mainly used for real time communication such as video call, live chat etc..
WebWorkers : this feature is also defined in HTML5. This is basically used to make bring multi threading feature in Javascript. Since javascript is a single threaded programming language , it breaks or pause whenever i.e heavy calculation tasks are done using it. to overcome this breakage , Webworkers are added to javascript.
You can perform Ajax and Websockets inside Webworkers . however you cannot manipulate DOM using webworkers due to security reasons.
They are not the same.
Ajax: It is a way of interacting with a web server asynchronously from a UI renderer
Web Sockets: An HTML5 feature using which you can interact with any Socket server extending the reach of the browser
Web Workers : Another HTML5 feature that helps you do multi-threaded programming from a web browser using Java Script
Ajax & Websockers are siblings.
Webworkers are completely different.
AJAX
The best example of AJAX is Google's search bar - suggestions appear as you type, but the current webpage is not redirected or refreshed! (10 years ago this was amazing, not so much anymore). This is AJAX in action.
AJAX uses what's called a "request" and "response" model: you ask a question, and you receive an answer from the 'server'.
AJAX allows webpages to talk to "servers" behind the scenes, allowing you to update a webpage without navigating away from your URL. Back in the old days of the web, if you wanted to show different content on a webpage, users would have to navigate to a different URL: not any more. This concept has been taken to the next level with single page apps and applications (like React, Vue, Elm etc.).
Websockets:
With websockets, your web-page talks to your server (as with Ajax), and your server responds - except you do so like you're talking on the phone. There is a "connection" between your users and your server. This "connection" is not there with AJAX: in that case, you have a simple request and a response coming back from the server.
In other words, if you wanted to stream stock market data, constantly updating it to your users: it would probably be better to use websockets, than AJAX.
Web-workers:
Use When you need intensive calculations - if you were to ask a web-page to calculate Pi to 100000 decimal places: that might take a while. The web-page might freeze, and you might lose $$. The intensive calculations can be done in the background, without freezing your webpage. People using your site can do other things - e.g. click around, while waiting for the result in the meantime.
I have a mobile website and I want to track clicks via javascript/ajax.
I thought I could use jquery to send the the tracking information and when I get a successful return I can redirect the user appropriately. I could do this no problem but I don't want to use jquery as it's a small webpage, loading in a JS library seems over the top.
What's the best way to post a http request? It needs to work on all modern smart phone web browsers.
Cheers
jquery-1.7.2.min.js is only 93kb and has all XHR functionality pre rolled and should work in all browsers.
Otherwise you would need to hand bake your own XHR's and take browsers into consideration
for example FF, Chrome and Safari can fire up new XMLHttpRequest objects, but IE will need a new ActiveXObject("Microsoft.XMLHTTP")
how to send this messages to many people who looking my site on google app engine
1.using html5 ?
2.using ajax ?
thanks
Some technologies you can use for this include COMET (Ajax Push), Hidden IFrame (basically make the page never terminate and just send more data as it becomes available so the socket is never closed), html5 and websockets, or plain old fashioned XmlHttpRequest (some sort of polling mechanism as described by mirthlab).
You could set up an ajax poller to poll the server for the message and then display it.
Your question is a little unclear though. What will the message be used for. Does it have to show up without the user refreshing the page? Etc.
If I want to create online phone for small office with web client (through Astrisk/Adhearsion) how can I stream IN/OUT audio right in my browser (like GTalk do). Preferably without Java applets and without Flash.
I need to get voice stream from Astriks call, stream it in browser, receive audio from mic and send it back to Astrisk.
And what shoud I choose for streaming audio IN/OUT as backend? XMPP?
You can't. There isn't a standard way (currently) to do what you are looking to do. You need something to help you out. This is often done in the form of a Flash application.
Google actually uses a browser plugin from Vidyo to make this happen effectively.