7 Replies - 568 Views - Last Post: 09 April 2012 - 06:09 AM Rate Topic: -----

#1 cupidvogel  Icon User is offline

  • D.I.C Addict

Reputation: 31
  • View blog
  • Posts: 593
  • Joined: 25-November 10

Facebook style auto updation

Posted 09 April 2012 - 05:12 AM

Hi, surely all of us have seen the fact that in Facebook, after you comment on a post and remain in that page, and somebody else comments on that post, that post gets automatically and instantly updated on the current page, i.e unlike Orkut, which requires a page-refresh to reflect the new changes, here the thing is done in the background, perhaps with Ajax. Can anybody suggest a decent algo how to do such a thing? Let's consider the posts posted in Dreamincode, suppose after I have asked this question, somebody answers, and remains on the page, admiring his answer. Now suddenly he spots a typo in his answer, and thus clicks the edit button to do the correction, and then press the submit button to submit the rectified answer. He can view the corrected answer immediately, for the correction occurs (perhaps) through Javascript on the client-side, while on the background, the revised answer is sent to the server through PHP. However, for any other user viewing this page at the same time, he won't see the change until he refreshes, right? So is there a way to do this, that both the current user and other users as well be updated with the revised answer automatically without page refresh?

Is This A Good Question/Topic? 0
  • +

Replies To: Facebook style auto updation

#2 Macjohn  Icon User is offline

  • D.I.C Regular
  • member icon

Reputation: 80
  • View blog
  • Posts: 407
  • Joined: 10-April 09

Re: Facebook style auto updation

Posted 09 April 2012 - 05:31 AM

Facebbok is using a lot of technologies...like Ajax, JQuery, Javascript and some other stuff that they created themselves.

I see a "easy" way to solve your problem.

With setting a timeout, so every x seconds you go query the db and receive a response and triet it with AJAX.
Was This Post Helpful? 1
  • +
  • -

#3 cupidvogel  Icon User is offline

  • D.I.C Addict

Reputation: 31
  • View blog
  • Posts: 593
  • Joined: 25-November 10

Re: Facebook style auto updation

Posted 09 April 2012 - 05:40 AM

Yeah, that indeed seems to be the easiest way out. But a number of problems: firstly, no answer might be posted for an hour or two, while the code will go on checking the db, wasting precious bandwidth of the user. Secondly, this will enable updation after every prescribed interval, not automatic updation, which Facebook does, which I want. And thirdly, here we are talking answers, if in response to a question such as the one on this page, all the answers are stored in a database, even the largest databases will run out of memory pretty soon. The answers have to be saved in a normal HTML page as usual (that is the page which is served on the browser), and when a response comes from a client side through a PHP script (the script might send the serial number of the comment on that page, like it is 2 for this answer on this page, alongwith the revised answer), another script will open the HTML page and edit that particular answer only. This is do-able of course, problem is, how do I send a signal to all the instances of the same page open at the same time on different client browsers and updating that answer on those instances asynchronously.
Was This Post Helpful? 0
  • +
  • -

#4 xxxjj18  Icon User is offline

  • D.I.C Head
  • member icon

Reputation: 53
  • View blog
  • Posts: 167
  • Joined: 30-November 11

Re: Facebook style auto updation

Posted 09 April 2012 - 05:42 AM

Just as Macjohn said, you could use javascript and AJAX to perform this task.

You could have a PHP file that prints the latest post of a user that is retrieved from the database.

Then in the main page you could use an AJAX function to call this PHP file, and have a Javascript function to call the AJAX function every lets say, 3 seconds;


<script type="text/javascript">

var interval = self.setInterval("AJAX_Update()",3000);

function AJAX_Update(){
	var ajaxRequest;  // The variable that makes Ajax possible!
	
	try{
		// Opera 8.0+, Firefox, Safari
		ajaxRequest = new XMLHttpRequest();
	} catch (e){
		// Internet Explorer Browsers
		try{
			ajaxRequest = new ActiveXObject("Msxml2.XMLHTTP");
		} catch (e) {
			try{
				ajaxRequest = new ActiveXObject("Microsoft.XMLHTTP");
			} catch (e){
				// Something went wrong
				alert("An Error occured!");
				return false;
			}
		}
	}

	// Create a function that will receive data sent from the server
	ajaxRequest.onreadystatechange = function(){
		if(ajaxRequest.readyState == 4){
			var ajaxDisplay = document.getElementById('post');
			ajaxDisplay.innerHTML = ajaxRequest.responseText;
		}
	}
	ajaxRequest.open("GET", "retrieve-post.php", true);
	ajaxRequest.send(null);
}

</script>




Where the 'post' div is the div that you would like to update.

Then in the PHP file you retrieve the latest post from the database.
Was This Post Helpful? 1
  • +
  • -

#5 cupidvogel  Icon User is offline

  • D.I.C Addict

Reputation: 31
  • View blog
  • Posts: 593
  • Joined: 25-November 10

Re: Facebook style auto updation

Posted 09 April 2012 - 05:45 AM

Yes, like I said, that is possible, but there are issues with that too, as I mentioned. And imagine there are 50 answers to a question, if for each of this 50 answers, an asynchronous call is made every 3 seconds, the browser may very easily choke, not to speak of the bandwidth loss the user will suffer.
Was This Post Helpful? 0
  • +
  • -

#6 Macjohn  Icon User is offline

  • D.I.C Regular
  • member icon

Reputation: 80
  • View blog
  • Posts: 407
  • Joined: 10-April 09

Re: Facebook style auto updation

Posted 09 April 2012 - 05:50 AM

you do it one at the time not all at once...
Was This Post Helpful? 0
  • +
  • -

#7 xxxjj18  Icon User is offline

  • D.I.C Head
  • member icon

Reputation: 53
  • View blog
  • Posts: 167
  • Joined: 30-November 11

Re: Facebook style auto updation

Posted 09 April 2012 - 05:51 AM

Sorry, You posted that while I was creating my post xD

I think what sites such as Facebook and Twitter do is they use javascript to check when the page gains focus (i.e the tab is switched to or the mouse is moved after a long period of inactivity), and then they run their Ajax script.

That's the only manageable solution I could think of :\
Was This Post Helpful? 1
  • +
  • -

#8 cupidvogel  Icon User is offline

  • D.I.C Addict

Reputation: 31
  • View blog
  • Posts: 593
  • Joined: 25-November 10

Re: Facebook style auto updation

Posted 09 April 2012 - 06:09 AM

No, I think they do exactly what I want to do. Have you seen the update bar on the right hand top corner of the Facebook page, where updates are constantly streamed? Sometimes you will see that the updates are streaming furiously, like during a football match. Surely that shows that the pages are interconnected, change on one page reflects on the other. This can be extended, imagine the edit button you see after you post an answer here. Now suppose you have mistakenly used a slang language in your answer, and you spot it 2 minutes after you have posted your answer. You immediately press the edit button and start to correct it. In the meantime, suppose an admin happens to browse through this page, becomes furious at such language, and clicks the remove post button (suppose there is one, enabled only for top admins). So now what happens after you have finished correcting it and pressing the submit button to submit the modified (and hopefully decent) post? In between your pressing the edit button and pressing the submit button, an admin has already removed the entire post! So you are likely to get a response like Sorry. This post no longer exists type of message. Annoying like hell, right? But if the technique I want is implementable, it can be used to disable the remove post button (which is visible only when an admin is logged in) instantly when the user has pressed the edit button, effectively creating a lock. The lock can be released when the user has submitted the modified answer. Although the admin, who is fuming and all-eager to delete the answer but cannot because the button is disabled, will now see the button enabled now (because the lock has been released), he will also see the answer has been modified, so he will cool off. This is not possible with setTimeOut, don't you think so?

View Postxxxjj18, on 09 April 2012 - 12:51 PM, said:

I think what sites such as Facebook and Twitter do is they use javascript to check when the page gains focus (i.e the tab is switched to or the mouse is moved after a long period of inactivity), and then they run their Ajax script.


Observe that when you are logged onto Facebook, but you are currently on a different tab, any notification on Facebook will dynamically reflect on the Facebook tab title. So clearly the changes are being updated asynchronously, automatically and instantly even when the page is not under focus...

This post has been edited by cupidvogel: 09 April 2012 - 06:05 AM

Was This Post Helpful? 0
  • +
  • -

Page 1 of 1