-
Notifications
You must be signed in to change notification settings - Fork 0
/
fetcher.js
65 lines (52 loc) · 1.86 KB
/
fetcher.js
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
/**
* @author Alan Insam
* @licence Apache 2.0
* @description An Instagram-wall implementation in Html,JavaScript and CSS
*/
// Change the username to your desired profile
let username = "";
const ENDPOINT = 'https://www.instagram.com/' + username + '/?__a=1';
const POST_URL = "https://www.instagram.com/p/";
const POST_COUNT = 3;
let json;
// Fetch the last 12 media articles of the selected account
$(document).ready(async function () {
// Call the API and await it's response
const response = await fetch(ENDPOINT);
json = await response.json();
parseAndSet();
});
/**
* Query the fetched json and set the profile-cards
* Note: var data is the base json array which holds the media (images, videos) of the user
*/
function parseAndSet() {
let data = json['graphql']['user']['edge_owner_to_timeline_media']['edges'];
console.log(data);
// Traverse the edges array
let i;
let imageUrls = [];
let imageDesc = [];
let postUrl = [];
for (i = 0; i < POST_COUNT; i++) {
// Traverse the array for the media sources
imageUrls.push(data[i]['node']['thumbnail_resources']['4']['src']);
// Traverse the array for the media description
imageDesc.push(data[i]['node']['edge_media_to_caption']['edges']['0']['node']['text']);
// Traverse the array for the shortcode ( which will be appended to the POST_URL
postUrl.push(POST_URL + data[i]['node']['shortcode']);
}
// Set images of the cards
$('.ig-image').each(function (i, obj) {
$(obj).attr("src", imageUrls[i]);
});
// Set descriptions of the cards
$('.ig-desc').each(function (i, obj) {
let desc = imageDesc[i].substr(0, 50) + "...";
$(obj).text(desc)
});
// Finally set the link to the post
$('.ig-post-url').each(function (i, obj) {
$(obj).attr("href", postUrl[i])
})
}