brabadu/flickr-search.html

## flickr-search.html
<html>
    <head>
        <title>Flickr search demo</title>
        <meta http-equiv="content-type" content="text/html; charset=UTF-8">
        <style>
            .gallery__item {
                float: left;
                height: 100;
                list-style: none;
            };
        </style>
        <script src="http://code.jquery.com/jquery-2.0.0.js" type="text/javascript" charset="utf-8"></script>
        <script type="text/javascript">
            $(function(){
                var opts = {
                    method: 'flickr.photos.search',
                    api_key: 'c86eac4d6a2c2263b01ef7d3e665bf77',
                    sort: 'relevance',
                    text: 'apple',
                    extras: 'url_m',
                    per_page: 10,
                    format: 'json',
                    nojsoncallback: 1
                };
                $.get('http://api.flickr.com/services/rest/', opts, function(resp){
                    var images;
                    if (resp.stat === "ok") {
                        images = $('<ul>', {'class': 'gallery'})
                        $.each(resp.photos.photo, function(index, value){
                            var image = $('<li>', {
                                'class': 'gallery__item'
                            }).append($('<img>', {
                                src: value.url_m,
                                title: value.title,
                                height: '100px',
                            })).appendTo(images);
                        });
                        images.appendTo('body');
                    }
                    else {
                        console.log('not ok', resp);
                    }
                });
            });
        </script>

    </head>
    <body>
    </body>
</html>
	<html>
	<head>
	<title>Flickr search demo</title>
	<meta http-equiv="content-type" content="text/html; charset=UTF-8">
	<style>
	.gallery__item {
	float: left;
	height: 100;
	list-style: none;
	};
	</style>
	<script src="http://code.jquery.com/jquery-2.0.0.js" type="text/javascript" charset="utf-8"></script>
	<script type="text/javascript">
	$(function(){
	var opts = {
	method: 'flickr.photos.search',
	api_key: 'c86eac4d6a2c2263b01ef7d3e665bf77',
	sort: 'relevance',
	text: 'apple',
	extras: 'url_m',
	per_page: 10,
	format: 'json',
	nojsoncallback: 1
	};
	$.get('http://api.flickr.com/services/rest/', opts, function(resp){
	var images;
	if (resp.stat === "ok") {
	images = $('<ul>', {'class': 'gallery'})
	$.each(resp.photos.photo, function(index, value){
	var image = $('<li>', {
	'class': 'gallery__item'
	}).append($('<img>', {
	src: value.url_m,
	title: value.title,
	height: '100px',
	})).appendTo(images);
	});
	images.appendTo('body');
	}
	else {
	console.log('not ok', resp);
	}
	});
	});
	</script>

	</head>
	<body>
	</body>
	</html>