Monthly Archives: October 2015

Invite Friends Using Google Contact API and oAuth in PHP

By | October 30, 2015

Invite Friends Using Google Contact API and oAuth in PHP

First, let me introduce what Contacts Data API and OAuth is.


OAuth (Open Authorization) is an open standard for authorization. It allows users to share their private resources (e.g. photos, videos, contact lists) stored on one site with another site without having to hand out their credentials, typically username and password.

Google Contact Data APIs

The Contacts Data API allows client applications to view and update a user’s contacts. Contacts are stored in the user’s Google Account; most Google services have access to the contact list.

You can easily find many source codes for importing Gmail contacts by Googling. But most of them use outdated Google Contact Data API or OAuth. By using the latest APIs we can easily import the contacts with fewer lines of code and is much more efficient than the old version. OAuth is in its second generation today. OAuth 2.0 focuses on client developer simplicity while providing specific authorization flows for web applications, desktop applications, mobile phones, and living room devices. OAuth 2.0 is not backward compatible with OAuth 1.0. Using the older APIs you couldn’t retrieve the contacts in local host. That is, it was difficult to modify or edit the code for the website as the code had to be uploaded again and again to the host. But with the help of new API you can try and edit the code in local host and it works efficiently.


How To Login With Google Account oAuth in PHPHow To Login With Google Account oAuth in PHP

In this tutorial we will be using OAuth 2.0 and Google Contacts Data API.

You can refer more about them at the links below.

Step 1:

Create file ‘oauth.php’ in your web-host. For the example that I have shown, I made a folder ‘oauth’ in localhost and created the file ‘oauth.php’ in the folder.

Thus, in my case, the URL for the file is http://localhost/invite-friends-using-google-contact-api-and-oauth/invite-gmail-contacts.php

Please note your URL for the file, as you will need it in the later steps.

Now paste the code below into ‘invite-gmail-contacts.php’ and save the file.

Step 2:

To use the Google API, you need to register your product at Google. To start the Registration process, head to Google API Console.

If you haven’t created any projects yet, then you will be seeing a page as shown below. Click ‘Create Project…’ button.

If you have created a project earlier, then you will be taken to an existing project directly. Click on the drop down menu that has the current project’s name which is located at the top left of the webpage (In my case it is ‘API Project’) and click ‘Create…’ in ‘Other projects’ tab. Now you will be asked to enter the name of the project. Enter a name as you wish.

How To Login With Google Account oAuth in PHP

Now Go to APIs and Then Find Contacts API and Enable it by Clicking Enable.


Enable Options :


Step 3:

Now Go to Credentials options and set your Registered Call back URLs and Note Down Client Secret and Client ID:

How To Login With Google Account oAuth in PHP

Step 4:

Open invite-gmail-contacts.php.php that you created in Step 1.

Replace ‘Your Client ID goes here’, ‘Your Client secret goes here’ and ‘Your Redirect URIs goes here’ with the Client ID, Client secret and Redirect URIs that you created in Step 3, respectively.

You can optionally change the number next to ‘$max_results’. It specifies the maximum number of email addresses to be retrieved.

Step 5:

Create the button or link that the user needs to click to retrieve the contact list and set its href parameter to

Replace ‘your_client_id_goes_here’ and ‘

’ with the Client ID and Redirect URIs that you created in Step 7, respectively.

Or you can optionally copy the code given below, replace ‘your_client_id_goes_here’ and ‘your-redirect-url’ as mentioned above, and save it as a new file, may be ‘index.php’.

Then save it to your host.

We have now successfully completed the web application to retrieve Gmail or Google contacts.

Testing the web application:

Now it’s the turn to test the application. Please follow the steps mentioned below.

Step 6:

Browse to the file that created in Step 5 using your favorite web browser. Click on the button or link that you created to retrieve the contacts.

There is a chance that you get an error similar to the one shown below, especially if you are trying it on localhost.


If you are among the unlucky ones, please follow the procedure mentioned below to solve the issue.


If you are on localhost open:


php/browscap/php.ini (if existent)

php/php4/php.ini (if existent)

apache/bin/php.ini (if existent)


If you are on web host, open web host’s ‘php.ini’


Search for ‘extension=php_curl.dll’.

If not found add it to ‘Dynamic Extensions’ section.

If found, uncomment the statement.

Then restart Apache if on localhost.

Try Step 10 again.

Step 7:

You will be taken to a conformation page which will look similar to the one shown below.


Click ‘Allow Access’ button.

If everything went right, you will have a list of email addresses on screen and a Invite buton also .

Please comment below, if you have any queries or errors.


Townhall Q&A with Mark ZuckerBerg at IIT DELHI LIVE

By | October 28, 2015

Townhall Q&A  with Mark ZuckerBerg at IIT DELHI LIVE

Facebook CEO Mark ZuckerBerg will be kicking off a Townhall Q&A shortly at the Indian Institute of Technology (IIT) Delhi.

I’ll be answering questions submitted from across our community as well as the audience here in India.

You can watch the livestream here. We’ll be starting at 12pm IST (11:30pm Tuesday Pacific time). Hope you can join!

TownHall Q&A is Now Concluded.

Watch Here:-

Q&A with Mark from Delhi, India

Watch the full video of today's Townhall Q&A with Mark at the Indian Institute of Technology (IIT) Delhi.

Posted by Q&A with Mark on Wednesday, October 28, 2015

How To Lazy Load Images Using jQuery

By | October 27, 2015

How To Lazy Load Images Using jQuery

In this article, we are going to create a simple library which takes a selector (preferably class) and makes the images inside it lazy load. Lazy loading means that the user will request the resources (in this case, images) only when they are needed. In our case, this means when the user scrolls down enough. If the user scrolls to the place where the image is supposed to be, his browser will request the image and it will be displayed to him.

How To Lazy Load Images Using jQuery

If he never scrolls down enough to see most of the images – his browser would have never requested them from our server.

Downlaod and Demo Links are as:-

How To Login With Google Account oAuth in PHPHow To Login With Google Account oAuth in PHP

How to make a lazy loader?

In our <head> tag, we just load jQuery.

In our <body> tag we create a container for the images and give it a class. Inside the container, we place as much images as we need.

We have used the data-src attribute to hold the real src attribute of the image that has to be loaded there. All src attributes point to a small pure black image which serve as a placeholder for the actual images. We also set the width and height attributes to have the dimensions of the real image (the one whose path is store in the data-src attribute). We do not really have to put placeholders with the same image size but we just wanted to make it as smooth as if the image was really there.

Now, let us proceed with the lazyLoader library.

We create an object with an initialize method which takes a CSS-styles selector of the container(s) of the images and calls the revealWhenScrolled  function once when the method is called and hooks up an event listener that will call revealWhenScrolled each time the user scrolls.

The revealWhenScrolled function loops over each image and if the viewport’s vertical position in the document is lower or at the level of the image – it replaces the image’s srcattribute with its data-src attribute.

Finally, we have the isVisible method which checks if the viewport’s vertical position in the document has reached or exceeded the image’s vertical position in the document.

Finally, before we close our <body> tag (placing your scripts after the HTML optimizes the page’s loading speed) we load our lazyLoader library and initialize it:

Now, all the images in the container(s) will load only when the user needs them!

Thanks For Reading 🙂

Creating a CountDown Timer Using Vanilla Javascript

By | October 20, 2015

Creating a CountDown Timer Using Vanilla Javascript

Adding a clock with JavaScript to a site can be valuable for different purposes. The commencement can be checking the days left to the official dispatch of your site, item or highlight inside of the site. Depending on outsider libraries can bring about additional weight on the data transmission include and it can lose some of your time attempting to twist the library to your will. On the off chance that everything you need is a basic commencement clock, the code included is not that much to require the inclusion of outsider scripts.

Creating a CountDown Timer Using Vanilla Javascript

Download And Demo Links are as:

How To Login With Google Account oAuth in PHPHow To Login With Google Account oAuth in PHP

To use our countdown timer, all that you are going to need to do is call the addCountdown function, pass it a date string and an element where the countdown will go and you are set. Using it looks something like this:

You need one line of JavaScript and one line that adds the element where you want it to be in the DOM:

The result is a countdown timer like this one:

Creating a CountDown Timer Using Vanilla Javascript

The visuals

We have created a simple dark skin for the countdown timer.

We float each box (there are 4 boxes – with days, hour, minutes and seconds) to the left, give fixed dimensions to the countdown timer and its boxes, make it dark and highlight the boxes with white border. We also use the default cursive font available to the system.

The logic

We create our function which accepts a date to countdown to, the id of the element which we want to hold the countdown timer and an optional array with labels for the time values. It seeks for 4 elements in the following order – days, hours, minutes, seconds. For example, if we pass it an array like: [“天”, “营业时间”, “纪要”, “秒”] the labels will be in Chinese (Simplified) as shown in the picture below:


To achieve this, we just called the addCountdown function in the following manner:

In the body of the addCountdown function we define another function called timeRemaining which will determine how many days, hours, minutes and seconds remain to the target date and return them as a string combined with the appropriate time label.

Afterwards, we define yet another function which takes the return value from the timeRemaining function and if timeRemaining has returned null we stop updating the clock every second and remove the countdown container (it returns null if the UNIX timestamp holds a negative value as checked in  if (timeRemaining > 0) )

Then, we call timeRemaining and save the return value to a variable:

Now, in our main addCountdown function we call isCountdownEnded and return from it if the result of the call to isCountdownEnded contains a truthy value:

Progressing further, we add all necessary children to the container element for the countdown timer with their appropriate value:

times is an array that comes as a result of the call to timeRemaining.

Finally, we set an interval that will call timeRemaining, stop further execution if the timer’s time is up and which will update the remaining time each second.

Thanks For Reading This Tutorial.

How to Overcome PHP 7 and The Fatal Errors

By | October 3, 2015

How to Overcome PHP 7 and The Fatal Errors

PHP as a language has irritating in handing of fatal errors; these errors can’t be handling before touches the browser’s window. One by one error results in set error handler () this lead to stop all script execution. PHP developers also worried to fatal errors and want to trap them as rare exceptions. Google searches also helps in revealing fatal error, but now PHP7 is there that decreases these fatal errors significantly.



Now developers can save their days and avoid to disgrace of using ini_set (‘display_errors’,’0′); and also avoid to tolerate the pain for use of “@” suppression character. One kind of developers thinks that there is no other choice, others hope that some type of guidance is prove to be an effective prevention against its use. (I realize 99% PHP developers use error suppression operator (I one of them) so I’m expecting any PHP developer who sees this, to down vote me but please bookmark this so that you can comeback and change it to an up vote in a couple

of years, when you realize I was right.) stackoverflow In PHP 7, exception will be thrown after a fatal and retrievable error (E_ERROR and E_RECOVERABLE_ERROR) occurs, rather than stopping script execution; Fatal errors static exist for some conditions, such as running out of memory, and still behave as early mentioned by instantly faltering script execution. The uncaught exception will also continue to be a fatal error in PHP7. It’s miserable if exception arise from an error that was fatal in PHP5.x goes uncaught, it will still be a fatal error in PHP 7.

Everyone is discussing the performance speed of PHP7. Tumbling PHP5 and adopting PHP7 the reason behind it is fatal errors however it depends on the developers part and re-factoring situations that before were left there, so the best practice is catch those errors and also write code excludes the possibility of error.

Two Steps

PHP frameworks and the Content Management systems will not re-factor their code and provide well robust solutions through upgrading fully with PHP 7.

Codes Support PHP 5.x & 7 Exceptions

Multiple catch block can used for catching exception in PHP 5.x & 7 with same code, Throwable first, then catching Exception. After PHP 5.x support is no longer needed then the block catching Exception can be removed.

Expect to see many fixes at Github by this code

This will create a code base to maintaining backwards compatibility. Delegating-code to handle best-case scenario is an older version of PHP, then it must be writing forward to the latest version. This is the status quo for PHP open source projects. Open Source Zombies take Over the World!. Open source projects are better choices and this tool is not use as another excuse to re-write PHP functionality with any other design pattern.

Users are free to create error and extend Error to create your own Error classes. The important question is that what situations would throw an instance of a class extending Error and Exception?