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")
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.
I am facing a scenario where live Twilio call gets dropped, if the browser window in which call is received is reloaded. Is there a way to overcome this set-back without affecting the live calls?
Twilio Evangelist here.
Based on your question, I assume you are using the Twilio Client JavaScript SDK? If that is indeed the case, then unfortunately, if the page thats hosting the SDK gets reloaded the connection between the browser and Twilio will drop since the browser is reloading everything, including the JavaScript SDK.
There are a couple of different techniques I can think of off the top of my head that you can use to help avoid page reloads, and another idea that could help you recover a call where the connection to the browser has dropped because of a page reload. A lot of this is going to depend on your specific app and the experience you are trying to create for your users.
So to help avoid having to reload the page:
1) Use AJAX requests to your server in order to avoid page reloads. If your page includes content like a form, or you want to update the page content with data form the server, you can look using AJAX requests to the server instead of a normal full page postback to submit the form, or to retrieve the data form the server. This would help in avoiding having to reload the entire page in those two scenarios.
2) Use an iFrame to host your page content, and then put the Twilio SDK in the parent page (the one that defined the iFrame). This would let you reload the content hosted in the iframe, without having to reload the entire host page, avoiding a reload the the Twilio library. The downside to this is that communicating between content in an iframe and its host can get really messy fast.
Neither of these two techniques is fool-proof. Obviously a user can always just hit the refresh button on their browser, and thats going to cause the connection to drop.
In a case where the page does get reloaded, and the connection from Twilio to the browser gets dropped, one idea is to leverage Twilios capability to help reconnect the caller together. When a user calls your twilio phone number, instead of connecting them directly to the Twilio Client running in the browser (by dialing a client with <Client>), instead dial that caller into a conference <Conference>, and then have the browser client connect into that same conference. The benefit to that is if the browser disconnects, the original caller won't get hung up on, they will still be sitting in the conference room. As long as you've saved the Conference SID or name, you can have the browser client reconnect to that conference.
Hope that helps point you in the right direction.
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
When I use facebook, If someone posts a new status or a comment or whatever new content, I receive the updates on my facebook homepage without having to refresh it. How does that work ??
Likely they use a javascript timer which periodically performs an Ajax request and updates the page in the browser when something was posted.
wikipedia entry on Ajax
i'm not sure what they use, but i think they probally using node.js (http://nodejs.org/) which is like ajax, but not ajax. it listens to webSockets which is very cool.
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.