AlexKovax/flickr.html

## flickr.html
<!DOCTYPE html>
<html>
    <head>
        <title>Flickr</title>
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">

        <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>

        <script>
            //jsonFlickrFeed is the default callback function returned by flickr, let's use it...
            function jsonFlickrFeed(data){
                for(i in data.items){
                    $("div#containerFlickr").append("<div><a target='_blank' href='"+data.items[i].link+"'><img class='thumb' src='"+data.items[i].media.m+"' alt='' /></a><br /><em>"+data.items[i].title+"</em></div>");
                    if(i > 1)
                        break;
                }
            }

            //basic function for the API call
            //in this example we are checking the latest photos from the tattoo artist Sunny Buick (www.flickr.com/photos/sunnybuick/)
            //you will need to get your flickr ID. If you don't know it use http://idgettr.com/. Sunny's ID is 24576721@N02 as you will see two lines below in the API call
            function getFlickrPhotos(){
                var url="http://api.flickr.com/services/feeds/photos_public.gne?id=24576721@N02&tagmode=any&format=json&jsoncallback=";
                $.ajax(
                    url,
                    {
                        dataType: 'jsonp'
                    }
                );
            }

            //We load the photos on document ready. Can be done on clicks or any other events...
            $(document).ready(function(){
                getFlickrPhotos();
            });
        </script>

    </head>
    <body>
        <h1>Simple Flickr API call</h1>
        <h2><em>This shows a very easy way to get your photos from Flickr</em></h2>

        <div id="containerFlickr"></div>
    </body>
</html>
	<!DOCTYPE html>
	<html>
	<head>
	<title>Flickr</title>
	<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">

	<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>

	<script>
	//jsonFlickrFeed is the default callback function returned by flickr, let's use it...
	function jsonFlickrFeed(data){
	for(i in data.items){
	$("div#containerFlickr").append("<div><a target='_blank' href='"+data.items[i].link+"'><img class='thumb' src='"+data.items[i].media.m+"' alt='' /></a><br /><em>"+data.items[i].title+"</em></div>");
	if(i > 1)
	break;
	}
	}

	//basic function for the API call
	//in this example we are checking the latest photos from the tattoo artist Sunny Buick (www.flickr.com/photos/sunnybuick/)
	//you will need to get your flickr ID. If you don't know it use http://idgettr.com/. Sunny's ID is 24576721@N02 as you will see two lines below in the API call
	function getFlickrPhotos(){
	var url="http://api.flickr.com/services/feeds/photos_public.gne?id=24576721@N02&tagmode=any&format=json&jsoncallback=";
	$.ajax(
	url,
	{
	dataType: 'jsonp'
	}
	);
	}

	//We load the photos on document ready. Can be done on clicks or any other events...
	$(document).ready(function(){
	getFlickrPhotos();
	});
	</script>

	</head>
	<body>
	<h1>Simple Flickr API call</h1>
	<h2><em>This shows a very easy way to get your photos from Flickr</em></h2>

	<div id="containerFlickr"></div>
	</body>
	</html>