-
Notifications
You must be signed in to change notification settings - Fork 0
/
index.html
72 lines (64 loc) · 2.62 KB
/
index.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
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>IgJs</title>
<link rel="stylesheet" type="text/css" href="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.3.7/css/bootstrap.min.css">
<link rel="stylesheet" type="text/css" href="./main.css">
</head>
<body>
<div class="container">
<h2>Instagram Feed</h2>
<hr>
<div> <p id="profile"></p></div>
<div><input placeholder="username" id="username" type="text"><input type="button" value="Submit" id="submit"></div>
<div class="ig-feed row"></div>
<hr>
<div class="ig-info">
<img src="" alt="">
<p id="jake"></p>
<hr>
<h5> Recent posts (you might have to go to the users page to go further back. If you do, download images using <a href="https://downloadgram.com/">downloadgram</a> or <a href="https://gramsave.com/">gramsave</a></a>: </h6>
<ol id="instaul">
</ol>
</div>
</div>
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.3.7/js/bootstrap.min.js"></script>
<script type="text/javascript" src="./jquery.igjs.js"></script>
<script type="text/javascript" src="./igjs.js"></script>
<script type="text/javascript">
function greet( event ) {
const username = $("#username").val();
$("#profile").html("<a target=\"_blank\" href='http://instagram.com/" + username + "'>Profile Link</a>");
const items = [];
let message = "Looks like your 10 most recent posts had these captions: <br><br>";
getPosts(username).then(posts => {
window.posts = posts;
let i = 0;
$.each(posts, function(i, item) {
i++;
console.log(item)
items.push('<li><a target="_blank" href="' + item.thumbnails["640"] + '">' + item.caption + '</a></li>');
let caption = item.caption;
if(item.caption.length > 50){
caption = item.caption.slice(0,50) + '...'
}
if(i < 11) {
message += ' ' + i + '. ' + caption + "<br>";
}
}); // close each()
message += "<br>Would you like to frame one of these?"
$('#instaul').append(items.join(''));
$('#jake').html(message);
});
}
$( "#submit" ).on( "click", {
name: "Karl"
}, greet );
window.onerror = function() {
alert("Error, probably a 422. Wait a few and do it manually");
};
</script>
</body>
</html>