My steps towards learning

Friday, June 27, 2014

How to implement an onClick function in a PHP code

If you are writing a button in HTML such as this:

<button type="button">Click!</button>

And you want to have an onClick function for it, for each something happens in your PHP code, the best way is to use document.write('<?php myFunction() ?>').
This will actually make the button execute the myFunction() function in your PHP code upon clicking on it. So all you have to do is to modify your button such as this:

<button type="button" onclick="document.write('<?php myFunction() ?>');">Click!</button>

Happy coding :)

Sadaf

Thursday, June 26, 2014

CSS changes not being applied to your website

If that's the case, don't worry! The only thing you need to do is clear your cache.

This is how you do it in Safari:

From your Safari menu bar click Safari > Preferences then select the Advanced tab
Select: Show Develop menu in menu bar
Now from the menu bar click Develop > Empty Caches

Problem solved :)

Sadaf

How to show your Facebook friends with their profile pictures

I had to make a Facebook application for a project of mine that has a similar look to the home page (more specifically, the newsfeed). For that, I needed to get access to friends and their profile pics of each user.
I started working on this and reading difference posts, specifically the one Facebook has and realized that the way application can have access to peoples friends has changed. Now there are two types of friends you can get from the application user:

/me/taggable_friends: The new Taggable Friends API. In the past if you wanted to tag friends in a post, you had to get their IDs, names and then pass that information into the post to tag them. With this new API you get a set of tokens that identify friends along with their names and pictures. Using this, it's easy to build a custom tagging interface from your app. If you use this feature, your app will have to go through review before it can tag people in posts or photos. Please note that the tokens returned through this API are not the same as the IDs returned via/me/friends.
/me/invitable_friends The new Invitable Friends API. This new API returns a set of people (represented by tokens, names and pictures) in order for you to build your own custom invites interface. Much like the taggable friends interface, the tokens returned here are not the same as the IDs returned via /me/friends and should not be re-used or saved. Using this API does not require review, but is only available to Games on Facebook.com.

You can read more about the changes that this brought upon applications in the sources provided below. But back to retrieving the user's friends, there is a very helpful class on Lynda.com with the following address:

http://www.lynda.com/Facebook-tutorials/Building-Facebook-Applications-PHP-MySQL/107060-2.html

This course explains step by step what you need to do in order to get the friends and their pictures in your application, however, since Facebook changed the way we are accessing friends, it is a bit outdated. That's why in accordance to the code that is explained in the course videos, I have made the following modification for it to work with the new limitations:

<?php
require 'php-sdk/facebook.php';
$facebook = new Facebook(array(
'appId' => 'your_app_id',
'secret' => 'your_app_secret'
));
?>
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8" />
<title>Friends List</title>
<link rel="stylesheet" href="
styles.css"/>
</head>
<body>

<?php

$news = array("I love Iran", "I love Germany", "I love USA", "I love France");
//get user from facebook object
$user = $facebook->getUser();

if ($user): //check for existing user id

$user_graph = $facebook->api('/me/taggable_friends/');
echo '<ul class="lgrid group">';

foreach ($user_graph['data'] as $key => $value) {
$index = round(rand(0,3));
echo '<img class="friendthumb" src = "',$value['picture']['data']['url'],'"/>';
echo "<h4>", $value['name'],'</h4>';
echo "<h5>", $news[$index], '</h5>';

} //iterate through friends graph
echo '</ul>';

else: //user doesn't exist
$loginUrl = $facebook->getLoginUrl(array(
'diplay'=>'popup',
'redirect_uri' => 'https://apps.facebook.com/friendsnewsfeed'
));
echo '<p><a href="', $loginUrl, '" target="_top">login</a></p>';
endif; //check for user id
?>
</body>
</html>

Hope you will have fun with it! :)

Sadaf

___________________________________________
Sources:
https://developers.facebook.com/docs/apps/upgrading

CSS font families

Just like any other family, font families are COMPLICATED! You have to know their "generic family" as well as their "font family". What are these families? The answer is below:

generic family - a group of font families with a similar look (like "Serif" or "Monospace"
font family - a specific font family (like "Times New Roman" or "Arial")

So if you want to let your html/php code know what font to use, you should start with the font you want, and end with a generic family, to let the browser pick a similar font in the generic family, if no other fonts are available. Here is an example:

font-family: "Times New Roman", Times, serif;

Ok but as I said, this is complicated! Sometimes you don't know which family a font belongs to! Well here is an easy solution:

http://cssfontstack.com

This website gives you all the font families you need and the best part is, you can copy and paste the code right away! It's so convenient! Give it a try :)

Sadaf

___________________________________

Sources:

http://www.w3schools.com/css/css_font.asp