-
Notifications
You must be signed in to change notification settings - Fork 2
/
jsonp.html
73 lines (59 loc) · 1.4 KB
/
jsonp.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
<!DOCTYPE html>
<html>
<head>
<style type="text/css">
h1{ width:100%; float:left; }
div{ width:100%; float:left; }
img{ height: 100px; float: left; }
</style>
<script src="jsonp.js"></script>
</head>
<body>
<h1>Flickr Cats</h1>
<div id="flickr-output">
</div>
<h1>Facebook <span id="fb-name">...</span></h1>
<div id="fb-output">
</div>
<script>
//
// Flicker
//
JSONp.get({
url : 'http://api.flickr.com/services/feeds/photos_public.gne',
callbackName : 'jsoncallback',
opts : { tags: "cat", tagmode: "any", format: "json" },
success : function( json ){
var htmlArray = new Array();
for( var i = 0; i < json.items.length; i++ ){
var item = json.items[i];
htmlArray.push('<img src="' + item.media.m + '" />');
}
document.getElementById('flickr-output').innerHTML = htmlArray.join('');
}
});
//
// Facebook Open Graph
//
// Album name
JSONp.get({
url : 'http://graph.facebook.com/29961281468',
success : function( json ){
document.getElementById('fb-name').innerHTML = json.name;
}
});
// Album photos
JSONp.get({
url : 'http://graph.facebook.com/29961281468/photos',
success : function( json ){
var htmlArray = new Array();
for( var i = 0; i < json.data.length; i++ ){
var item = json.data[i];
htmlArray.push('<img src="' + item.source + '" />');
}
document.getElementById('fb-output').innerHTML = htmlArray.join('');
}
});
</script>
</body>
</html>