-
Notifications
You must be signed in to change notification settings - Fork 0
/
index.html
48 lines (47 loc) · 1.53 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
<html>
<head>
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.1.3/css/bootstrap.min.css" integrity="sha384-MCw98/SFnGE8fJT3GXwEOngsV7Zt27NXFoaoApmYm81iuXoPkFOJwJ8ERdknLPMO" crossorigin="anonymous">
</head>
<style>
form input{
font-size: 18px;
}
</style>
<script>
const og_img_regex = /(<meta property="og:image" content=")(.*)(" \/>)/g ;
create_submission_html = (url) => {
return "<form method='post'><input name='url' type='hidden' value='"+url+"'><input type='submit' value='Print!'></form>";
}
dolookup = ()=>{
const url = document.querySelector('#img_url').value;
const data = fetch(url);
data.then((response) => {
return response.text();
}).then((text) => {
const og_url = og_img_regex.exec(text)[2];
document.querySelector('#feedback')
.innerHTML = create_submission_html(url)+'<img src="'+og_url+'" width="50%;">';
}).catch(() => {
document.querySelector('#feedback')
.innerHTML= '<span class="alert alert-warning" role="alert">Could not get open graph image from url</span>';
});
return false;
}
</script>
<body class="container">
<h1>Epsongram</h1>
<form onsubmit="return dolookup()">
url:<input
id="img_url"
style="width: 100%;"
type="text"
value=""/>
<input type="submit" />
</form>
<span id="feedback">
<span class="alert alert-primary">
enter a url
</span>
</span>
</body>
</html>